@charset "UTF-8";

/* merge-build.js 산출물 — 납품 시 css/sections/*.css 전량이 이 아래로 합쳐진다. 손으로 쓰지 않는다(CLAUDE.md 원칙 14). */
/* merge-build:acon01 */
/* acon01 — 모바일 인계: 노랑 판(좌우 라벨)은 사진 폭에 맞춰 축소·라벨 숨김 검토, 나머지는 세로 1열 그대로 */
.acon01_iner {
  padding: calc(var(--px)*116) 0 calc(var(--px)*114);
}

.acon01__title {
  margin-top: calc(var(--px)*36);
}

.acon01__media {
  width: calc(var(--px)*984);
  margin-top: calc(var(--px)*45);
}

.acon01__plate {
  top: calc(var(--px)*84);
  right: 0;
  bottom: calc(var(--px)*72);
  left: 0;
  border-radius: calc(var(--px)*30);
  background: var(--secondary);
}

.acon01__plate-side {
  width: calc(var(--px)*64);
}

.acon01__plate-text {
  writing-mode: vertical-rl;
  text-transform: uppercase;
}

.acon01__plate-text--left {
  writing-mode: sideways-lr;
  margin-bottom: calc(var(--px)*8);
}

.acon01__photo {
  border-radius: calc(var(--px)*40);
  overflow: hidden;
  transition: box-shadow .45s ease-out;
}

@media (hover: hover) {
  .acon01__media:hover .acon01__photo {
    box-shadow: 0 calc(var(--px)*24) calc(var(--px)*48) color-mix(in srgb, var(--primary) 22%, transparent);
  }
}

.acon01__body {
  margin-top: calc(var(--px)*48);
  white-space: pre-line;
}

/* IMG:AUTO acon01 */
/* 섹션 HTML 파생 (tools/img-size-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.acon01__photo {
    width: calc(var(--px)*856);
    aspect-ratio: 856 / 511;
}
/* /IMG:AUTO acon01 END */

/* FONT:AUTO acon01 */
/* spec.json 파생 (tools/spec-font-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: line-height · letter-spacing 는 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.acon01 {
    text-align: center;
}

.acon01__lead {
    font-family: var(--font-pretendard);
    font-size: var(--headS);
    font-weight: 600;
    letter-spacing: -0.05em;
    line-height: 1.2;
    color: #000000;
}

.acon01__title {
    font-family: var(--font-pretendard);
    font-size: var(--titleXL);
    font-weight: 800;
    letter-spacing: -0.05em;
    line-height: 1.2;
    color: #000000;
}

.acon01__title-point {
    color: #0f3625;
}

.acon01__plate {
    font-family: var(--font-poppins);
    font-size: var(--bodyM);
    font-weight: 800;
    letter-spacing: 1em;
    line-height: 1.2;
    color: #0f3625;
}

.acon01__body {
    font-family: var(--font-pretendard);
    font-size: var(--bodyXL);
    font-weight: 500;
    letter-spacing: -0.05em;
    line-height: 1.5;
    color: #222222;
}

.acon01__body-point {
    font-weight: 800;
    color: #0f3625;
}
/* /FONT:AUTO acon01 END */

/* INK:AUTO acon01 */
.acon01__title { margin-top: calc(var(--px) * 28.5); margin-bottom: calc(var(--px) * -7.5); } /* base 36,0 */
.acon01__plate-text.acon01__plate-text--left { margin-top: calc(var(--px) * -3.1); margin-bottom: calc(var(--px) * -2.92); } /* base 0,8 */
.acon01__plate-text.acon01__plate-text--right { margin-top: calc(var(--px) * -3.1); margin-bottom: calc(var(--px) * -10.92); } /* base 0,0 */
.acon01__title-point { margin-top: calc(var(--px) * -7.5); margin-bottom: calc(var(--px) * -6.5); } /* base 0,0 */
.acon01__body { margin-top: calc(var(--px) * 42); margin-bottom: calc(var(--px) * -3); } /* base 48,0 */
.acon01__lead { margin-top: calc(var(--px) * -4); margin-bottom: calc(var(--px) * -3); } /* base 0,0 */
.acon01__body-point { margin-top: calc(var(--px) * -5); margin-bottom: calc(var(--px) * 0); } /* base 0,0 */
/* /INK:AUTO acon01 END */

@media (max-width:599px) {
  .acon01_iner {
    padding: 17.0667vw 5.3333vw;
  }

  .acon01__title {
    margin-top: 5.3333vw;
  }

  .acon01__media {
    width: 89.3333vw;
    margin-top: 6.4vw;
  }

  .acon01__plate {
    top: 6.4vw;
    bottom: 6.4vw;
    border-radius: 3.2vw;
    letter-spacing: 0.3em;
  }

  .acon01__plate-side {
    width: 6.4vw;
  }

  .acon01__plate-text.acon01__plate-text--left,
  .acon01__plate-text.acon01__plate-text--right {
    margin-top: 0;
    margin-bottom: 0;
  }

  .acon01__photo {
    width: 76.5333vw;
    border-radius: 6.4vw;
  }

  .acon01__body {
    margin-top: 8.5333vw;
  }
}

/* /merge-build:acon01 */
/* merge-build:acon02 */
/* acon02 — WHY ONSO 운영 시스템 패널(좌 카피·폰 목업 / 우 카드 슬라이더). 모바일: 패널 flex-col, 슬라이더 폭 100%, pc-inline br 해제 */
.acon02 {
  background-color: #eff8e4;
}

.acon02_iner {
  padding-top: calc(var(--px) * 129);
  padding-bottom: calc(var(--px) * 40);
}

.acon02__head {
  gap: calc(var(--px) * 30);
  margin-bottom: calc(var(--px) * 57);
}

.acon02__panel {
  width: calc(var(--px) * 1779);
  padding-bottom: calc(var(--px) * 89);
  border: 1px solid #c8d9b4;
  border-radius: calc(var(--px) * 40);
  background-color: #fff;
}

.acon02__tab {
  top: calc(var(--px) * 141);
  left: calc(var(--px) * -1);
  width: calc(var(--px) * 58);
  padding: calc(var(--px) * 27) 0;
  border-radius: 0 calc(var(--px) * 20) calc(var(--px) * 20) 0;
  background-color: var(--primary);
}

.acon02__tab-label {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.acon02__mockup {
  top: calc(var(--px) * -38);
  left: calc(var(--px) * 142);
}

.acon02__intro {
  flex: none;
  width: calc(var(--px) * 792);
  padding: calc(var(--px) * 338) 0 0 calc(var(--px) * 167);
}

.acon02__intro-eyebrow {
  margin-bottom: calc(var(--px) * 26);
}

.acon02__intro-title {
  margin-bottom: calc(var(--px) * 50);
}

.acon02__stage {
  padding-top: calc(var(--px) * 80);
}

.acon02__slider {
  width: calc(var(--px) * 951);
}

.acon02__slider .acon02__slide {
  width: calc(var(--px) * 292);
  margin-right: calc(var(--px) * 37.5);
  align-items: flex-start;
}

.acon02__badge {
  bottom: calc(var(--px) * -27);
  left: calc(var(--px) * 27);
  width: calc(var(--px) * 43);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background-color: var(--secondary);
  transition: opacity .35s ease-out, scale .35s ease-out;
}

.acon02:not(.is-badge-in) .acon02__badge,
.acon02__slide:not(.swiper-slide-active) .acon02__badge {
  opacity: 0;
  scale: .6;
}

.acon02__caption {
  margin-top: calc(var(--px) * 43);
  padding-left: calc(var(--px) * 27);
  text-align: left;
}

.acon02__arrows {
  gap: calc(var(--px) * 10);
  margin-top: calc(var(--px) * 49);
}

.acon02__arrow {
  width: calc(var(--px) * 50);
  aspect-ratio: 1 / 1;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background-color: var(--primary);
  cursor: pointer;
  box-shadow: 0 0 0 0 transparent;
  transition: transform .15s ease-out, box-shadow .25s ease-out;
}

.acon02__arrow:focus-visible {
  box-shadow: 0 0 0 calc(var(--px) * 6) color-mix(in srgb, var(--primary) 18%, transparent);
}

.acon02__arrow:active {
  transform: scale(.92);
}

.acon02__photo .acon02__photo-img {
  overflow: hidden;
  border-radius: calc(var(--px) * 35); /* 이미지 모서리가 알파로 구워져 있어 hover 확대 때 각지지 않게 */
}

.acon02__arrow .acon02__arrow-icon {
  transition: transform .25s ease-out;
}

@media (hover:hover) {
  .acon02__slide.swiper-slide-active:hover .acon02__badge {
    scale: 1.18;
  }

  .acon02__arrow:hover {
    box-shadow: 0 0 0 calc(var(--px) * 6) color-mix(in srgb, var(--primary) 18%, transparent);
  }

  .acon02__arrow--next:hover .acon02__arrow-icon {
    transform: translateX(calc(var(--px) * 3));
  }

  .acon02__arrow--prev:hover .acon02__arrow-icon {
    transform: translateX(calc(var(--px) * -3));
  }
}

/* IMG:AUTO acon02 */
/* 섹션 HTML 파생 (tools/img-size-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.acon02__mockup {
    width: calc(var(--px)*338);
    aspect-ratio: 338 / 322;
}

.acon02__photo-img {
    width: calc(var(--px)*292);
    aspect-ratio: 292 / 397;
}

.acon02__arrow-icon {
    width: calc(var(--px)*18);
    aspect-ratio: 18 / 14;
}
/* /IMG:AUTO acon02 END */

/* FONT:AUTO acon02 */
/* spec.json 파생 (tools/spec-font-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: line-height · letter-spacing 는 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.acon02__head {
    text-align: center;
}

.acon02__eyebrow {
    font-family: var(--font-poppins);
    font-size: var(--bodyL);
    font-weight: 700;
    letter-spacing: 0em;
    line-height: 1.44;
    color: #0f3625;
}

.acon02__title {
    font-family: var(--font-pretendard);
    font-size: var(--titleXL);
    font-weight: 800;
    letter-spacing: -0.05em;
    line-height: 1.2;
    color: #000000;
}

.acon02__title-accent,
.acon02__intro-title-accent {
    color: #0f3625;
}

.acon02__panel {
    font-family: var(--font-pretendard);
}

.acon02__tab-label {
    font-size: var(--bodyL);
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.2;
    text-align: center;
    color: #ffffff;
}

.acon02__intro-eyebrow {
    font-size: var(--bodyL);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1.2;
    color: #000000;
}

.acon02__intro-title {
    font-size: calc(var(--px)*45.02);
    font-weight: 800;
    letter-spacing: -0.05em;
    line-height: 1.2;
    color: #000000;
}

.acon02__intro-desc {
    font-size: var(--bodyL);
    font-weight: 500;
    letter-spacing: -0.05em;
    line-height: 1.67;
    color: #222222;
}

.acon02__slider {
    font-weight: 800;
    color: #0f3625;
}

.acon02__badge {
    font-size: var(--bodyL);
    letter-spacing: -0.05em;
    line-height: 1.67;
}

.acon02__caption {
    font-size: var(--headM);
    letter-spacing: -0.05em;
    line-height: 1.15;
}
/* /FONT:AUTO acon02 END */

/* INK:AUTO acon02 */
.acon02__title { margin-top: calc(var(--px) * -7.5); margin-bottom: calc(var(--px) * -7.5); } /* base 0,0 */
.acon02__title-accent { margin-top: calc(var(--px) * -7.5); margin-bottom: calc(var(--px) * -6.5); } /* base 0,0 */
.acon02__intro-desc { margin-top: calc(var(--px) * -6.53); margin-bottom: calc(var(--px) * -5.49); } /* base 0,0 */
.acon02__intro-title { margin-top: calc(var(--px) * -6.01); margin-bottom: calc(var(--px) * 44); } /* base 0,50 */
.acon02__intro-title-accent { margin-top: calc(var(--px) * -6.01); margin-bottom: calc(var(--px) * -5.99); } /* base 0,0 */
.acon02__eyebrow { margin-top: calc(var(--px) * -6.46); margin-bottom: calc(var(--px) * -5.45); } /* base 0,0 */
.acon02__caption { margin-top: calc(var(--px) * 39.98); margin-bottom: calc(var(--px) * -3.02); } /* base 43,0 */
.acon02__intro-eyebrow { margin-top: calc(var(--px) * -2.3); margin-bottom: calc(var(--px) * 23.71); } /* base 0,26 */
/* /INK:AUTO acon02 END */

@media (max-width:599px) {
  .acon02_iner {
    padding-top: 17.0667vw;
    padding-bottom: 8.5333vw;
  }

  .acon02__head {
    gap: 4.2667vw;
    margin-bottom: 12.8vw;
  }

  .acon02__panel {
    flex-direction: column;
    align-items: stretch;
    width: 91.4667vw;
    padding-bottom: 8.5333vw;
    border-radius: 6.4vw;
  }

  .acon02__tab {
    top: 8.5333vw;
    left: -0.2667vw;
    width: 8.5333vw;
    padding: 4.2667vw 0;
    border-radius: 0 3.2vw 3.2vw 0;
  }

  .acon02__mockup {
    position: relative;
    top: auto;
    left: auto;
    align-self: center;
    width: 60vw;
    margin-top: -8vw;
  }

  .acon02__intro {
    width: auto;
    padding: 4.2667vw 6.4vw 0;
  }

  .acon02__intro-eyebrow {
    margin-bottom: 2.1333vw;
  }

  .acon02__intro-title {
    margin-bottom: 4.2667vw;
    font-size: var(--titleXS);
  }

  .acon02__stage {
    align-items: stretch;
    padding: 8.5333vw 6.4vw 0;
  }

  .acon02__stage .acon02__slider {
    width: auto;
    margin-left: -6.4vw; /* 스테이지 패딩 상쇄해 카드 풀폭 — 이 셀렉터가 swiper-bundle .swiper{margin-inline:auto} 보다 강함 */
    margin-right: -6.4vw;
  }

  .acon02__slider .acon02__slide {
    width: 56vw;
    margin-inline: 2.6667vw; /* 모바일 centeredSlides — 간격을 좌우 반씩 나눠야 가운데가 안 쏠림 */
    align-items: stretch;
  }

  .acon02__photo-img {
    width: 56vw;
  }

  .acon02__photo .acon02__photo-img {
    border-radius: 6.6667vw;
  }

  .acon02__badge {
    bottom: -3.2vw;
    left: 4.2667vw;
    width: 8.5333vw;
  }

  .acon02__caption {
    margin-top: 6.4vw;
    padding-left: 0;
    text-align: center;
  }

  .acon02__arrows {
    justify-content: center;
    gap: 3.2vw;
    margin-top: 8.5333vw;
  }

  .acon02__arrow {
    width: 10.6667vw;
  }

  .acon02__arrow-icon {
    width: 4.2667vw;
  }
}

/* /merge-build:acon02 */
/* merge-build:acon03 */
/* acon03 — ONE-STOP 운영 시스템 패널(센터 슬라이더 + 하단 4카드). 모바일 접기 의도: 슬라이더 1장씩·이웃 이동 해제, 4카드 2열→1열 */
.acon03 {
  padding-top: calc(var(--px) * 27);
  padding-bottom: calc(var(--px) * 50);
}
.acon03__panel {
  width: calc(var(--px) * 1779);
  margin-left: calc(var(--px) * 69);
  padding: calc(var(--px) * 128) 0 calc(var(--px) * 93.7);
  border-radius: calc(var(--px) * 40);
  background-color: #eff8e4;
}
.acon03__tab {
  top: calc(var(--px) * 146);
  left: 0; /* 시안 -6 은 레이어 어긋남 — 패널 왼쪽 변에 맞춤 */
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--px) * 58);
  padding-block: calc(var(--px) * 30);
  border-radius: 0 calc(var(--px) * 20) calc(var(--px) * 20) 0;
  background-color: var(--secondary);
}
.acon03__tab-text {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}
.acon03__head {
  gap: calc(var(--px) * 23);
  padding-right: calc(var(--px) * 12);
  padding-bottom: calc(var(--px) * 5.54); /* 우 12 = 콘텐츠 중심을 크롭 중심(952.5)에 맞춤 */
}
.acon03__stage {
  width: calc(var(--px) * 1779);
  margin-top: calc(var(--px) * 48.46);
}
.acon03__title {
  margin-top: calc(var(--px) * 3);
}
.acon03__lead {
  margin-top: calc(var(--px) * 2);
}
.acon03__slider.swiper { /* swiper-bundle .swiper{padding:0} 이 뒤에 로드돼 명시도를 올림 */
  height: calc(var(--px) * 508.2); /* HEIGHT: 전환 중 새·옛 활성 카드 설명이 겹쳐 543 까지 늘었다 줄어 아래가 흔들림 — 안정 높이로 고정 */
  overflow: clip visible; /* 가로만 자름 — 전환 중 늘어난 몫이 아래로 잘리지 않게 */
  padding: calc(var(--px) * 36) calc(var(--px) * 12) 0 0; /* 상 36 = 활성 카드 위로 삐져나온 몫 · 우 12 = swiper 중심 보정 */
}
.acon03__slider .acon03__slide {
  width: calc(var(--px) * 389); /* swiper-slide 기본 width:100% 해제 — 사진 369 + 좌우 10 */
  align-items: stretch; /* common.css div.swiper-slide 의 가운데 정렬 해제 */
  justify-content: flex-start;
  padding-inline: calc(var(--px) * 10);
  transition: transform 0.3s ease;
}
.acon03__slider .acon03__slide:has(~ .swiper-slide-active) {
  transform: translateX(calc(var(--px) * -166)); /* 활성 카드가 넓어진 만큼 이웃을 밀어냄 */
}
.acon03__slider .swiper-slide-active ~ .acon03__slide {
  transform: translateX(calc(var(--px) * 143));
}
.acon03__slide-body {
  padding-top: calc(var(--px) * 93);
  border-radius: calc(var(--px) * 30);
  background-color: transparent; /* 활성 흰색과 보간되도록 명시 */
  transition: margin 0.3s ease-out, padding 0.3s ease-out, border-radius 0.3s ease-out, background-color 0.3s ease-out;
}
.swiper-slide-active .acon03__slide-body {
  margin: calc(var(--px) * -36) calc(var(--px) * -36) 0 calc(var(--px) * -37);
  padding: calc(var(--px) * 36) calc(var(--px) * 36) calc(var(--px) * 51) calc(var(--px) * 37);
  background-color: #fff;
}
.acon03__photo {
  border-radius: calc(var(--px) * 30);
  overflow: hidden;
}
.acon03__num,
.acon03__slide-desc {
  opacity: 0;
  transform: translateY(40%);
  transition: opacity 0.3s ease-out, transform 0.3s ease-out, margin 0.3s ease-out, display 0.3s allow-discrete; /* 비활성화 시 페이드아웃 뒤 display 해제 */
}
.acon03__slide-desc {
  display: none; /* 활성 카드에서만 노출 */
}
.acon03__num {
  height: 0; /* 제목 위라 display 해제 순간 제목이 튐 — 높이를 접어 제목이 따라 올라가게 */
  overflow: hidden;
  transition: opacity 0.3s ease-out, transform 0.3s ease-out, margin 0.3s ease-out, height 0.3s ease-out, padding 0.3s ease-out, border-width 0.3s ease-out;
}
.swiper-slide-active .acon03__num,
.swiper-slide-active .acon03__slide-desc {
  display: block;
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.1s, 0.1s, 0s, 0s;
  @starting-style {
    opacity: 0;
    transform: translateY(40%);
  }
}
.acon03__num {
  margin: 0 calc(var(--px) * 30);
  border-bottom: 0 solid rgb(0 0 0 / 10.2%);
}
.acon03__slide-title {
  margin-top: calc(var(--px) * 26);
}
.swiper-slide-active .acon03__num {
  height: calc(var(--bodyL) * 1.56 + var(--px) * 15 + 1px); /* 한 줄(line-height 1.56) + padding + border */
  margin-top: calc(var(--px) * 23);
  margin-bottom: calc(var(--px) * 29.4); /* 제목 margin-top 과 겹침 상쇄(max) — 제목 값보다 커야 효과 */
  padding-bottom: calc(var(--px) * 15);
  border-bottom-width: 1px;
  transition-delay: 0.1s, 0.1s, 0s, 0s, 0s, 0s;
}
.acon03__slide-desc {
  margin-top: calc(var(--px) * 18);
}
.acon03__arrow {
  top: calc(var(--px) * 203);
  z-index: 2; /* swiper 가 .swiper{z-index:1} 로 스택 컨텍스트를 만듦 — 공통 .btn_arr 와 같은 층 */
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--px) * 50);
  padding-block: calc(var(--px) * 18);
  border-radius: 50%;
  background-color: var(--secondary);
  cursor: pointer;
  transition: transform 0.25s ease-out;
}
@media (hover: hover) {
  .acon03__arrow:hover {
    transform: scale(1.1);
  }
}
.acon03__arrow:focus-visible {
  transform: scale(1.1);
}
.acon03__arrow:active {
  transform: scale(0.94);
}
.acon03__arrow--prev {
  left: calc(var(--px) * 592);
}
.acon03__arrow--next {
  right: calc(var(--px) * 605);
}
.acon03__arrow-icon {
  display: block;
}
.acon03__cards {
  gap: calc(var(--px) * 34);
  padding-right: calc(var(--px) * 12);
  margin-top: calc(var(--px) * 127);
}
.acon03__card {
  display: flex;
  flex-direction: column;
  width: calc(var(--px) * 334);
  padding-top: calc(var(--px) * 23);
  border: 1px solid #c8d9b4;
  border-radius: calc(var(--px) * 40);
  overflow: hidden; /* 안쪽 흰 몸체가 카드 하단 곡선 밖으로 번져 모서리가 두 겹으로 보이던 것 차단 */
  background-color: #eff8e4;
  transition: box-shadow 0.3s ease-out, border-color 0.3s ease-out, background-color 0.4s ease-out;
}
.acon03__card.is-active {
  background-color: var(--primary);
}
@media (hover: hover) {
  .acon03__card:hover {
    border-color: color-mix(in srgb, var(--primary) 40%, transparent);
    box-shadow: 0 calc(var(--px) * 14) calc(var(--px) * 28) color-mix(in srgb, var(--primary) 14%, transparent);
  }
}
.acon03__card-head {
  margin-bottom: calc(var(--px) * 20);
  opacity: 0.329;
  transition: opacity 0.4s ease-out, color 0.4s ease-out;
}
.acon03__card-head--on {
  opacity: 1;
}
.acon03__card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: calc(var(--px) * 59) calc(var(--px) * 33) calc(var(--px) * 47.46);
  border-radius: calc(var(--px) * 40) calc(var(--px) * 40) 0 0; /* 하단 곡선은 카드 overflow 가 소유 */
  background-color: #fff;
}
.acon03__card-title {
  padding-bottom: calc(var(--px) * 18);
  border-bottom: 1px solid color-mix(in srgb, var(--primary) 10.2%, transparent);
}
.acon03__card-mark {
  padding-inline: calc(var(--px) * 4);
  border-radius: calc(var(--px) * 4);
  background-color: var(--secondary);
}
.acon03__card-list {
  display: flex;
  flex-direction: column;
  gap: calc(var(--px) * 11);
  margin-top: calc(var(--px) * 41);
  padding-bottom: calc(var(--px) * 5.54);
}
.acon03__card-item {
  position: relative;
  padding-left: calc(var(--px) * 13);
  transition: transform 0.25s ease-out;
}
@media (hover: hover) {
  .acon03__card-item:hover {
    transform: translateX(calc(var(--px) * 6));
  }
  .acon03__card-item:hover::before {
    background-color: var(--primary);
  }
}
.acon03__card-item::before {
  content: "";
  position: absolute;
  top: calc(var(--px) * 11);
  left: calc(var(--px) * 1);
  inline-size: calc(var(--px) * 6);
  block-size: calc(var(--px) * 6);
  border-radius: 50%;
  background-color: color-mix(in srgb, var(--primary) 20%, transparent);
  transition: background-color 0.25s ease-out;
}

/* IMG:AUTO acon03 */
/* 섹션 HTML 파생 (tools/img-size-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.acon03__photo {
    width: calc(var(--px)*369);
    aspect-ratio: 369 / 235;
}

.acon03__arrow-icon {
    width: calc(var(--px)*18);
    aspect-ratio: 18 / 14;
}
/* /IMG:AUTO acon03 END */

/* FONT:AUTO acon03 */
/* spec.json 파생 (tools/spec-font-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: line-height · letter-spacing 는 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.acon03__panel {
    font-family: var(--font-pretendard);
}

.acon03__tab-text {
    font-size: var(--bodyL);
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.2;
    text-align: center;
    color: #0f3625;
}

.acon03__eyebrow {
    font-size: var(--bodyL);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1.2;
    color: #000000;
}

.acon03__title {
    font-size: calc(var(--px)*45.02);
    font-weight: 800;
    letter-spacing: -0.05em;
    line-height: 1.2;
    color: #000000;
}

.acon03__title-accent {
    color: #0f3625;
}

.acon03__lead {
    font-size: var(--bodyL);
    font-weight: 500;
    letter-spacing: -0.05em;
    line-height: 1.56;
    text-align: center;
    color: #222222;
}

.acon03__slider {
    text-align: center;
}

.acon03__num {
    font-size: var(--bodyL);
    font-weight: 800;
    letter-spacing: 0em;
    line-height: 1.56;
    color: #0f3625;
}

.acon03__slide-title {
    font-size: var(--headS);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1.17;
    color: #222222;
}

.acon03__slide-desc,
.acon03__card-list {
    font-size: var(--bodyL);
    font-weight: 500;
    letter-spacing: -0.05em;
    line-height: 1.56;
    color: #222222;
}

.acon03__card-head.acon03__card-head--on {
    font-size: var(--subheadL);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1.36;
    text-align: center;
    color: #ffffff;
}

.acon03__card-title {
    font-size: var(--bodyXL);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1.25;
    text-align: center;
    color: #0f3625;
}

.acon03__card-head {
    font-size: var(--subheadL);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1.36;
    text-align: center;
    color: #0f3625;
}
/* /FONT:AUTO acon03 END */

/* INK:AUTO acon03 */
.acon03__lead { margin-top: calc(var(--px) * -3.54); margin-bottom: calc(var(--px) * -5.54); } /* base 2,0 */
.acon03__slide-desc { margin-top: calc(var(--px) * 12.46); margin-bottom: calc(var(--px) * -5.54); } /* base 18,0 */
.acon03__card-item { margin-top: calc(var(--px) * -5.54); margin-bottom: calc(var(--px) * -5.54); } /* base 0,0 */
.acon03__card-head.acon03__card-head--on { margin-top: calc(var(--px) * -4.96); margin-bottom: calc(var(--px) * 15.05); } /* base 0,20 */
.acon03__card-head { margin-top: calc(var(--px) * -4.96); margin-bottom: calc(var(--px) * 15.05); } /* base 0,20 */
.acon03__title { margin-top: calc(var(--px) * -3.01); margin-bottom: calc(var(--px) * -2); } /* base 3,0 */
.acon03__title-accent { margin-top: calc(var(--px) * -6.01); margin-bottom: calc(var(--px) * -1.99); } /* base 0,0 */
.acon03__slide-title { margin-top: calc(var(--px) * 22.38); margin-bottom: calc(var(--px) * -2.62); } /* base 26,0 */
.acon03__slide-title.acon03__slide-title--01 { margin-top: calc(var(--px) * 23.38); margin-bottom: calc(var(--px) * -2.62); } /* base 26,0 */
.acon03__eyebrow { margin-top: calc(var(--px) * -2.3); margin-bottom: calc(var(--px) * -2.29); } /* base 0,0 */
/* /INK:AUTO acon03 END */

@media (prefers-reduced-motion: reduce) {
  .acon03__slider .acon03__slide,
  .acon03__slide-body,
  .acon03__arrow,
  .acon03__card,
  .acon03__card-item,
  .acon03__card-item::before,
  .acon03__card-head,
  .acon03__num,
  .acon03__slide-desc,
  .swiper-slide-active .acon03__num,
  .swiper-slide-active .acon03__slide-desc {
    transition: none;
  }
}

@media (max-width: 599px) {
  .acon03 {
    padding-top: 4.2667vw;
    padding-bottom: 8.5333vw;
  }
  .acon03__panel {
    width: 91.4667vw;
    margin-inline: auto;
    padding: 17.0667vw 0 10.6667vw;
    border-radius: 6.4vw;
  }
  .acon03__tab {
    top: 6.4vw;
    left: 0; /* 모바일은 카드 왼쪽 변에 맞춤 */
    width: 8.5333vw;
    padding-block: 4.2667vw;
    border-radius: 0 3.2vw 3.2vw 0;
  }
  .acon03__head {
    gap: 3.2vw;
    padding-right: 0;
    padding-bottom: 0;
  }
  .acon03__title {
    font-size: var(--titleM);
    margin-top: 0;
    margin-bottom: 0;
  }
  .acon03__lead,
  .acon03__eyebrow {
    margin-top: 0;
    margin-bottom: 0;
  }
  .acon03__stage {
    width: 100%;
    margin-top: 6.4vw;
  }
  .acon03__slider.swiper {
    height: auto;
    padding: 4.2667vw 0 0;
    min-height: 85.3333vw; /* 활성 카드 설명 길이로 295↔319(@375) 출렁여 아래 섹션이 밀림 — 최대치(320 · 전 폭 85.1vw 이하)로 고정 */
  }
  .acon03__slider .acon03__slide {
    width: 58.6667vw;
    padding-inline: 2.1333vw;
  }
  .acon03__slider .acon03__slide:has(~ .swiper-slide-active) {
    transform: translateX(-3.2vw);
  }
  .acon03__slider .swiper-slide-active ~ .acon03__slide {
    transform: translateX(3.2vw);
  }
  .acon03__slide-body {
    padding-top: 12.8vw;
  }
  .swiper-slide-active .acon03__slide-body {
    margin: -4.2667vw -4.2667vw 0 -4.2667vw;
    padding: 4.2667vw 4.2667vw 6.4vw 4.2667vw;
    border-radius: 5.3333vw;
  }
  .acon03__photo {
    width: 54.4vw;
    border-radius: 5.3333vw;
  }
  .acon03__num {
    margin-inline: 4.2667vw;
  }
  .swiper-slide-active .acon03__num {
    height: calc(var(--bodyL) * 1.56 + 2.1333vw + 1px);
    margin-top: 3.2vw;
    margin-bottom: 3.2vw;
    padding-bottom: 2.1333vw;
  }
  .acon03__slide-title,
  .acon03__slide-title.acon03__slide-title--01 {
    margin-top: 3.2vw;
    margin-bottom: 0;
  }
  .acon03__slide-desc {
    margin-top: 2.1333vw;
    margin-bottom: 0;
  }
  .acon03__arrow {
    top: 30.1333vw; /* 양옆 이웃 카드 사진(64~194px) 세로 가운데 − 화살표 높이 절반 */
    width: 8.5333vw;
    padding-block: 2.8vw;
  }
  .acon03__arrow--prev {
    left: 2.1333vw;
  }
  .acon03__arrow--next {
    right: 2.1333vw;
  }
  .acon03__arrow-icon {
    width: 3.7333vw;
  }
  .acon03__cards {
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 5.3333vw;
    padding: 0 5.3333vw;
    margin-top: 10.6667vw;
  }
  .acon03__card {
    width: 100%;
    padding-top: 4.2667vw;
    border-radius: 6.4vw;
  }
  .acon03__card-head,
  .acon03__card-head.acon03__card-head--on {
    margin-top: 0;
    margin-bottom: 3.2vw;
  }
  .acon03__card-body {
    padding: 8.5333vw 5.3333vw 6.4vw;
    border-radius: 6.4vw 6.4vw 0 0;
  }
  .acon03__card-title {
    padding-bottom: 3.2vw;
  }
  .acon03__card-mark {
    padding-inline: 1.0667vw;
    border-radius: 1.0667vw;
  }
  .acon03__card-list {
    gap: 1.6vw;
    margin-top: 6.4vw;
    padding-bottom: 0;
  }
  .acon03__card-item {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 3.2vw;
  }
  .acon03__card-item::before {
    top: 2.1333vw;
    left: 0.5333vw;
    inline-size: 1.0667vw;
    block-size: 1.0667vw;
  }
}

/* /merge-build:acon03 */
/* merge-build:acon04 */
/* acon04 — 핵심 가치 4카드. 모바일: 카드열 flex-col 1열 후보, pc-inline br 해제 */
.acon04 {
  height: calc(var(--px) * 882); /* HEIGHT: 활성 카드 translateY 70 은 흐름 높이에 안 잡혀 시안 섹션 높이로 고정 */
  background-color: #f7f5ea;
}

.acon04_iner {
  padding-top: calc(var(--px) * 141);
  padding-bottom: calc(var(--px) * 128);
}

.acon04__head {
  gap: calc(var(--px) * 23);
  margin-bottom: calc(var(--px) * 38);
}

.acon04__list {
  gap: calc(var(--px) * 33);
}

.acon04__tab {
  top: 0;
  left: 0;
  right: 0;
  margin-inline: auto;
  opacity: 0;
  transform: translateY(calc(var(--px) * 70)); /* 카드 뒤에 숨김 — 호버 시 카드가 내려가며 드러남 */
  width: calc(var(--px) * 258);
  padding: calc(var(--px) * 15) 0 calc(var(--px) * 12) calc(var(--px) * 48);
  gap: calc(var(--px) * 7);
  border-radius: calc(var(--px) * 20) calc(var(--px) * 20) 0 0;
  background-color: var(--primary);
}

.acon04__tab-name {
  gap: calc(var(--px) * 12);
  text-transform: uppercase;
}

.acon04__card {
  min-height: calc(var(--px) * 417); /* HEIGHT: 카드 높이 시안 고정(좌우 카드 높이 균일, 내용은 1~3줄로 가변) */
  width: calc(var(--px) * 335);
  padding-top: calc(var(--px) * 62);
  border-radius: calc(var(--px) * 40);
  background-color: #fff;
}

.acon04__icon-circle {
  width: calc(var(--px) * 125);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background-color: #f7f5ea;
}

.acon04__card-title {
  margin-top: calc(var(--px) * 38);
}

.acon04__card-desc {
  margin-top: calc(var(--px) * 31);
}

/* 신호등: ani_acon04 가 .is-active 를 자동 순환시키고 호버한 카드에 고정 */
@media (min-width: 600px) {
  .acon04__card {
    transition: transform .35s ease-out, background-color .35s ease-out, box-shadow .35s ease-out;
  }

  .acon04__tab {
    transition: transform .35s ease-out, opacity .35s ease-out;
  }

  .acon04__icon-circle {
    transition: background-color .35s ease-out;
  }

  .acon04__card-title {
    transition: color .35s ease-out;
  }

  .acon04__tab-name .acon04__tab-word {
    opacity: 0;
    transform: translateX(-40%);
    transition: transform .3s ease-out, opacity .3s ease-out;
  }

  .acon04__tab-name .acon04__tab-word:nth-child(1) {
    transition-delay: .12s;
  }

  .acon04__tab-name .acon04__tab-word:nth-child(2) {
    transition-delay: .2s;
  }

  .acon04__item.is-active .acon04__tab-name .acon04__tab-word,
  .acon04__item:focus-within .acon04__tab-name .acon04__tab-word {
    opacity: 1;
    transform: none;
  }

  .acon04__item.is-active .acon04__card,
  .acon04__item:focus-within .acon04__card {
    transform: translateY(calc(var(--px) * 70));
    box-shadow: inset 0 0 0 3px var(--primary); /* 3px 테두리 — 레이아웃 불변 */
    background-color: #f7f5ea;
  }

  .acon04__item.is-active .acon04__tab,
  .acon04__item:focus-within .acon04__tab {
    opacity: 1;
    transform: none;
  }

  .acon04__item.is-active .acon04__icon-circle,
  .acon04__item:focus-within .acon04__icon-circle {
    background-color: var(--secondary);
  }

  .acon04__item.is-active .acon04__card-title,
  .acon04__item:focus-within .acon04__card-title {
    color: var(--primary);
  }
}

@media (prefers-reduced-motion: reduce) {
  .acon04__card,
  .acon04__tab,
  .acon04__icon-circle,
  .acon04__card-title,
  .acon04__tab-name .acon04__tab-word {
    transition: none;
  }
}

/* IMG:AUTO acon04 */
/* 섹션 HTML 파생 (tools/img-size-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.acon04__tab-leaf {
    width: calc(var(--px)*49);
    aspect-ratio: 49 / 43;
}

.acon04__icon.acon04__icon--dish {
    width: calc(var(--px)*64);
    aspect-ratio: 64 / 53;
}

.acon04__icon.acon04__icon--coin {
    width: calc(var(--px)*76);
    aspect-ratio: 76 / 51;
}

.acon04__icon.acon04__icon--salad {
    width: calc(var(--px)*57);
    aspect-ratio: 57 / 58;
}

.acon04__icon.acon04__icon--chart {
    width: calc(var(--px)*53);
    aspect-ratio: 53 / 54;
}
/* /IMG:AUTO acon04 END */

/* FONT:AUTO acon04 */
/* spec.json 파생 (tools/spec-font-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: line-height · letter-spacing 는 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.acon04 {
    text-align: center;
}

.acon04__eyebrow {
    font-family: var(--font-poppins);
    font-size: var(--bodyL);
    font-weight: 700;
    letter-spacing: 0em;
    line-height: 1.44;
    color: #0f3625;
}

.acon04__title {
    font-family: var(--font-pretendard);
    font-size: var(--titleXL);
    font-weight: 800;
    letter-spacing: -0.05em;
    line-height: 1.2;
    color: #000000;
}

.acon04__title-accent {
    color: #0f3625;
}

.acon04__tab-name {
    font-family: var(--font-poppins);
    font-size: var(--bodyM);
    font-weight: 700;
    letter-spacing: 0.265em; /* OVR */
    line-height: 1.2;
    color: #eed64e;
}

.acon04__card.acon04__card--featured,
.acon04__card {
    font-family: var(--font-pretendard);
}

.acon04__card-title.acon04__card-title--featured {
    font-size: var(--headS);
    font-weight: 800;
    letter-spacing: -0.073em; /* OVR */
    line-height: 1.2;
    color: #0f3625;
}

.acon04__card-desc {
    font-size: var(--bodyL);
    font-weight: 500;
    letter-spacing: -0.05em;
    line-height: 1.5;
    color: #565656;
}

.acon04__card-title {
    font-size: var(--headS);
    font-weight: 800;
    letter-spacing: -0.073em; /* OVR */
    line-height: 1.2;
    color: #000000;
}
/* /FONT:AUTO acon04 END */

/* INK:AUTO acon04 */
.acon04__title { margin-top: calc(var(--px) * -7.5); margin-bottom: calc(var(--px) * -7.5); } /* base 0,0 */
.acon04__title-accent { margin-top: calc(var(--px) * -7.5); margin-bottom: calc(var(--px) * -6.5); } /* base 0,0 */
.acon04__eyebrow { margin-top: calc(var(--px) * -6.46); margin-bottom: calc(var(--px) * -5.45); } /* base 0,0 */
.acon04__card-desc { margin-top: calc(var(--px) * 26); margin-bottom: calc(var(--px) * -5); } /* base 31,0 */
.acon04__card-title { margin-top: calc(var(--px) * 34); margin-bottom: calc(var(--px) * -3); } /* base 38,0 */
.acon04__tab-word { margin-top: calc(var(--px) * -3.1); margin-bottom: calc(var(--px) * -3.09); } /* base 0,0 */
.acon04__card-title.acon04__card-title--featured { margin-top: calc(var(--px) * 35); margin-bottom: calc(var(--px) * -3); } /* base 38,0 */
/* /INK:AUTO acon04 END */

@media (max-width: 599px) {
  .acon04 {
    height: auto;
  }

  .acon04_iner {
    padding-top: 21.3333vw;
    padding-bottom: 21.3333vw;
  }

  .acon04__head {
    gap: 3.2vw;
    margin-bottom: 6.4vw;
  }

  .acon04__title { margin-top: -1.2vw; margin-bottom: -1.2vw; }
  .acon04__eyebrow { margin-top: -1.0336vw; margin-bottom: -0.872vw; }

  .acon04__list {
    flex-direction: column;
    align-items: center;
    gap: 5.3333vw;
  }

  .acon04__card {
    width: 87vw;
    min-height: 0;
    padding: 10.6667vw 5.3333vw 8.5333vw;
    border-radius: 6.4vw;
  }

  .acon04__icon-circle { width: 21.3333vw; }

  .acon04__icon.acon04__icon--dish { width: 10.9227vw; }
  .acon04__icon.acon04__icon--coin { width: 12.9707vw; }
  .acon04__icon.acon04__icon--salad { width: 9.728vw; }
  .acon04__icon.acon04__icon--chart { width: 9.0453vw; }

  .acon04__card-title { margin-top: 5.44vw; margin-bottom: -0.48vw; }
  .acon04__card-desc { margin-top: 4.16vw; margin-bottom: -0.8vw; }
}

/* /merge-build:acon04 */
/* merge-build:acon05 */
/* acon05 — 모바일 인계: 좌 연도 카드 + 우 타임라인 → 세로 1열(카드 위·타임라인 아래), 월 원은 축소 */
.acon05_iner {
  padding: calc(var(--px)*147) 0 calc(var(--px)*140);
}

.acon05__title {
  margin-top: calc(var(--px)*23);
}

.acon05__body {
  margin-top: calc(var(--px)*77);
  gap: calc(var(--px)*71);
  align-items: flex-start;
}

.acon05__year-card {
  width: calc(var(--px)*484);
  padding: calc(var(--px)*156) 0 calc(var(--px)*77) calc(var(--px)*80); /* 위 패딩 = 판 높이 313 을 숫자 1줄 + 잎 영역으로 채움 */
  border-radius: calc(var(--px)*30);
  background: var(--primary);
  transition: box-shadow .4s ease-out;
}

@media (min-width: 600px) {
  .acon05 { overflow: clip; } /* section overflow:hidden 은 sticky 를 막음 — clip 은 스크롤컨테이너를 안 만듦 */
  .acon05__year-card {
    position: sticky;
    top: calc(var(--px)*201); /* 고정 탭바 하단(171) + 30 — 150 이면 카드 윗변이 탭바에 가려짐 */
    align-self: flex-start;
  }
}

.acon05__leaf {
  top: calc(var(--px)*62);
  right: calc(var(--px)*73);
}

.acon05__timeline {
  width: calc(var(--px)*886);
  border-top: 1px solid var(--primary);
  border-bottom: 1px solid var(--primary);
}

.acon05__timeline::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(var(--px)*101);
  width: 1px;
  background: color-mix(in srgb, var(--primary) 10%, transparent);
  background-image: linear-gradient(var(--primary), var(--primary));
  background-size: 100% calc(var(--acon05-progress, 0) * 100%);
  background-repeat: no-repeat;
}

.acon05__row {
  isolation: isolate;
  padding: calc(var(--px)*48) 0 calc(var(--px)*51) calc(var(--px)*62);
  gap: calc(var(--px)*60);
}

.acon05__row:first-child {
  padding-top: calc(var(--px)*65);
  padding-bottom: calc(var(--px)*62);
}

.acon05__row:nth-child(2) {
  padding-top: calc(var(--px)*55);
  padding-bottom: calc(var(--px)*52);
}

.acon05__row:last-child {
  padding-top: calc(var(--px)*56);
  padding-bottom: calc(var(--px)*61);
}

.acon05__row:not(:last-child)::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: calc(var(--px)*201);
  height: 1px;
  background: color-mix(in srgb, var(--primary) 15%, transparent);
}

.acon05__month {
  flex-shrink: 0;
  width: calc(var(--px)*81);
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--primary);
  transition: background-color .3s ease-out;
  position: relative; /* 활성 링 ::before 앵커 */
}

.acon05__month::before {
  content: "";
  position: absolute;
  inset: calc(var(--px)*-8);
  border-radius: 50%;
  background: color-mix(in srgb, var(--primary) 18%, transparent);
  opacity: 0;
  z-index: -1; /* 링은 원 뒤 레이어 — 행(.acon05__row)이 isolation 으로 스택 컨텍스트를 만들어 원 배경·글자 아래로만 깔림 */
  transition: opacity .3s ease-out;
}

.acon05__item {
  transition: color .3s ease-out, translate .3s ease-out;
  padding-left: calc(var(--px)*16);
  background: radial-gradient(circle at calc(var(--px)*3) calc(var(--px)*17), var(--primary) calc(var(--px)*3), transparent calc(var(--px)*3.5)) repeat-y left top / calc(var(--px)*6) calc(var(--px)*35); /* 줄마다 불릿: 줄 피치 35 타일 반복 */
}

@media (hover: hover) {
  .acon05__row:hover .acon05__item { color: var(--primary); translate: calc(var(--px)*10) 0; }
  .acon05__year-card:hover { box-shadow: 0 calc(var(--px)*20) calc(var(--px)*40) color-mix(in srgb, var(--primary) 30%, transparent); }
}

.acon05__row.is-active .acon05__month::before { opacity: 1; }
.acon05__row.is-active .acon05__item { color: var(--primary); }

@media (prefers-reduced-motion: reduce) {
  .acon05__year-card,
  .acon05__month::before,
  .acon05__item { transition: none; }
}

/* IMG:AUTO acon05 */
/* 섹션 HTML 파생 (tools/img-size-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.acon05__leaf {
    width: calc(var(--px)*62);
    aspect-ratio: 62 / 61;
}
/* /IMG:AUTO acon05 END */

/* FONT:AUTO acon05 */
/* spec.json 파생 (tools/spec-font-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: line-height · letter-spacing 는 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.acon05__eyebrow {
    font-family: var(--font-poppins);
    font-size: var(--bodyL);
    font-weight: 700;
    letter-spacing: 0em;
    line-height: 1.44;
    text-align: center;
    color: #0f3625;
}

.acon05__title {
    font-family: var(--font-pretendard);
    font-size: var(--titleXL);
    font-weight: 800;
    letter-spacing: -0.05em;
    line-height: 1.2;
    text-align: center;
    color: #000000;
}

.acon05__title-point {
    color: #0f3625;
}

.acon05__year {
    font-family: var(--font-poppins);
    font-size: var(--displayL);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.07;
    color: #ffffff;
}

.acon05__timeline {
    font-family: var(--font-pretendard);
}

.acon05__month {
    font-size: var(--subheadL);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.2;
    text-align: center;
    color: #ffffff;
}

.acon05__item {
    font-size: var(--bodyL);
    font-weight: 500;
    letter-spacing: -0.05em;
    line-height: 1.94;
    color: #3f3f3f;
}
/* /FONT:AUTO acon05 END */

/* INK:AUTO acon05 */
.acon05__year { margin-top: calc(var(--px) * -13.67); margin-bottom: calc(var(--px) * -18.67); } /* base 0,0 */
.acon05__title { margin-top: calc(var(--px) * 15.5); margin-bottom: calc(var(--px) * -7.5); } /* base 23,0 */
.acon05__title-point { margin-top: calc(var(--px) * -7.5); margin-bottom: calc(var(--px) * -6.5); } /* base 0,0 */
.acon05__eyebrow { margin-top: calc(var(--px) * -6.46); margin-bottom: calc(var(--px) * -5.45); } /* base 0,0 */
/* /INK:AUTO acon05 END */

@media (max-width:599px) {
  .acon05_iner { padding: 17.0667vw 5.3333vw; }
  .acon05__title { margin-top: 2.1333vw; }
  .acon05__body { flex-direction: column; align-items: stretch; width: 100%; margin-top: 12.8vw; gap: 10.6667vw; }
  .acon05 { overflow: clip; } /* sticky 카드 — hidden 은 스크롤컨테이너를 만들어 sticky 를 막음 */
  .acon05__year-card {
    position: sticky;
    top: 34.6667vw; /* 고정 탭바 하단(118px@375) + 12px 여백 */
    z-index: 2; /* DOM 뒤의 relative 행들이 sticky 카드 위로 지나가지 않게 */
    width: 100%;
    padding: 4.2667vw 6.4vw 4.2667vw 8.5333vw;
    border-radius: 5.3333vw;
  }
  .acon05__leaf { top: calc(50% - 5.3333vw); right: 6.4vw; width: 10.6667vw; }
  .acon05__timeline { width: 100%; }
  .acon05__timeline::before { left: 9.6vw; }
  .acon05__row,
  .acon05__row:first-child,
  .acon05__row:nth-child(2),
  .acon05__row:last-child { padding: 6.4vw 4.2667vw; gap: 3.2vw; }
  .acon05__row:not(:last-child)::after { left: 18.1333vw; }
  .acon05__month { width: 10.6667vw; }
  .acon05__month::before { inset: -1.6vw; }
  .acon05__item { padding-left: 0; background: none; }
}

/* /merge-build:acon05 */
/* merge-build:sub-hero */
/* sub-hero — 서브 공용 히어로(텍스트는 페이지마다 교체). 모바일 인계: 판 폭 100% 로 줄이고 세로 1열 그대로 */
.sub-hero_iner {
  padding: calc(var(--hd-h) + 1px) 0 calc(var(--px)*20); /* 고정 헤더 높이만큼 비움 */
}

.sub-hero_box {
  position: relative;
  width: calc(var(--px)*1800);
  border-radius: calc(var(--px)*40);
  overflow: hidden;
}

.sub-hero_box_iner {
  padding: calc(var(--px)*159) 0 calc(var(--px)*175.02);
}

.sub-hero__crumb-list {
  gap: calc(var(--px)*13);
  padding-right: calc(var(--px)*26);
}

.sub-hero__home-link {
  display: block;
  transition: transform .25s ease-out;
}

/* 홈 아이콘 hover·focus 확대 (CSS 레인) */
@media (hover:hover) {
  .sub-hero__home-link:hover { transform: scale(1.15) rotate(-8deg); }
}
.sub-hero__home-link:focus-visible { transform: scale(1.15) rotate(-8deg); }

.sub-hero__crumb-sep {
  opacity: 0.33;
}

.sub-hero__title {
  margin-top: calc(var(--px)*29);
}

.sub-hero__desc {
  margin-top: calc(var(--px)*36);
}

/* IMG:AUTO sub-hero */
/* 섹션 HTML 파생 (tools/img-size-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.sub-hero__home-img {
    width: calc(var(--px)*31);
    aspect-ratio: 31 / 31;
}
/* /IMG:AUTO sub-hero END */

/* FONT:AUTO sub-hero */
/* spec.json 파생 (tools/spec-font-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: line-height · letter-spacing 는 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.sub-hero__crumb-list {
    font-size: var(--bodyL);
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1;
    color: #000000;
}

.sub-hero__crumb-sep {
    font-family: var(--font-suit);
}

.sub-hero__crumb-current {
    font-family: var(--font-poppins);
}

.sub-hero__title {
    font-family: var(--font-poppins);
    font-size: calc(var(--px)*70.03);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.07;
    color: #0f3625;
}

.sub-hero__desc {
    font-family: var(--font-pretendard);
    font-size: var(--bodyXL);
    font-weight: 500;
    letter-spacing: -0.05em;
    line-height: 1.45;
    color: #222222;
}
/* /FONT:AUTO sub-hero END */

/* INK:AUTO sub-hero */
.sub-hero__title { margin-top: calc(var(--px) * 18.03); margin-bottom: calc(var(--px) * -11.96); } /* base 29,0 */
.sub-hero__desc { margin-top: calc(var(--px) * 30.5); margin-bottom: calc(var(--px) * -5.5); } /* base 36,0 */
.sub-hero__crumb-current { margin-top: calc(var(--px) * -2.5); margin-bottom: calc(var(--px) * -1.5); } /* base 0,0 */
.sub-hero__crumb-sep { margin-top: calc(var(--px) * -1.5); margin-bottom: calc(var(--px) * -1.5); } /* base 0,0 */
/* /INK:AUTO sub-hero END */

@media (max-width:599px) {
  .sub-hero_iner { padding-bottom: 3.2vw; }
  .sub-hero_box { width: 91.4667vw; border-radius: 6.4vw; }
  .sub-hero_box_iner { padding: 12.8vw 5.3333vw; word-break: keep-all; }
  .sub-hero__crumb-list { gap: 2.1333vw; padding-right: 4.2667vw; }
  .sub-hero__home-img { width: 5.3333vw; }
  .sub-hero__title { font-size: var(--displayS); margin-top: 4.2667vw; margin-bottom: 0; }
  .sub-hero__desc { margin-top: 4.2667vw; margin-bottom: 0; text-wrap: balance; }
}

/* /merge-build:sub-hero */
/* merge-build:tab-nav */
/* tab-nav — 서브 공용 탭바. 스크롤 시 고정은 헤더(--hd-h) 아래 sticky. 모바일 인계: 판 폭 100% */
.tab-nav {
  position: sticky;
  top: var(--hd-h);
  z-index: 11; /* 뒤 섹션 .front{z-index:10} 위, 헤더(9999) 아래 */
  overflow: visible;
  transition: top 0.3s; /* 헤더 .insert 전환과 같은 시간 */
}

body:has(.header.insert) .tab-nav {
  top: 0;
}

.tab-nav__bar {
  width: calc(var(--px)*1800);
  background-color: var(--primary);
  border-radius: calc(var(--px)*20);
  padding-block: calc(var(--px)*25.5) calc(var(--px)*27.5);
  position: relative;
}

.tab-nav__bar::after {
  content: "";
  position: absolute;
  left: calc(var(--px)*20);
  right: calc(var(--px)*20);
  bottom: 0;
  height: calc(var(--px)*3);
  background: var(--tertiary);
  transform-origin: left;
  transform: scaleX(var(--tab-progress, 0));
  pointer-events: none;
}

.tab-nav__link {
  display: block;
  position: relative;
  padding-inline: calc(var(--px)*76.5);
  transition: color 0.25s ease-out;
}

.tab-nav__link::after {
  content: "";
  position: absolute;
  left: calc(var(--px)*76.5);
  right: calc(var(--px)*76.5);
  bottom: calc(var(--px)*-10);
  height: calc(var(--px)*2);
  background: var(--tertiary);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.35s cubic-bezier(0.65, 0, 0.35, 1);
}

.tab-nav__char {
  display: inline-block;
  transition: translate 0.3s ease-out;
  transition-delay: calc(var(--i, 0)*0.02s);
}

@media (hover: hover) {
  .tab-nav__link:hover {
    color: var(--tertiary);
  }

  .tab-nav__link:hover::after {
    transform: scaleX(1);
    transform-origin: left;
  }

  .tab-nav__link:hover .tab-nav__char {
    translate: 0 -12%;
  }
}

.tab-nav__link:focus-visible,
.tab-nav__link.is-active {
  color: var(--tertiary);
}

.tab-nav__link:focus-visible::after,
.tab-nav__link.is-active::after {
  transform: scaleX(1);
  transform-origin: left;
}

.tab-pane:not(.is-active) {
  display: none; /* 탭 전환은 뷰포트가 아닌 런타임 상태라 pc/mobile 유틸 대상 아님 */
}

.tab-nav__item {
  position: relative;
}

.tab-nav__item + .tab-nav__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 1px;
  height: calc(var(--px)*13);
  background-color: rgb(255 255 255 / 0.2);
  transform: translateY(-50%);
}

/* FONT:AUTO tab-nav */
/* spec.json 파생 (tools/spec-font-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: line-height · letter-spacing 는 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.tab-nav__list {
    font-family: var(--font-pretendard);
    font-size: var(--bodyXL);
    font-weight: 500;
    letter-spacing: -0.05em;
    line-height: 0.9; /* OVR */
    color: #ffffff;
}
/* /FONT:AUTO tab-nav END */


@media (max-width:599px) {
  .tab-nav {
    top: calc(var(--hd-h) + 4.2667vw); /* 모바일은 헤더가 안 숨어(.insert 없음) 늘 그 아래 — 붙지 않게 좌우 여백과 같은 16px@375 */
  }

  .tab-nav__bar {
    width: 91.4667vw;
    border-radius: 3.2vw;
    padding-block: 4.2667vw;
  }

  .tab-nav__bar::after {
    left: 3.2vw;
    right: 3.2vw;
    height: 0.5333vw;
  }

  .tab-nav__list {
    align-items: center; /* 탭마다 줄 수가 달라도 세로 가운데로 맞춤 */
    font-size: var(--bodyS); /* bodyXL(16px@375)이면 FOOD CONSULTING 같은 긴 탭명이 한 칸을 넘음 */
    word-break: keep-all;
    line-height: 1.2; /* PC 0.9 는 한 줄 전제 — 그래도 접히는 탭명은 줄이 겹치지 않게 */
  }

  .tab-nav__item {
    flex: auto; /* 칸 폭을 글자 길이에 맞춰 나눔 — 균등 1/3 이면 긴 탭명만 접힘 */
  }

  .tab-nav__link {
    width: fit-content; /* 밑줄이 칸 폭이 아니라 글자 폭을 따르게 */
    margin-inline: auto;
    padding-inline: 1.0667vw;
  }

  .tab-nav__link::after {
    left: 1.0667vw;
    right: 1.0667vw;
    bottom: -1.0667vw;
    height: 0.5333vw;
  }

  .tab-nav__item + .tab-nav__item::before {
    height: 2.1333vw; /* HEIGHT: 1px 구분선 장식 absol, PC 13px 의 모바일 스냅 8px — 콘텐츠로 못 잡음 */
  }

  .tab-nav ~ section {
    scroll-margin-top: calc(var(--hd-h) + 21.3333vw); /* 탭바가 헤더 아래 16px 띄워 고정되므로 그만큼 더 내림 */
  }
}

/* /merge-build:tab-nav */