@charset "utf-8";
/* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */

#skipToContent a {z-index:100000; position:absolute; top:0; left:0; width:1px; height:1px; font-size:0; line-height:0; overflow:hidden}
#skipToContent a:focus, #skipToContent a:active {width:200px; height:50px; background:#21272e; color:#fff; font-size:14px; font-weight:bold; text-align:center; text-decoration:none; line-height:50px}

.only-desktop {display:block;}
.only-desktop-tablet {display:block;}
.only-tablet-mobile {display:none;}
.only-tablet {display:none;}
.only-mobile {display:none;}

.contain {width:100%; max-width:1660px; padding-left:30px; padding-right:30px; margin:0 auto;}
.contain2 {width:100%; max-width:1460px; padding-left:30px; padding-right:30px; margin:0 auto;}
.contain:after {content:""; display:block; clear:both;}

#container>div {overflow:hidden;}
#container>section {overflow:hidden;}
#ws-wrapper {display:flex; min-height:100vh;}
#ws-header {width:200px; background:#fafafa; box-shadow:0 0 5px rgba(0,0,0,.2);}
.ws-menu .ui {display:block; padding:13px 0; background:#5e31a1; color:#fff; font-size:18px; font-weight:700; line-height:1.5em; letter-spacing:-.03em; text-align:center; border-bottom:2px solid #3c2065;}
.ws-menu h2 {font-family:"Roboto",sans-serif; font-size:15px; color:#fff; line-height:1.3em; padding:7px 0; text-align:center; background:#7952b3;}
.ws-menu ul {display:flex; flex-wrap:wrap;}
.ws-menu ul li {width:100%; border-bottom:1px solid #e5e5e5;}
.ws-menu ul li.w50 {width:50%; border-right:1px solid #e5e5e5;}
.ws-menu ul li.w50:nth-child(2n) {border-right:0;}
.ws-menu ul li a {display:block; color:#333; text-decoration:none; font-size:13px; font-weight:300; line-height:1.4em; letter-spacing:-.04em; padding:5px 5px 5px 11px;}
.ws-menu ul li a:hover, .ws-menu ul li.active a {background:#eee; color:#653ba4; font-weight:500; padding-left:14px;}
#ws-content {flex:1 1 auto; min-width:0; width:1%; padding:30px;}
.ws-title {display:flex; align-items:center; padding-bottom:15px; margin-bottom:50px; border-bottom:1px solid #ddd;}
.ws-title h2 {flex:1 1 auto; min-width:0; width:1%; font-size:30px; line-height:1.3em; letter-spacing:-.04em;}
.btn-psd-download {display:inline-block; padding:8px 20px; font-family:"Roboto",sans-serif; color:#fff; font-size:16px; font-weight:500; line-height:1.3em; background:#7952b3; border-radius:4px;}
.ws-real-cont {max-width:1200px; margin:0 auto;}

:root {--hero-padding-top:clamp(160px, 19.79vw, 380px); --hero-padding-bottom:clamp(40px, 3.125vw, 60px); --hero-company-title-size:clamp(36px, 3.75vw, 72px); --hero-company-title-lh:1.25em; --hero-division-title-size:clamp(28px, 3.75vw, 72px); --hero-division-title-lh:1.25em; --hero-subtitle-size:clamp(16px, 1.354vw, 26px); --hero-subtitle-lh:1.62em; --hero-text-gap:clamp(24px, 2.08vw, 40px); --hero-text-offset-y:clamp(-24px, -2.08vw, -40px); --hero-brush-size:min(1400px, 130vw); --hero-brush-top:clamp(260px, 24vw, 400px); --hero-subtitle-max-w:720px; --hero-indicator-size:clamp(13px, 0.83vw, 16px); --hero-arrow-size:clamp(14px, 0.9375vw, 18px); --hero-arrow-lh:1.67em; --hero-crossfade-duration:0.85s; --hero-crossfade-ease:cubic-bezier(0.4, 0, 0.2, 1); --hero-text-duration:0.28s; --business-card-width:calc((100% - var(--space-md) * 2) / 3); --business-card-width-tablet:calc((100% - var(--space-md)) / 2); --business-card-width-mobile:100%; --business-card-gap:34px; --business-body-gap:30px; --business-text-gap:20px; --sub-visual-height:clamp(320px, 31.56vw, 606px); --sub-visual-padding-x:clamp(20px, 4.17vw, 80px); --sub-visual-padding-top:clamp(120px, 11.875vw, 228px); --sub-visual-gap:clamp(60px, 8.33vw, 160px); --sub-visual-title-size:clamp(32px, 3.75vw, 72px); --sub-visual-title-lh:1.28em; --sub-visual-subtitle-size:clamp(16px, 1.25vw, 24px); --sub-visual-subtitle-lh:1.67em; --sub-visual-tab-size:clamp(16px, 1.04vw, 20px); --sub-title-pt:clamp(60px, 6.25vw, 120px); --sub-title-pb:clamp(50px, 5.21vw, 100px); --sub-title-size:clamp(28px, 2.5vw, 48px); --sub-title-lh:1.29em;}

body#main {padding-top:0; overflow-x:clip;}
body#sub {padding-top:0;}

/* header */
#header {position:fixed; top:0; left:0; width:100%; height:var(--header-height); z-index:101; background:transparent; transition:background-color var(--transition-base), transform var(--transition-base); }
#header .contain { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; height:100%; z-index:10; max-width: 1820px;}
#header .contain:after {content:none;}
#gnb {justify-self:start; height:100%;}
#gnb>ul {display:flex; align-items:center; gap:48px; height:100%;}
#gnb>ul>li {position:static; display:flex; align-items:center; height:100%;}
#gnb>ul>li>a {display:block; font-weight:600; font-size:20px; letter-spacing:-0.4px; line-height:1.7em; color:var(--color-white); white-space:nowrap; transition:color var(--transition-base);}
#gnb .submenu {display:none; position:absolute; top:100%; left:0; width:100%; background:var(--color-white); padding:8px 0 var(--submenu-padding-bottom); z-index:9;}
#gnb .submenu .contain {display:flex; align-items:flex-start; justify-content:space-between; height:auto;}
#gnb .submenu-left {display:flex; align-items:flex-start;}
#gnb .submenu-title {display:flex; align-items:center; width:260px; font-weight:600; font-size:32px; letter-spacing:-0.64px; line-height:1.44em; color:var(--color-text);}
#gnb .submenu-links {display:flex; flex-direction:column; gap:20px; border-left:2px solid var(--color-border-light);}
#gnb .submenu-links a {display:flex; align-items:center; padding-left:30px; font-weight:500; font-size:24px; letter-spacing:-0.48px; line-height:1.67em; color:var(--color-text-light); border-left:2px solid transparent; margin-left:-2px; transition:color var(--transition-base), border-color var(--transition-base);}
#gnb .submenu-links a:hover, #gnb .submenu-links a:focus-visible {color:var(--color-navy); border-left-color:var(--color-navy);}
#gnb .submenu-photo {width:576px; height:240px; flex-shrink:0; overflow:hidden;}
#gnb .submenu-photo img {width:100%; height:100%; object-fit:cover;}
#header:hover #gnb>ul>li:hover .submenu, #header:focus-within #gnb>ul>li:focus-within .submenu {display:block;}
.sitelogo {justify-self:center; width:72px; height:72px;}
.sitelogo a {display:block; width:72px; height:72px;}
.sitelogo img {width:72px; height:72px; object-fit:contain;}
.sitelogo .logo-white {display:block;}
.sitelogo .logo-color {display:none;}
.util {justify-self:end; display:flex; align-items:center; gap:8px;}
.btn-icon {display:flex; align-items:center; gap:14px; height:54px; padding:4px 18px 4px 4px; border:1px solid var(--color-white); font-weight:600; font-size:18px; letter-spacing:-0.36px; line-height:1.5em; color:var(--color-white); white-space:nowrap; transition:background-color var(--transition-base), color var(--transition-base), border-color var(--transition-base);}
.btn-icon__icon {display:flex; align-items:center; justify-content:center; width:46px; height:46px; flex-shrink:0; background:rgba(255,255,255,0.1);}
.btn-icon__icon img {width:20px; height:20px;}
.btn-icon .icon-white {display:block;}
.btn-icon .icon-dark {display:none;}
.list-icon {display:none; justify-self:start; width:22px; height:16px; text-align:center; text-indent:-9999em; z-index:50; position:relative;}
.list-icon span {position:absolute; right:0; top:50%; height:2px; background:var(--color-white); left:0;}
.list-icon span:before, .list-icon span:after {content:" "; position:absolute; left:0; right:0; height:2px; background:var(--color-white);}
.list-icon span:before {top:-8px;}
.list-icon span:after {bottom:-8px;}
#header.is-solid, #header:hover, #header:focus-within {background:var(--color-white);}
#header.is-solid #gnb>ul>li>a, #header:hover #gnb>ul>li>a, #header:focus-within #gnb>ul>li>a {color:var(--color-text);}
#header:hover #gnb>ul>li:hover>a, #header:focus-within #gnb>ul>li:focus-within>a {color:var(--color-navy);}
#header.is-solid .sitelogo .logo-white, #header:hover .sitelogo .logo-white, #header:focus-within .sitelogo .logo-white {display:none;}
#header.is-solid .sitelogo .logo-color, #header:hover .sitelogo .logo-color, #header:focus-within .sitelogo .logo-color {display:block;}
#header.is-solid .btn-icon, #header:hover .btn-icon, #header:focus-within .btn-icon {border-color:transparent; background:var(--color-bg-muted); color:var(--color-text);}
#header.is-solid .btn-icon__icon, #header:hover .btn-icon__icon, #header:focus-within .btn-icon__icon {background:var(--color-white); border:1px solid var(--color-navy);}
#header.is-solid .btn-icon .icon-white, #header:hover .btn-icon .icon-white, #header:focus-within .btn-icon .icon-white {display:none;}
#header.is-solid .btn-icon .icon-dark, #header:hover .btn-icon .icon-dark, #header:focus-within .btn-icon .icon-dark {display:block;}
#header.is-solid .list-icon span, #header.is-solid .list-icon span:before, #header.is-solid .list-icon span:after, #header:hover .list-icon span, #header:hover .list-icon span:before, #header:hover .list-icon span:after {background:var(--color-text);}
#header.is-hidden {transform:translateY(calc(-1 * var(--header-height))); pointer-events:none;}

.mobile-navigation {display:block; position:fixed; top:0; left:0; width:300px; height:100%; overflow:auto; transition:.2s linear; transform:translateX(-100%); background:#fff; z-index:102;}
.mobile-navigation .home {display:flex; align-items:center; height:80px; padding:0 20px; color:#242424; font-size:19px; font-weight:700; line-height:1.5em;}
.mobile-navigation .nav-menu>ul {border-top:1px solid #ddd;}
.mobile-navigation .nav-menu>ul>li {border-bottom:1px solid #ddd;}
.mobile-navigation .nav-menu>ul>li>a {position:relative; padding:10px 48px 10px 20px; display:block; color:#242424; font-size:17px; font-weight:700; line-height:1.5em;}
.mobile-navigation .nav-menu>ul>li>a:after {content:""; position:absolute; top:50%; right:20px; transform:translateY(-75%) rotate(45deg); width:11px; height:11px; border-right:2px solid #505050; border-bottom:2px solid #505050;}
.mobile-navigation .nav-menu>ul>li.active>a {color:#fff; background:var(--color-primary);}
.mobile-navigation .nav-menu>ul>li.active>a:after {transform:translateY(-35%) rotate(-135deg); border-color:#fff;}
.mobile-navigation .nav-menu .submenu {display:none; position:static; width:auto; padding:0; background:#f8f8f8;}
.mobile-navigation .nav-menu .submenu .contain {display:block; padding:0; max-width:none;}
.mobile-navigation .nav-menu .submenu-title, .mobile-navigation .nav-menu .submenu-photo {display:none;}
.mobile-navigation .nav-menu .submenu-links {display:block; border:0;}
.mobile-navigation .nav-menu .submenu-links a {display:block; padding:12px 20px; font-size:15px; line-height:1.5em; color:#454545; border:0; margin:0;}
.mobile-navigation .nav-menu .submenu ul li {border-top:1px solid #e5e5e5;}
.mobile-navigation .close {position:absolute; top:25px; right:15px; width:26px; height:26px; text-indent:-9999em; overflow:hidden;}
.mobile-navigation .close:before, .mobile-navigation .close:after {content:" "; position:absolute; top:12px; left:0; width:100%; height:3px; background:#242424; border-radius:3px;}
.mobile-navigation .close:before {transform:rotate(45deg);}
.mobile-navigation .close:after {transform:rotate(-45deg);}
.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:101;}
html.menu-opened {overflow:hidden;}
html.menu-opened .mobile-navigation {transform:translateX(0);}
html.menu-opened .mobile-overlay {display:block;}

/* 메인비주얼 */
.main-visual {position:relative; height:100vh; overflow:hidden;}
.main-visual .slick-slide {position:relative; height:100vh; overflow:hidden;}
.main-visual .item {position:absolute; top:0; left:0; width:100%; height:100%; overflow:hidden;}
.main-visual .item .video-js, .main-visual .item video {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.main-visual .item iframe {position:absolute; top:50%; left:50%; width:100vw; height:100vh; transform:translate(-50%,-50%);}
.main-visual .item img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.main-visual .caption {position:absolute; left:0; text-align:center; width:100%; top:50%; transform:translateY(-50%);}
.main-visual .caption .txt {width:100%; transform:translateX(-50px); opacity:0; transition:opacity 0s 2s, transform 0s 2s; color:#fff; text-shadow:0 2px 4px rgba(0,0,0,0.55), 0 6px 18px rgba(0,0,0,0.6), 0 0 28px rgba(0,0,0,0.45);}
.main-visual .items .slick-active .caption .txt {transform:translateX(0); opacity:1; transition:opacity 2s, transform 1s; transition-delay:0.6s;}
.main-visual .items .reset-animation .caption .txt {transform:translateX(-50px); opacity:0; transition:all 0s;}
.main-visual .caption h2 {margin-bottom:24px; letter-spacing:-0.02em;}
.main-visual .caption .company h2 {font-size:clamp(36px, 3.75vw, 72px); font-weight:800; line-height:1.25em;}
.main-visual .caption .division h2 {font-size:clamp(28px, 3.75vw, 72px); font-weight:700; line-height:1.25em;}
.main-visual .caption p {max-width:720px; margin:0 auto; font-size:clamp(16px, 1.354vw, 26px); font-weight:500; line-height:1.62em; letter-spacing:-0.48px;}
.main-visual-arrows {position:absolute; top:50%; left:50%; z-index:5; width:100%; max-width:1820px; padding:0 30px; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:space-between; pointer-events:none; box-sizing:border-box;}
.main-visual-arrow {display:flex; align-items:center; gap:12px; opacity:0.5; color:#fff; font-family:var(--font-title); font-weight:600; font-size:clamp(14px, 0.9375vw, 18px); line-height:1.67em; background:none; border:0; pointer-events:auto; cursor:pointer; transition: .3s;}
.main-visual-arrow:hover, .main-visual-arrow:focus-visible {opacity:1;}
.main-visual-arrow img {width:24px; height:24px;}
.main-visual-bottom {position:absolute; left:50%; bottom:clamp(40px, 3.125vw, 60px); z-index:5; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:20px;}
.main-visual-indicator {font-family:var(--font-title); font-weight:600; font-size:clamp(13px, 0.83vw, 16px); line-height:1em; letter-spacing:0.08em; color:rgba(255,255,255,0.72);}
.main-visual-scroll {display:flex; align-items:center; justify-content:center; width:48px; height:48px; overflow:hidden; border:0; border-radius:var(--radius-pill); background:#000; cursor:pointer;}
.main-visual-scroll img {display:block; width:28px; height:28px; animation:main-visual-scroll-flow 1.5s linear infinite;}
@keyframes main-visual-scroll-flow {0% {transform:translateY(-38px);} 100% {transform:translateY(38px);}}
.hero__arrows {position:absolute; top:50%; left:50%; width:100%; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:space-between;}
.hero__arrow {display:flex; align-items:center; gap:12px; opacity:0.5; color:var(--color-white); font-family:var(--font-title); font-weight:600; font-size:var(--hero-arrow-size); line-height:var(--hero-arrow-lh); background:none; border:0;}
.hero__arrow:hover, .hero__arrow:focus-visible {opacity:1;}
.hero__arrow img {width:24px; height:24px;}

/* 메인 컨텐츠 */
.section-title {font-family:var(--font-title); font-weight:500; font-size:clamp(32px, 4vw, 54px); line-height:1.3em; color:var(--color-text);}
.section-title .accent {color:var(--color-navy);}
.section-title.center {text-align:center;}
.section-desc {font-family:var(--font-body); font-size:clamp(16px, 1.4vw, 20px); line-height:1.7em; letter-spacing:-0.4px; color:var(--color-text-muted);}
.section-desc.center {text-align:center;}
.btn-outline {display:inline-flex; align-items:center; padding:10px 24px; background:var(--color-white); font-size:18px; letter-spacing:-0.36px; line-height:1.5em; color:var(--color-text); position: relative; }
.btn-outline::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border:1px solid var(--color-text-muted); }
.btn-outline:hover, .btn-outline:focus-visible {background:var(--color-navy); border-color:var(--color-navy); color:var(--color-white);}
.carousel-arrows {display:flex; align-items:center; gap:16px;}
.carousel-arrow {display:flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:var(--radius-pill); background:var(--color-bg-muted); border:0;}
.carousel-arrow img {width:18px; height:18px;}
.carousel-arrow--prev img {transform:rotate(180deg);}
.carousel-arrow--next {background:var(--color-navy);}
.carousel-arrow--next img {filter:brightness(0) invert(1);}

#container>section.our-business {overflow:visible; padding:var(--space-4xl) 0 var(--space-6xl);}
.our-business .contain {overflow:visible; --business-inner:min(1600px, calc(100vw - 60px)); --business-card-width:calc((var(--business-inner) - var(--space-md) * 2) / 3);}
.our-business .contain:after {content:none;}
.our-business__head {display:flex; align-items:flex-end; justify-content:space-between; gap:var(--space-md); margin-bottom:var(--space-xl); flex-wrap:wrap;}
.our-business__heading {display:flex; flex-direction:column; gap:12px; max-width:720px;}
.business-carousel {width:auto; margin-left:0; margin-right:calc(50% - 50vw); overflow:hidden;}
.business-carousel .swiper-slide {width:var(--business-card-width); height:auto;}
.business-card {width:var(--business-card-width); max-width:var(--business-card-width); display:flex; flex-direction:column; gap:var(--business-card-gap);}
.business-card__thumb {display:block; width:100%; aspect-ratio:517.33 / 453; overflow:hidden;}
.business-card__thumb img {width:100%; height:100%; object-fit:cover; pointer-events:none; -webkit-user-drag:none;}
.business-card__body {display:flex; flex-direction:column; align-items:flex-start; gap:var(--business-body-gap);}
.business-card__text {display:flex; flex-direction:column; align-items:flex-start; gap:var(--business-text-gap);}
.business-card__body h3 {font-weight:500; font-size:28px; line-height:1.5em; letter-spacing:-0.56px; color:var(--color-text);}
.business-card__body p {font-size:18px; line-height:1.67em; letter-spacing:-0.36px; color:var(--color-text);}

.start-move {background:var(--color-white); padding:0 0 var(--space-5xl);}
.start-move__head {display:flex; flex-direction:column; align-items:center; gap:12px; margin-bottom:var(--space-xl);}
.start-move__grid {display:flex; gap:var(--space-md);}
.start-move__box {flex:1 1 0; display:flex; align-items:center; justify-content:center; gap:10px; padding:30px var(--space-sm); background:var(--color-navy-dark); transition: .3s;}
.start-move__icon {display:flex; align-items:center; justify-content:center; width:32px; height:32px; flex-shrink:0;}
.start-move__icon img {display:block; object-fit:contain; opacity:0.8;}
.start-move__icon--company img {width:30px; height:27px;}
.start-move__icon--notice img {width:28px; height:30px;}
.start-move__icon--faq img {width:29px; height:30px;}
.start-move__icon--location img {width:25px; height:30px;}
.start-move__label {font-weight:500; font-size:20px; line-height:1.7em; letter-spacing:-0.4px; color:rgba(255,255,255,0.8); white-space:nowrap;}
.start-move__box:hover, .start-move__box:focus-visible {background:var(--color-navy-darker);}
.start-move__box:hover .start-move__icon img, .start-move__box:focus-visible .start-move__icon img {opacity:1;}
.start-move__box:hover .start-move__label, .start-move__box:focus-visible .start-move__label {color:var(--color-white);}

.choose-us {background:var(--color-bg-soft); padding:var(--space-4xl) 0 var(--space-6xl);}
.choose-us__top {display:flex; gap:var(--space-md); margin-bottom:var(--space-3xl); flex-wrap:wrap;}
.choose-us__title {flex:1 1 0; min-width:280px; font-weight:500; font-size:clamp(28px, 3.6vw, 54px); letter-spacing:-1.08px; line-height:1.3em; color:var(--color-text);}
.choose-us__title .accent {color:var(--color-navy);}
.choose-us__panel {flex:1 1 0; min-width:320px; display:flex; flex-direction:column; gap:var(--space-lg);}
.choose-us__tabs {display:flex; gap:10px; border-bottom:1px solid var(--color-border-muted);}
.choose-us__tab {flex:1; padding-bottom:16px; font-weight:500; font-size:24px; line-height:1.67em; letter-spacing:-0.48px; text-align:left; color:var(--color-text-lighter); border:0; border-bottom:2px solid transparent; background:none;}
.choose-us__tab.is-active {color:var(--color-navy); border-bottom-color:var(--color-navy);}
.choose-us__desc {font-size:20px; line-height:1.7em; letter-spacing:-0.4px; color:var(--color-text-muted); min-height:68px;}
.choose-us__buttons {display:flex; gap:6px;}
.choose-us__photo {position:relative; width:100%; aspect-ratio:1600 / 520; max-height:520px; overflow:hidden;}
.choose-us__photo-img {position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center bottom;}
.choose-us__scrim {position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(90deg, rgba(0,0,0,0.08), rgba(0,0,0,0) 50%, rgba(0,0,0,0.08));}
.choose-us__arrows.hero__arrows {position:absolute; inset:0; top:0; left:0; z-index:2; transform:none; display:flex; align-items:flex-end; justify-content:space-between; padding:var(--space-lg); pointer-events:none;}
.choose-us__arrows .hero__arrow {opacity:0.7; pointer-events:auto;}

/* 서브 공통 */
.sub-visual {position:relative; display:flex; flex-direction:column; height:var(--sub-visual-height); overflow:hidden; background-color:var(--color-navy-darker); color:var(--color-white);}
.sub-visual .bg {position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center bottom; z-index:0;}
.sub-visual-scrim {position:absolute; inset:0; z-index:1; pointer-events:none; background:radial-gradient(ellipse 30% 24% at 76% 68%, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0) 100%), linear-gradient(186deg, rgba(0,0,0,0.16) 0.534%, rgba(0,0,0,0) 29.85%), linear-gradient(90deg, rgba(0,0,0,0.16) 0%, rgba(0,0,0,0) 70%), linear-gradient(90deg, rgba(0,0,0,0.04) 0%, rgba(0,0,0,0.04) 100%);}
.sub-visual .contain {position:relative; z-index:2; display:flex; flex-direction:column; align-items:flex-start; flex:1 1 auto; max-width:none; padding:var(--sub-visual-padding-top) var(--sub-visual-padding-x) 0;}
.sub-visual .contain:after {content:none;}
.sub-visual-head {display:flex; flex-direction:column; gap:12px;}
.sub-visual h2 {font-family:var(--font-title); font-weight:800; font-size:var(--sub-visual-title-size); line-height:var(--sub-visual-title-lh); white-space:nowrap;}
.sub-visual p {font-weight:700; font-size:var(--sub-visual-subtitle-size); line-height:var(--sub-visual-subtitle-lh); letter-spacing:-0.48px;}
.lnb-wrap {position:relative; z-index:2; width:100%; flex-shrink:0; max-width:1750px; margin:0 auto;}
.lnb .swiper {width:100%; overflow:hidden;}
.lnb .swiper-slide {height:auto;}
.lnb ul {display:flex;}
.lnb ul li {flex:1 1 0;}
.lnb ul li a {display:flex; align-items:center; justify-content:center; width:100%; padding:20px 12px; font-weight:500; font-size:var(--sub-visual-tab-size); line-height:1.7em; letter-spacing:-0.4px; color:var(--color-text-muted); background:rgba(255,255,255,0.8); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-right:1px solid var(--color-border-muted); white-space:nowrap; transition:background-color var(--transition-base), color var(--transition-base);}
.lnb ul li:last-child a {border-right:0;}
.lnb ul li a:hover, .lnb ul li a:focus-visible {color:var(--color-navy-dark);}
.lnb ul li.active a {color:var(--color-white); background:var(--color-navy-dark);}
.lnb ul li.active a:hover, .lnb ul li.active a:focus-visible {color:var(--color-white);}

#contArea {max-width:1460px; padding-left:30px; padding-right:30px; margin:0 auto;}
#contArea.wide {max-width:100%; padding-left:0; padding-right:0;}
.sub-title {position:relative; display:flex; align-items:flex-end; justify-content:flex-start; flex-wrap:wrap; gap:12px 32px; padding-top:var(--sub-title-pt); padding-bottom:var(--sub-title-pb);}
.sub-title h2 {flex:0 0 auto; font-family:var(--font-body); font-weight:500; font-size:var(--sub-title-size); line-height:var(--sub-title-lh); letter-spacing:-0.96px; color:var(--color-text);}
.sub-title.none {display:none;}
.real-cont {min-height:300px; padding-bottom:180px;}
.real-cont2 {padding-bottom:0;}

/* footer */
#footer {width:100%; position:relative; z-index:1; background:var(--color-white); border-top:1px solid var(--color-border); color:var(--color-text);}
#footer .contain {padding-top:60px; padding-bottom:70px;}
#footer .contain:after {content:none;}
.foot-top {display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:60px;}
.site-footer-logo {display:block; width:72px; height:72px;}
.site-footer-logo img {width:72px; height:72px; object-fit:contain;}
.foot-family-wrap {position:relative; width:262px; flex-shrink:0;}
.foot-family {display:flex; align-items:center; justify-content:space-between; gap:20px; width:100%; padding:14px 24px; border:1px solid var(--color-border); border-radius:60px; font-weight:500; font-size:18px; letter-spacing:-0.36px; line-height:1.67em; color:var(--color-text); background:var(--color-white); white-space:nowrap; cursor:pointer;}
.foot-family img {width:28px; height:28px; flex-shrink:0; transition:transform var(--transition-base);}
.foot-family-wrap.is-open .foot-family img {transform:rotate(45deg);}
.foot-family-list {position:absolute; right:0; bottom:calc(100% + 8px); z-index:10; width:100%; background:var(--color-white); border:1px solid var(--color-border); border-radius:12px; overflow:hidden;}
.foot-family-list[hidden] {display:none;}
.foot-family-list li {border-bottom:1px solid var(--color-border-light);}
.foot-family-list li:last-child {border-bottom:0;}
.foot-family-list a {display:block; padding:14px 24px; font-weight:500; font-size:18px; letter-spacing:-0.36px; line-height:1.67em; color:var(--color-text); transition:background-color var(--transition-base);}
.foot-family-list a:hover, .foot-family-list a:focus-visible {background:var(--color-bg-soft);}
.foot-policy {display:flex; gap:24px; font-weight:600; font-size:18px; letter-spacing:-0.36px; color:var(--color-text); margin-bottom:30px;}
.foot-policy a {transition:color var(--transition-base);}
.foot-policy a:hover, .foot-policy a:focus-visible {color:var(--color-navy);}
.foot-bottom {display:flex; align-items:flex-end; justify-content:space-between; gap:20px; padding-top:30px; border-top:1px solid var(--color-border-light); font-size:16px; letter-spacing:-0.32px; line-height:1.5em; color:var(--color-text-muted); flex-wrap:wrap;}
.foot-info {display:flex; flex-direction:column; gap:8px;}
.foot-info-row {display:flex; gap:20px; flex-wrap:wrap;}
.foot-info-row .name {font-weight:500; color:var(--color-text);}
.foot-copy {display:flex; align-items:center; gap:24px; white-space:nowrap;}
.foot-copy .credit {color:var(--color-bg-soft);}
.foot-copy .rights {color:var(--color-text-lighter);}

/* 플로팅 */
.floating-menu {position:fixed; right:var(--float-offset-right); top:50%; bottom:auto; transform:translateY(-50%); z-index:90; display:flex; flex-direction:column; gap:var(--float-stack-gap); width:var(--float-width);}
.floating-menu__list {display:flex; flex-direction:column; gap:var(--float-item-gap); align-items:center; width:100%; padding:var(--float-list-padding-y) var(--float-list-padding-x); background:var(--color-float-bg); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); transition:background-color var(--transition-base), backdrop-filter var(--transition-base);}
.floating-menu__list:hover, .floating-menu__list:focus-within {background:var(--color-float-hover-bg); backdrop-filter:none; -webkit-backdrop-filter:none;}
.floating-menu__item {width:100%;}
.floating-menu__item a {display:flex; flex-direction:column; align-items:center; gap:var(--float-link-gap); width:100%;}
.floating-menu__icon {width:var(--float-icon-size); height:var(--float-icon-size); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.floating-menu__icon img {width:100%; height:100%; object-fit:contain;}
.floating-menu__label {font-weight:600; font-size:var(--float-label-size); line-height:var(--float-label-lh); letter-spacing:-0.56px; color:var(--color-white); white-space:nowrap; text-align:center;}
.floating-menu__top {display:flex; align-items:center; justify-content:center; width:100%; height:var(--float-top-height); background:var(--color-float-top-bg); border:0; cursor:pointer;}
.floating-menu__top img {width:10px; height:12px;}
.floating-menu__toggle {display:none; flex-direction:column; align-items:center; justify-content:center; gap:4px; width:100%; min-height:52px; padding:10px 6px; border:0; background:var(--color-navy); color:var(--color-white); cursor:pointer;}
.floating-menu__toggle-icon {position:relative; width:16px; height:16px;}
.floating-menu__toggle-icon::before, .floating-menu__toggle-icon::after {content:""; position:absolute; left:50%; top:50%; background:var(--color-white); transform:translate(-50%, -50%);}
.floating-menu__toggle-icon::before {width:14px; height:2px;}
.floating-menu__toggle-icon::after {width:2px; height:14px;}
.floating-menu.is-open .floating-menu__toggle-icon::after {opacity:0;}
.floating-menu__toggle-text {font-weight:600; font-size:11px; line-height:1.2; letter-spacing:-0.22px; color:var(--color-white);}
