@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;outline-color:#f37736;}

.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:1260px; padding-left:var(--space-container); padding-right:var(--space-container); margin:0 auto;}


#header {position:fixed; top:0; left:0; z-index:100; width:100%; background:#fff; border-bottom:1px solid #ddd; z-index:100;}
#header .contain {position:relative; display:flex; align-items:center; justify-content:space-between; height:var(--header-height); z-index:10;}

.sitelogo {color:#242424; font-size:var(--font-size-32); font-weight:700; letter-spacing:-.03em; line-height:1.3em;}

#gnb {text-align:center; flex:1 1 auto; min-width:0; width:1%;}
#gnb>ul {display:flex; justify-content:flex-end;} 
#gnb>ul>li {position:relative; padding:0 45px;}
#gnb>ul>li>a {position:relative; display:flex; align-items:center; flex-direction: column; justify-content:center; height:var(--header-height); color:#242424; font-size:var(--font-size-18); font-weight:600; letter-spacing:-.03em; line-height:1.3em;}
#gnb>ul>li.active>a {color:var(--color-primary);}
#gnb .submenu {position:absolute; left:0; width:100%; height:0; overflow:hidden; text-align:center;}
#gnb .submenu>ul {padding:var(--space-20) var(--space-10);}
#gnb .submenu>ul>li>a {display:block; padding:var(--space-10) 0; color:#454545; font-size:var(--font-size-16); line-height:1.33em;}
#gnb .submenu>ul>li>a:hover {text-decoration:underline;}
#gnb .submenu>ul>li.active>a {color:#42ade2;}
.submenu-bg {display:none; position:absolute; width:100%; left:0; background:#fff; border-top:1px solid #ddd; border-bottom:1px solid #eee;}

/* for mobile navigation */
.btn-m-menu {display:none; position:relative; width:24px; height:24px;}
.btn-m-menu div {display:flex; flex-direction:column; justify-content:center; align-items:flex-end; gap:7px; width:100%; height:100%;}
.btn-m-menu span {display:block; width:100%; height:2px; background:#121212;}

.mobile-navigation {display:none; position:fixed; top:0; right:0; width:300px; height:100%; overflow:auto; transition:.2s linear; -ms-transform:translateX(100%); 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:19px; 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:#42ade2}
.mobile-navigation .nav-menu>ul>li.active>a:after {transform:translateY(-35%) rotate(-135deg); border-color:#fff;}
.mobile-navigation .nav-menu .submenu {display:none; background:#f8f8f8; color:#454545; font-size:16px; font-weight:400; line-height:1.5em;}
.mobile-navigation .nav-menu .submenu ul li {border-top:1px solid #e5e5e5;}
.mobile-navigation .nav-menu .submenu ul li a {display:block; padding:12px 20px;}
.mobile-navigation .nav-menu .submenu ul li a:hover {color:#42ade2;}
.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 {-ms-transform:translateX(0); transform:translateX(0);}
html.menu-opened .mobile-overlay {display:block;}

/* main */
.main-section {padding:var(--space-100) 0;}
.main-section h2 {font-size:var(--font-size-40); font-weight:700; line-height:1.3em; letter-spacing:-.04em; text-align:center;}

.main-visual {height:50vh; background:#333; color:#fff;}

.main-about {background:#eee;}
.main-business {background:#fff;}
.main-contact {background:#cfd8eb;}

/* sub layout */
.sub-visual {display:flex; align-items:center; justify-content:center; margin-top:100px; width:100%; height:300px; background:#eee; text-align:center;}
.sub-visual h2 {font-size:48px; line-height:1.3em;}

.lnb-wrap {border-bottom:1px solid #ddd;}
.lnb {max-width:1200px; margin:0 auto;}
.lnb ul {display:flex;}
.lnb ul li {flex:1; border-right:1px solid #ddd;}
.lnb ul li:first-child {border-left:1px solid #ddd;}
.lnb ul li a {display:flex; align-items:center; justify-content:center; width:100%; height:60px; background:#fff; text-align:center;}
.lnb ul li.active a {background:#333; color:#fff;}

#contArea {max-width:1260px; margin:0 auto; padding-left:var(--space-container); padding-right:var(--space-container);}
#contArea.wide {max-width:100%; width:100%; padding:0;}
#contArea.wide .sub-title {padding-left:var(--space-container); padding-right:var(--space-container);}

.sub-title {padding:80px 0; text-align:center;}
.sub-title h2 {font-size:32px; line-height:1.3em;}

.real-cont {min-height:300px; padding-bottom:120px;}


/* footer */
#footer {padding:var(--space-30) 0; background:#242424; color:#fff; text-align:center;}
#footer .copyright {font-size:14px; font-weight:400; line-height:1.3em;}

/* GVS layout */
body {color:var(--gvs-ink); background:#fff;}
.contain {max-width:1440px;}
#header {border-bottom:1px solid rgba(12,35,53,.11); box-shadow:0 8px 28px rgba(11,32,52,.035);}
#header:after {content:""; position:absolute; left:0; right:0; bottom:-1px; z-index:9; height:1px; background:#d8e3e9; pointer-events:none;}
#header .contain {max-width:1440px; height:88px; gap:38px;}
.sitelogo {flex:0 0 auto;}
.sitelogo img {display:block; width:144px; height:auto;}
#gnb>ul {justify-content:center;}
#gnb>ul>li {padding:0 33px;}
#gnb>ul>li>a {height:88px; font-size:15px; font-weight:700; white-space:nowrap;}
#gnb>ul>li>a:after {content:""; position:absolute; left:0; right:0; bottom:-1px; z-index:12; height:2px; background:var(--gvs-blue); transform:scaleX(0); transition:transform .25s;}
#gnb>ul>li:hover>a:after,#gnb>ul>li.active>a:after {transform:scaleX(1);}
#gnb .submenu {top:100%; left:50%; width:max-content; min-width:205px; transform:translateX(-50%); background:transparent;}
#gnb .submenu>ul {padding:20px 14px;}
#gnb .submenu>ul>li>a {font-size:13px; padding:8px 0; white-space:nowrap;}
.submenu-bg {top:100%; border-top:0;}
.header-contact {flex:0 0 auto; display:flex; gap:22px; align-items:center; padding:14px 18px; color:#fff; background:var(--gvs-ink); font-size:13px; font-weight:700;}
.header-contact span {color:var(--gvs-accent-light); font-size:19px; line-height:1;}
.header-contact:hover {background:var(--gvs-blue); color:#fff;}
.main-section {padding:130px 0;}
.main-section h2 {text-align:left;}
.main-hero {--hero-slide-height:max(100vh,800px); position:relative; display:flex; align-items:center; box-sizing:border-box; min-height:800px; height:100vh; padding-top:88px; overflow:hidden; background:var(--gvs-ink);}
.hero-copy {position:relative; z-index:2; display:flex; align-items:center; width:100%; color:#fff;}
.hero-copy-inner {box-sizing:border-box; width:100%; padding-top:65px; padding-bottom:45px;}
.hero-media {position:absolute; inset:0; z-index:0; overflow:hidden; background:var(--gvs-ink) url('../images/main/hero.webp') center center / cover no-repeat;}
.hero-media .slick-list,.hero-media .slick-track,.hero-media .hero-slide {height:var(--hero-slide-height);}
.hero-media .hero-slide {position:relative; overflow:hidden;}
.hero-media:not(.slick-initialized) .hero-slide:not(:first-child) {display:none;}
.hero-media img {position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; object-position:center center;}
.hero-media:after {content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(90deg,rgba(6,27,45,.95) 0%,rgba(6,27,45,.75) 40%,rgba(6,27,45,.24) 78%,rgba(6,27,45,.12) 100%);}
.label-dot {display:block; width:6px; height:6px; border-radius:50%; background:var(--gvs-accent-light);}
.intro-grid {display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,410px); gap:clamp(35px,5vw,80px); align-items:center;}
.section-aside {display:flex; gap:14px; align-items:flex-start; color:var(--gvs-blue); font-size:12px; font-weight:800; letter-spacing:.12em; white-space:nowrap;}
.section-no {display:inline-flex; justify-content:center; align-items:center; width:28px; height:28px; border:1px solid currentColor; border-radius:50%; font-size:10px; letter-spacing:0;}
.section-aside>span:last-child {padding-top:7px;}
.section-top {display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:70px; align-items:end; margin-bottom:58px;}
.main-services {background:#f1f6f8;}
.main-approach {background:linear-gradient(90deg,rgba(5,25,43,.87),rgba(5,25,43,.68)),url('../images/main/approach-bg.webp') center center / cover no-repeat; color:#fff;}
.approach-grid {display:grid; grid-template-columns:43% 57%; gap:0;}
.approach-heading {padding-right:12%;}
.main-update {background:#fff;}
.update-grid {display:grid; grid-template-columns:1fr 1fr; gap:22px;}
.main-contact {position:relative; background:#dceef2;}
.main-contact:before {content:""; position:absolute; inset:0 0 0 50%; background:linear-gradient(90deg,rgba(4,20,34,.85) 0%,rgba(4,20,34,.72) 58%,rgba(4,20,34,.38) 100%),url('../images/main/contact-bg.png') 62% center / cover no-repeat;}
.contact-grid {position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; gap:0; align-items:stretch;}
.contact-primary,.contact-secondary {display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; min-height:660px; padding:78px clamp(30px,5vw,85px);}
.contact-secondary {background:transparent; color:#fff;}
.sub-visual {position:relative; justify-content:flex-start; height:350px; margin-top:88px; background:var(--gvs-ink); color:#fff; text-align:left; overflow:hidden;}
.sub-visual:before {content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(4,24,42,.83) 0%,rgba(4,24,42,.38) 48%,rgba(4,24,42,.08) 100%);}
.sub-visual:after {display:none;}
.sub-visual-about {background:var(--gvs-ink) url('../images/sub/subvisual-about.webp') center/cover no-repeat;}
.sub-visual-business {background:var(--gvs-ink) url('../images/sub/subvisual-business.webp') center/cover no-repeat;}
.sub-visual-projects {background:var(--gvs-ink) url('../images/sub/subvisual-projects.webp') center/cover no-repeat;}
.sub-visual-resources {background:var(--gvs-ink) url('../images/sub/subvisual-resources.webp') center/cover no-repeat;}
.sub-visual-support {background:var(--gvs-ink) url('../images/sub/subvisual-support.webp') center/cover no-repeat;}
.sub-visual .contain {position:relative; z-index:1;}
.sub-visual h2 {font-size:clamp(52px,6vw,86px); font-weight:800; letter-spacing:-.06em;}
.lnb-wrap {border-color:var(--gvs-line); background:#fff;}
.lnb {max-width:1380px;}
.lnb ul li {flex:0 0 180px; border-right:1px solid var(--gvs-line);}
.lnb ul li:first-child {border-left:1px solid var(--gvs-line);}
.lnb ul li a {height:68px; font-size:14px; font-weight:700;}
.lnb ul li.active a {background:var(--gvs-blue);}
#contArea {max-width:1380px;}
.sub-title {padding:92px 0 72px; text-align:left;}
.sub-title:before {content:attr(data-eyebrow); display:block; margin-bottom:18px; color:var(--gvs-blue); font-size:12px; font-weight:800; letter-spacing:.16em;}
.sub-title h2 {font-size:clamp(38px,4vw,56px); font-weight:800; letter-spacing:-.05em;}
.real-cont {padding-bottom:140px;}
#footer {padding:0; background:#020d18; color:#fff; text-align:left;}
#footer .contain {max-width:1440px;}
.footer-top {display:flex; justify-content:space-between; align-items:end; gap:40px; padding:85px 0 75px; border-bottom:1px solid rgba(255,255,255,.2);}
.footer-top strong {font-size:clamp(29px,3vw,45px); font-weight:750; line-height:1.35; letter-spacing:-.05em;}
.footer-top>a {display:flex; justify-content:space-between; gap:44px; min-width:220px; padding:17px 0; color:#fff; border-bottom:1px solid #fff; font-weight:700;}
.footer-top>a span {color:var(--gvs-accent-light); font-size:20px;}
.footer-light {background:#020d18; color:#fff;}
.footer-bottom {display:flex; justify-content:space-between; align-items:center; gap:30px; padding:42px 0 55px; color:#d4e0e9; font-size:14px; line-height:1.8;}
.footer-brand {display:grid; justify-items:start; gap:24px;}
.footer-bottom img {display:block; width:123px; height:auto; filter:brightness(0) invert(1);}
.footer-top-button {display:flex; flex:0 0 52px; flex-direction:column; align-items:center; justify-content:center; width:52px; height:52px; border:1px solid rgba(255,255,255,.55); border-radius:50%; background:rgba(255,255,255,.05); color:#fff; line-height:1; transition:background .2s,border-color .2s,color .2s,transform .2s;}
.footer-top-button span {font-size:20px; font-weight:400;}
.footer-top-button small {margin-top:3px; font-size:8px; font-weight:800; letter-spacing:.12em;}
.footer-top-button:hover,.footer-top-button:focus-visible {border-color:var(--gvs-accent-light); background:var(--gvs-accent-light); color:var(--gvs-ink); transform:translateY(-4px);}
.footer-info {display:grid; gap:5px; max-width:670px; font-style:normal; text-align:left;}
.footer-info small {color:#a8bdc9; font-size:12px;}
.footer-info a {color:#d4e0e9;}
.footer-info a:hover {color:var(--gvs-accent-light); text-decoration:underline;}
.footer-legal {display:flex; align-items:center; justify-content:space-between; gap:30px; padding:22px 0; border-top:1px solid rgba(255,255,255,.2);}
.footer-utility {display:flex; flex:0 0 auto; gap:30px; margin-left:auto; padding:0; font-size:14px; font-weight:750; text-align:right;}
.footer-utility span {color:#e8f0f5;}
#footer .copyright {padding:0; border:0; color:#a8bdc9;}

/* 푸터 — 카피라이트 · Designed by (site.css 병합, 동일 font-size·color) */
#footer .copyright {font-size: 13px;}
#footer .copyright .design-credit {color: inherit; font-size: inherit; text-decoration: none;}
#footer .copyright .design-credit:hover {text-decoration: underline;}

/* GNB/LNB 미제작 페이지 (site.css 병합, 클릭해도 이동 없음) */
#gnb a.is-unlinked, .lnb a.is-unlinked, .mobile-navigation a.is-unlinked {cursor: default;}
