/**
 * Sub PC 반응형 — policy (저작권 정책 · 찾아오시는길)
 *
 * 로드 순서: sub-responsive.css → policy.css → policy-responsive.css
 * MO 레퍼런스: policy-mobile.css @450px
 */

body.copyright-page.sub-page--pc-responsive .policy-body {
  container-type: inline-size;
  container-name: sub-policy;
}

@media (max-width: 768px) {
  body.copyright-page.sub-page--pc-responsive {
    --header-mobile-h: clamp(64px, 14vw, 80px);
  }
}

/* ── 히어로 제목 (policy는 h1 사용) ── */
@container sub-hero (max-width: 1280px) {
  body.copyright-page.sub-page--pc-responsive .sub-hero-overlay h1 {
    font-size: var(--sub-hero-title-size, 36px);
  }
}


@container sub-hero (max-width: 451px) {
  body.copyright-page.sub-page--pc-responsive .sub-hero-overlay h1 {
    font-size: max(13px, 5vw);
  }
}

/* ── 본문 (1280 · 1024 · 768 · 451) ── */
@container sub-policy (max-width: 1280px) {
  body.copyright-page.sub-page--pc-responsive .policy-body {
    padding: clamp(32px, 4.6875cqi, 60px) 0 clamp(48px, 7.8125cqi, 100px);
  }

  body.copyright-page.sub-page--pc-responsive .policy-intro {
    gap: clamp(20px, 2.5cqi, 32px);
    margin-bottom: clamp(32px, 3.90625cqi, 50px);
    padding: clamp(24px, 2.5cqi, 32px) clamp(20px, 3.125cqi, 40px);
  }

  body.copyright-page.sub-page--pc-responsive .policy-intro__icon {
    width: clamp(72px, 7.8125cqi, 100px);
    height: clamp(72px, 7.8125cqi, 100px);
  }



  body.copyright-page.sub-page--pc-responsive .copyright-content__lead {
    font-size: clamp(16px, 1.40625cqi, 18px);
    margin-bottom: clamp(20px, 1.875cqi, 24px);
  }

  body.copyright-page.sub-page--pc-responsive .copyright-content__lead + .copyright-content__text {
    margin-top: clamp(24px, 3.125cqi, 40px);
  }

  body.copyright-page.sub-page--pc-responsive .copyright-content__text {
    font-size: clamp(14px, 1.171875cqi, 15px);
    margin-bottom: clamp(16px, 2.734375cqi, 35px);
  }
}

@container sub-policy (max-width: 1024px) {
  body.copyright-page.sub-page--pc-responsive .copyright-content__lead--single-line {
    white-space: normal;
  }
}

@container sub-policy (max-width: 768px) {
  body.copyright-page.sub-page--pc-responsive .policy-body {
    padding: 32px 0 40px;
  }

  body.copyright-page.sub-page--pc-responsive .policy-intro {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin-bottom: 28px;
    padding: 24px 20px;
    text-align: center;
  }

  body.copyright-page.sub-page--pc-responsive .policy-intro__icon {
    width: 72px;
    height: 72px;
  }

  body.copyright-page.sub-page--pc-responsive .policy-intro__text {
    text-align: center;
  }

  body.copyright-page.sub-page--pc-responsive .copyright-content {
    padding: 0 20px;
  }

  body.copyright-page.sub-page--pc-responsive .copyright-content.m60 {
    margin-bottom: 4rem;
  }

  body.copyright-page.sub-page--pc-responsive .copyright-content__lead {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.7;
    margin-bottom: 20px;
  }

  body.copyright-page.sub-page--pc-responsive .copyright-content__lead + .copyright-content__text {
    margin-top: 32px;
  }

  body.copyright-page.sub-page--pc-responsive .copyright-content__text {
    font-size: 14px;
    line-height: 1.7;
    margin-bottom: 12px;
  }

  body.copyright-page.sub-page--pc-responsive .sub-contact {
    margin-top: 24px;
  }

  body.copyright-page.sub-page--pc-responsive .sub-contact .inner.container17 {
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 20px;
    width: 100%;
    padding: 0 20px 24px;
    box-sizing: border-box;
  }

  body.copyright-page.sub-page--pc-responsive .sub-contact p {
    margin: 0;
    font-size: 14px;
    line-height: 1.7;
    text-align: center;
    word-break: keep-all;
  }
}

@container sub-policy (max-width: 451px) {
  /* MO 브릿지 — policy-mobile.css copyright-page 와 동일 */
  body.copyright-page.sub-page--pc-responsive .policy-body {
    padding: 32px 0 40px;
  }

  body.copyright-page.sub-page--pc-responsive .policy-intro {
    margin-bottom: 28px;
    padding: 24px 20px;
  }

  body.copyright-page.sub-page--pc-responsive .copyright-content__lead {
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 20px;
  }

  body.copyright-page.sub-page--pc-responsive .copyright-content__text {
    font-size: 14px;
    margin-bottom: 12px;
  }

  body.copyright-page.sub-page--pc-responsive .sub-contact p {
    font-size: 14px;
  }
}

/* ── directions — 찾아오시는길 ── */
@media (max-width: 768px) {
  body.directions-page.sub-page--pc-responsive {
    --header-mobile-h: clamp(64px, 14vw, 80px);
  }
}

/* ── 히어로 ── */
@container sub-hero (max-width: 1280px) {
  body.directions-page.sub-page--pc-responsive .sub-hero-overlay h1 {
    font-size: var(--sub-hero-title-size, 36px);
  }
}

@container sub-hero (max-width: 768px) {
  body.directions-page.sub-page--pc-responsive .sub-hero-overlay h1 {
    font-size: 22px;
    line-height: 1.3;
  }
}

@container sub-hero (max-width: 451px) {
  body.directions-page.sub-page--pc-responsive .sub-hero-overlay h1 {
    font-size: max(13px, 5vw);
  }
}

/* ── 본문 (1280 · 1024 · 768 · 451) ── */
@container sub-main (max-width: 1280px) {
  body.directions-page.sub-page--pc-responsive .directions-body {
    padding: clamp(32px, 4.6875cqi, 60px) 0 clamp(48px, 7.8125cqi, 100px);
  }

  body.directions-page.sub-page--pc-responsive .sub-table-wrap--traffic.m60 {
    margin-bottom: clamp(40px, 4.6875cqi, 60px);
  }
}

@container sub-main (max-width: 768px) {
  body.directions-page.sub-page--pc-responsive .directions-body {
    padding: 32px 0 40px;
  }

  body.directions-page.sub-page--pc-responsive .sub-table-wrap--traffic.m60 {
    margin-bottom: 40px;
  }

  body.directions-page.sub-page--pc-responsive .sub-contact {
    margin-top: 24px;
  }

  body.directions-page.sub-page--pc-responsive .sub-contact .inner.container17 {
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 20px;
    width: 100%;
    padding: 0 20px 24px;
    box-sizing: border-box;
  }

  body.directions-page.sub-page--pc-responsive .sub-contact p {
    margin: 0;
    font-size: 14px;
    line-height: 1.7;
    text-align: center;
    word-break: keep-all;
  }
}

@container sub-main (max-width: 451px) {
  body.directions-page.sub-page--pc-responsive .directions-body {
    padding: 32px 0 40px;
  }

  body.directions-page.sub-page--pc-responsive .sub-contact p {
    font-size: 14px;
  }
}

/* ── 지도 (1280 · 950 · 768 · 451) — sec1-guide sub-traffic-map 패턴 ── */
@container sub-map (max-width: 1280px) {
  body.directions-page.sub-page--pc-responsive .directions-map {
    margin-bottom: clamp(48px, 5.46875cqi, 60px);
    border-radius: clamp(12px, 1.5625cqi, 20px);
    min-height: clamp(360px, 39.0625cqi, 500px);
  }

  body.directions-page.sub-page--pc-responsive .directions-map__canvas {
    min-height: clamp(320px, 39.0625cqi, 500px);
  }

  body.directions-page.sub-page--pc-responsive .directions-map__info {
    padding: clamp(40px, 4.6875cqi, 60px) clamp(24px, 2.34375cqi, 40px);
    gap: clamp(24px, 2.5cqi, 32px);
    min-width: clamp(240px, 23.4375cqi, 300px);
  }

  body.directions-page.sub-page--pc-responsive .directions-map__deco {
    right: clamp(16px, 4.6875cqi, 18%);
    bottom: clamp(80px, 10.9375cqi, 29%);
    width: clamp(80px, 8.59375cqi, 110px);
    height: clamp(140px, 15cqi, 192px);
  }

  body.directions-page.sub-page--pc-responsive .directions-map__addr dt {
    margin-bottom: clamp(24px, 2.8125cqi, 36px);
    font-size: clamp(18px, 1.875cqi, 24px);
  }

  body.directions-page.sub-page--pc-responsive .directions-map__addr-row {
    margin-bottom: clamp(16px, 1.875cqi, 24px);
    font-size: clamp(14px, 1.25cqi, 16px);
  }

  body.directions-page.sub-page--pc-responsive .directions-map__addr-label,
  body.directions-page.sub-page--pc-responsive .directions-map__addr-row span {
    font-size: clamp(14px, 1.25cqi, 16px);
  }

  body.directions-page.sub-page--pc-responsive .directions-map__addr-label {
    width: clamp(38px, 4.21875cqi, 54px);
  }

  body.directions-page.sub-page--pc-responsive .directions-map .sub-traffic-map__link {
    height: auto;
    font-size: clamp(14px, 1.25cqi, 16px);
    padding: clamp(13px, 1.09375cqi, 14px) clamp(18px, 1.40625cqi, 18px);
  }
}

@media (max-width: 950px) {
  body.directions-page.sub-page--pc-responsive .directions-map {
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
    margin-bottom: 48px;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__canvas {
    flex: 0 0 auto;
    order: 1;
    width: 100%;
    min-width: 0;
    min-height: 320px;
    max-height: none;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__info {
    flex: 0 0 auto;
    order: 2;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    width: 100%;
    max-width: none;
    min-width: 0;
    min-height: 320px;
    padding: 40px 24px;
    gap: 32px;
    border-radius: 0;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__deco {
    right: 24px;
    bottom: 80px;
    width: 120px;
    height: 120px;
  }
}

@media (max-width: 768px) {
  body.directions-page.sub-page--pc-responsive .directions-map {
    margin-bottom: 48px;
    border-radius: 16px;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__canvas {
    min-height: 280px;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__info {
    min-height: 320px;
    padding: 32px 24px;
    gap: 30px;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__deco {
    right: 16px;
    bottom: 88px;
    width: 80px;
    height: 140px;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__addr dt {
    margin-bottom: 24px;
    font-size: 20px;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__addr-row {
    font-size: 14px;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__addr-label,
  body.directions-page.sub-page--pc-responsive .directions-map__addr-row span {
    font-size: 14px;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__addr-label {
    width: 38px;
  }

  body.directions-page.sub-page--pc-responsive .directions-map .sub-traffic-map__link {
    font-size: 14px;
    padding: 13px 30px;
  }
}

@media (max-width: 451px) {
  body.directions-page.sub-page--pc-responsive .directions-map {
    margin-bottom: 6vw;
    border-radius: 12px;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__canvas {
    min-height: 62vw;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__info {
    min-height: 0;
    padding: 8vw 5vw;
    gap: 8vw;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__addr dt {
    font-size: max(13px, 4.6vw);
    margin-bottom: 6vw;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__addr-row {
    font-size: max(13px, 3.6vw);
    margin-bottom: 4vw;
  }

  body.directions-page.sub-page--pc-responsive .directions-map__addr-label,
  body.directions-page.sub-page--pc-responsive .directions-map__addr-row span {
    font-size: max(13px, 3.6vw);
  }

  body.directions-page.sub-page--pc-responsive .directions-map .sub-traffic-map__link {
    font-size: max(13px, 3.6vw);
    padding: 3.3vw 7vw;
  }
}

/* ── 자가용 경로 (1280 · 1024 · 768) ── */
body.directions-page.sub-page--pc-responsive .directions-car__route {
  --directions-car-route-end-gap: clamp(16px, 1.875cqi, 24px);
}

body.directions-page.sub-page--pc-responsive .directions-car__route::before {
  left: calc(var(--directions-car-unit-wide-w) / 2);
  right: auto;
  width: calc(
    100% - var(--directions-car-unit-wide-w) / 2 - var(--directions-car-unit-narrow-w) / 2 -
      var(--directions-car-route-end-gap, 0px)
  );
}

body.directions-page.sub-page--pc-responsive .directions-car__route::after {
  content: "";
  flex: 0 0 var(--directions-car-route-end-gap);
  width: var(--directions-car-route-end-gap);
  min-width: var(--directions-car-route-end-gap);
  align-self: stretch;
  pointer-events: none;
}

@container sub-table (max-width: 1280px) {
  body.directions-page.sub-page--pc-responsive .directions-car {
    gap: clamp(20px, 1.875cqi, 24px);
  }

  body.directions-page.sub-page--pc-responsive .directions-car__title {
    font-size: clamp(16px, 1.40625cqi, 18px);
  }

  body.directions-page.sub-page--pc-responsive .directions-car__card {
    padding: clamp(20px, 2.1875cqi, 28px) clamp(16px, 1.875cqi, 24px) clamp(16px, 1.875cqi, 24px);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-padding-right: clamp(16px, 1.875cqi, 24px);
  }

  body.directions-page.sub-page--pc-responsive .directions-car__card--course {
    overflow-x: auto;
    overflow-y: hidden;
  }

  body.directions-page.sub-page--pc-responsive .directions-car__route {
    --directions-car-unit-wide-w: clamp(80px, 7.1875cqi, 92px);
    --directions-car-unit-narrow-w: clamp(52px, 4.6875cqi, 60px);
    --directions-car-arrow-gap: clamp(32px, 4.375cqi, 56px);
    width: max-content;
    min-width: 100%;
    max-width: none;
    box-sizing: content-box;
  }

  body.directions-page.sub-page--pc-responsive .directions-car__segment--has-hint .directions-car__segment-track {
    gap: clamp(40px, 5.46875cqi, 70px);
  }

  body.directions-page.sub-page--pc-responsive .directions-car__route--arrow-gap-56 .directions-car__segment--has-hint .directions-car__segment-track {
    gap: clamp(32px, 4.375cqi, 56px);
  }

  body.directions-page.sub-page--pc-responsive .directions-car__label {
    font-size: clamp(13px, 1.015625cqi, 13px);
  }

  body.directions-page.sub-page--pc-responsive .directions-car__segment-hint {
    font-size: clamp(13px, 0.9375cqi, 12px);
    white-space: nowrap;
  }
}

@container sub-table (max-width: 1024px) {
  body.directions-page.sub-page--pc-responsive .directions-car__route {
    --directions-car-unit-wide-w: 76px;
    --directions-car-unit-narrow-w: 52px;
    --directions-car-arrow-gap: 28px;
  }

  body.directions-page.sub-page--pc-responsive .directions-car__unit--wide {
    max-width: 88px;
  }

  body.directions-page.sub-page--pc-responsive .directions-car__segment--has-hint .directions-car__segment-track,
  body.directions-page.sub-page--pc-responsive .directions-car__route--arrow-gap-56 .directions-car__segment--has-hint .directions-car__segment-track {
    gap: 36px;
  }
}

@container sub-table (max-width: 768px) {
  body.directions-page.sub-page--pc-responsive .directions-car__card {
    padding-bottom: 16px;
  }

  body.directions-page.sub-page--pc-responsive .directions-car__route {
    min-width: 100%;
  }

  body.directions-page.sub-page--pc-responsive .directions-car__route--arrow-gap-56 {
    min-width: 640px;
  }

  body.directions-page.sub-page--pc-responsive .directions-car__card--course {
    padding-top: 36px;
  }
}

/* ── 대중교통 (1280 · 768) ── */
@container sub-table (max-width: 1280px) {
  body.directions-page.sub-page--pc-responsive .directions-transit {
    gap: clamp(12px, 1.25cqi, 16px);
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__title {
    font-size: clamp(16px, 1.40625cqi, 18px);
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__card {
    padding: clamp(24px, 2.34375cqi, 30px);
    min-height: clamp(140px, 12.5cqi, 160px);
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__item {
    font-size: clamp(14px, 1.171875cqi, 15px);
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__note {
    font-size: clamp(13px, 1.09375cqi, 14px);
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__card--bus::before,
  body.directions-page.sub-page--pc-responsive .directions-transit__card--subway::before {
    width: clamp(88px, 9.609375cqi, 123px);
    height: clamp(88px, 9.609375cqi, 123px);
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__card--subway::before {
    width: clamp(78px, 8.515625cqi, 109px);
  }
}

@container sub-table (max-width: 768px) {
  body.directions-page.sub-page--pc-responsive .directions-transit {
    flex-direction: column;
    gap: 24px;
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__card {
    min-height: 0;
    padding: 24px 20px;
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__card--bus::before,
  body.directions-page.sub-page--pc-responsive .directions-transit__card--subway::before {
    right: 12px;
    width: 72px;
    height: 81px;
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__item {
    font-size: 14px;
    line-height: 1.55;
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__note {
    font-size: 13px;
  }
}

@container sub-table (max-width: 451px) {
  body.directions-page.sub-page--pc-responsive .directions-transit {
    gap: 20px;
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__title {
    font-size: 16px;
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__card {
    padding: 24px 20px;
  }

  body.directions-page.sub-page--pc-responsive .directions-transit__card--bus::before,
  body.directions-page.sub-page--pc-responsive .directions-transit__card--subway::before {
    width: 64px;
    height: 72px;
  }
}
