@charset "UTF-8";
.hero-img{background-size:cover;background-position:center; height: 100vh; position: relative;}
.hero-overlay{background:linear-gradient(135deg,rgba(11,31,64,0.85) 0%,rgba(19,84,163,0.6) 100%)}
.stats-strip{background:var(--blue)}
.section-en{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--blue-bright);font-weight:700}
.btn-main{background:var(--blue-bright);color:#fff;padding:14px 28px;border-radius:4px;font-weight:700;font-size:14px;display:inline-flex;align-items:center;gap:8px;text-decoration:none;transition:background .2s}
.btn-main:hover{background:#1560cc;color:#fff}
.biz-img{border-radius:12px;overflow:hidden;position:relative}
.biz-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.biz-img:hover img{transform:scale(1.04)}
.biz-img-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(11,31,64,0.5),transparent)}
.equip-card{border:1px solid #E5EAF2;border-radius:10px;overflow:hidden;transition:all .3s;background:#fff}
.equip-card:hover{border-color:var(--blue-bright);box-shadow:0 8px 24px rgba(29,111,232,0.12);transform:translateY(-3px)}
.equip-card img{width:100%;aspect-ratio:4/3;object-fit:cover}
.proj-card{border-radius:10px;overflow:hidden;position:relative}
.proj-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.proj-card:hover img{transform:scale(1.06)}
.proj-card-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(11,31,64,0.82) 100%);opacity:0;transition:opacity .35s}
.proj-card:hover .proj-card-overlay{opacity:1}
.notice-row{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid #F3F4F6;text-decoration:none;transition:background .15s}
.notice-row:hover{background:#F7FAFF}
.banner-img{background-image:url('https://images.unsplash.com/photo-1446776858070-70c3d5ed6758?w=1920&q=85');background-size:cover;background-attachment:fixed;background-position:center;position:relative}
.banner-overlay{background:rgba(11,31,64,0.72);position:relative;z-index:1}
.proj-card-text{position:absolute;bottom:0;left:0;right:0;padding:20px;transform:translateY(10px);opacity:0;transition:all .35s ease;z-index:2}
.proj-card:hover .proj-card-text{opacity:1;transform:translateY(0)}
.footer-dark{background:var(--navy)}

/* ── 히어로 Swiper 슬라이더 ── */
.hero-swiper{position:absolute;top:var(--gnb-h,100px);left:0;right:0;bottom:0;z-index:0}
.hero-slide{background-size:cover;background-position:center top;width:100%;height:100%}
.hero-slide-link{position:absolute;inset:0;display:block;z-index:1}
.hero-pagination{z-index:20!important;bottom:100px!important}
.hero-pagination .swiper-pagination-bullet{background:#fff;opacity:.45;width:10px;height:10px;border-radius:50%;transition:all .35s;margin:0 5px!important}
.hero-pagination .swiper-pagination-bullet-active{opacity:1;width:28px;border-radius:5px;background:var(--color1)}

/* ── 카운트업 숫자 준비 ── */
.count-num { display:inline-block; }

/* [2026] 메인비주얼 영상 슬라이드 */
.hero-slide{position:relative}
.hero-slide-video{background:#000}
.hero-video{position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:100%;min-height:100%;transform:translate(-50%,-50%);object-fit:cover;pointer-events:none;object-position:center 45%}

/* 공통 */
.section{padding: 10rem 0;}
.tit-wr {margin-bottom: 3.75rem; text-align: center;}
.tit-wr h3 {font-family: var(--font-one); font-weight: 700; font-size: 4rem;}
.tit-wr .desc {font-size: 1.25rem; color: var(--gray3); margin-top: 1.5rem;}

/* quick */
.quick-wr {position: absolute; bottom:24px; left: 50%; transform: translateX(-50%); border-radius: 32px; background: var(--color1); z-index: 9; width: var(--inner);}
.quick-wr ul {display: flex; justify-content: space-between; padding: 0 5rem; align-items: center; flex-wrap: wrap;}
.quick-wr ul li {flex: 1;}
.quick-wr ul li a {display: flex; align-items: center; gap: 1rem; padding: 1rem; justify-content: center; border-radius: var(--border-s); transition: 0.15s ease;}
.quick-wr ul li a:hover {background: rgba(0,0,0,0.1); transition: 0.15s ease;}
.quick-wr ul li a span {color: #fff; font-weight: 500;}

/* section01 */
.section01 .cont-wr ul {gap: 2rem;}
.section01 .cont-wr ul li {width: calc((100% - 8rem) / 5);}
.section01 .cont-wr ul li a {transition: 0.15s ease;padding: 2rem; box-sizing: border-box; border: 1px solid var(--gray8); border-radius: var(--border-l); width: 100%; min-height: 220px;background: linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(245, 112, 64, 0.04) 50%);box-shadow: 0px 8px 16px -4px rgba(0, 0, 0, 0.05); justify-content: flex-end;}
.section01 .cont-wr ul li a span {font-size: 1.5rem; font-weight: 600; margin-top: 1.5rem;}
.section01 .cont-wr ul li a .icon-wr {position: relative;}
.section01 .cont-wr ul li a .icon-wr::after {position: absolute; left: 20px; top: 10px; background: rgba(255,95,0,0.05); border-radius: 100%; content: ''; width: 60px; height: 60px;} 
.section01 .cont-wr ul li a .icon-wr::before {position: absolute; left: 66px; bottom: 0px; background: rgba(255,95,0,0.3); border-radius: 100%; content: ''; width: 24px; height: 24px;} 
.section01 .cont-wr ul li a:hover {transform: translateY(-20px); transition: 0.15s ease;}
.section01 .cont-wr ul li a:hover span {color: var(--color1); transition: 0.15s ease;}

/* section02 */
.section02 {display: flex; overflow:  hidden; white-space: nowrap; width: 100%;}
.section02 .flow-track {display: flex; gap: 2rem; padding-right: 2rem; animation: flowAnimation 50s linear infinite;}
.section02 p {font-size: 140px; font-family: var(--font-one); color: transparent; -webkit-text-stroke: 1px #E0D5C1;}
@keyframes flowAnimation {
    0% {
      transform: translateX(0);
    }
    100% {
      transform: translateX(-100%); /* 왼쪽으로 100% 이동 후 리셋 */
    }
  }

/* section03 */
.section03 .tit-wr {text-align: left;}
.section03 .label-wr {gap: .5rem; margin-bottom: 2rem;}
.section03 .label-wr span {color: var(--gray3); border: 1px solid var(--gray8); border-radius: 30px; padding: .5rem 1rem; box-sizing: border-box;}
.section03 .inner {gap: 1.5rem; justify-content: space-between;}
.section03 .left-wr {width: 630px; justify-content: flex-end;}
.section03 .right-wr {width: calc(100% - 630px - 1.5rem); gap: 1.5rem;}
.section03 .inner .img-wr a{border-radius: var(--border-l); overflow: hidden; transition: 0.15s ease; position: relative;}
.section03 .inner .img-wr a:hover {transform: translateY(-20px); transition: 0.15s ease;}
.section03 .inner .img-wr a::after {position: absolute; right: 1.5rem; top: 1.5rem; background: rgba(255,255,255,0.3) url(/design/default/icon/sns-facebook.svg) no-repeat center center; border-radius: 100%; width: 54px; height: 54px; content: ''; backdrop-filter: blur(20px);}
.section03 .inner .img-wr a.sns.facebook::after {background: rgba(255,255,255,0.3) url(/design/default/icon/sns-facebook.svg) no-repeat center center;}
.section03 .inner .img-wr a.sns.insta::after {background: rgba(255,255,255,0.3) url(/design/default/icon/sns-insta.svg) no-repeat center center;}
.section03 .inner .img-wr a::before {box-sizing: border-box;position: absolute; content: ''; border: 3px solid transparent; width:100%; height: 100%; border-radius: var(--border-l); transition: 0.15s ease;}
.section03 .inner .img-wr a:hover::before {position: absolute; content: ''; border: 3px solid var(--color1); width: 100%; height: 100%; border-radius: var(--border-l); transition: 0.15s ease;}
.section03 .right-wr .img02 {display: flex; align-items: flex-end;}
.section03 .right-wr .img-list {gap: 1.5rem; justify-content: flex-end;}

/* section04 */
/* .section04 .swiper {overflow: visible;}
.section04 .swiper .swiper-wrapper {overflow: visible;} */
.section04 .logo-item {border: 1px solid var(--gray8); border-radius: var(--border-s); overflow: hidden; min-height: 130px; padding: 1rem; box-sizing: border-box; display: flex; justify-content: center; align-items: center;}
/* ===== 체크리스트 아이콘 애니메이션 (2026-08) ===== */
.section01 .cont-wr ul li a .icon-wr img{position:relative;z-index:1;animation:ckFloat 3.4s ease-in-out infinite;transition:transform .3s ease}
@keyframes ckFloat{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-8px) rotate(-2.5deg)}}
.section01 .cont-wr ul li:nth-child(2) a .icon-wr img{animation-delay:.45s}
.section01 .cont-wr ul li:nth-child(3) a .icon-wr img{animation-delay:.9s}
.section01 .cont-wr ul li:nth-child(4) a .icon-wr img{animation-delay:.65s}
.section01 .cont-wr ul li:nth-child(5) a .icon-wr img{animation-delay:1.1s}
.section01 .cont-wr ul li:nth-child(6) a .icon-wr img{animation-delay:.25s}
.section01 .cont-wr ul li a .icon-wr::before{animation:ckPulse 2.8s ease-in-out infinite}
@keyframes ckPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.28);opacity:.55}}
.section01 .cont-wr ul li a .icon-wr::after{animation:ckGlow 4s ease-in-out infinite}
@keyframes ckGlow{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.12);opacity:.7}}
.section01 .cont-wr ul li a:hover .icon-wr img{transform:translateY(-4px) scale(1.14) rotate(4deg);animation-play-state:paused}
@media(prefers-reduced-motion:reduce){
  .section01 .cont-wr ul li a .icon-wr img,
  .section01 .cont-wr ul li a .icon-wr::before,
  .section01 .cont-wr ul li a .icon-wr::after{animation:none}
}

/* [2026-10-06] iOS Safari 텍스트 자동확대(font boosting) 억제 — 실제 아이폰 글자 커짐 방지 */
html, body, .cont, .inner, p, li, td, th, span, div {
  -webkit-text-size-adjust: 100% !important;
  -moz-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

/* [2026-10-07] 로고 데스크톱 표시 크기 (원본 340px의 80%) */
#header .header_wrap .logo-name img{width:272px}

/* [2026-10-08] 메인 히어로: GNB 아래에 영상 전체 노출 — GNB 높이 변수 */
:root{--gnb-h:100px}
@media (max-width:1280px){:root{--gnb-h:70px}}

/* [2026-10-14] 히어로 영상 처리 */
/* 데스크톱(≥1025): 풀블리드 100vh 유지 + 영상 상단(타이틀) 정렬 → GNB에 안 가리고 퀵배너는 뷰포트 내 */
@media (min-width:1025px){
  .hero-video{object-position:center top}
}
/* 모바일·태블릿(≤1024): 영상 전체를 작은 16:9로 표시 + 퀵메뉴를 영상 아래로 */
@media (max-width:1024px){
  .hero-img{height:auto;min-height:0}
  .hero-swiper{position:relative;top:0;left:0;right:0;bottom:auto;margin-top:var(--gnb-h);width:100%;aspect-ratio:16 / 9;background:#000}
  .hero-swiper .swiper-wrapper,.hero-swiper .hero-slide,.hero-swiper .hero-slide-video{height:100%}
  .hero-img .quick-wr{position:static;transform:none;left:auto;right:auto;width:auto;margin:10px auto 0}
}

/* [2026-10-14] GNB-영상 경계: 흰색 5px 구분선(영상 상단 5px만 덮음, GNB와 동일 흰색으로 이질감 없음) */
.hero-swiper::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:#fff;z-index:3;pointer-events:none}