/* foundation */ /* componenet*/ /* foundation */ /* componenet*/ ::-webkit-scrollbar-track { background-color: #e6e6e6; border-radius: 2.5rem; } ::-webkit-scrollbar { width: 0.5rem; height: 0.5rem; border-radius: 2.5rem; } ::-webkit-scrollbar-thumb { background-color: #b7b7b7; border-radius: 2.5rem; } .layout { max-width: 100%; position: relative; margin: 0 auto; } .h2 { font-size: 56px; font-weight: 700; } .h3 { font-size: 48px; font-weight: 700; } .h4 { font-size: 32px; font-weight: 700; } .h5 { font-size: 24px; font-weight: 700; } .h6 { font-size: 20px; font-weight: 700; } .noto { font-family: "Noto Sans KR"; } .sqopa { font-family: "Spoqa Han Sans Neo"; } .pre { font-family: "Pretendard"; } .mont { font-family: "Montserrat"; } .redhat { font-family: "Red Hat Display"; } .icon { font-family: "iconoir"; } .f400 { font-weight: 400; } .gray-900 { color: #222; } .gray-800 { color: #424242; } .gray-700 { color: #616161; } .gray-600 { color: #757575; } .gray-500 { color: #9E9E9E; } .border-w-blue { border-color: #275BAB; } .border-w-green { border-color: #087F34; } .border-w-orange { border-color: #F79000; } .border-w-red { border-color: #D43333; } .border-w-gray { border-color: #424242; } .border-c-blue { border-color: #364FC7; } .border-c-green { border-color: #00926F; } .border-c-orange { border-color: #EB6B25; } .border-c-red { border-color: #971836; } .border-c-gray { border-color: #424242; } .border-light-blue { border-color: #EFF3FB; } .border-light-green { border-color: #EFF9F7; } .border-light-orange { border-color: #FFF2EB; } .border-light-red { border-color: #FEECF0; } .border-gray-900 { border-color: #222; } .border-gray-800 { border-color: #424242; } .border-gray-700 { border-color: #616161; } .border-gray-600 { border-color: #757575; } .border-gray-500 { border-color: #9E9E9E; } .border-gray-400 { border-color: #BDBDBD; } .border-gray-300 { border-color: #E0E0E0; } .border-gray-200 { border-color: #EEEEEE; } .border-gray-100 { border-color: #F5F5F5; } .border-gray900 { border-color: #222; } .border-gray800 { border-color: #424242; } .border-gray700 { border-color: #616161; } .border-gray600 { border-color: #757575; } .border-gray500 { border-color: #9E9E9E; } .border-gray400 { border-color: #BDBDBD; } .border-gray300 { border-color: #E0E0E0; } .border-gray200 { border-color: #EEEEEE; } .border-gray100 { border-color: #F5F5F5; } .border-light-gray { border-color: #E0E0E0; } .border-deep-gray { border-color: #F5F5F5; } [class*="border-"] { border-width: 1px; border-style: solid; background: #fff; } .color-w-blue { color: #275BAB; } .color-w-green { color: #087F34; } .color-w-orange { color: #F79000; } .color-w-red { color: #D43333; } .color-w-gray { color: #424242; } .color-c-blue { color: #364FC7; } .color-c-green { color: #00926F; } .color-c-orange { color: #EB6B25; } .color-c-red { color: #971836; } .color-c-gray { color: #424242; } .color-light-blue { color: #EFF3FB; } .color-light-green { color: #EFF9F7; } .color-light-orange { color: #FFF2EB; } .color-light-red { color: #FEECF0; } .color-gray-900 { color: #222; } .color-gray-800 { color: #424242; } .color-gray-700 { color: #616161; } .color-gray-600 { color: #757575; } .color-gray-500 { color: #9E9E9E; } .color-gray-400 { color: #BDBDBD; } .color-gray-300 { color: #E0E0E0; } .color-gray-200 { color: #EEEEEE; } .color-gray-100 { color: #F5F5F5; } .color-gray900 { color: #222; } .color-gray800 { color: #424242; } .color-gray700 { color: #616161; } .color-gray600 { color: #757575; } .color-gray500 { color: #9E9E9E; } .color-gray400 { color: #BDBDBD; } .color-gray300 { color: #E0E0E0; } .color-gray200 { color: #EEEEEE; } .color-gray100 { color: #F5F5F5; } .color-light-gray { color: #E0E0E0; } .color-deep-gray { color: #F5F5F5; } .bg-w-blue { background: #275BAB; } .bg-w-green { background: #087F34; } .bg-w-orange { background: #F79000; } .bg-w-red { background: #D43333; } .bg-w-gray { background: #424242; } .bg-c-blue { background: #364FC7; } .bg-c-green { background: #00926F; } .bg-c-orange { background: #EB6B25; } .bg-c-red { background: #971836; } .bg-c-gray { background: #424242; } .bg-light-blue { background: #EFF3FB; } .bg-light-green { background: #EFF9F7; } .bg-light-orange { background: #FFF2EB; } .bg-light-red { background: #FEECF0; } .bg-gray-900 { background: #222; } .bg-gray-800 { background: #424242; } .bg-gray-700 { background: #616161; } .bg-gray-600 { background: #757575; } .bg-gray-500 { background: #9E9E9E; } .bg-gray-400 { background: #BDBDBD; } .bg-gray-300 { background: #E0E0E0; } .bg-gray-200 { background: #EEEEEE; } .bg-gray-100 { background: #F5F5F5; } .bg-gray900 { background: #222; } .bg-gray800 { background: #424242; } .bg-gray700 { background: #616161; } .bg-gray600 { background: #757575; } .bg-gray500 { background: #9E9E9E; } .bg-gray400 { background: #BDBDBD; } .bg-gray300 { background: #E0E0E0; } .bg-gray200 { background: #EEEEEE; } .bg-gray100 { background: #F5F5F5; } .bg-light-gray { background: #E0E0E0; } .bg-deep-gray { background: #F5F5F5; } [class*="bg-w"], [class*="bg-c"], [class*="bg-gray"] { color: #fff; } html.active { overflow: hidden; } [class*="flex"] { display: flex; gap: 0.8rem; } .flex-wrap { flex-wrap: wrap; } .flex-between { justify-content: space-between; } .flex-column { flex-direction: column; } .flex-full > * { flex: 1; } #wrap { position: relative; overflow: hidden; } #wrap.active::before { display: block; content: ""; width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.5); z-index: 39; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-logo { display: none; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu { position: fixed; top: 0; right: 0; width: 100vw; height: 100vh; display: flex; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-background { z-index: -1; transition: 0.4s; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-copyrights { display: flex; align-items: flex-end; gap: 2.5rem; font-size: 1.6rem; flex-wrap: wrap; margin-top: auto; flex-shrink: 0; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-copyrights-sns { display: flex; align-items: center; gap: 1rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-copyrights-sns a { position: relative; display: flex; align-items: center; justify-content: center; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-copyrights-sns a::before { display: block; content: ""; width: 2.4rem; height: 2.4rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-copyrights-sns-list { display: flex; align-items: center; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-copyrights-sns-facebook::before { background: url(/mxds/images/foundation/facebook.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-copyrights-sns-blog::before { background: url(/mxds/images/foundation/blog.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-copyrights-sns-twitter::before { background: url(/mxds/images/foundation/twitter.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-copyrights-sns-instagram::before { background: url(/mxds/images/foundation/instagram.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-copyrights-sns-youtube::before { background: url(/mxds/images/foundation/youtube.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-container { width: 100%; overflow: auto; max-height: 100%; position: relative; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-container > ul { max-width: 100%; margin: auto 0; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-container > ul > li.on .header-menu-2depth { display: block; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-container > ul > li.on > a > span { opacity: 1 !important; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-container > ul > li.on > a.arrow::before { content: "\eb23"; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-container > ul > li > a { position: relative; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-container > ul > li > a.arrow::before { display: block; content: "\ebd1"; font-family: "iconoir"; position: absolute; left: 0; font-size: 3.2rem; line-height: 1; top: 50%; transform: translateY(-50%); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-2depth { display: none; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-2depth-title { display: none; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-menu-2depth-image { display: none; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-util > div { display: none; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header-util-sitemap { display: block !important; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu { display: flex; align-items: center; justify-content: center; color: #fff; padding: 10rem 2rem; gap: 6rem 0; flex-direction: column; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-background { position: fixed; left: 0; top: 0; width: 100%; height: 100%; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-background::after { display: block; content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, 0.5); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights { flex-direction: row-reverse; justify-content: flex-end; width: 128rem; padding: 0 9rem; max-width: 100%; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns a { width: 5rem; height: 5rem; border-radius: 50%; border: 2px solid rgba(255, 255, 255, 0.2); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns a:hover, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns a:focus-visible { background: #fff; border-color: #fff; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-list { gap: 0.8rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-facebook::before { background-image: url(/mxds/images/foundation/facebook-gray.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-facebook:hover::before, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-facebook:focus-visible::before { background-image: url(/mxds/images/foundation/facebook.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-blog::before { background-image: url(/mxds/images/foundation/blog-gray.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-blog:hover::before, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-blog:focus-visible::before { background-image: url(/mxds/images/foundation/blog.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-twitter::before { background-image: url(/mxds/images/foundation/twitter-gray.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-twitter:hover::before, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-twitter:focus-visible::before { background-image: url(/mxds/images/foundation/twitter.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-instagram::before { background-image: url(/mxds/images/foundation/instagram-gray.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-instagram:hover::before, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-instagram:focus-visible::before { background-image: url(/mxds/images/foundation/instagram.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-youtube::before { background-image: url(/mxds/images/foundation/youtube-gray.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-youtube:hover::before, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-sns-youtube:focus-visible::before { background-image: url(/mxds/images/foundation/youtube.png); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-copyrights-text { padding-bottom: 1.3rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-container { max-width: 128rem; flex-grow: 1; display: flex; align-items: center; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-container > ul { width: 100%; flex-direction: column; gap: 5.4rem; padding: 0 9rem; display: flex; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-container > ul > li { padding: 0 5.6rem; position: relative; display: flex; flex-direction: column; gap: 2rem; align-items: flex-start; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-container > ul > li > a { font-size: 2.4rem; position: relative; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-container > ul > li > a.arrow::before { left: -2.4rem; transform: translateX(-100%) translateY(-50%); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-container > ul > li > a > span { opacity: 0.5; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-2depth { position: relative; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-2depth > ul { display: flex; gap: 6.4rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-2depth > ul > li { display: flex; flex-direction: column; gap: 1.4rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-2depth > ul > li:hover > a, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-2depth > ul > li.on > a { text-decoration: underline; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-2depth > ul > li > a { font-size: 2rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-2depth > ul > li > a:focus-visible { text-decoration: underline; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-3depth > ul { display: flex; flex-direction: column; gap: 0.2rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-3depth > ul > li > a { display: flex; position: relative; padding-left: 0.9rem; opacity: 0.5; font-size: 1.6rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-3depth > ul > li > a::before { display: block; content: ""; width: 0.4rem; height: 1px; background: #fff; position: absolute; left: 0; top: 1.15rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-3depth > ul > li > a:hover, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-3depth > ul > li > a:focus-visible { opacity: 1; text-decoration: underline; text-underline-position: under; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-menu-3depth > ul > li.on > a { opacity: 1; text-decoration: underline; text-underline-position: under; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-util > div > a { color: #fff; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-util > div > a::after { color: #fff; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type1"] .header-util-sitemap > a::after { background-image: url(/mxds/images/foundation/close-white.svg); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu { background: #fff; padding: 10rem 0 10rem 25%; gap: 10rem 0; flex-direction: column; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-background { position: fixed; top: 0; left: 0; width: 25%; height: 100%; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-copyrights { padding: 0 16rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-copyrights-sns-list { gap: 1.7rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-line { width: 1px; background: #e0e0e0; position: absolute; display: block; top: 0; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-line > span { display: block; transition: 0.25s; width: 3px; height: 3.2rem; background: #275BAB; position: absolute; left: -1px; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-container { width: 100%; flex-grow: 1; display: flex; align-items: center; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-container > ul { display: flex; justify-content: flex-start; padding: 2.6rem 16rem; flex-direction: column; position: relative; gap: 5.1rem; width: 100%; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-container > ul > li { width: 25.4rem; display: flex; flex-direction: column; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-container > ul > li > a { display: flex; position: relative; padding-left: 5.2rem; font-size: 2.8rem; font-weight: 700; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-container > ul > li.on > a { color: #275BAB; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-container > ul > li.on .header-menu-2depth { display: block; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-container > ul > li:hover > a, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-container > ul > li:focus-visible > a { color: #275BAB; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-2depth { position: absolute; left: calc(16rem + 25.4rem); top: 2.6rem; padding-left: 12rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-2depth > ul { display: flex; flex-direction: column; gap: 2.9rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-2depth > ul > li { gap: 1.4rem; display: flex; flex-direction: column; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-2depth > ul > li:hover > a, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-2depth > ul > li.on > a { color: #275BAB; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-2depth > ul > li > a { font-size: 2rem; font-weight: 700; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-2depth > ul > li > a:focus-visible { color: #275BAB; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-3depth > ul { display: flex; flex-direction: column; gap: 0.6rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-3depth > ul > li { display: flex; justify-content: flex-start; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-3depth > ul > li > a { font-size: 1.6rem; color: #757575; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-3depth > ul > li > a:hover, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-3depth > ul > li > a:focus-visible { text-decoration: underline; text-underline-position: under; color: #222; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type2"] .header-menu-3depth > ul > li.on > a { text-decoration: underline; text-underline-position: under; color: #222; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-logo { display: flex; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu { display: flex; background: #fff; padding: calc(10rem * 1.8) 0 0; overflow: hidden; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-container { padding: 0 4rem 10rem; overflow: auto; max-height: 100%; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-container > ul { max-width: 130rem; margin: 0 auto; display: flex; gap: 12.7rem 5.5rem; width: 100%; flex-wrap: wrap; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-container > ul > li { width: calc(20% - (5.5rem * 4 / 5)); } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-container > ul > li > a { display: block; padding-bottom: 2.35rem; border-bottom: 1px solid #e0e0e0; font-size: 2.2rem; font-weight: 700; letter-spacing: 0.02em; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-container > ul > li > a::before { display: none; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-container > ul > li > a:focus-visible { color: #275BAB; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-container > ul > li:hover > a { color: #275BAB; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-2depth { padding: 3rem 0 0; display: block; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-2depth > ul { display: flex; flex-direction: column; gap: 0.8rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-2depth > ul > li { display: flex; flex-direction: column; gap: 0.5rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-2depth > ul > li > a { font-size: 1.8rem; font-weight: 500; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-2depth > ul > li > a:focus-visible { color: #275BAB; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-2depth > ul > li:hover > a, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-2depth > ul > li.on > a { color: #275BAB; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-3depth { padding-bottom: 2.3rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-3depth > ul { display: flex; flex-direction: column; gap: 0.2rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-3depth > ul > li { display: flex; justify-content: flex-start; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-3depth > ul > li > a { font-size: 1.6rem; color: #424242; position: relative; padding-left: 1rem; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-3depth > ul > li > a::before { display: block; content: ""; width: 0.4rem; height: 1px; background: #bdbdbd; position: absolute; top: 1.25rem; left: 0; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-3depth > ul > li > a:hover, #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-3depth > ul > li > a:focus-visible { text-decoration: underline; text-underline-position: under; color: #275BAB; } #wrap[data-mxds-responsive="pc"][data-header-state-item="sitemap"] .header[data-header-sitemap="type3"] .header-menu-3depth > ul > li.on > a { text-decoration: underline; text-underline-position: under; color: #275BAB; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu { width: 100%; height: 100%; position: relative; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-bg { width: 100%; position: absolute; top: 100%; left: 0; background: #fff; display: none; z-index: -1; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-line { display: none; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-copyrights { display: none; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu a[target="_blank"]::after { content: "\eb7a"; font-family: "iconoir"; font-size: 1.2rem; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-container { width: 100%; height: 100%; position: relative; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-container > ul { display: flex; height: 100%; justify-content: center; padding: 0 23rem; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-container > ul > li { height: 100%; position: relative; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-container > ul > li > a { padding: 0 5rem; font-size: 2rem; font-weight: 500; display: flex; height: 100%; align-items: center; position: relative; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-container > ul > li.active > a { color: #275BAB; font-weight: 500; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-container > ul > li.active .header-menu-2depth { opacity: 1; visibility: visible; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-2depth { position: absolute; top: 100%; left: 0; width: 100%; padding: 3.7rem 1rem; display: flex; justify-content: center; opacity: 0; visibility: hidden; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-2depth > ul { display: flex; flex-direction: column; gap: 1.2rem; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-2depth > ul > li { display: flex; flex-direction: column; gap: 0.5rem; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-2depth > ul > li:hover > a { text-decoration: underline; text-underline-position: under; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-2depth a { display: flex; align-items: center; gap: 0.4rem; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-2depth a:hover, #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-2depth a:focus-visible { text-decoration: underline; text-underline-position: under; font-weight: 500; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-3depth ul { display: flex; flex-direction: column; align-items: center; gap: 0.2rem; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-3depth ul li a { display: block; position: relative; padding-left: 0.9rem; font-size: 1.6rem; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header-menu-3depth ul li a::before { display: block; content: ""; width: 0.4rem; height: 1px; background: #707070; position: absolute; top: 1.15rem; left: 0; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type1"] .header-menu > ul > li.active > a { color: #275BAB; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type1"] .header-menu > ul > li.active > a::after { display: block; content: ""; width: calc(100% - 10rem); height: 2px; background: #275BAB; position: absolute; bottom: 0; left: 5rem; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type1"] .header-menu-2depth > ul > li:hover > a { color: #275BAB; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type1"] .header-menu-2depth > ul > li > a:focus-visible { color: #275BAB; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type1"] .header-menu-3depth > ul > li > a:hover, #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type1"] .header-menu-3depth > ul > li > a:focus-visible { color: #275BAB; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type1"] .header-menu.active .header-menu-2depth { opacity: 1; visibility: visible; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type2"] .header-menu a { text-align: center; word-break: break-all; justify-content: center; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type2"] .header-menu a:hover, #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type2"] .header-menu a:focus-visible { color: #fff; opacity: 1 !important; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type2"] .header-menu > ul > li.active > a { background: #275BAB; color: #fff; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type2"] .header-menu-2depth { color: #fff; background: #275BAB; border-top: 1px solid rgba(255, 255, 255, 0.2); } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type2"] .header-menu-2depth > ul { align-items: center; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type2"] .header-menu-3depth ul li a { padding-left: 0; opacity: 0.5; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type2"] .header-menu-3depth ul li a::before { display: none; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-container > ul > li { position: static; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-container > ul > li > a { display: flex; align-items: center; justify-content: center; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-container > ul > li.active > a { color: #275BAB; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-container > ul > li.active > a span { position: relative; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-container > ul > li.active > a span::after { display: block; content: ""; width: 100%; height: 1px; background: #275BAB; position: absolute; bottom: 0; left: 0; transform: translateY(300%); } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-2depth { padding-left: 0; padding-right: 0; justify-content: flex-start; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-2depth::before { display: block; content: ""; width: 100vw; height: 100%; background: #f5f5f5; position: absolute; left: 50%; transform: translateX(-50%); top: 0; z-index: -1; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-2depth-title { display: flex; flex-direction: column; width: 41.4rem; flex-shrink: 0; gap: 1.5rem; padding-right: 6rem; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-2depth-title strong { font-size: 2.8rem; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-2depth-title p { color: #757575; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-2depth > ul { flex-grow: 1; padding-right: 6rem; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-2depth > ul > li:hover > a { color: #2b2b2b; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-2depth-image { width: 48rem; height: 23.2rem; overflow: hidden; flex-shrink: 0; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-2depth-image img { width: 100%; height: 100%; object-fit: cover; } #wrap[data-mxds-responsive="pc"]:not([data-header-state-item="sitemap"]) .header[data-header-gnb="type3"] .header-menu-3depth ul { align-items: flex-start; } #wrap[data-mxds-responsive="mobile"] .header { padding: 0 20px; } #wrap[data-mxds-responsive="mobile"] .header-container { width: 100%; } #wrap[data-mxds-responsive="mobile"][data-header-state-item="sitemap"] .header[data-header-lnb] .header-menu { display: flex; } #wrap[data-mxds-responsive="mobile"] .header[data-header-search] .search-container { padding: 30px 20px; } #wrap[data-mxds-responsive="mobile"] .header[data-header-search] .search-area { width: 100%; } #wrap[data-mxds-responsive="mobile"] .header[data-header-search="type1"] .search-container { padding: 49px 40px; } #wrap[data-mxds-responsive="mobile"] .header[data-header-search="type2"] .search-container { top: 10rem; } #wrap[data-mxds-responsive="mobile"] .header[data-header-search="type2"] .search-container-close { display: none; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu { display: none; position: fixed; right: 0; width: 414px; max-width: 100%; padding: 0; background: #fff; height: calc(100vh - $headerHeight); top: 10rem; color: #000; flex-direction: column; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-container > ul { flex-grow: 1; overflow: auto; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-line { display: none; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-background { display: none; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-copyrights { flex-shrink: 0; padding: 35px 20px; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-copyrights-sns { display: flex; gap: 2rem; justify-content: space-between; font-size: 16px; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-copyrights-sns a { position: relative; display: flex; align-items: center; justify-content: center; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-copyrights-sns a::before { display: block; content: ""; width: 24px; height: 24px; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-copyrights-sns-list { display: flex; align-items: center; gap: 1.6rem; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-copyrights-sns-facebook::before { background: url(/mxds/images/foundation/facebook.png); } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-copyrights-sns-blog::before { background: url(/mxds/images/foundation/blog.png); } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-copyrights-sns-twitter::before { background: url(/mxds/images/foundation/twitter.png); } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-copyrights-sns-instagram::before { background: url(/mxds/images/foundation/instagram.png); } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-copyrights-sns-youtube::before { background: url(/mxds/images/foundation/youtube.png); } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-copyrights-text { display: none; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu li a.arrow { width: 100%; justify-content: space-between; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu li a.arrow::after { display: block; content: "\ebd1"; font-family: "iconoir"; color: #9e9e9e; font-weight: 400; font-size: 24px; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-container { height: 100%; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-container > ul { height: 100%; padding: 0; gap: 0; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-container > ul > li { padding: 0; gap: 0; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-container > ul > li > a { display: flex; align-items: center; padding: 10px 20px; width: 100%; font-weight: 700; border-bottom: 1px solid; position: relative; justify-content: space-between; gap: 10px; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-container > ul > li.on .header-menu-2depth { display: block; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-container > ul > li.on > a.arrow::after { content: "\eb23"; color: #275BAB; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-2depth { display: none; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-2depth-title, #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-2depth-image { display: none; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-2depth > ul { flex-direction: column; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-2depth > ul > li > a { font-weight: 500; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-2depth > ul > li.on > a { font-weight: 700; color: #275BAB; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-3depth > ul > li > a { font-size: 16px; position: relative; padding-left: 13px; color: #757575; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-3depth > ul > li > a::before { display: block; content: ""; width: 6px; height: 1px; background: #707070; position: absolute; top: 12px; left: 0; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-3depth > ul > li > a:hover { text-decoration: underline; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb] .header-menu-3depth > ul > li.on > a { font-weight: 500; text-decoration: underline; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type1"] .header-menu-container > ul > li > a { min-height: 73px; border-bottom-color: #e0e0e0; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type1"] .header-menu-container > ul > li.on > a { color: #275BAB; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type1"] .header-menu-2depth { width: 100%; padding: 28px 20px; background: #eeeeee; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type1"] .header-menu-2depth > ul { gap: 18px; display: flex; flex-direction: column; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type1"] .header-menu-2depth > ul > li { display: flex; flex-direction: column; gap: 5px; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type1"] .header-menu-2depth > ul > li > a { font-size: 18px; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type1"] .header-menu-2depth > ul > li > a.arrow::after { display: none; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type1"] .header-menu-2depth > ul > li.on a { text-decoration: underline; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type1"] .header-menu-3depth > ul > li.on > a { color: #275BAB; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-copyrights { display: none; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-container > ul { background: #616161; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-container > ul > li { padding-right: calc(100% - 177px); } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-container > ul > li > a { color: #fff; min-height: 65px; border-bottom-color: #757575; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-container > ul > li > a::after { display: none !important; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-container > ul > li.on > a { background: #fff; color: #000; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-2depth { width: calc(100% - 177px); height: calc(100vh - $headerHeight); position: absolute; top: 0; right: 0; background: #fff; padding: 0 20px; overflow: auto; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-2depth > ul > li > a { color: #757575; display: flex; padding: 10px 0; min-height: 65px; align-items: center; font-size: 16px; border-bottom: 1px solid #eee; width: 100%; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-2depth > ul > li.on > a { border-bottom-color: #275BAB; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-2depth > ul > li.on > a.arrow::after { content: "\eb23"; color: #275BAB; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-2depth > ul > li.on .header-menu-3depth { display: block; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-3depth { display: none; padding: 13px 0 24px; border-bottom: 1px solid #eee; } #wrap[data-mxds-responsive="mobile"] .header[data-header-lnb="type2"] .header-menu-3depth > ul > li.on > a { color: #222; } .header { display: flex; justify-content: center; height: 10rem; z-index: 40; position: fixed; top: 0; left: 0; width: 100%; background: #fff; padding: 0 4rem; } .header[data-header-search="type1"] .search-container { top: 10rem; padding: 8.65rem 2rem; } .header[data-header-search="type1"] .search-area input { border-bottom: 2px solid #2b2b2b; padding: 1.9rem 5.6rem 1.9rem 0; } .header[data-header-search="type1"] .search-area button { position: absolute; right: 0; bottom: 1.5rem; } .header[data-header-search="type1"] .search-area button i { font-size: 28px; color: #222; } .header[data-header-search="type1"] .search-area button span { font-size: 0; opacity: 0; } .header[data-header-search="type2"] .search-container { z-index: 1; padding: 2.6rem 2rem; top: 0; height: 10rem; } .header[data-header-search="type2"] .search-container-close { position: absolute; right: 0; top: 0; height: 10rem; width: 10rem; display: flex; align-items: center; justify-content: center; background: #222; z-index: 1; } .header[data-header-search="type2"] .search-container-close img { width: 2.4rem; } .header[data-header-search="type2"] .search-area { height: 100%; display: flex; position: relative; gap: 1.6rem; align-items: center; } .header[data-header-search="type2"] .search-area::before { display: block; content: "\ec3b"; font-family: "iconoir"; font-size: 3.2rem; color: #222; } .header[data-header-search="type2"] .search-area input { flex-grow: 1; height: 100%; } .header[data-header-search="type2"] .search-area button { position: relative; width: 7.3rem; height: 4rem; background: #757575; border-radius: 0.3rem; flex-shrink: 0; } .header[data-header-search="type2"] .search-area button i { font-size: 0; opacity: 0; visibility: hidden; } .header[data-header-search="type2"] .search-area button span { font-size: 1.6rem; color: #fff; font-weight: 500; } .header::before { display: block; content: ""; width: 100%; height: 1px; border-bottom: 1px solid #E0E0E0; position: absolute; bottom: 0; left: 0; z-index: -1; } .header-container { width: 130rem; max-width: 100%; height: 100%; position: relative; display: flex; align-items: center; } .header-logo { position: absolute; left: 0; top: 0; bottom: 0; margin: auto 0; display: flex; align-items: center; z-index: 1; } .header-logo a { overflow: hidden; } .header-logo a img { width: 100%; transform: translateY(0); transition: 0.25s; } .header-util { position: absolute; right: 0; top: 0; bottom: 0; margin: auto 0; display: flex; align-items: center; justify-content: flex-end; gap: 1.6rem; } .header-util > div { position: relative; } .header-util > div > a { font-size: 1.5rem; font-family: inherit; font-weight: 500; display: flex; align-items: center; justify-content: center; gap: 0.4rem; } .header-util > div > a::after { display: block; font-family: "iconoir"; line-height: 1; } .header-util > div > a + * { display: none; } .header-util > div.active > a + * { display: flex; } .header-util-language > a { padding: 1.2rem 1.4rem; } .header-util-language > a::after { content: "\eb4a"; font-size: 1.6rem; color: #275BAB; transform: rotate(0); transition: 0.25s; } .header-util-language.active { background: #eee; } .header-util-language.active > a::after { transform: rotate(180deg); } .header-util-language .language-container { flex-direction: column; position: absolute; top: 100%; left: 0; width: 100%; background: #eee; } .header-util-language .language-container a { display: flex; padding: 1.2rem 1.4rem; font-size: 1.5rem; border-top: 1px solid #e0e0e0; } .header-util-language .language-container a:hover, .header-util-language .language-container a:focus-visible { background: #000; color: #fff; } .header-util-search > a::after { content: "\ec3b"; font-size: 3.2rem; width: 3.2rem; } .header-util-search.active > a::after { content: ""; height: 3.2rem; background: url(/mxds/images/foundation/close.svg) no-repeat center center/2.2rem 2.2rem; } .header-util-search .search-container { position: fixed; width: 100%; left: 0; background: #fff; justify-content: center; align-items: center; } .header-util-search .search-area { position: relative; width: 56rem; max-width: 100%; } .header-util-search .search-area input { display: block; width: 100%; border: none; font-size: 16px; } .header-util-sitemap > a::after { content: "\eb15"; font-size: 3.2rem; width: 3.2rem; } .header-util-sitemap.active > a::after { content: ""; height: 3.2rem; background: url(/mxds/images/foundation/close.svg) no-repeat center center/2.2rem 2.2rem; } .snb { display: flex; justify-content: center; z-index: 30; position: relative; } .snb-information { display: flex; max-width: 100%; } .snb[data-mxds-type="type1"], .snb[data-mxds-type="type2"] { background: #161616; } .snb[data-mxds-type="type1"] .snb-information-home, .snb[data-mxds-type="type2"] .snb-information-home { width: 7.2rem; color: #fff; background: #275BAB; display: flex; align-items: center; justify-content: center; font-size: 2.4rem; flex-shrink: 0; } .snb[data-mxds-type="type1"] .snb-information-title, .snb[data-mxds-type="type2"] .snb-information-title { position: relative; min-width: 0; } .snb[data-mxds-type="type1"] .snb-information-title > a, .snb[data-mxds-type="type2"] .snb-information-title > a { display: flex; justify-content: space-between; align-items: center; height: 7.2rem; padding: 0 1.75rem 0 3.2rem; font-size: 1.8rem; color: #fff; font-weight: 700; letter-spacing: -0.025em; gap: 3rem; min-width: 21.8rem; border-right: 1px solid #616161; } .snb[data-mxds-type="type1"] .snb-information-title > a i, .snb[data-mxds-type="type2"] .snb-information-title > a i { font-size: 1.6rem; } .snb[data-mxds-type="type1"] .snb-information-title > a.on, .snb[data-mxds-type="type2"] .snb-information-title > a.on { background: #424242; } .snb[data-mxds-type="type1"] .snb-information-title > a.on i, .snb[data-mxds-type="type2"] .snb-information-title > a.on i { transform: rotate(180deg); color: #fff; } .snb[data-mxds-type="type1"] .snb-information-title > a span, .snb[data-mxds-type="type2"] .snb-information-title > a span { flex-grow: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .snb[data-mxds-type="type1"] .snb-information-title > a i, .snb[data-mxds-type="type2"] .snb-information-title > a i { flex-shrink: 0; } .snb[data-mxds-type="type1"] .snb-information-title > ul, .snb[data-mxds-type="type2"] .snb-information-title > ul { position: absolute; width: 100%; top: 100%; z-index: 1; display: none; background: #424242; } .snb[data-mxds-type="type1"] .snb-information-title > ul > li > a, .snb[data-mxds-type="type2"] .snb-information-title > ul > li > a { display: flex; align-items: center; padding: 1.6rem 3.2rem; font-size: 1.8rem; color: #fff; font-weight: 500; transition: 0.25s; border-top: 1px solid #616161; } .snb[data-mxds-type="type1"] .snb-information-title > ul > li > a:hover, .snb[data-mxds-type="type2"] .snb-information-title > ul > li > a:hover { background: #757575; } .snb[data-mxds-type="type1"] .snb-information-title > ul > li:last-of-type > a, .snb[data-mxds-type="type2"] .snb-information-title > ul > li:last-of-type > a { border-bottom: 0; } .snb[data-mxds-type="type1"] .snb-information-list, .snb[data-mxds-type="type2"] .snb-information-list { display: flex; overflow: auto; position: relative; padding: 0 3.25rem; flex-grow: 1; } .snb[data-mxds-type="type1"] .snb-information-list > li, .snb[data-mxds-type="type2"] .snb-information-list > li { margin-right: 3.2rem; } .snb[data-mxds-type="type1"] .snb-information-list > li:last-of-type, .snb[data-mxds-type="type2"] .snb-information-list > li:last-of-type { margin-right: 0; } .snb[data-mxds-type="type1"] .snb-information-list > li > a, .snb[data-mxds-type="type2"] .snb-information-list > li > a { height: 7.2rem; display: flex; align-items: center; padding: 0; font-size: 1.8rem; font-weight: 500; color: #fff; opacity: 0.5; white-space: nowrap; } .snb[data-mxds-type="type1"] .snb-information-list > li.on a, .snb[data-mxds-type="type2"] .snb-information-list > li.on a { opacity: 1; } .snb[data-mxds-type="type1"] .snb-information-title { flex-shrink: 0; } .snb[data-mxds-type="type3"] { background: rgba(0, 0, 0, 0.3); } .snb[data-mxds-type="type3"] .snb-information { justify-content: center; } .snb[data-mxds-type="type3"] .snb-information-list { display: flex; max-width: 100%; overflow: auto; } .snb[data-mxds-type="type3"] .snb-information-list > ul { display: flex; } .snb[data-mxds-type="type3"] .snb-information-list > ul > li > a { display: flex; height: 7.2rem; align-items: center; justify-content: center; position: relative; color: #fff; padding: 0 2.4rem; font-weight: 500; font-size: 1.8rem; } .snb[data-mxds-type="type3"] .snb-information-list > ul > li.on > a::before { display: block; content: ""; width: 100%; height: 3px; background: #fff; position: absolute; top: 0; left: 0; } .sub-visual { height: 560px; background: #bdbdbd; position: relative; padding-top: 10rem; } .sub-visual .layout { display: flex; align-items: center; justify-content: center; text-align: center; height: 100%; flex-direction: column; gap: 1.6rem; } .sub-location { display: flex; justify-content: center; flex-wrap: wrap; } .sub-location-home { opacity: 1; font-size: 2rem; } .sub-location > a { display: flex; align-items: center; justify-content: center; position: relative; color: #fff; opacity: 0.8; } .sub-location > a::before { display: block; content: ""; width: .6rem; height: .6rem; background: rgba(255, 255, 255, 0.4); margin: 0 1.2rem; border-radius: 50%; } .sub-location > a:first-of-type::before { display: none; } #sub { padding: 12rem 0 18.9rem; } #sub .contents { margin-top: 72px; } #sub .h3 + * { margin-top: 72px; } #sub .h4 { margin: 5.6rem 0 2.4rem; } #sub .h4:first-of-type { margin-top: 0; } #sub .h5 { margin: 5.6rem 0 1.6rem; } #sub .h6 { margin: 5.6rem 0 1.2rem; } .bul1 { display: flex; flex-direction: column; gap: 0.8rem; } * + .bul1 { margin-top: 1.2rem; } .bul1 > li { position: relative; padding-left: 12px; display: flex; flex-direction: column; gap: 1.2rem; } .bul1 > li::before { display: block; content: ""; width: 4px; height: 4px; background: #9e9e9e; position: absolute; left: 0; top: 11px; } .bul2 { display: flex; flex-direction: column; gap: 0.8rem; } * + .bul2 { margin-top: 1.2rem; } .bul2 > li { position: relative; padding-left: 12px; display: flex; flex-direction: column; gap: 1.2rem; } .bul2 > li::before { display: block; content: ""; width: 4px; height: 2px; background: #bdbdbd; position: absolute; left: 0; top: 12px; } .bul3 { counter-reset: list-number; display: flex; flex-direction: column; gap: 1.2rem; } * + .bul3 { margin-top: 1.2rem; } .bul3 > li { counter-increment: list-number; position: relative; padding-left: 39px; display: flex; flex-direction: column; gap: 1.2rem; } .bul3 > li::before { display: flex; content: counter(list-number); width: 27px; height: 27px; background: #424242; align-items: center; justify-content: center; text-align: center; position: absolute; left: 0; top: 0; color: #fff; font-size: 14px; font-weight: 500; border-radius: 0.3rem; } .bul4 { counter-reset: list-number2; display: flex; flex-direction: column; gap: 0.8rem; } * + .bul4 { margin-top: 1.2rem; } .bul4 > li { counter-increment: list-number2; position: relative; padding-left: 39px; display: flex; flex-direction: column; gap: 1.2rem; } .bul4 > li::before { display: flex; content: counter(list-number2); width: 26px; height: 26px; background: #e0e0e0; align-items: center; justify-content: center; text-align: center; position: absolute; left: 0; top: 0; color: #424242; font-size: 14px; border-radius: 50%; font-weight: 500; }