/* 진료시간 및 오시는길 전용 레이어.
   공통 fg2 레이어 위에 얹고, 공통 파일은 건드리지 않는다. */

.fg14 {
  --fg14-mint: #74d5ca;
  --fg14-mint-deep: #5fa79f;
  --fg14-line: #e4eaed;
  --fg14-ink: #0a0a0a;
  --fg14-ink-cell: #353535;
  --fg14-muted: #6b6b6b;
  --fg14-white: #ffffff;
}

/* ── 섹션 바탕 ─────────────────────────── */
.fg14-sec { background: var(--fg14-white); }
.fg14-sec--contact { padding: 170px 0 122px; }
.fg14-sec--hours { padding: 100px 0 293px; }

/* ── 섹션 머리(라벨 + 제목) ─────────────── */
.fg14-head {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.fg14-head__label {
  margin: 0;
  font-size: 12px;
  line-height: 14.32px;
  font-weight: 600;
  letter-spacing: 3px;
  color: var(--fg14-muted);
}
.fg14-head__body {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.fg14-head__title {
  margin: 0;
  font-size: 40px;
  line-height: 52px;
  font-weight: 600 !important;
  letter-spacing: -0.6px;
  color: var(--fg14-ink);
}

/* ── 지도 ──────────────────────────────── */
.fg14-map {
  display: block;
  position: relative;
  overflow: hidden;
  width: 1200px;
  max-width: 100%;
  height: 470px;
  margin: 60px 0 0;
  background: rgba(0, 0, 0, 0.06);
}

/* 지도 타일은 SDK 가 인라인 치수를 준다. 공용 리셋의
   `img{max-width:100%!important;height:auto!important}` 가 그 치수를 이기는데,
   타일을 감싸는 칸이 0×0 이라 max-width:100% 가 0 으로 풀려 타일이 찌그러진다.
   그 칸 안에서만 리셋을 풀어 SDK 값이 그대로 서게 한다. */
.fg14-map img {
  max-width: none !important;
  height: auto;
}

/* 지도 SDK 가 뜨기 전(또는 못 뜰 때) 자리를 채우는 정지 이미지. */
.fg14-map .fg14-map__still {
  display: block;
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  object-position: 50% 50%;
}

.fg14-map.is-live .fg14-map__still { display: none; }

/* ── 주소·주차 정보 블록 ────────────────── */
.fg14-info { margin: 40px 0 0; }
.fg14-info--parking { margin: 28px 0 0; }
.fg14-info__label {
  margin: 0;
  font-size: 14px;
  line-height: 26px;
  font-weight: 400;
  color: var(--fg14-muted);
}
.fg14-info__value {
  margin: 0;
  font-size: 18px;
  line-height: 30px;
  font-weight: 600;
  letter-spacing: -0.255px;
  color: var(--fg14-ink);
}
.fg14-info__desc {
  margin: 0;
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  color: var(--fg14-muted);
}
.fg14-info--address { width: 639px; max-width: 100%; }
.fg14-info--parking { width: 502px; max-width: 100%; }

/* ── 주차 배지 줄 ──────────────────────── */
.fg14-badgerow {
  display: flex;
  width: fit-content;
  max-width: 100%;
  align-items: center;
  gap: 14px;
  margin: 13px 0 0;
}
.fg14-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 16px;
  border-radius: 100px;
  background: var(--fg14-mint);
  font-size: 14px;
  line-height: 16.71px;
  font-weight: 600;
  color: var(--fg14-white);
  white-space: nowrap;
}
.fg14-badgerow__note {
  margin: 0;
  width: 426px;
  max-width: 100%;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  color: var(--fg14-mint-deep);
}

/* ── 진료시간 — 사진 + 표 ───────────────── */
.fg14-hours {
  display: flex;
  align-items: flex-start;
  gap: 28px;
  margin: 60px 0 0;
}
.fg14-hours__photo {
  display: block;
  width: 474px;
  height: 399px;
  flex: 0 0 auto;
  object-fit: cover;
  object-position: 58% 50%;
  background: rgba(0, 0, 0, 0.06);
}
.fg14-table {
  width: 698px;
  flex: 0 0 auto;
  border: 1px solid var(--fg14-line);
  border-radius: 10px;
  overflow: hidden;
}
.fg14-table__row {
  display: flex;
  align-items: stretch;
  height: 57px;
  border-bottom: 1px solid var(--fg14-line);
}
.fg14-table__row--head { height: 56px; border-bottom: 0; }
.fg14-table__row:last-child { height: 56px; border-bottom: 0; }

.fg14-table__cell {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 154px;
  flex: 0 0 auto;
  padding: 14px 10px;
  border-right: 1px solid var(--fg14-line);
  background: var(--fg14-white);
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  color: var(--fg14-ink-cell);
  white-space: nowrap;
}
.fg14-table__cell--day {
  width: 80px;
  background: rgba(116, 213, 202, 0.08);
}
.fg14-table__cell--last { width: auto; flex: 1 1 auto; border-right: 0; }

.fg14-table__row--head .fg14-table__cell {
  background: var(--fg14-mint);
  border-right: 1px solid var(--fg14-white);
  color: var(--fg14-white);
}
.fg14-table__row--head .fg14-table__cell--last { border-right: 0; }

.fg14-table__cell--night {
  background: var(--fg14-mint-deep);
  color: var(--fg14-white);
}

/* 표 아래 운영 안내 — 시안 여백 안에 둔다 */
.fg14-hours__note {
  margin: 20px 0 0 502px;
  font-size: 15px;
  line-height: 26px;
  color: var(--fg14-muted);
}

/* ── 좁은 화면 ──────────────────────────── */
@media (max-width: 1023px) {
  .fg14-sec--contact { padding: 70px 0 56px; }
  .fg14-sec--hours { padding: 56px 0 70px; }
  .fg14-head { gap: 12px; }
  .fg14-head__title { font-size: 26px; line-height: 36px; }
  .fg14-head__label { font-size: 11px; letter-spacing: 2.4px; }

  .fg14-map { height: 260px; margin-top: 28px; }

  .fg14-info { margin-top: 28px; }
  .fg14-info--address,
  .fg14-info--parking { width: 100%; }
  .fg14-info__value { font-size: 17px; }
  .fg14-info__desc { font-size: 15px; line-height: 26px; }

  .fg14-badgerow { flex-direction: column; align-items: flex-start; gap: 10px; }
  .fg14-badgerow__note { width: 100%; font-size: 15px; line-height: 26px; }

  /* 표는 5칸이 한 화면에 안 들어간다 — 가로 스크롤 컨테이너로 감싼다 */
  .fg14-hours { flex-direction: column; gap: 20px; margin-top: 28px; }
  .fg14-hours__photo { width: 100%; height: 240px; }
  .fg14-table__scroll { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .fg14-table__scroll { --fg14-fade: 36px; -webkit-mask-image: linear-gradient(to right, #000 calc(100% - var(--fg14-fade)), transparent); mask-image: linear-gradient(to right, #000 calc(100% - var(--fg14-fade)), transparent); }
  .fg14-table { width: 698px; }
  .fg14-hours__note { margin: 16px 0 0; font-size: 14px; }
}
@property --fg14-fade { syntax: "<length>"; inherits: false; initial-value: 36px; }
@keyframes fg14-fade-out { to { --fg14-fade: 0px; } }
@supports (animation-timeline: scroll()) {
  @media (max-width: 768px) {
    .fg14-table__scroll { animation: fg14-fade-out linear both; animation-timeline: scroll(self inline); }
  }
}