.comp-subnav { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; border-top: 1rem solid rgba(255, 255, 255, 0.15); }
.comp-subnav__list { display: flex; gap: 60rem; width: 100%; max-width: var(--max-width); justify-content: center; }
.comp-subnav__item { padding: 32rem 0; }
.comp-subnav__item--active { border-top: 1rem solid var(--color-blue-500); margin-top: -1rem; }
.comp-subnav__link { display: inline-flex; align-items: center; color: var(--text-white); text-decoration: none; transition: opacity var(--transition-fast); }
.comp-subnav__link:hover, .comp-subnav__link:focus-visible { opacity: 0.7; outline: none; }
/* 하위 탭 — GNB 하단 고정 (제품라인업과 동일 패턴, JS에서 히어로 뒤로 재배치) */
.comp-subnav--sticky { position: sticky; top: 120rem; bottom: auto; z-index: 90; margin-top: -90rem; transition: background var(--transition-base); }
.comp-subnav--sticky.is-stuck { background: var(--bg-black); border-top-color: transparent; }

@media (max-width: 1024px) {
  .comp-subnav__list { gap: 40rem; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; justify-content: center; padding: 0 var(--side-padding); }
  .comp-subnav__list::-webkit-scrollbar { display: none; }
  .comp-subnav__item { flex-shrink: 0; }
  .comp-subnav__item--active { margin-top: 0; }
  .comp-subnav--sticky { top: 60rem; }
}

@media (max-width: 600px) {
  .comp-subnav__list { justify-content: flex-start; }
}

/* 기업정보 - 기가비스 소개 */
.comp-hero--intro { position: relative; height: 100vh; overflow: hidden; }
.comp-hero--intro .comp-hero__bg { position: fixed; inset: 0; overflow: hidden; }
.comp-hero--intro .comp-hero__video { width: 100%; height: 100%; object-fit: cover; }
.comp-hero--intro .comp-hero__bg::after { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.5); }
.comp-hero__center { position: absolute; left: 50%; top: calc(50% - 51.5rem); transform: translate(-50%, -50%); display: flex; align-items: flex-start; justify-content: space-between; width: 1182rem; max-width: calc(100% - var(--side-padding) * 2); color: var(--text-white); }
.comp-hero__title-group { display: flex; flex-direction: column; align-items: flex-start; gap: 24rem; }
.comp-hero__typo { display: flex; flex-direction: column; gap: 40rem; width: 380rem; padding-top: 60rem; color: var(--text-white); }
.comp-page--intro { background: var(--bg-white); color: var(--text-highest); }
.intro-vision { position: relative; background: var(--bg-primary-dark-1); color: var(--text-white); }
.intro-vision__intro { display: flex; flex-direction: column; align-items: center; gap: 60rem; padding: 485rem 0 0; text-align: center; }
.intro-vision__headline-line { display: block; }
.intro-vision__headline-line--delay { transition-delay: 0.35s; }
.intro-vision__sub { color: var(--text-white); }
/* 핀 고정/스크롤 거리는 GSAP ScrollTrigger(pin) 가 제어하므로 별도 높이를 두지 않는다 */
.intro-vision__expand { position: relative; }
.intro-vision__sticky { position: relative; height: 100vh; display: flex; align-items: center; justify-content: center; overflow: hidden; background: var(--bg-primary-dark-1); }
.intro-vision__box { position: relative; flex-shrink: 0; width: 456rem; height: 600rem; margin: 0; overflow: hidden; will-change: width, height; }
.intro-vision__img { position: absolute; top: 50%; left: 50%; width: 100vw; height: 100vh; transform: translate(-50%, -50%); object-fit: cover; }
.intro-vision__dim { position: absolute; inset: 0; background: #000; opacity: 0.4; pointer-events: none; }
.intro-vision__overlay { position: absolute; inset: 0; display: flex; align-items: center; opacity: 0; pointer-events: none; will-change: opacity, transform; }
.intro-vision__overlay-inner { display: flex; justify-content: flex-end; width: calc(100% - 40rem); max-width: 1424rem; margin: 0 auto; }
.intro-vision__overlay-text { width: 698rem; max-width: 100%; color: var(--text-white); }
.intro-vision__eyebrow { text-transform: uppercase; }
.intro-vision__brand { margin-top: 24rem; }
.intro-vision__desc { margin-top: 60rem; }
.intro-vision__desc p + p { margin-top: 1.6em; }
.intro-company { display: none; position: relative; background: var(--bg-white); padding: 200rem 0; } /* 회사 정보 영역 임시 숨김 */
.intro-company__inner { display: flex; align-items: flex-start; justify-content: space-between; gap: 60rem; width: calc(100% - 40rem); max-width: 1424rem; margin: 0 auto; }
.intro-company .comp-section__title { margin-bottom: 0; }
.intro-company__list { width: 698rem; max-width: 100%; }
.intro-company__row { display: flex; align-items: center; gap: 120rem; padding: 32rem 0; border-top: 1rem solid var(--line-low); }
.intro-company__row:first-child { padding-top: 0; border-top: 0; }
.intro-company__row--contact { align-items: flex-start; }
.intro-company__label { flex-shrink: 0; width: 90rem; color: var(--text-high); }
.intro-company__value { color: var(--text-highest); }
.intro-company__row--contact .intro-company__value { display: flex; flex-direction: column; gap: 4rem; }
.intro-company__contact-line { display: flex; flex-wrap: wrap; gap: 20rem; }
.intro-company__contact-item { display: inline-flex; gap: 12rem; }
.intro-company__contact-key { color: var(--text-medium); }
.intro-company__contact-val { color: var(--text-highest); }

@media (max-width: 1024px) {
  .comp-hero__center { top: 50%; width: calc(100% - var(--side-padding) * 2); flex-direction: column; gap: 120rem; }
  .comp-hero__typo { width: 100%; padding-top: 0; }
  .intro-vision__intro { max-width: 1424rem; width: calc(100% - 90rem); margin: 0 auto; padding: 120rem 0 87rem; }
  .intro-vision__box { width: 280rem; height: 360rem; }
  .intro-vision__overlay-inner { justify-content: flex-start; }
  .intro-vision__overlay-text { width: 100%; }
  .intro-company { padding: 120rem 0; }
  .intro-company__inner { flex-direction: column; }
  .intro-company__list { width: 100%; }
  .intro-company__row { gap: 40rem; }
}

@media (max-width: 600px) {
  .intro-company__row { flex-direction: column; align-items: flex-start; gap: 12rem; }
  .intro-company__contact-line { flex-direction: column; gap: 4rem; }
}

/* 기업정보 ─ 경영철학 */
.comp-hero--full { position: relative; height: 100vh; overflow: hidden; }
.comp-hero--full .comp-hero__bg { background-image: url("../../images/phil-hero-bg.jpg"); background-position: center; background-size: cover; background-repeat: no-repeat; }
.comp-hero--full .comp-hero__bg::after { background: rgba(0, 0, 0, 0.6); }
.comp-greeting { position: relative; padding: 160rem 0; background: var(--bg-primary-dark-1); }
.comp-greeting__inner { display: flex; align-items: flex-start; justify-content: space-between; gap: 80rem; width: calc(100% - 40rem); max-width: 1182rem; margin: 0 auto; color: var(--color-white); }
.comp-greeting__photo { flex-shrink: 0; width: 360rem; height: 460rem; margin: 0; overflow: hidden; }
.comp-greeting__photo img { width: 100%; height: 100%; object-fit: cover; }
.comp-greeting__body { display: flex; flex-direction: column; gap: 40rem; }
.comp-greeting__message { width: 577rem; max-width: 100%; }
.comp-greeting__message p + p { margin-top: 1.6em; }
.comp-greeting__sign { display: flex; align-items: flex-start; justify-content: space-between; width: 457rem; max-width: 100%; }
.comp-greeting__sign-group { display: flex; align-items: flex-start; gap: 20rem; }
.comp-greeting__sign-name { font-size: 36rem; line-height: 1.6; font-weight: var(--fw-regular); text-align: right; }
.comp-greeting__sign-img { width: 120rem; height: 86rem; object-fit: contain; }
.comp-quote { position: relative; width: 100%; height: 800rem; background: #f1f1f1; overflow: hidden; margin-bottom: -1rem; }
.comp-quote__bg { position: absolute; inset: 0; background-image: url("../../images/phil-quote-bg.jpg"); background-position: center; background-size: cover; background-repeat: no-repeat; }
.comp-quote__text { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 1182rem; max-width: calc(100% - var(--side-padding) * 2); color: var(--text-white); }
.scroll-motion.comp-quote__text { transform: translate(-50%, 10%); }
.scroll-motion.active.comp-quote__text { transform: translate(-50%, -50%); }
.comp-values { position: relative; padding: 120rem 0 200rem; background: var(--bg-primary-dark-1); margin-bottom: -2rem; }
.comp-values__inner { width: calc(100% - 40rem); max-width: 1182rem; margin: 0 auto; color: var(--color-white); }
.comp-values__list { display: flex; align-items: flex-start; list-style: none; padding: 0; margin: 0; }
.comp-value { flex: 1 0 0; display: flex; flex-direction: column; align-items: center; gap: 40rem; }
.comp-value.scroll-motion { transition-delay: 0s; }
.comp-value.scroll-motion:nth-child(2) { transition-delay: 0.2s; }
.comp-value.scroll-motion:nth-child(3) { transition-delay: 0.4s; }
.comp-value__icon { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 160rem; height: 160rem; }
.comp-value__icon img { width: 110rem; height: 110rem; object-fit: contain; }
.comp-value__text { display: flex; flex-direction: column; align-items: center; gap: 20rem; text-align: center; }

@media (max-width: 1024px) {
  .comp-values { padding: 120rem 0; }
  .comp-greeting__inner { flex-direction: column; }
  .comp-greeting__photo { width: 100%; }
  .comp-greeting__message { width: 100%; }
  .comp-greeting__sign { width: 100%; }
  .comp-values__list { flex-direction: column; gap: 40rem; align-items: center; }
  .comp-quote__text { top: 78%; }
  .comp-value { padding: 0; gap: 20rem; }
}

@media (max-width: 600px) {
  .comp-greeting { padding: 120rem 0 178rem; }
}

/* 기업정보 ─ 연혁 */
.hist-page { position: relative; background: #181818; color: var(--text-white); overflow-x: clip; }
.hist-hero { position: relative; height: 260vh; z-index: 0; }
.hist-hero__sticky { position: sticky; top: 0; width: 100%; height: 100vh; overflow: hidden; background: #181818; }
.hist-hero__bg { position: absolute; inset: 0; background-image: url("../../images/history-hero-bg.jpg"); background-position: center; background-size: cover; background-repeat: no-repeat; }
.hist-hero__bg::after { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.6); pointer-events: none; }
.hist-hero__typo { position: absolute; left: 50%; top: 50%; display: flex; flex-direction: column; align-items: center; gap: 60rem; width: max-content; max-width: 90%; text-align: center; color: var(--text-white); transform: translate(-50%, -50%); will-change: opacity, transform; }
/* .hist-hero__eyebrow { text-transform: uppercase; } */
.hist-hero__typo--intro { opacity: 1; transform: translate(-50%, -50%) translateY(0); }
.hist-hero__typo--main { opacity: 0; transform: translate(-50%, -50%) translateY(120rem); }
.hist__line { position: absolute; left: 50%; top: 0; transform: translateX(-50%); width: 1px; height: 100%; background: var(--bg-white); opacity: 0.2; }
.hist-main__line::after { content: ''; position: absolute; left: -2px; top: 0; width: 6rem; height: 5rem; border-radius: 99px; background: var(--bg-white); }
.hist-content { position: relative; z-index: 1; margin-top: -100vh; background: #181818; }
.hist-section { position: relative; padding-top: 440rem; padding-bottom: 300rem; overflow: hidden; }
.hist-section.hist-section--1 { overflow: unset; }
.hist-section.hist-section--2 { padding-top: 368rem; }
.hist-section.hist-section--3 { padding-top: 503rem; }
.hist-section__bg { position: absolute; inset: 0; z-index: 0; background-position: center top; background-size: auto; background-repeat: no-repeat; pointer-events: none; }
.hist-section--1 .hist-section__bg { background-image: url("../../images/history-section1-bg.png");}
.hist-section--1 .hist-top__line { height: 520rem; top: -160rem; }
.hist-section--1 .hist-main__line { top: 734rem; }
.hist-section--2 .hist-section__bg { background-image: url("../../images/history-section2-bg.png"); }
.hist-section--2 .hist-top__line { height: 290rem;}
.hist-section--2 .hist-main__line { top: 662rem; }
.hist-section--3 .hist-section__bg { background-image: url("../../images/history-section3-bg.png"); top: -10rem; }
.hist-section--3 .hist-top__line { height: 423rem;}
.hist-section--3 .hist-main__line { top: 797rem; }
.hist-section__inner { position: relative; z-index: 1; width: 100%; max-width: var(--max-width); margin: 0 auto; padding: 0; display: flex; flex-direction: column; gap: 80rem; align-items: center; }
.hist-timeline__info { display: flex; flex-direction: column; align-items: center; gap: 24rem; text-align: center; color: var(--text-white); }
.hist-timeline__title-group { display: flex; flex-direction: column; gap: 12rem; align-items: center; }
.hist-inner__cont { position: relative; display: flex; justify-content: space-between; max-width: calc(100% - 40rem); margin: 0 auto; }
.hist-inner__cont .left { width: 50%; position: relative; bottom: -18rem; }
.hist-section--1 .hist-inner__cont { width: 1430rem;  }
.hist-section--2 .hist-inner__cont { width: 1380rem;  }
.hist-section--3 .hist-inner__cont { width: 1470rem;  }

.hist-years { display: flex; flex-direction: column; gap: 80rem; width: 430rem; color: var(--text-white); align-self: start; padding-top: 146rem; }
.hist-year { display: flex; flex-direction: column; gap: 24rem; }
.hist-year__list { display: flex; flex-direction: column; gap: 4rem; }
.hist-card { position: absolute; overflow: hidden; background: #0a0077; box-shadow: 0 17rem 36rem rgba(0, 0, 0, 0.1), 0 66rem 66rem rgba(0, 0, 0, 0.09), 0 149rem 89rem rgba(0, 0, 0, 0.05); }
.hist-card img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hist-card--1 { top: 80rem; width: 380rem; height: 500rem; }
.hist-card--2 { bottom: 270rem; left: 130rem; width: 500rem; height: 338rem; }
.hist-card--3 { bottom: -1rem; width: 500rem; height: 320rem; }
.hist-card--4 { bottom: 356rem; left: 174rem; width: 500rem; height: 320rem; }
.hist-card { will-change: transform, opacity; }

/* 섹션 스택 — 다음 섹션이 이전 섹션 위로 덮으며 올라오도록 z-index 증가 */
.hist-section { background: #181818; }
.hist-section--1 { z-index: 1; }
.hist-section--2 { z-index: 2; }
.hist-section--3 { z-index: 3; }
/* 푸터 — Phase C 에서 마지막 섹션 inner 하단에 붙어 함께 올라오므로 섹션 위에 노출 */
.hist-page ~ .footer { position: relative; z-index: 4; }


.hist-years { will-change: transform; }
.hist-main__line { will-change: transform; }
.hist-top__line { will-change: transform; }
.hist-section__inner { will-change: transform; }

/* PC 핀 상태에서 타이틀 + 좌측 카드 + 우측 연혁이 한 화면에 들어오도록 .left 컬럼 높이 제한
   ─ .left 가 .right 의 큰 높이를 따라가지 않게 align-items: flex-start + 명시 높이 부여 */
@media (min-width: 1025px) {
  .hist-content .hist-section.hist-section--1,
  .hist-content .hist-section.hist-section--2,
  .hist-content .hist-section.hist-section--3 {
    padding-top: 280rem;
    padding-bottom: 120rem;
  }
  .hist-content .hist-section__inner { gap: 60rem; }
  .hist-content .hist-inner__cont { align-items: flex-start; }
  .hist-content .hist-inner__cont .left {
    height: calc(100vh - 580rem);
    align-self: flex-start;
    flex-shrink: 0;
    overflow: hidden;
  }
  /* 좌측 카드 — viewport 높이에 맞춰 상/하단으로 재배치 */
  .hist-section .hist-card--1 { top: 0; }
  .hist-section .hist-card--2 { bottom: 0; }
  .hist-section .hist-card--4 { bottom: 0; }
}

@media (max-width: 1024px) {
  .hist-hero__typo { gap: 40rem; }
  .hist__line { display: none; }
  .hist-section { padding-top: 342rem !important; padding-bottom: 122rem; }
  .hist-section__inner { gap: 342rem; }
  .hist-section__bg { background-size: auto 33%; }
  .hist-section--2 .hist-section__bg { background-size: auto 24%; }
  .hist-section--3 .hist-section__bg { background-size: auto 22%; }
  .hist-inner__cont { flex-direction: column; }
  .hist-inner__cont .left { width: 100%; }
  .hist-timeline { gap: 40rem; }
  .hist-timeline__line--top { height: 120rem; }
  .hist-timeline__line--dashed { display: none; }
  .hist-years { width: 100%; margin-top: 0; gap: 80rem; padding-top: 0; }
  .hist-year { gap: 16rem; }
  .hist-section--1 .hist-years .hist-year:nth-child(2) { margin-top: 541rem; }
  .hist-section--1 .hist-years .hist-year:nth-child(5) { margin-top: 430rem; }
  .hist-section--2 .hist-years .hist-year:nth-child(1) { margin-top: 287rem; }
  .hist-section--3 .hist-years .hist-year:nth-child(5) { margin-top: 304rem; }
  .hist-card--1 { width: 100%; height: 461rem; top: 262rem; }
  .hist-card--2 { width: 100%; height: 350rem; left: 0; top: 1840rem; }
  .hist-card--3 { width: 100%; height: 207rem; top: 0; }
  .hist-card--4 { width: 100%; height: 224rem; left: 0; top: 810rem; }
} 

/* 기업정보 ─ 인증/수상 */
.comp-hero { position: relative; height: 600rem; overflow: hidden; }
.comp-hero__bg { position: fixed; inset: 0; background-image: url("../../images/comp-hero-bg.jpg"); background-size: 100% auto; background-repeat: no-repeat; }
.comp-hero__inner { position: absolute; top: 320rem; left: 50%; width: 1182rem; max-width: calc(100% - var(--side-padding) * 2); transform: translateX(-50%); display: flex; flex-direction: column; gap: 24rem; color: var(--text-white); }
.comp-hero__eyebrow { text-transform: uppercase; }
.comp-section { padding: 120rem 0; }
.comp-section--certs { padding-top: 120rem; padding-bottom: 200rem; }
.comp-section--area { position: relative; background-image: url("../../images/comp-awards-cont-bg.jpg"); background-position: center; background-size: cover; background-repeat: no-repeat; }
.comp-section--awards { padding-top: 0; padding-bottom: 200rem; }
.comp-section__inner { width: calc(100% - 40rem); max-width: 1424rem; margin: 0 auto; padding: 0; }
.comp-section__title { margin-bottom: 80rem; }
.comp-section__txt { margin-bottom: 60rem; }
.comp-certs { display: grid; grid-template-columns: 1fr 1fr; gap: 28rem; list-style: none; padding: 0; margin: 0; }
.comp-certs > li { display: flex; }
.comp-cert { position: relative; width: 100%; height: 360rem; background: var(--bg-white); border-radius: var(--rd-300); overflow: hidden; border: 1rem solid var(--line-low); transition: border-color var(--transition-fast); }
.comp-cert:hover, .comp-cert:focus-within { border-color: var(--bd-info); }
.comp-cert__head { position: absolute; left: 349rem; right: 60rem; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; align-items: flex-start; gap: 20rem; }
.comp-cert__img { position: absolute; left: 59rem; top: calc(50% + 67rem); transform: translateY(-50%); width: 245rem; height: 335rem; padding: 12rem; background: var(--bg-white); border: 1rem solid var(--line-low); box-shadow: 0 24rem 36rem rgba(0, 0, 0, 0.1); margin: 0; transition: top 0.35s ease-out; }
.comp-cert__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.comp-cert:hover .comp-cert__img,
.comp-cert:focus-within .comp-cert__img { top: 50%; }
.comp-awards { display: grid; grid-template-columns: 1fr 1fr; gap: 28rem; list-style: none; padding: 0; margin: 0; }
.comp-awards > li { display: flex; }
.comp-award { position: relative; width: 100%; height: 420rem; overflow: hidden; background: var(--bg-white); border-radius: var(--rd-300); border: 1px solid var(--color-white); }
.comp-award:hover { border-color: var(--bd-info); }
.comp-award__text { position: absolute; left: 60rem; top: 60rem; bottom: 60rem; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; z-index: 1; }
.comp-award__head { display: flex; flex-direction: column; align-items: flex-start; gap: 16rem; }
.comp-award__icon { display: block; width: 30rem; height: 40rem; }
.comp-award__icon img { display: block; width: 100%; height: 100%; object-fit: contain; }
.comp-award__img { position: absolute; top: 0; right: 0; width: 320rem; height: 420rem; margin: 0; }
.comp-award__img img { display: block; width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 1024px) {
  .comp-hero { height: 360rem; }
  .comp-hero__bg { background-size: cover; }
  .comp-hero__inner { top: auto; bottom: 120rem; left: var(--side-padding); width: calc(100% - var(--side-padding) * 2); max-width: none; transform: none; gap: 16rem; }
  .comp-section { padding: 80rem 0; }
  .comp-section--certs { padding-top: 80rem; padding-bottom: 100rem; }
  .comp-section--awards { padding-top: 0; padding-bottom: 100rem; }
  .comp-section__inner { width: 100%; padding: 0 var(--side-padding); }
  .comp-certs,
  .comp-awards { grid-template-columns: 1fr; gap: 16rem; }
  .comp-cert { height: 320rem; }
  .comp-cert__head { left: 210rem; right: 24rem; }
  .comp-cert__img { left: 24rem; top: calc(50% + 55rem); width: 160rem; height: 218rem; padding: 8rem; }
  .comp-award { height: 360rem; }
  .comp-award__text { top: 32rem; left: 24rem; bottom: 32rem; max-width: calc(50% - 8rem); }
  .comp-award__img { width: 50%; height: 360rem; }
  .comp-award__img img { height: auto; position: absolute; top: 50%; transform: translateY(-50%); }
}

@media (max-width: 600px) {
  .comp-hero__inner { bottom: 100rem; }
  .comp-section { padding: 60rem 0; }
  .comp-section--certs { padding-top: 60rem; padding-bottom: 60rem; }
  .comp-section--awards { padding-bottom: 60rem; }
  .comp-cert__head { gap: 8rem; }
  .comp-cert__org { white-space: normal; }
}

/* 기업정보 ─ 오시는 길 */
.comp-map-hero { height: 100vh; min-height: 720rem; background: #020f21; }
.comp-map-hero .comp-hero__bg { position: fixed; inset: 0; overflow: hidden; background: #020f21; }
.comp-map-hero .comp-hero__video { width: 100%; height: 215%; object-fit: cover; position: absolute; top: 75rem; }
.comp-map-hero .comp-hero__bg::after { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.4); pointer-events: none; }
.map-location__cont { position: relative; z-index: 99; background: var(--bg-neutral-light-1); }
.map-locations__intro { position: relative; width: 100%; height: 180vh; }
.map-locations__intro-sticky { position: sticky; top: 0; width: 100%; height: 100vh; overflow: hidden; background: var(--bg-neutral-light-1); }
.map-locations__intro-content { position: absolute; top: 200rem; left: 0; right: 0; width: 940rem; max-width: calc(100% - 40rem); margin: 0 auto; display: flex; align-items: center; z-index: 2; color: var(--text-highest); will-change: top, color; }
.map-locations__intro-typo { position: relative; display: flex; flex-direction: column; gap: 40rem; align-items: flex-start; color: inherit; will-change: transform; }
.map-locations__intro-title { color: inherit; text-align: left; }
.map-locations__intro-desc { color: inherit; text-align: left; }
.map-locations__intro-typo--mirror { position: absolute; inset: 0; color: var(--text-white); pointer-events: none; clip-path: inset(100% 0 0 0); will-change: clip-path; }
.map-locations__intro-stats { position: absolute; top: 50%; right: 0; display: flex; align-items: center; gap: 80rem; color: var(--text-white); opacity: 0; transform: translateY(-50%); will-change: opacity, transform; }
.map-locations__intro-stat { display: flex; flex-direction: column; align-items: center; color: inherit; }
.map-locations__intro-stat-num { font-family: "Pretendard", sans-serif; font-size: 180rem; font-weight: 700; line-height: 1; color: inherit; }
.map-locations__intro-stat-divider { width: 1rem; height: 100rem; background: var(--bg-white); }
.map-locations__intro-banner { position: absolute; top: 560rem; left: 0; right: 0; width: 1424rem; max-width: calc(100% - 40rem); height: 450rem; margin: 0 auto; background: url("../../images/map-intro-banner.jpg") top center / cover no-repeat; z-index: 1; overflow: hidden; will-change: top, width, max-width, height; }
.map-locations__intro-banner-dim { position: absolute; inset: 0; background: rgba(0, 0, 0, 0); pointer-events: none; will-change: background; }
.map-locations { padding-bottom: 338rem; padding-top: 160rem; }
.map-locations__inner { position: relative; display: flex; gap: 28rem; width: 1760rem; max-width: calc(100% - 40rem); margin: 0 auto; padding: 0 160rem; }
.map-aside { flex-shrink: 0; }
.map-aside__sticky { position: sticky; top: 160rem; display: flex; flex-direction: column; transition: top var(--transition-fast, 0.3s) ease; }
body.is-gnb-hidden .map-aside__sticky { top: 40rem; }
.map-aside--left { width: 577rem; }
/* 노출 카드가 1개뿐일 때(본사 등) 지도 영역 스크롤 고정 해제 */
.map-locations__inner--no-sticky .map-aside__sticky { position: static; top: auto; }
.map-img { position: relative; width: 100%; height: 700rem; background-image: url("../../images/map-img.jpg"); background-position: top center; background-size: cover; background-repeat: no-repeat; background-color: #f2f4f8; border: 1rem solid var(--color-gray-100); overflow: hidden; }
.map-img .map-location__ico { position: absolute; inset: 0; width: 100%; height: 100%; }
.map-img .map-location__ico .map-marker { position: absolute; }
.map-img .map-location__ico .map-tab1   { left: 62%; top: 20%; }
.map-img .map-location__ico .map-tab2-1 { left: 79%; top: 24%; }
.map-img .map-location__ico .map-tab2-2 { left: 83%; top: 21%; }
.map-img .map-location__ico .map-tab3   { left: 51%; top: 41%; }
.map-img .map-location__ico .map-tab4   { left: 39%; top: 43%; }
.map-img .map-location__ico .map-tab5   { left: 20%; top: 75%; }
.map-img .map-location__ico .map-tab6   { left: 24%; bottom: 48%; }
.map-marker { padding: 0; background: transparent; border: 0; cursor: pointer; transition: transform var(--transition-fast); }
.map-marker:focus-visible { outline: 2rem solid var(--color-primary, #0099d9); outline-offset: 2rem; }
.map-marker__img { display: block; width: 26rem; height: 35rem; transition: transform var(--transition-fast); }
.map-marker.is-active { z-index: 2; }
.map-marker.is-active .map-marker__img { transform: translateY(-4rem); }
.map-marker__label { position: absolute; left: 50%; top: -20rem; margin-bottom: 2rem; font-size: 12rem; line-height: 1.5; font-weight: 500; color: var(--text-point); text-align: center; white-space: nowrap; opacity: 0; pointer-events: none; transform: translateX(-50%); transition: opacity var(--transition-fast), transform var(--transition-fast);}
.map-marker.is-active .map-marker__label { opacity: 1; transform: translateX(-50%);}
.map-overlay-tab { display: flex; width: 100%; }
.map-overlay-tab__btn { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8rem; height: 60rem; margin-right: -1rem; padding: 0 24rem; color: var(--text-highest); background: var(--bg-white); border: 1rem solid var(--color-gray-100); cursor: pointer; transition: background var(--transition-fast), color var(--transition-fast); }
.map-overlay-tab__btn:last-child { margin-right: 0; }
.map-overlay-tab__label,
.map-overlay-tab__count { color: inherit; }
.map-overlay-tab__btn--active,
.map-overlay-tab__btn--active:hover,
.map-overlay-tab__btn--active:focus-visible { color: var(--text-white); background: var(--bg-black); border-color: var(--bg-black); }
.map-cards { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 28rem; }
.map-card { display: flex; flex-direction: column; background: var(--bg-white); border: 1rem solid var(--color-gray-100); scroll-margin-top: 40rem; }
.map-card--hidden { display: none; }
.map-card__map { width: 100%; height: 540rem; background-color: #ebebeb; background-image: url("../../images/map-section-img.png"); background-position: center; background-size: cover; background-repeat: no-repeat; border-bottom: 1rem solid var(--color-gray-100); }
.map-card__body { display: flex; align-items: flex-start; justify-content: space-between; gap: 24rem; padding: 48rem; }
.map-card__info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 24rem; padding: 8rem 0; }
.map-card__head { display: flex; align-items: center; gap: 16rem; }
.map-card__divider { width: 1rem; height: 20rem; background: var(--color-gray-200); }
.map-card__detail { display: flex; flex-direction: column; gap: 16rem; }
.map-card__addr { color: var(--text-high); }
.map-card__contact { display: flex; flex-direction: column; gap: 2rem; }
.map-card__row { display: flex; align-items: center; gap: 8rem; }
.map-card__key { flex-shrink: 0; width: 40rem; color: var(--text-high); }
.map-card__val { color: var(--text-highest); }

@media (max-width: 1024px) {
  .map-locations__intro { height: 180vh; padding: 0; }
  .map-locations__intro-sticky { position: sticky; top: 0; height: 100vh; overflow: hidden; padding: 0; background: var(--bg-neutral-light-1); }
  .map-locations__intro-content { top: 120rem; left: 0; right: 0; width: calc(100% - 80rem); max-width: 600rem; margin: 0 auto; flex-direction: column; align-items: center; justify-content: flex-start; gap: 60rem; }
  .map-locations__intro-typo { gap: 20rem; }
  .map-locations__intro-banner { top: 500rem; left: 0; right: 0; width: calc(100% - 80rem); max-width: 600rem; height: 280rem; margin: 0 auto; }
  .map-locations__intro-stats { position: static; top: auto; right: auto; align-items: center; color: var(--text-white); transform: none; }
  .map-locations__intro-stat { align-items: center; }
  .map-locations__intro-stat-num { font-size: 80rem; }
  .map-locations { padding-bottom: 120rem; padding-top: 120rem; }
  .map-locations__inner { flex-direction: column; gap: 120rem; padding: 0; }
  .map-aside--left { width: 100%; }
  .map-aside__sticky { position: static; top: auto; }
  .map-cards { gap: 40rem; }
  .map-card__map { height: 320rem; }
  .map-card__body { flex-direction: column-reverse; gap: 24rem; padding: 40rem; }
  .map-card__country { align-self: flex-start; }
  .map-img { height: 880rem; }
  .map-img .map-location__ico .map-tab1   { left: 63%; top: 22%; }
  .map-img .map-location__ico .map-tab2-1 { left: 80%; top: 26%; }
  .map-img .map-location__ico .map-tab2-2 { left: 83%; top: 23%; }
  .map-img .map-location__ico .map-tab3   { left: 52%; top: 43%; }
  .map-img .map-location__ico .map-tab4   { left: 39%; top: 45%; }
  .map-img .map-location__ico .map-tab5   { left: 20%; top: 76%; }
  .map-img .map-location__ico .map-tab6   { left: 24%; bottom: 48%; }
}

@media (max-width: 600px) {
  .map-img { height: 461rem; }
  .map-img .map-location__ico .map-tab1   { left: 62%; top: 16%; }
  .map-img .map-location__ico .map-tab2-1 { left: 79%; top: 18%; }
  .map-img .map-location__ico .map-tab2-2 { left: 83%; top: 16%; }
  .map-img .map-location__ico .map-tab3   { left: 51%; top: 35%; }
  .map-img .map-location__ico .map-tab4   { left: 39%; top: 36%; }
  .map-img .map-location__ico .map-tab5   { left: 18%; top: 65%; }
  .map-img .map-location__ico .map-tab6   { left: 24%; bottom: 53%; }
  .map-overlay-tab { flex-wrap: wrap; }
  .map-overlay-tab__btn { flex: auto; width: 50%; }
  .map-card__row { flex-wrap: wrap; }
}