/* ===== 보훈 위탁병원 찾기 ===== */
/* 모바일 우선 · 고령자 UX: 큰 글씨, 고대비, 큰 터치 영역 */

:root {
  --c-primary: #0b4da2;
  --c-primary-dark: #083a7c;
  --c-bg: #f6f7f9;
  --c-card: #ffffff;
  --c-text: #111417;
  --c-text-sub: #40474f;
  --c-line: #d4d9e0;
  --c-green: #1a7f37;
  --c-blue: #0b4da2;
  --c-purple: #6f42c1;
  --c-orange: #b54a00;
  --c-red: #b02a37;
  --c-call: #1a7f37;
  --fs-base: 18px;
  --fs-name: 23px;
  --fs-tab: 21px;
}

/* 글자 크게 모드 (JS로 body에 부여) */
body.font-lg {
  --fs-base: 21px;
  --fs-name: 26px;
  --fs-tab: 23px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--c-bg);
  color: var(--c-text);
  font-family: -apple-system, BlinkMacSystemFont, "Malgun Gothic", "맑은 고딕",
    "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
  font-size: var(--fs-base);
  line-height: 1.55;
  -webkit-text-size-adjust: 100%;
  /* 더블탭 확대가 버튼 탭을 삼키지 않도록 (핀치 확대는 그대로 가능) */
  touch-action: manipulation;
}

/* 데스크톱 전용 커스텀 커서: M16 실루엣 (베트남전 참전용사 상징) */
@media (pointer: fine) {
  body {
    cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'><g fill='%23434a3a'><rect x='1' y='1' width='13' height='3.4' rx='1' transform='rotate(45 2 2)'/><rect x='10.2' y='9.2' width='9' height='5' rx='1.2' transform='rotate(45 10.2 9.2)'/><rect x='9.4' y='13.6' width='3' height='7' rx='1' transform='rotate(45 9.4 13.6)'/><rect x='15.5' y='14.5' width='4.6' height='9.5' rx='1.4' transform='rotate(45 15.5 14.5)'/><rect x='19.5' y='18.5' width='11' height='4.6' rx='1.6' transform='rotate(45 19.5 18.5)'/><circle cx='14.6' cy='11.2' r='2.5'/></g></svg>") 2 2, auto;
  }
  a, button, [role="button"], select, input, .map-sido { cursor: pointer; }
  input[type="search"], input[type="text"] { cursor: text; }
}

button {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

a { color: var(--c-primary); }

.wrap {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 12px 40px;
}

/* ===== 헤더 ===== */
header.site-head {
  background: var(--c-primary);
  color: #fff;
  padding: 14px 12px 12px;
}
.site-head .head-inner {
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.site-title {
  font-size: 20px;
  font-weight: 800;
  margin: 0;
  letter-spacing: -0.5px;
  white-space: nowrap;
}
body.font-lg .site-title { font-size: 22px; }
.site-title a { color:#fff; text-decoration: none; }
.brand-year {
  display: inline-block;
  font-size: 0.72em;
  background: #fff;
  color: var(--c-primary-dark);
  padding: 1px 7px 0;
  border-radius: 8px;
  vertical-align: 2px;
}
@media (min-width: 700px) {
  .site-title { font-size: 24px; }
  body.font-lg .site-title { font-size: 26px; }
}

/* 글자 크기 토글 */
.font-toggle {
  display: flex;
  gap: 6px;
}
.font-toggle button {
  min-width: 52px;
  min-height: 44px;
  border: 2px solid #ffffff;
  background: transparent;
  color: #fff;
  border-radius: 10px;
  font-weight: 700;
  font-size: 17px;
}
.font-toggle button[aria-pressed="true"] {
  background: #fff;
  color: var(--c-primary);
}
.font-toggle .btn-big { font-size: 21px; }

/* ===== 상단 큰 탭 ===== */
nav.main-tabs {
  display: flex;
  background: var(--c-primary);
  padding: 0 12px;
}
nav.main-tabs .tabs-inner {
  max-width: 760px;
  margin: 0 auto;
  width: 100%;
  display: flex;
  gap: 8px;
}
.main-tab {
  flex: 1;
  min-height: 58px;
  font-size: var(--fs-tab);
  font-weight: 800;
  border: none;
  border-radius: 14px 14px 0 0;
  background: var(--c-primary-dark);
  color: #dbe6f5;
}
.main-tab[aria-selected="true"] {
  background: var(--c-bg);
  color: var(--c-primary-dark);
}

/* ===== 오늘 날짜 ===== */
.today-line {
  text-align: center;
  font-size: 17px;
  font-weight: 600;
  color: var(--c-text-sub);
  margin: 12px 0 0;
}
body.font-lg .today-line { font-size: 19px; }

/* ===== 안내 문구 ===== */
.intro-line {
  text-align: center;
  font-size: var(--fs-base);
  font-weight: 600;
  color: var(--c-text);
  background: #fff8e6;
  border: 1px solid #f0dfae;
  border-radius: 12px;
  padding: 10px 14px;
  margin: 8px 0 10px;
}

/* ===== 검색 ===== */
.search-box { position: relative; margin: 0 0 10px; }
.search-box input {
  width: 100%;
  min-height: 58px;
  font-size: 20px;
  padding: 8px 52px 8px 16px;
  border: 2px solid var(--c-primary);
  border-radius: 14px;
  background: #fff;
}
body.font-lg .search-box input { font-size: 22px; }
.search-box input:focus { outline: 3px solid #9dbdea; }
.search-box .search-icon {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24px;
  pointer-events: none;
}
.suggest-list {
  position: absolute;
  z-index: 30;
  left: 0; right: 0;
  top: calc(100% + 4px);
  background: #fff;
  border: 2px solid var(--c-primary);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}
.suggest-list button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 13px 16px;
  min-height: 50px;
  border: none;
  border-bottom: 1px solid var(--c-line);
  background: #fff;
  font-size: 19px;
}
.suggest-list button:last-child { border-bottom: none; }
.suggest-list button:hover, .suggest-list button:focus { background: #e8f0fc; }
.suggest-list .sug-type {
  font-size: 15px;
  color: var(--c-text-sub);
  margin-left: 8px;
}

/* ===== 내 주변 병원 버튼 ===== */
.near-btn {
  width: 100%;
  min-height: 56px;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  background: var(--c-green);
  border: none;
  border-radius: 14px;
  margin-top: 12px;
}
.near-btn:active { background: #14602a; }

/* ===== 지도 ===== */
.map-area {
  background: var(--c-card);
  border: 1px solid var(--c-line);
  border-radius: 16px;
  padding: 8px;
  transition: max-height .35s ease;
  overflow: hidden;
}
.map-area svg {
  display: block;
  width: 100%;
  height: auto;
}
.map-sido {
  fill: #cfe0f5;
  stroke: #fff;
  stroke-width: 1.5;
  transition: fill .15s;
}
.map-sido:hover, .map-sido:focus, .map-sido.hl {
  fill: #6ea3e6;
  outline: none;
}
.map-sido.selected { fill: var(--c-primary); }
.map-label {
  cursor: pointer;
  font-weight: 800;
  fill: #14243c;
}
.map-label .cnt { font-weight: 600; fill: #33445e; }

/* 축소 상태(목록 표시 중) */
.map-area.mini { padding: 4px; }
.map-area.mini svg { max-height: 210px; }
.map-area.mini .map-sido { fill: #e3eaf3; }
.map-area.mini .map-sido.selected { fill: var(--c-primary); }
.map-area.mini .map-label { display: none; }

/* ===== 시·군·구 지도 (시·도 선택 후) ===== */
.map-area.submap { padding: 6px; }
.map-area.submap svg {
  display: block;
  width: 100%;
  height: auto;
  max-height: 340px;
  margin: 0 auto;
}
.sub-sgg {
  fill: #cfe0f5;
  stroke: #fff;
  stroke-width: 1.5;
  transition: fill .15s;
}
.sub-sgg:hover, .sub-sgg:focus { fill: #6ea3e6; outline: none; }
.sub-sgg.selected { fill: var(--c-primary); }
.sub-sgg.empty { fill: #e8eaee; }
.sub-label {
  cursor: pointer;
  font-weight: 700;
  fill: #14243c;
}
.sub-label.empty { fill: #8a919a; pointer-events: none; }

/* ===== 시·도 큰 버튼 목록 ===== */
.sido-btns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 12px;
}
.sido-btns button {
  min-height: 58px;
  font-size: 19px;
  font-weight: 700;
  background: #fff;
  border: 2px solid var(--c-primary);
  color: var(--c-primary-dark);
  border-radius: 12px;
  line-height: 1.25;
}
.sido-btns button small {
  display: block;
  font-size: 15px;
  font-weight: 600;
  color: var(--c-text-sub);
}
.sido-btns button:active { background: #e8f0fc; }

/* ===== 목록 화면 ===== */
.list-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 14px 0 10px;
}
.back-btn {
  min-height: 52px;
  padding: 0 18px;
  font-size: 19px;
  font-weight: 700;
  background: #fff;
  color: var(--c-primary-dark);
  border: 2px solid var(--c-primary);
  border-radius: 12px;
}
.list-title {
  font-size: 21px;
  font-weight: 800;
  margin: 0;
}
body.font-lg .list-title { font-size: 23px; }

/* 종별 탭 */
.kind-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 4px 0 8px;
  -webkit-overflow-scrolling: touch;
}
.kind-tabs button {
  flex: 0 0 auto;
  min-height: 54px;
  padding: 0 18px;
  font-size: 19px;
  font-weight: 700;
  border: 2px solid var(--c-primary);
  background: #fff;
  color: var(--c-primary-dark);
  border-radius: 27px;
  white-space: nowrap;
}
.kind-tabs button[aria-selected="true"] {
  background: var(--c-primary);
  color: #fff;
}

/* 시·군·구 / 진료과목 필터 칩 */
.chip-row {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 0 8px;
  -webkit-overflow-scrolling: touch;
}
.chip-row-label {
  font-size: 16px;
  font-weight: 700;
  color: var(--c-text-sub);
  margin: 4px 0 2px;
}
.chip-row button {
  flex: 0 0 auto;
  min-height: 46px;
  padding: 0 16px;
  font-size: 17px;
  font-weight: 600;
  border: 1.5px solid var(--c-line);
  background: #fff;
  color: var(--c-text);
  border-radius: 23px;
  white-space: nowrap;
}
.chip-row button[aria-pressed="true"] {
  background: var(--c-text);
  border-color: var(--c-text);
  color: #fff;
}

/* ===== 병원 카드 ===== */
.cards { display: flex; flex-direction: column; gap: 14px; margin-top: 6px; }
.card {
  background: var(--c-card);
  border: 1px solid var(--c-line);
  border-radius: 16px;
  padding: 16px;
}
.card h3 {
  margin: 0 0 6px;
  font-size: var(--fs-name);
  line-height: 1.3;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.badge {
  display: inline-block;
  font-size: 15px;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 8px;
  color: #fff;
  white-space: nowrap;
}
.badge.b-의원 { background: var(--c-green); }
.badge.b-병원 { background: var(--c-blue); }
.badge.b-종합병원 { background: var(--c-purple); }
.badge.b-요양병원 { background: var(--c-orange); }
.badge.b-상급종합 { background: var(--c-red); }
.card .dist {
  font-size: 17px;
  font-weight: 800;
  color: var(--c-green);
}
.card .depts, .card .addr {
  margin: 4px 0;
  color: var(--c-text-sub);
  font-size: calc(var(--fs-base) - 1px);
  overflow-wrap: anywhere;
}
.card .addr { color: var(--c-text); }
.card .homepage { font-size: calc(var(--fs-base) - 1px); word-break: break-all; }

.card-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 12px;
}
.btn-call {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 60px;
  font-size: 22px;
  font-weight: 800;
  color: #fff !important;
  background: var(--c-call);
  border-radius: 14px;
  text-decoration: none;
}
.btn-call:active { background: #14602a; }
.sub-actions {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
}
.sub-actions a, .sub-actions button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  font-size: 17px;
  font-weight: 700;
  border-radius: 12px;
  text-decoration: none;
  border: 2px solid var(--c-line);
  background: #fff;
  color: var(--c-text);
  white-space: nowrap;
}
.sub-actions .btn-kakao-map { border-color: #f7c600; background: #fee500; color: #191600; }
.sub-actions .btn-naver { border-color: #03c75a; color: #026b32; }
.sub-actions .btn-share { border-color: #b8873b; color: #7a5310; }
/* 더 보기 */
.more-btn {
  width: 100%;
  min-height: 58px;
  margin-top: 14px;
  font-size: 20px;
  font-weight: 800;
  border: 2px solid var(--c-primary);
  background: #fff;
  color: var(--c-primary-dark);
  border-radius: 14px;
}
.more-btn:active { background: #e8f0fc; }
.empty-msg {
  text-align: center;
  padding: 30px 10px;
  color: var(--c-text-sub);
  font-size: 19px;
}

/* ===== 이용 안내 탭 ===== */
.guide-card {
  background: var(--c-card);
  border: 1px solid var(--c-line);
  border-radius: 16px;
  padding: 18px;
  margin: 14px 0;
}
.guide-card h2 {
  margin: 0 0 10px;
  font-size: 22px;
  color: var(--c-primary-dark);
}
body.font-lg .guide-card h2 { font-size: 24px; }
.guide-card p, .guide-card li { font-size: var(--fs-base); }
.guide-card ul { padding-left: 22px; margin: 8px 0; }
.guide-card .stress { font-weight: 800; color: var(--c-red); }
.guide-steps { list-style: none; padding: 0; margin: 0; counter-reset: st; }
.guide-steps li {
  counter-increment: st;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 10px 0;
  border-bottom: 1px dashed var(--c-line);
}
.guide-steps li:last-child { border-bottom: none; }
.guide-steps li::before {
  content: counter(st);
  flex: 0 0 auto;
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--c-primary);
  color: #fff;
  font-weight: 800;
  font-size: 20px;
  display: flex; align-items: center; justify-content: center;
}
.juris-phones { display: grid; grid-template-columns: 1fr; gap: 10px; }
.juris-phones a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 58px;
  padding: 0 18px;
  font-size: 19px;
  font-weight: 700;
  background: var(--c-green);
  color: #fff;
  border-radius: 14px;
  text-decoration: none;
}
.juris-phones a .num { font-size: 21px; }

/* 광고 슬롯 (이용 안내 하단 전용) — 광고가 실제 채워졌을 때만 노출 */
.ad-slot {
  display: none;
  margin: 20px 0 8px;
  border: 2px dashed var(--c-line);
  border-radius: 12px;
  padding: 16px 12px;
  text-align: center;
  color: #8a919a;
  font-size: 15px;
  background: #fbfcfd;
}
.ad-slot:has(ins.adsbygoogle[data-ad-status="filled"]) { display: block; }
.ad-slot::before {
  content: "광고";
  display: inline-block;
  border: 1px solid #b6bcc4;
  border-radius: 6px;
  padding: 1px 8px;
  font-size: 13px;
  margin-bottom: 6px;
}

/* ===== 푸터 ===== */
footer.site-foot {
  margin-top: 30px;
  padding: 20px 12px 34px;
  border-top: 1px solid var(--c-line);
  text-align: center;
  color: var(--c-text-sub);
  font-size: 15px;
}
.visit-counter { font-size: 15px; margin-top: 6px; }
.visit-counter[hidden] { display: none; }
.region-links { margin: 10px 0 4px; line-height: 2; }
.region-links a { margin: 0 5px; font-size: 15px; color: var(--c-text-sub); }
.region-links.seo-pages { margin-top: 2px; font-size: 12px; color: #9aa1a9; line-height: 1.8; }
.region-links.seo-pages a { font-size: 12px; color: #9aa1a9; margin: 0 3px; }

/* ===== 데스크톱 확장 ===== */
@media (min-width: 700px) {
  .sido-btns { grid-template-columns: repeat(6, 1fr); }
  .card-actions { grid-template-columns: 220px 1fr; align-items: stretch; }
  .btn-call { min-height: 56px; }
  .juris-phones { grid-template-columns: 1fr 1fr; }
  .cards { gap: 16px; }
}

/* 접근성: 화면낭독기 전용 텍스트 */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
}

[hidden] { display: none !important; }