@charset "UTF-8";
/* 비급여 진료비용 전용 — 공통은 ../../common/css/common.css · sub.css (감수 박스 = sub.css 17)
   이 페이지만 금액 표기 (진료 페이지는 금액 없이 이 페이지로 연결)
   10-20 : 금액표를 HTML 표 → 이미지로 바꿈. 이미지 · 기준일 · 아래 안내는 관리자 「비급여 진료비용」([hs_fee], inc/fee.php)
           이전 표 버전은 04_서브시안/_보관/08_유틸리티_01_비급여진료비용_표버전_1020 */

/* 기준일 — 이미지 위 가운데 한 줄 */
.fee-date{display:flex;justify-content:center;align-items:center;gap:10px;font-size:16px;font-weight:600;letter-spacing:-.03em}
.fee-date span{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:30px;background:#F3EADA;color:#8A6A28;font-size:12.5px;font-weight:600;letter-spacing:0}

/* 비용표 이미지 1장 — 가운데 · 누르면 원본 새 창 (10-20 : 관리자에서 1장만 올리게 함) */
.fee-imgs{display:grid;gap:24px;max-width:960px;margin:24px auto 0}
.fee-img{margin:0;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff}
.fee-img a{display:block;cursor:zoom-in}
.fee-img img{display:block;width:100%;height:auto}
.fee-zoom{margin-top:14px;font-size:13.5px;color:var(--muted);text-align:center}
/* 시안에서만 : 관리자에서 올릴 이미지 자리 */
.fee-img--sample{display:grid;place-items:center;min-height:560px;padding:24px;border:1px dashed #CFC6B5;background:#FBF8F2;text-align:center}
.fee-img--sample span{font-size:20px;font-weight:600;letter-spacing:-.04em;color:var(--ink)}
.fee-img--sample small{display:block;margin-top:10px;font-size:14px;line-height:1.7;font-weight:400;color:var(--muted)}
/* 이미지를 아직 올리지 않았을 때 (숏코드가 출력) */
.fee-empty{max-width:960px;margin:24px auto 0;padding:56px 24px;border:1px dashed #CFC6B5;border-radius:14px;background:#fff;text-align:center;font-size:16px;line-height:1.8;color:var(--ink-2)}
.fee-empty a{color:var(--ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* 아래 고지 문구 */
.fee-notes{max-width:960px;margin:40px auto 0;padding:24px 28px;border-radius:14px;background:#fff;text-align:left}
.fee-notes li{position:relative;padding-left:14px}
.fee-notes li+li{margin-top:6px}
.fee-notes li::before{content:"";position:absolute;left:0;top:.8em;width:4px;height:4px;border-radius:50%;background:var(--muted)}
.fee-notes a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

@media (max-width:690px){
  .fee-imgs{gap:14px}
  .fee-img{border-radius:10px}
  .fee-img--sample{min-height:360px}
  .fee-img--sample span{font-size:17px}
  .fee-notes{padding:18px 18px;margin-top:32px}
}

/* 보험 적용 구분 (09-23 추가) : 건강보험 · 비급여 · 자동차 · 산재보험 카드 3장 */
.cover-grid .card{display:flex;flex-direction:column}
.cover-grid .card .tags{margin-top:auto;padding-top:18px}
.cover .notice{max-width:960px;margin-inline:auto}

/* 10-20 : 카드 글자는 가운데 (sub.css 20번 공통 규칙에 #cover 추가) */
@media (max-width:999px){
  .cover .notice{text-align:left}
}

/* ===== 엘리멘터 max-width · margin · flex 보정 (tools/sync_theme.py 자동 생성 · 직접 고치지 말 것) ===== */
.elementor.elementor.elementor.elementor .fee-date span{align-items:center}
.elementor.elementor.elementor.elementor .fee-imgs{max-width:960px;margin:24px auto 0}
.elementor.elementor.elementor.elementor .fee-img{margin:0}
.elementor.elementor.elementor.elementor .fee-zoom{margin-top:14px}
.elementor.elementor.elementor.elementor .fee-img--sample small{margin-top:10px}
.elementor.elementor.elementor.elementor .fee-empty{max-width:960px;margin:24px auto 0}
.elementor.elementor.elementor.elementor .fee-notes{max-width:960px;margin:40px auto 0}
.elementor.elementor.elementor.elementor .fee-notes li+li{margin-top:6px}
@media (max-width:690px){.elementor.elementor.elementor.elementor .fee-notes{margin-top:32px}}
.elementor.elementor.elementor.elementor .cover-grid .card{flex-direction:column}
.elementor.elementor.elementor.elementor .cover-grid .card .tags{margin-top:auto}
.elementor.elementor.elementor.elementor .cover .notice{max-width:960px;margin-inline:auto}
