/* yoyang.ayo.pe.kr — 요양원·주간보호 독자 스킨 (2026-09-27 사이트 고유 디자인 규칙).
 *
 * 콘셉트: **햇살 드는 요양원 창가 × 큰 글씨 돌봄 수첩**. 이 사이트를 찾는 사람은 부모님 기관을 알아보는
 * 자녀이거나 어르신 본인이다. 그래서 장식보다 **큰 글씨·넓은 간격·누르기 쉬운 버튼**이 먼저고,
 * 모양은 박공지붕 집·창틀·햇살로 차분하게 낸다.
 * site.css(디자인 A) 위에 덮어쓰고 전부 body.site-yoyang 아래로 가둔다 — 다른 사이트에 새지 않는다.
 *
 *   헤더   : 박공지붕 선 + 네 칸 창틀 표식 · 오른쪽 위 햇살 원
 *   탭     : 큰 알약 버튼(높이 44px 이상)
 *   요약표 : 기관 안내판 — 큰 글씨, 칸마다 여백 넉넉히
 *   질답   : 돌봄 수첩 — 질문마다 "물음" 표찰, 답은 줄 간격 넓게(본문 18px)
 *   목록   : 집 모양 카드(지붕 꼭지 + 세이지 띠) 두 줄
 *   글꼴   : 제목 Noto Serif KR · 본문 Nanum Gothic
 *
 * ⚠️ 광고 유닛(<ins>·.ad-top·.ad-row 안쪽)에는 배경·테두리·라벨을 씌우지 않는다(site.css 애드센스 절).
 * ⚠️ 질문(h2)과 답(p) 사이에 요소를 끼우지 않는다 — 장식은 ::before/::after 로만.
 * ⚠️ 평가등급은 공단 결과 그대로다 — 디자인에서 별점·추천 같은 평가 표식을 만들지 않는다.
 */

body.site-yoyang {
  --fg: #262b25;
  --fg-soft: #454d44;
  --muted: #6f786d;
  --line: #d8dccd;
  --line-soft: #e9ecdf;
  --bg: #fdfbf5;
  --bg-soft: #f2f1e6;
  --accent: #3f6b4b;          /* 세이지 */
  --accent-strong: #2c5137;
  --accent-soft: #e2ecdf;
  --accent-wash: #f3f7ef;
  --accent-line: #b7cdb4;
  --sun: #e59a2c;
  --sun-soft: #fbe9c8;
  --roof: #9b5b3a;
  --radius: 16px;
  --wrap: 900px;
  --head: "Noto Serif KR", "Nanum Myeongjo", serif;
  background: #f7f3e8;
  font-family: "Nanum Gothic", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  font-size: 18px;
  line-height: 1.75;
}
body.site-yoyang a { color: var(--accent); }

body.site-yoyang main,
body.site-yoyang .site-foot,
body.site-yoyang .ad-top,
body.site-yoyang .top-search { max-width: var(--wrap); }

/* ── 헤더: 박공지붕 + 창틀 ─────────────────────────────────────────── */
body.site-yoyang .site-head {
  position: relative;
  max-width: none;
  margin: 0 0 8px;
  padding: 46px max(20px, calc((100% - var(--wrap)) / 2 + 20px)) 18px;
  border: 0;
  background:
    radial-gradient(circle at calc(100% - max(40px, (100% - var(--wrap)) / 2 + 40px)) 30px, rgba(229, 154, 44, .45) 0 22px, rgba(229, 154, 44, .12) 23px 46px, transparent 47px),
    linear-gradient(180deg, #fff7e6 0, #fdfbf5 100%);
  border-bottom: 3px solid var(--accent);
  gap: 14px 24px;
}
/* 지붕 선 — 헤더 위 가운데로 올라가는 박공 */
body.site-yoyang .site-head::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 30px;
  background:
    linear-gradient(to top right, transparent calc(50% - 2px), var(--roof) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) 0 0 / 50% 100% no-repeat,
    linear-gradient(to top left, transparent calc(50% - 2px), var(--roof) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) 100% 0 / 50% 100% no-repeat;
  opacity: .55;
  pointer-events: none;
}
body.site-yoyang .brand {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--head);
  font-weight: 700;
  font-size: 27px;
  letter-spacing: -0.5px;
  line-height: 1.2;
}
/* 네 칸 창틀 */
body.site-yoyang .brand::before {
  content: "";
  flex: none;
  width: 30px; height: 30px;
  border: 3px solid var(--roof);
  border-radius: 4px;
  background:
    linear-gradient(var(--roof), var(--roof)) 50% 0 / 3px 100% no-repeat,
    linear-gradient(var(--roof), var(--roof)) 0 50% / 100% 3px no-repeat,
    linear-gradient(160deg, #fff4d6, #f7d58f);
}
body.site-yoyang .brand a { color: var(--fg); }
body.site-yoyang .brand a:hover { color: var(--accent); text-decoration: none; }

/* 탭: 큰 알약 버튼 */
body.site-yoyang .site-head nav { gap: 8px; }
body.site-yoyang .site-head nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 6px 18px;
  border-radius: 999px;
  border: 2px solid var(--accent-line);
  background: #fff;
  color: var(--accent-strong);
  font-size: 16.5px;
  font-weight: 700;
}
body.site-yoyang .site-head nav a.on,
body.site-yoyang .site-head nav a:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  text-decoration: none;
}

/* 검색창: 큰 입력칸 */
body.site-yoyang .site-search input[type="search"] {
  padding: 14px 18px;
  font-size: 17px;
  border: 2px solid var(--accent-line);
  border-radius: 14px;
  background: #fff;
}
body.site-yoyang .site-search input[type="search"]:focus { outline: 3px solid var(--sun-soft); border-color: var(--accent); }
body.site-yoyang .site-search button {
  padding: 0 24px;
  border-radius: 14px;
  background: var(--accent);
  font-size: 17px;
  font-weight: 800;
}
body.site-yoyang .site-search button:hover { background: var(--accent-strong); }

/* ── 경로·제목 ─────────────────────────────────────────────────────── */
body.site-yoyang .crumb { font-size: 15px; }
body.site-yoyang .crumb a { color: var(--fg-soft); text-decoration: underline; text-decoration-color: var(--accent-line); text-underline-offset: 3px; }
body.site-yoyang .crumb a::after { content: "  ›  "; color: var(--muted); text-decoration: none; display: inline-block; white-space: pre; }
body.site-yoyang .crumb span { color: var(--fg); font-weight: 700; }

body.site-yoyang h1 {
  font-family: var(--head);
  font-weight: 700;
  font-size: 34px;
  line-height: 1.35;
  letter-spacing: -0.6px;
  color: var(--fg);
  margin: 18px 0 20px;
}
body.site-yoyang .lead { color: var(--fg-soft); margin: -4px 0 24px; }
body.site-yoyang .data-date {
  display: inline-flex;
  gap: 6px;
  margin: -6px 0 20px;
  padding: 4px 14px;
  border-radius: 8px;
  background: var(--sun-soft);
  color: #6b4a12;
  font-size: 14.5px;
}

/* ── 요약표: 기관 안내판 ────────────────────────────────────────────── */
body.site-yoyang .summary {
  border: 2px solid var(--accent-line);
  border-radius: 18px;
  background: #fff;
  font-size: 17px;
  box-shadow: 0 6px 0 var(--accent-soft);
}
body.site-yoyang .summary tr:has(> td:empty) { display: none; }
body.site-yoyang .summary tr + tr th,
body.site-yoyang .summary tr + tr td { border-top: 1px solid var(--line-soft); }
body.site-yoyang .summary th {
  width: 130px;
  padding: 16px 16px;
  background: var(--accent-wash);
  color: var(--accent-strong);
  font-weight: 800;
  font-size: 15.5px;
}
body.site-yoyang .summary td { padding: 16px 18px; font-weight: 700; }

body.site-yoyang .btn { border-radius: 12px; }
body.site-yoyang .phone-row .btn-phone { padding: 7px 16px; font-size: 15px; }
body.site-yoyang .btn-phone { border: 2px solid var(--accent); color: var(--accent-strong); background: #fff; font-weight: 800; }
body.site-yoyang .btn-phone:hover { background: var(--accent); color: #fff; }
body.site-yoyang .phone-note { font-size: 14.5px; }

/* ── 질답: 돌봄 수첩 ────────────────────────────────────────────────── */
body.site-yoyang .qa-head {
  font-family: var(--head);
  font-weight: 700;
  font-size: 24px;
  color: var(--fg);
}
body.site-yoyang .qa-head::before {
  content: "";
  width: 26px; height: 20px;
  border-radius: 3px 8px 8px 3px;
  background:
    linear-gradient(90deg, var(--roof) 0 5px, transparent 5px),
    repeating-linear-gradient(180deg, #fff 0 4px, var(--accent-line) 4px 5px);
  border: 2px solid var(--roof);
}
body.site-yoyang .qa-list,
body.site-yoyang section.qa > .qa-item {
  padding: 8px 28px;
  border: 0;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 0 0 2px var(--line-soft), 0 12px 30px -22px rgba(63, 107, 75, .45);
}
body.site-yoyang section.qa > .qa-item + .qa-item { margin-top: 12px; }
body.site-yoyang .qa-item { padding: 22px 0; border-bottom: 2px dotted var(--line); }
body.site-yoyang section.qa > .qa-item { padding: 22px 28px; }
body.site-yoyang .qa-item h2 {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-family: var(--head);
  font-weight: 700;
  font-size: 20.5px;
  line-height: 1.45;
  color: var(--fg);
  margin-bottom: 10px;
}
body.site-yoyang .qa-item h2::before {
  content: "물음";
  flex: none;
  margin-top: 2px;
  padding: 3px 10px;
  border-radius: 8px;
  background: var(--accent);
  color: #fff;
  font-family: "Nanum Gothic", sans-serif;
  font-size: 13.5px;
  font-weight: 800;
  line-height: 1.5;
}
body.site-yoyang .qa-item p {
  padding: 2px 0 2px 16px;
  margin-left: 22px;
  border-left: 4px solid var(--sun-soft);
  color: var(--fg-soft);
  line-height: 1.85;
}

/* ── 지도 ───────────────────────────────────────────────────────────── */
body.site-yoyang .mapsec-head { font-family: var(--head); font-size: 22px; }
body.site-yoyang .map-canvas,
body.site-yoyang .pano-canvas { border: 3px solid #fff; border-radius: 18px; box-shadow: 0 0 0 2px var(--line); }

/* ── 주변: 같은 동네 돌봄 ──────────────────────────────────────────── */
body.site-yoyang .near { border-top: 0; margin-top: 46px; }
body.site-yoyang .near-block {
  padding: 4px 24px 20px;
  border-radius: 20px;
  background: var(--accent-wash);
  border: 2px solid var(--accent-soft);
}
body.site-yoyang .near-block + .near-block { margin-top: 18px; }
body.site-yoyang .near h2 {
  border-left: 0;
  padding-left: 0;
  font-family: var(--head);
  font-weight: 700;
  font-size: 20px;
  color: var(--accent-strong);
}
body.site-yoyang .near > .near-block > p { padding-left: 0; }
body.site-yoyang .near ul { padding-left: 0; display: grid; gap: 8px; }
body.site-yoyang .near li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 10px;
  padding: 12px 16px;
  border-radius: 12px;
  background: #fff;
}
body.site-yoyang .near li a { font-weight: 800; color: var(--fg); font-size: 17px; }
body.site-yoyang .near .more { padding-left: 0; font-size: 16px; }
body.site-yoyang .addr { font-size: 14.5px; }
body.site-yoyang .dist { background: var(--sun-soft); color: #6b4a12; font-size: 13px; }

/* ── 목록: 집 모양 카드 ─────────────────────────────────────────────── */
body.site-yoyang section.list > h2,
body.site-yoyang section.children > h2,
body.site-yoyang section.other-sites > h2 {
  font-family: var(--head);
  font-weight: 700;
  font-size: 22px;
  color: var(--fg);
  border-bottom: 3px solid var(--accent);
  padding-bottom: 10px;
}
body.site-yoyang .place-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 26px 16px;
  padding-top: 14px;
}
body.site-yoyang .place-list li:not(.ad-row) {
  position: relative;
  padding: 16px 18px 16px;
  border: 2px solid var(--line);
  border-top: 6px solid var(--accent);
  border-radius: 4px 4px 16px 16px;
  background: #fff;
  align-content: start;
}
/* 지붕 꼭지 */
body.site-yoyang .place-list li:not(.ad-row)::before {
  content: "";
  position: absolute;
  left: 50%; top: -20px;
  width: 36px; height: 16px;
  margin-left: -18px;
  background: var(--accent);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
body.site-yoyang .place-list li.ad-row { grid-column: 1 / -1; }
body.site-yoyang .place-list li:not(.ad-row):hover { border-color: var(--accent-line); border-top-color: var(--accent-strong); background: var(--accent-wash); }
body.site-yoyang .place-list li > a { color: var(--fg); font-size: 18px; font-weight: 800; }
body.site-yoyang .cat:empty { display: none; }
body.site-yoyang .cat { background: var(--sun-soft); color: #6b4a12; border-radius: 6px; font-size: 13px; }

/* 지역·조건·다른 사이트 링크: 큰 버튼 */
body.site-yoyang .region-links { gap: 10px; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
body.site-yoyang .region-links li {
  min-height: 56px;
  padding: 12px 16px;
  border: 2px solid var(--line);
  border-radius: 14px;
  background: #fff;
  align-items: center;
  flex-wrap: wrap;
  min-width: 0;
}
body.site-yoyang .region-links li:hover { border-color: var(--accent); background: var(--accent-wash); }
body.site-yoyang .region-links li > a { color: var(--fg); font-size: 17px; font-weight: 800; }
body.site-yoyang .count { font-size: 14px; color: var(--accent); font-weight: 700; }

/* 홈 메뉴: 창문 카드 */
body.site-yoyang .menu-cards { gap: 16px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
body.site-yoyang .menu-cards li {
  position: relative;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 22px 22px 22px 88px;
  border: 2px solid var(--line);
  border-radius: 20px;
  background: #fff;
}
body.site-yoyang .menu-cards li::before {
  content: "";
  position: absolute;
  left: 22px; top: 50%;
  width: 46px; height: 46px;
  margin-top: -23px;
  border: 4px solid var(--roof);
  border-radius: 6px;
  background:
    linear-gradient(var(--roof), var(--roof)) 50% 0 / 4px 100% no-repeat,
    linear-gradient(var(--roof), var(--roof)) 0 50% / 100% 4px no-repeat,
    linear-gradient(160deg, #fff4d6, #f7d58f);
}
body.site-yoyang .menu-cards li:hover { border-color: var(--accent); background: var(--accent-wash); }
body.site-yoyang .menu-cards li > a { font-family: var(--head); font-weight: 700; font-size: 22px; color: var(--fg); }

/* ── 출처·삭제요청·푸터 ─────────────────────────────────────────────── */
body.site-yoyang .source h2 { font-family: var(--head); font-weight: 700; font-size: 19px; }
body.site-yoyang .removal {
  border: 2px solid var(--line);
  border-radius: 20px;
  background: #fff;
  box-shadow: none;
}
body.site-yoyang .removal::before { background: var(--sun-soft); opacity: .7; }
body.site-yoyang .removal-icon { background: var(--accent-soft); color: var(--accent-strong); border-radius: 50%; }
body.site-yoyang .removal-title { font-size: 17.5px; }
body.site-yoyang .removal-copy p:not(.removal-title) { font-size: 15.5px; }
body.site-yoyang .btn-removal { background: var(--accent); box-shadow: none; font-size: 16px; padding: 13px 22px; }
body.site-yoyang .btn-removal:hover { background: var(--accent-strong); box-shadow: none; }
body.site-yoyang .site-foot {
  margin-top: 56px;
  padding: 26px 20px 46px;
  border-top: 0;
  border-radius: 24px 24px 0 0;
  background: var(--accent);
  color: #eef4ea;
  font-size: 15.5px;
}
body.site-yoyang .site-foot a { color: #fff3d1; }

/* ── 모바일 ─────────────────────────────────────────────────────────── */
@media (max-width: 600px) {
  body.site-yoyang { font-size: 17px; }
  body.site-yoyang .site-head { padding: 40px 16px 14px; }
  body.site-yoyang .brand { font-size: 23px; }
  body.site-yoyang .site-head nav a { font-size: 15.5px; padding: 6px 14px; min-height: 42px; }
  body.site-yoyang h1 { font-size: 27px; }
  body.site-yoyang .summary th { width: 92px; padding: 13px 10px; font-size: 14.5px; }
  body.site-yoyang .summary td { padding: 13px 12px; }
  body.site-yoyang .qa-list { padding: 4px 16px; }
  body.site-yoyang section.qa > .qa-item { padding: 18px 16px; }
  body.site-yoyang .qa-item h2 { font-size: 18.5px; flex-direction: column; gap: 6px; }
  body.site-yoyang .qa-item p { margin-left: 0; padding-left: 12px; }
  body.site-yoyang .place-list { grid-template-columns: minmax(0, 1fr); }
  body.site-yoyang .region-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.site-yoyang .near-block { padding: 4px 14px 16px; }
  body.site-yoyang .menu-cards li { padding-left: 80px; }
}

/* ── 다크 모드: 저녁 창가(스탠드 불빛) ─────────────────────────────── */
@media (prefers-color-scheme: dark) {
  body.site-yoyang {
    --fg: #eef0e8;
    --fg-soft: #c9cfc3;
    --muted: #9aa393;
    --line: #3a4238;
    --line-soft: #2f362e;
    --bg: #1a1e19;
    --bg-soft: #242a23;
    --accent: #8fc39b;
    --accent-strong: #b3dbbb;
    --accent-soft: #28382b;
    --accent-wash: #1f2a21;
    --accent-line: #3f5a44;
    --sun-soft: #4a3a1c;
    --roof: #c9895f;
    background: #151914;
  }
  body.site-yoyang .site-head {
    background:
      radial-gradient(circle at calc(100% - max(40px, (100% - var(--wrap)) / 2 + 40px)) 30px, rgba(229, 154, 44, .35) 0 22px, rgba(229, 154, 44, .1) 23px 46px, transparent 47px),
      linear-gradient(180deg, #2a2618 0, #1a1e19 100%);
  }
  body.site-yoyang .summary,
  body.site-yoyang .qa-list,
  body.site-yoyang section.qa > .qa-item,
  body.site-yoyang .place-list li:not(.ad-row),
  body.site-yoyang .region-links li,
  body.site-yoyang .menu-cards li,
  body.site-yoyang .near li,
  body.site-yoyang .removal,
  body.site-yoyang .site-head nav a,
  body.site-yoyang .site-search input[type="search"],
  body.site-yoyang .btn-phone { background: #20261f; }
  body.site-yoyang .data-date,
  body.site-yoyang .dist,
  body.site-yoyang .cat { color: #f3d9a4; }
  body.site-yoyang .qa-item h2::before,
  body.site-yoyang .site-head nav a.on,
  body.site-yoyang .site-search button,
  body.site-yoyang .btn-removal,
  body.site-yoyang .btn-phone:hover,
  body.site-yoyang .site-head nav a:hover { color: #142016; }
  body.site-yoyang .site-foot { background: #24352a; }
}
