@charset "utf-8";

/* ============================================================
   footer.css — 텍스트코딩 푸터 (#ftr)
   메인/서브 전 페이지 공용 (landing.css 는 메인 전용이라 분리했다).
   · 토큰(:root)이 필요하므로 common-style.css 와 함께 로드
   · 좌 50% 카카오맵 / 우 50% 병원정보 — 시안 분할점 x=951 = 정확히 50%
============================================================ */

/* main.css 가 p·div·a 에 font-size:13px / color:#666 / letter-spacing 을 요소 셀렉터로
   전역 지정한다. :where() 로 특정도 0 을 유지해 main.css 와 동타 + 나중 로드로만 이긴다
   (클래스 규칙에는 져야 아래 #ftr 규칙들이 정상 적용된다) */
:where(#ftr) p,
:where(#ftr) div,
:where(#ftr) a,
:where(#ftr) ul,
:where(#ftr) li {
  font-size     : inherit;
  color         : inherit;
  letter-spacing: inherit;
}

#ftr {
  --ftr-pad : 60px;   /* 우측 패널 좌우 여백 (시안 실측 61px) */
  background: #eaeaea;
}
#ftr img { height: auto; }
#ftr .ftr-row { display: flex; align-items: stretch; }


/* ---- 좌: 카카오맵 ---- */
#ftr .ftr-map {
  flex     : 0 0 50%;
  min-width: 0;
  position : relative;
  overflow : hidden;
}

/* ⚠️ 지도 내부(타일·줌 컨트롤)는 CSS 로 늘리지 말 것 —
   `.wrap_map > *` 까지 100% 강제하면 타일 그리드가 깨져 "kakaomap" 플레이스홀더만 뜬다.
   높이는 .wrap_map 한 곳에서만 정하고, 나머지 선택자는 직접 조정용으로 비워 둔다 */
#ftr .ftr-map__inner {
}
#ftr .ftr-map .root_daum_roughmap {
  width: 100%;
}
#ftr .ftr-map .root_daum_roughmap .wrap_map {
  height: 406px !important;   /* + 하단 .cont 바 30px = 436px (시안 총높이) */
}
#ftr .ftr-map .root_daum_roughmap .map_border {
}
.root_daum_roughmap .cont .section.lst {
  display: none;
}


/* ---- 우: 병원 정보 ---- */
/* 패딩 85/63 = 캡처↔시안 픽셀 비교로 맞춘 값 (총높이 436px). 토큰(80/80)이면 460px 로 커진다 */
#ftr .ftr-info {
  flex     : 0 0 50%;
  min-width: 0;
  padding  : 85px var(--ftr-pad) 63px;
}
/* 시안 로고 x=1003 / 텍스트 x=1012 → 9px + 크롭 좌측 여백 2px = -11px */
#ftr .ftr-logo { width: 415px; max-width: 100%; margin-left: -11px; }
#ftr .ftr-logo img { width: 100%; }

#ftr .ftr-list {
  margin-top : 20px;
  line-height: var(--one-lh-r);
  color      : var(--one-txt-color);
}
#ftr .ftr-list b  { font-weight: 700; }
#ftr .ftr-list em { font-style: normal; margin: 0 var(--one-gap-xs); font-weight: 400; }

/* 시안 Copyright 줄만 기본 자간보다 6% 넓다 → letter-spacing 으로 폭 일치 (실측 703px) */
#ftr .ftr-copy {
  font-size     : var(--one-caption);
  line-height   : var(--one-lh-r);
  letter-spacing: 0.02em;
  color         : #7e7e7e;
}

#ftr .ftr-link {
  margin-top : var(--one-gap-r);
  line-height: var(--one-lh-r);
}
#ftr .ftr-link a {
    color: #8f8f8f;
    margin-right: var(--one-gap-lg);
}
#ftr .ftr-link a:hover,
#ftr .ftr-link a:focus { color: var(--main-color); text-decoration: underline; }
/* 비급여수가표 | 증례 바로가기 구분선 */
#ftr .ftr-link em {
  font-style : normal;
  margin     : 0 var(--one-gap-r);
  font-weight: 400;
  color      : #c4c4c4;
}


/* ============================================================
   반응형
============================================================ */
@media all and (max-width: 1024px) {
  /* 세로 스택 — 높이는 .wrap_map 이 정하므로 .ftr-map 에 aspect-ratio 를 주지 않는다 */
  #ftr { --ftr-pad: var(--one-space-s); }
  #ftr .ftr-row { flex-direction: column; }
  #ftr .ftr-map { flex: 0 0 auto; }
  #ftr .ftr-map .root_daum_roughmap .wrap_map { height: 360px !important; }
  #ftr .ftr-info { flex: 0 0 auto; padding: var(--one-space-s) var(--ftr-pad); }
  #ftr .ftr-logo { width: 340px; }
}

@media all and (max-width: 639px) {
  #ftr { --ftr-pad: var(--one-space-safe); }
  #ftr .ftr-map .root_daum_roughmap .wrap_map { height: 260px !important; }
  #ftr .ftr-info { padding: var(--one-space-s) var(--ftr-pad); }
  #ftr .ftr-logo { width: 260px; }
  #ftr .ftr-list { margin-top: var(--one-gap-lg); }
  #ftr .ftr-list li + li { margin-top: var(--one-gap-xs); }
  #ftr .ftr-copy { font-size: var(--one-m-copy); }
}