/* 추가 대표번호만 꾸밉니다. 기존 로고·메뉴·하단 고정 상담은 변경하지 않습니다. */
.extra-representative-phone {
  --extra-phone-color: #26282b;
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  width: fit-content;
  max-width: 100%;
  min-width: 0;
  margin-top: 12px !important;
  color: var(--extra-phone-color) !important;
  font-size: 12px !important;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: -.025em;
  white-space: normal !important;
  text-decoration: none;
}
.extra-representative-phone > span {
  display: block;
  max-width: 100%;
  color: inherit;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.extra-representative-phone > strong {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 6px;
  max-width: 100%;
  min-width: 0;
  color: inherit;
  font-size: var(--extra-phone-size, 24px);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -.025em;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.extra-representative-phone > strong > small {
  display: inline-block;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: -.025em;
  white-space: nowrap;
}
.extra-representative-phone.extra-phone-hero,
.extra-representative-phone.extra-phone-footer,
.extra-representative-phone.extra-phone-consultation {
  --extra-phone-color: #f6f3ed;
}
.extra-representative-phone.extra-phone-hero {
  /* site.css .hero-phone a의 기존 직통번호 크기 */
  --extra-phone-size: clamp(28px, 3.2vw, 40px);
  text-shadow: 0 1px 6px rgb(0 0 0 / 30%);
}
body.home-page .home-photo-hero .extra-representative-phone.extra-phone-hero {
  /* home.css의 최종 직통번호 크기 */
  --extra-phone-size: clamp(30px, 3.1vw, 40px);
}
.extra-representative-phone.extra-phone-panel,
.extra-representative-phone.extra-phone-sidebar {
  --extra-phone-color: #26282b;
}
/* 같은 extra-phone-panel이라도 지역 패널과 오시는 길의 원래 크기는 다릅니다. */
.region-contact-panel .extra-representative-phone.extra-phone-panel {
  --extra-phone-color: #f6f3ed;
  --extra-phone-size: clamp(26px, 2.8vw, 34px);
}
.contact-panel .extra-representative-phone.extra-phone-panel {
  --extra-phone-size: 34px;
}
.extra-representative-phone.extra-phone-sidebar {
  --extra-phone-size: 24px;
}
.direct-phone-label {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}
.direct-phone-label + .sidebar-phone {
  margin-top: 3px;
}
/* 기존 consultation 직통번호의 하단 여백 22px와 합쳐 간격 12px를 유지합니다. */
.extra-representative-phone.extra-phone-consultation {
  --extra-phone-size: 40px;
  margin-top: -10px !important;
  margin-bottom: 22px;
}
body.home-page .extra-representative-phone.extra-phone-consultation {
  --extra-phone-size: 38px;
}
.extra-representative-phone.extra-phone-footer {
  --extra-phone-size: 29px;
}
.extra-representative-phone:hover > strong {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}
.extra-representative-phone:focus-visible {
  outline: 2px solid #bba988;
  outline-offset: 4px;
  border-radius: 2px;
}

/* 기존 header-call의 색·아이콘·테두리를 유지합니다.
   두 링크 모두 설명 위/숫자 아래로, 기존 96·82·76px 헤더 안에 수용합니다. */
.header-contact-options {
  --header-phone-size: 19px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 2px;
  flex: 0 0 auto;
  min-width: 0;
  max-width: 100%;
  max-height: var(--sticky-header-height, 96px);
}
.site-header .header-contact-options > .header-call {
  margin-left: 0;
  padding-block: 0 !important;
}
.site-header .header-contact-options > .header-call > span {
  gap: 0;
  min-width: 0;
}
.site-header .header-contact-options > .header-call small,
.header-contact-options > .extra-representative-phone.extra-phone-header > span {
  font-size: 11px;
  line-height: 1.2;
}
.site-header .header-contact-options > .header-call strong {
  font-size: var(--header-phone-size);
  line-height: 1.35;
}
.header-contact-options > .extra-representative-phone.extra-phone-header {
  --extra-phone-size: var(--header-phone-size);
  --extra-phone-color: #26282b;
  align-items: center;
  align-self: center;
  gap: 0;
  margin-top: 0 !important;
  padding-block: 0 !important;
  font-size: 11px !important;
  line-height: 1.2;
}
.header-contact-options > .extra-representative-phone.extra-phone-header > strong {
  justify-content: center;
  gap: 0 4px;
  line-height: 1.35;
}
.header-contact-options > .extra-representative-phone.extra-phone-header > strong > small {
  font-size: inherit;
  line-height: inherit;
}

/* 상단바도 각 라벨을 번호 위에 두고 두 숫자를 동일한 12px로 표시합니다. */
.topbar-phones {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 0 0 auto;
  min-width: 0;
  white-space: nowrap;
}
.topbar-phones > .topbar-direct-phone {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  min-width: 0;
  padding-block: 0;
  font-size: 12px;
  line-height: 1.2;
}
.topbar-phones > .topbar-direct-phone > span,
.topbar-phones > .extra-representative-phone.extra-phone-topbar > span {
  font-size: 9px;
  line-height: 1.2;
}
.topbar-phones > .topbar-direct-phone > strong {
  font-size: 12px;
  line-height: 1.35;
  font-variant-numeric: tabular-nums;
}
.topbar-phones > .extra-representative-phone.extra-phone-topbar {
  --extra-phone-size: 12px;
  --extra-phone-color: #f6f3ed;
  gap: 0;
  margin-top: 0 !important;
  padding-block: 0 !important;
  font-size: 9px !important;
  line-height: 1.2;
}
.topbar-phones > .extra-representative-phone.extra-phone-topbar > strong {
  gap: 0 4px;
}
.topbar-phones > .extra-representative-phone.extra-phone-topbar > strong > small {
  font-size: inherit;
  line-height: inherit;
}

/* 대표번호만 원래 직통번호의 모든 반응형 수치를 따라갑니다. */
@media (max-width: 1100px) {
  .header-contact-options {
    --header-phone-size: 18px;
  }
  body.home-page .extra-representative-phone.extra-phone-consultation {
    --extra-phone-size: 34px;
  }
}
@media (max-width: 1000px) {
  .header-contact-options {
    margin-left: auto;
  }
  .region-contact-panel .extra-representative-phone.extra-phone-panel {
    --extra-phone-size: 28px;
  }
  .contact-panel .extra-representative-phone.extra-phone-panel {
    --extra-phone-size: 28px;
  }
  .extra-representative-phone.extra-phone-consultation {
    --extra-phone-size: 34px;
  }
}
@media (max-width: 768px) {
  .topbar-phones {
    display: none;
  }
  .header-contact-options {
    gap: 0;
  }
  /* 651~768px에서도 테두리 포함 그룹 높이가 76px를 넘지 않습니다. */
  .site-header .header-contact-options > .header-call strong,
  .header-contact-options > .extra-representative-phone.extra-phone-header > strong {
    line-height: 1.25;
  }
  .extra-representative-phone > span {
    font-size: 11px;
  }
  .extra-representative-phone > strong > small {
    font-size: inherit;
  }
  .extra-representative-phone.extra-phone-hero {
    --extra-phone-size: 34px;
  }
  body.home-page .home-photo-hero .extra-representative-phone.extra-phone-hero {
    --extra-phone-size: 30px;
  }
  .region-contact-panel .extra-representative-phone.extra-phone-panel {
    --extra-phone-size: 34px;
  }
  .contact-panel .extra-representative-phone.extra-phone-panel {
    --extra-phone-size: 32px;
  }
  .extra-representative-phone.extra-phone-consultation {
    --extra-phone-size: 40px;
  }
  body.home-page .extra-representative-phone.extra-phone-consultation {
    --extra-phone-size: 30px;
  }
  body.home-page .extra-representative-phone.extra-phone-footer {
    --extra-phone-size: 28px;
  }
}
@media (max-width: 650px) {
  .header-contact-options {
    display: none;
  }
}
@media (max-width: 480px) {
  .extra-representative-phone.extra-phone-hero {
    --extra-phone-size: 28px;
  }
  body.home-page .home-photo-hero .extra-representative-phone.extra-phone-hero {
    --extra-phone-size: clamp(24px, 7.4vw, 30px);
  }
  .region-contact-panel .extra-representative-phone.extra-phone-panel {
    --extra-phone-size: 28px;
  }
  .contact-panel .extra-representative-phone.extra-phone-panel {
    --extra-phone-size: 28px;
  }
  .extra-representative-phone.extra-phone-consultation {
    --extra-phone-size: 32px;
  }
  body.home-page .extra-representative-phone.extra-phone-consultation {
    --extra-phone-size: clamp(24px, 7.4vw, 30px);
  }
  .extra-representative-phone.extra-phone-footer {
    --extra-phone-size: 27px;
  }
  body.home-page .extra-representative-phone.extra-phone-footer {
    --extra-phone-size: clamp(24px, 7.4vw, 28px);
  }
}