/* 진료안내 · 오시는 길 (리셉션) — build/reception.mjs. /reservation 에만 붙는다. (2026-10-21 '예약 안내'에서 확장)
   톤은 사이트 그대로: 회갈색 #675b56 · 아이보리 #f5f2f0 · 가는 선 · 각진 버튼. 글꼴은 사이트 기본(영문·숫자 Times New Roman + 한글 나눔바른고딕).
   영문은 보조(작은 세리프 제목), 주요 정보는 한글. 휴대폰에서는 진료시간 → 상담 버튼 → 오시는 길·지도가 위로 오게 장식·여백을 줄인다. */
.rt-rc-wrap { --rc: #675b56; --rc-soft: #a79a95; --rc-cream: #f5f2f0; --rc-ivory: #faf8f6; --rc-line: #e9e4e0; --rc-text: #5f5651; color: var(--rc-text); background: #fff; }
.rt-rc { max-width: 1180px; margin: 0 auto; padding: 84px 24px; }
html[lang="ko"] .rt-rc-wrap { word-break: keep-all; }
.rt-rc-wrap h3, .rt-rc-wrap h4 { color: var(--rc); }

/* 제목 */
.rt-rc-head { margin: 0 0 52px; text-align: center; }
.rt-rc-eyebrow { margin: 0 0 12px; font-size: 13px; letter-spacing: .3em; text-indent: .3em; color: var(--rc-soft); }
.rt-rc-head h2 { margin: 0; font-size: 30px; line-height: 1.35; font-weight: 700; color: var(--rc); }
.rt-rc-head h2::after { content: ""; display: block; width: 28px; height: 1px; margin: 22px auto 0; background: var(--rc); }
.rt-rc-lead { margin: 0; font-size: 16px; line-height: 1.7; }
.rt-rc-en { margin: 0 0 6px; font-family: "Times New Roman", Times, serif; font-style: italic; font-size: 17px; letter-spacing: .02em; color: var(--rc-soft); }
.rt-rc-wrap h3 { margin: 0 0 22px; font-size: 22px; line-height: 1.35; font-weight: 700; }

/* 1) 진료시간 · 상담 — PC 2열 */
.rt-rc-pair { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--rc); border-bottom: 1px solid var(--rc-line); }
.rt-rc-pair > section { padding: 44px 48px 46px; }
.rt-rc-pair > section + section { border-inline-start: 1px solid var(--rc-line); }
.rt-rc-hours dl { margin: 0; }
.rt-rc-hours dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--rc-line); }
.rt-rc-hours dl > div:first-child { padding-top: 4px; }
.rt-rc-hours dt { font-size: 16px; color: var(--rc-text); }
.rt-rc-hours dt em { display: inline-block; margin-inline-start: 6px; padding: 2px 8px; border: 1px solid var(--rc); font-style: normal; font-size: 12px; line-height: 1.4; color: var(--rc); vertical-align: 1px; }
.rt-rc-hours dd { margin: 0; font-size: 18px; color: var(--rc); font-variant-numeric: tabular-nums; white-space: nowrap; }
.rt-rc-hours .is-night dd { font-weight: 700; }
.rt-rc-hours .is-off dd { color: var(--rc-soft); }
.rt-rc-note { margin: 16px 0 0; font-size: 14px; line-height: 1.7; color: #8a807b; }
.rt-rc-book > p { margin: 0 0 22px; font-size: 16px; line-height: 1.75; }
.rt-rc-main { display: grid; gap: 10px; }
.rt-rc-cta { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; padding: 14px 20px; border: 1px solid var(--rc); color: var(--rc) !important; text-decoration: none !important; transition: background-color .2s ease, color .2s ease; }
.rt-rc-cta span { font-size: 16px; font-weight: 700; }
.rt-rc-cta b { font-size: 15px; font-weight: 400; white-space: nowrap; }
.rt-rc-cta.is-tel b { font-size: 18px; letter-spacing: .02em; }
.rt-rc-cta.is-tel { background: var(--rc); color: #fff !important; }
.rt-rc-cta:hover, .rt-rc-cta:focus-visible { background: var(--rc); color: #fff !important; }
.rt-rc-cta.is-tel:hover, .rt-rc-cta.is-tel:focus-visible { background: #574c47; }
.rt-rc-cta:focus-visible { outline: 2px solid var(--rc); outline-offset: 3px; }
.rt-rc-flow { display: flex; flex-wrap: wrap; gap: 6px 26px; margin: 24px 0 0; padding: 0; list-style: none; font-size: 14px; color: #8a807b; }
.rt-rc-flow li { position: relative; }
.rt-rc-flow li + li::before { content: "\2192"; position: absolute; inset-inline-start: -18px; color: #c9bfb9; }
.rt-rc-flow span { margin-inline-end: 5px; font-family: "Times New Roman", Times, serif; color: var(--rc-soft); }

/* 2) 오시는 길 — 아이보리 띠 · 글 왼쪽 / 지도 오른쪽 */
.rt-rc-loc { background: var(--rc-ivory); border-top: 1px solid var(--rc-line); border-bottom: 1px solid var(--rc-line); }
.rt-rc-loc-in { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; align-items: start; }
.rt-rc-addr { margin: 0 0 8px; font-style: normal; font-size: 19px; line-height: 1.6; color: var(--rc); }
.rt-rc-addr span { display: block; }
.rt-rc-jibun { margin: 0 0 14px; font-size: 14px; color: #8a807b; }
.rt-rc-telfax { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0 0 26px; font-size: 16px; color: var(--rc); }
.rt-rc-telfax a { color: inherit; text-decoration: none; }
.rt-rc-telfax a:hover { text-decoration: underline; }
.rt-rc-maps { display: grid; gap: 8px; margin: 0 0 30px; }
.rt-rc-map { display: flex; align-items: center; justify-content: space-between; min-height: 52px; padding: 0 18px; background: #fff; border: 1px solid var(--rc-line); color: var(--rc) !important; text-decoration: none !important; font-size: 15px; transition: border-color .2s ease; }
.rt-rc-map:hover, .rt-rc-map:focus-visible { border-color: var(--rc); }
.rt-rc-map:focus-visible { outline: 2px solid var(--rc); outline-offset: 2px; }
.rt-rc-map span::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-inline-end: 10px; border-radius: 50%; vertical-align: 1px; }
.rt-rc-map.is-naver span::before { background: #03c75a; }
.rt-rc-map.is-kakao span::before { background: #fee500; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); }
.rt-rc-map.is-google span::before { background: #4285f4; }
.rt-rc-park h4 { margin: 0 0 6px; font-size: 16px; font-weight: 700; }
.rt-rc-park p { margin: 0; font-size: 15px; line-height: 1.75; }
.rt-rc-mapbox { position: relative; aspect-ratio: 7 / 5; background: #ece7e3; border: 1px solid var(--rc-line); overflow: hidden; }
.rt-rc-mapbox iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* 3) 공간 사진 — 옆으로 넘기기 */
.rt-rc-sh { margin: 0 0 26px; text-align: center; }
.rt-rc-sh h3 { margin: 0; }
/* 공간 사진 제목: 영문 세리프 (첫 화면 'Make a moment eternal' 과 같은 결) */
.rt-rc-wrap h3.rt-rc-h-en { font-family: "Times New Roman", Times, serif; font-weight: 400; font-size: 30px; letter-spacing: .01em; }
.rt-rc-gal { position: relative; }
.rt-rc-strip { display: flex; gap: 12px; margin: 0; padding: 0 0 6px; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.rt-rc-strip::-webkit-scrollbar { display: none; }
.rt-rc-strip li { flex: 0 0 calc((100% - 36px) / 4); scroll-snap-align: start; }
.rt-rc-strip img { display: block; width: 100%; height: auto; aspect-ratio: 9 / 14; object-fit: cover; background: var(--rc-cream); }
.rt-rc-strip:focus-visible { outline: 2px solid var(--rc); outline-offset: 4px; }
.rt-rc-gbtn { position: absolute; top: 50%; z-index: 1; display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; margin-top: -23px; padding: 0; border: 1px solid var(--rc-line); border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--rc); cursor: pointer; }
.rt-rc-gbtn.is-prev { left: -14px; }
.rt-rc-gbtn.is-prev svg { transform: rotate(180deg); }
.rt-rc-gbtn.is-next { right: -14px; }
.rt-rc-gbtn[disabled] { opacity: 0; pointer-events: none; }
.rt-rc-gbtn:focus-visible { outline: 2px solid var(--rc); outline-offset: 2px; }

/* 4) 온라인 · 해외 상담 — 보조 채널 카드(얇은 선) */
.rt-rc-more-ch { padding-top: 20px; }
.rt-rc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 0; padding: 0; list-style: none; background: var(--rc-line); border: 1px solid var(--rc-line); }
.rt-rc-grid[data-n="2"] { grid-template-columns: repeat(2, 1fr); }
.rt-rc-grid[data-n="1"] { grid-template-columns: 1fr; }
.rt-rc-card { display: flex; flex-direction: column; align-items: center; min-width: 0; padding: 36px 20px 32px; background: #fff; text-align: center; }
.rt-rc-ico { display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; margin: 0 0 16px; border-radius: 50%; background: var(--rc-cream); color: var(--rc); }
.rt-rc-ico svg { width: 26px; height: 26px; }
.rt-rc-card h3 { margin: 0 0 6px; font-size: 17px; line-height: 1.3; }
.rt-rc-card p { margin: 0 0 18px; font-size: 14.5px; line-height: 1.65; color: #8a807b; text-wrap: balance; }
.rt-rc-btn, .rt-rc-soon { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 160px; min-height: 44px; max-width: 100%; margin-top: auto; padding: 8px 16px; border: 1px solid var(--rc); font-size: 13px; line-height: 1.5; font-weight: 700; letter-spacing: .5px; text-align: center; }
a.rt-rc-btn, summary.rt-rc-btn { color: var(--rc); background: transparent; text-decoration: none; cursor: pointer; transition: background-color .2s ease, color .2s ease; }
a.rt-rc-btn:hover, a.rt-rc-btn:focus-visible, summary.rt-rc-btn:hover, .rt-rc-more[open] > summary.rt-rc-btn { background: var(--rc); color: #fff; text-decoration: none; }
a.rt-rc-btn:focus-visible, summary.rt-rc-btn:focus-visible { outline: 2px solid var(--rc); outline-offset: 3px; }
.rt-rc-soon { border: 1px dashed #cfc6c1; color: var(--rc-soft); font-weight: 400; }
.rt-rc-card.is-soon .rt-rc-ico { color: #b9aea9; }
.rt-rc-card.is-soon h3 { color: var(--rc-soft); }
.rt-rc-more { width: 100%; margin-top: auto; }
.rt-rc-more > summary { list-style: none; }
.rt-rc-more > summary::-webkit-details-marker { display: none; }
.rt-rc-wx { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--rc-line); }
.rt-rc-wx b { font-size: 17px; letter-spacing: .03em; color: var(--rc); user-select: all; }
.rt-rc-wx img { display: block; width: 180px; max-width: 100%; height: auto; }
.rt-rc-wx small { font-size: 12px; line-height: 1.6; color: #8a807b; }
/* 언어판: 그 언어에서 많이 쓰는 채널을 앞에 */
html[lang="ja"] .rt-rc-line:not(.is-soon), html[lang="th"] .rt-rc-line:not(.is-soon), html[lang="id"] .rt-rc-line:not(.is-soon), html[lang^="zh"] .rt-rc-wechat:not(.is-soon) { order: -1; }

@media (max-width: 1023px) and (min-width: 768px) {
  .rt-rc-pair > section { padding: 36px 30px; }
  .rt-rc-loc-in { grid-template-columns: 1fr; gap: 32px; }
  .rt-rc-strip li { flex-basis: calc((100% - 24px) / 3); }
}
@media (max-width: 767px) {
  .rt-rc { padding: 44px 16px; }
  .rt-rc-head { margin-bottom: 28px; }
  .rt-rc-eyebrow { font-size: 12px; margin-bottom: 8px; }
  .rt-rc-head h2 { font-size: 24px; }
  .rt-rc-head h2::after { margin: 16px auto 0; }
  .rt-rc-wrap h3.rt-rc-h-en { font-size: 25px; }
  .rt-rc-lead { font-size: 15px; }
  .rt-rc-wrap h3 { font-size: 20px; margin-bottom: 14px; }
  .rt-rc-en { font-size: 15px; margin-bottom: 2px; }
  /* 진료시간 다음에 바로 상담 버튼 */
  .rt-rc-pair { grid-template-columns: 1fr; }
  .rt-rc-pair > section { padding: 26px 0 28px; }
  .rt-rc-pair > section + section { border-inline-start: 0; border-top: 1px solid var(--rc-line); }
  .rt-rc-hours dl > div { padding: 12px 0; }
  .rt-rc-hours dt { font-size: 15.5px; }
  .rt-rc-hours dd { font-size: 17px; }
  .rt-rc-book > p { font-size: 15.5px; margin-bottom: 16px; }
  .rt-rc-cta { min-height: 56px; padding: 12px 16px; }
  .rt-rc-cta span { font-size: 15.5px; }
  .rt-rc-cta b { font-size: 14px; }
  .rt-rc-cta.is-tel b { font-size: 17px; }
  .rt-rc-flow { margin-top: 18px; font-size: 13.5px; }
  /* 오시는 길: 주소 → 지도 → 길찾기 → 주차 */
  .rt-rc-loc-in { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .rt-rc-loc-tx { display: contents; }
  .rt-rc-loc-tx > .rt-rc-en, .rt-rc-loc-tx > h3, .rt-rc-addr, .rt-rc-jibun, .rt-rc-telfax { order: 0; }
  .rt-rc-mapbox { order: 1; aspect-ratio: auto; height: 300px; margin: 0 0 16px; }
  .rt-rc-maps { order: 2; margin-bottom: 26px; }
  .rt-rc-park { order: 3; }
  .rt-rc-addr { font-size: 17px; }
  .rt-rc-telfax { margin-bottom: 18px; font-size: 15.5px; }
  .rt-rc-map { min-height: 50px; }
  /* 공간 사진: 한 장 반 보이게 */
  .rt-rc-strip { gap: 8px; margin: 0 -16px; padding: 0 16px 4px; scroll-padding: 0 16px; }
  .rt-rc-strip li { flex-basis: 64%; }
  .rt-rc-gbtn { display: none; }
  /* 온라인·해외 상담: 한 줄에 하나 · 아이콘 왼쪽 */
  .rt-rc-grid, .rt-rc-grid[data-n="2"] { grid-template-columns: 1fr; }
  .rt-rc-card { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 14px; align-items: center; padding: 18px 16px; text-align: left; }
  .rt-rc-ico { grid-row: 1 / span 2; width: 48px; height: 48px; margin: 0; }
  .rt-rc-ico svg { width: 22px; height: 22px; }
  .rt-rc-card h3 { grid-column: 2; align-self: end; margin: 0 0 2px; font-size: 16px; }
  .rt-rc-card p { grid-column: 2; align-self: start; margin: 0; font-size: 14px; line-height: 1.55; text-wrap: pretty; }
  .rt-rc-btn, .rt-rc-soon, .rt-rc-more { grid-column: 1 / -1; }
  .rt-rc-btn, .rt-rc-soon { width: 100%; min-width: 0; margin-top: 14px; }
  /* 이 페이지에는 상담 채널이 본문에 다 있으므로 떠 있는 상담 버튼을 숨겨 지도·버튼을 가리지 않게 한다 */
  .im-float-stack { display: none !important; }
}
@media (prefers-reduced-motion: reduce) { .rt-rc-cta, .rt-rc-btn, .rt-rc-map { transition: none; } }

/* 언어별 메신저 버튼 (build/langs.mjs MESSENGER): 상담·예약 칸의 전화 다음 · 위챗은 누르면 아래로 QR */
.rt-rc-cta.is-line, .rt-rc-cta.is-wechat { border-color: #06c755; color: #06a347 !important; }
.rt-rc-cta.is-line:hover, .rt-rc-cta.is-line:focus-visible, .rt-rc-cta.is-wechat:hover, .rt-rc-cta.is-wechat:focus-visible,
.rt-rc-cta-wx[open] > .rt-rc-cta.is-wechat { background: #06c755; color: #fff !important; }
.rt-rc-cta-wx > summary { list-style: none; cursor: pointer; }
.rt-rc-cta-wx > summary::-webkit-details-marker { display: none; }
.rt-rc-cta-wx .rt-rc-wx { margin-top: 0; padding: 16px 0 6px; border-top: 0; }