/* edu.ayo.pe.kr — 학교·학원 독자 스킨 (2026-09-27, 사이트 고유 디자인 규칙).
 *
 * 콘셉트: **교실 칠판 × 가정통신문 × 시험지**. 학교를 찾는 사람이 가장 익숙한 종이와 벽의 말투로 짠다.
 * site.css(디자인 A) 위에 덮어쓰고 전부 body.site-edu 아래로 가둔다 — 다른 사이트에 새지 않는다.
 *
 *   헤더   : 초록 칠판 + 나무 분필 받침(아래 테) · 상호는 분필 손글씨
 *   탭     : 칠판 위 분필 글씨, 선택 탭은 분필 동그라미
 *   요약표 : 가정통신문(위 이중선 · 항목 칸 세로 괘선)
 *   질답   : 시험지 — 문항 번호(1. 2. …) 에 빨간 채점 동그라미, 답 앞에 "답)" 표기
 *   목록   : 출석부 — 번호 칸이 붙은 줄 목록
 *   지역   : 교실 문패(위 짙은 띠 + 흰 판)
 *   메뉴   : 교과서 표지(왼쪽 책등)
 *   글꼴   : 제목 Gaegu(분필 손글씨) · 본문 Nanum Gothic
 *
 * ⚠️ 광고 유닛(<ins>·.ad-top·.ad-row 안쪽)에는 배경·테두리·라벨을 씌우지 않는다(site.css 애드센스 절).
 * ⚠️ 질문(h2)과 답(p) 사이에 요소를 끼우지 않는다 — 장식은 ::before/::after 로만.
 */

body.site-edu {
  --fg: #1f2622;
  --fg-soft: #3f4a44;
  --muted: #6c7770;
  --line: #d9ddd3;
  --line-soft: #e9ece4;
  --bg: #ffffff;
  --bg-soft: #f4f5ef;
  --accent: #1f6b4a;
  --accent-strong: #154d35;
  --accent-soft: #e2f0e7;
  --accent-wash: #f3f8f2;
  --accent-line: #b9d6c3;
  --board: #24473a;           /* 칠판 */
  --board-dark: #1a3429;
  --chalk: #f4f1e6;
  --wood: #9a6b3c;
  --red-pen: #d23a2f;         /* 채점 빨간펜 */
  --paper: #fbfaf5;
  --radius: 6px;
  --wrap: 860px;
  --hand: "Gaegu", "Nanum Gothic", sans-serif;
  background: var(--paper);
  font-family: "Nanum Gothic", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
}

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

/* ── 헤더: 칠판 ─────────────────────────────────────────────────────────── */
body.site-edu .site-head {
  position: relative;
  max-width: none;
  margin: 0 0 4px;
  padding: 22px max(20px, calc((100% - var(--wrap)) / 2 + 20px)) 30px;
  border-bottom: 0;
  background:
    radial-gradient(ellipse at 20% 30%, rgba(255, 255, 255, .06), transparent 55%),
    radial-gradient(ellipse at 80% 70%, rgba(255, 255, 255, .05), transparent 50%),
    var(--board);
  box-shadow: inset 0 0 0 6px var(--board-dark);
}
/* 분필 받침(나무 턱) + 분필 두 토막 */
body.site-edu .site-head::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 12px;
  background:
    linear-gradient(90deg, transparent calc(50% + 150px), #f4f1e6 calc(50% + 150px) calc(50% + 180px), transparent calc(50% + 180px) calc(50% + 190px), #f3c9c3 calc(50% + 190px) calc(50% + 212px), transparent calc(50% + 212px)) 0 0 / 100% 5px no-repeat,
    linear-gradient(180deg, #b07d4a, var(--wood) 60%, #6f4a26);
}
body.site-edu .brand {
  font-family: var(--hand);
  font-size: 30px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0;
}
body.site-edu .brand a {
  color: var(--chalk);
  text-shadow: 0 0 1px rgba(244, 241, 230, .6), 1px 1px 0 rgba(0, 0, 0, .15);
}
body.site-edu .brand a:hover { color: #fff; text-decoration: none; }
body.site-edu .brand::after {
  /* 칠판 구석 날짜 칸 */
  content: "오늘의 알림";
  display: block;
  margin-top: 2px;
  font-size: 15px;
  font-weight: 400;
  color: rgba(244, 241, 230, .6);
}
body.site-edu .site-head nav { gap: 6px 14px; }
body.site-edu .site-head nav a {
  padding: 4px 12px;
  background: transparent;
  border: 2px solid transparent;
  border-radius: 48% 52% 45% 55% / 60% 45% 55% 40%;
  color: var(--chalk);
  font-family: var(--hand);
  font-size: 21px;
  font-weight: 700;
  line-height: 1.2;
}
body.site-edu .site-head nav a.on {
  border-color: rgba(244, 241, 230, .85);
  color: #fff;
}
body.site-edu .site-head nav a:hover {
  background: rgba(255, 255, 255, .08);
  color: #fff;
  text-decoration: none;
}

/* 검색창: 원고지 입력칸 */
body.site-edu .site-search input[type="search"] {
  border: 1.5px solid var(--board);
  border-radius: 2px;
  background: #fff;
}
body.site-edu .site-search button {
  border-radius: 2px;
  background: var(--board);
  font-family: var(--hand);
  font-size: 20px;
  font-weight: 700;
}
body.site-edu .site-search button:hover { background: var(--board-dark); }

/* ── 경로·제목: 가정통신문 머리 ─────────────────────────────────────────── */
body.site-edu .crumb { font-size: 13px; color: var(--muted); }
body.site-edu .crumb a { color: var(--fg-soft); }
body.site-edu .crumb a::after { content: " / "; color: #b8beb3; }
body.site-edu .crumb span { color: var(--accent); font-weight: 700; }

body.site-edu h1 {
  font-family: var(--hand);
  font-size: 36px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
  color: var(--board-dark);
  margin: 16px 0 18px;
  padding-bottom: 10px;
  border-bottom: 4px double var(--board);
}
body.site-edu .lead { margin: 0 0 22px; color: var(--fg-soft); }
body.site-edu .data-date {
  display: inline-block;
  margin: -4px 0 16px;
  padding: 2px 10px;
  border: 1px solid var(--line);
  border-radius: 2px;
  background: #fff;
  font-size: 12.5px;
}
body.site-edu .data-date::before { content: "발행 "; color: var(--red-pen); font-weight: 800; }

/* ── 요약표: 가정통신문 ────────────────────────────────────────────────── */
body.site-edu .summary {
  border: 0;
  border-top: 3px double var(--board);
  border-bottom: 1.5px solid var(--board);
  border-radius: 0;
  background: #fff;
  font-size: 15px;
}
body.site-edu .summary tr + tr th,
body.site-edu .summary tr + tr td { border-top: 1px solid var(--line); }
body.site-edu .summary th {
  width: 104px;
  background: var(--bg-soft);
  border-right: 1px solid var(--line);
  color: var(--board);
  font-weight: 800;
  text-align: center;
  letter-spacing: 2px;
}
body.site-edu .summary td { color: var(--fg); }
body.site-edu .phone-cell { gap: 6px 10px; }
body.site-edu .btn { border-radius: 2px; }
body.site-edu .btn-phone {
  border: 1.5px solid var(--board);
  color: var(--board);
  background: #fff;
}
body.site-edu .btn-phone:hover { background: var(--accent-soft); color: var(--board-dark); }

/* ── 질답: 시험지 ───────────────────────────────────────────────────────── */
body.site-edu section.qa { counter-reset: edu-q; }
body.site-edu .qa-head {
  font-family: var(--hand);
  font-size: 24px;
  font-weight: 700;
  color: var(--board-dark);
  letter-spacing: 0;
}
body.site-edu .qa-head::before {
  content: "문";
  width: 28px; height: 28px;
  border-radius: 2px;
  background: var(--board);
  color: var(--chalk);
  font-family: var(--hand);
  font-size: 18px;
  font-weight: 700;
}
body.site-edu .qa-list,
body.site-edu section.qa > .qa-item {
  border: 1px solid var(--line);
  border-radius: 0;
  background: #fff;
  box-shadow: 3px 3px 0 var(--line-soft);
}
body.site-edu .qa-list { padding: 4px 26px; }
body.site-edu section.qa > .qa-item { padding: 16px 26px; }
body.site-edu section.qa > .qa-item + .qa-item { border-top: 0; }
body.site-edu .qa-item {
  counter-increment: edu-q;
  padding: 18px 0;
  border-bottom: 1px dashed #cfd4ca;
}
body.site-edu .qa-item h2 {
  position: relative;
  font-size: 17px;
  font-weight: 800;
  color: var(--fg);
  gap: 10px;
}
body.site-edu .qa-item h2::before {
  content: counter(edu-q) ".";
  flex: none;
  min-width: 28px;
  height: 28px;
  margin-top: -2px;
  display: grid;
  place-items: center;
  border: 2px solid var(--red-pen);
  border-radius: 50% 46% 52% 48%;
  color: var(--fg);
  font-family: var(--hand);
  font-size: 19px;
  font-weight: 700;
  transform: rotate(-4deg);
}
body.site-edu .qa-item p {
  padding-left: 38px;
  color: var(--fg-soft);
  line-height: 1.85;
}
body.site-edu .qa-item p::before {
  content: "답) ";
  color: var(--accent);
  font-weight: 800;
}

/* ── 지도 ─────────────────────────────────────────────────────────────── */
body.site-edu .mapsec-head { font-family: var(--hand); font-size: 23px; font-weight: 700; color: var(--board-dark); }
body.site-edu .map-canvas,
body.site-edu .pano-canvas { border: 1.5px solid var(--board); border-radius: 2px; }
body.site-edu .map-pin { background: var(--board); }

/* ── 주변 정보: 알림장 메모 ────────────────────────────────────────────── */
body.site-edu .near { border-top: 4px double var(--board); }
body.site-edu .near h2 {
  border-left: 0;
  padding-left: 0;
  color: var(--board-dark);
  font-size: 17.5px;
}
body.site-edu .near h2::before {
  content: "";
  display: inline-block;
  width: 10px; height: 10px;
  margin-right: 8px;
  background: var(--red-pen);
  transform: rotate(45deg) translateY(-2px);
}
body.site-edu .near-block {
  padding: 2px 18px 14px;
  background: #fff;
  border: 1px solid var(--line);
  border-left: 6px solid var(--board);
}
body.site-edu .near > .near-block > p,
body.site-edu .near ul,
body.site-edu .near .more { padding-left: 0; }
body.site-edu .near li { padding: 7px 0; border-bottom: 1px dotted var(--line); }
body.site-edu .dist { background: #fdecea; color: #a52920; border-radius: 2px; }
body.site-edu .cat { background: var(--accent-soft); color: var(--accent-strong); border-radius: 2px; }

/* hrd 과정 블록과 같은 틀(edu 에는 없지만 안전하게) */
body.site-edu .courses { border-top: 4px double var(--board); }

/* ── 목록: 출석부 ───────────────────────────────────────────────────────── */
body.site-edu section.list > h2,
body.site-edu section.children > h2,
body.site-edu section.other-sites > h2 {
  font-family: var(--hand);
  font-size: 24px;
  font-weight: 700;
  color: var(--board-dark);
  border-bottom: 2px solid var(--board);
}
body.site-edu .place-list {
  counter-reset: edu-n;
  border: 1px solid var(--line);
  border-top: 0;
  background: #fff;
}
body.site-edu .place-list li:not(.ad-row) {
  counter-increment: edu-n;
  position: relative;
  padding: 11px 14px 11px 60px;
  border-bottom: 1px solid var(--line);
}
body.site-edu .place-list li:not(.ad-row)::before {
  content: counter(edu-n);
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 44px;
  display: grid;
  place-items: center;
  border-right: 1.5px solid #e7b1ab;
  background: var(--bg-soft);
  color: var(--muted);
  font-family: var(--hand);
  font-size: 19px;
  font-weight: 700;
}
body.site-edu .place-list li:not(.ad-row):nth-child(even) { background: #fcfdf9; }
body.site-edu .place-list li > a { color: var(--fg); font-weight: 800; }
body.site-edu .place-list li > a:hover { color: var(--accent); }

/* 지역: 교실 문패 */
body.site-edu .region-links { gap: 12px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
body.site-edu .region-links li {
  position: relative;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  padding: 16px 12px 8px;
  border: 1.5px solid #c8cfc2;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 2px 0 #dfe3d8;
}
body.site-edu .region-links li::before {
  content: "";
  position: absolute;
  left: -1.5px; right: -1.5px; top: -1.5px;
  height: 8px;
  border-radius: 3px 3px 0 0;
  background: var(--board);
}
body.site-edu .region-links li:hover { border-color: var(--board); }
body.site-edu .region-links li > a { color: var(--fg); font-weight: 800; font-size: 15.5px; }
body.site-edu .count { color: var(--muted); font-size: 12px; }

/* 메뉴: 교과서 표지 */
body.site-edu .menu-cards { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; }
body.site-edu .menu-cards li {
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 22px 18px 18px 34px;
  border: 1.5px solid #c8cfc2;
  border-radius: 2px 8px 8px 2px;
  background: linear-gradient(90deg, var(--board) 0 16px, #fff 16px);
  box-shadow: 4px 4px 0 #dfe3d8;
}
body.site-edu .menu-cards li:nth-child(2) { background: linear-gradient(90deg, #8a3a2e 0 16px, #fff 16px); }
body.site-edu .menu-cards li:hover { border-color: var(--board); background-color: #fff; }
body.site-edu .menu-cards li > a { font-family: var(--hand); font-size: 28px; font-weight: 700; color: var(--board-dark); line-height: 1.1; }

/* ── 출처·삭제요청·푸터 ─────────────────────────────────────────────────── */
body.site-edu .source h2 { font-size: 16px; color: var(--board-dark); }
body.site-edu .removal {
  border: 1.5px dashed var(--board);
  border-radius: 2px;
  background: #fff;
  box-shadow: none;
}
body.site-edu .removal::before { background: var(--accent-soft); }
body.site-edu .removal-icon { border-radius: 2px; background: var(--board); color: var(--chalk); }
body.site-edu .btn-removal { background: var(--board); box-shadow: none; }
body.site-edu .btn-removal:hover { background: var(--board-dark); }
body.site-edu .site-foot {
  border-top: 0;
  padding-top: 22px;
  background: linear-gradient(180deg, var(--wood) 0 8px, transparent 8px);
  color: var(--muted);
}

/* 안내형 404 */
body.site-edu main.not-found h1::before { content: "결석 "; color: var(--red-pen); }

/* ── 모바일 ─────────────────────────────────────────────────────────────── */
@media (max-width: 600px) {
  body.site-edu .site-head { padding: 18px 16px 26px; }
  body.site-edu .brand { font-size: 26px; }
  body.site-edu .site-head nav a { font-size: 19px; padding: 3px 10px; }
  body.site-edu h1 { font-size: 29px; }
  body.site-edu .summary th { width: 78px; letter-spacing: 0; }
  body.site-edu .qa-list { padding: 2px 14px; }
  body.site-edu section.qa > .qa-item { padding: 14px 14px; }
  body.site-edu .qa-item p { padding-left: 0; }
  body.site-edu .place-list li:not(.ad-row) { padding-left: 52px; }
  body.site-edu .place-list li:not(.ad-row)::before { width: 38px; }
  body.site-edu .region-links { grid-template-columns: 1fr 1fr; }
  body.site-edu .menu-cards { grid-template-columns: 1fr; }
}

/* ── 다크 모드: 불 끈 교실 ─────────────────────────────────────────────── */
@media (prefers-color-scheme: dark) {
  body.site-edu {
    --fg: #e8ece6;
    --fg-soft: #bcc6bf;
    --muted: #8f9a93;
    --line: #34403a;
    --line-soft: #28312c;
    --bg: #161c19;
    --bg-soft: #1d2521;
    --accent: #7fcca4;
    --accent-strong: #a2e0bf;
    --accent-soft: #1f3329;
    --accent-wash: #18221d;
    --accent-line: #325644;
    --red-pen: #ff7a6e;
    --paper: #121714;
  }
  body.site-edu h1,
  body.site-edu .qa-head,
  body.site-edu .mapsec-head,
  body.site-edu .near h2,
  body.site-edu section.list > h2,
  body.site-edu section.children > h2,
  body.site-edu section.other-sites > h2,
  body.site-edu .menu-cards li > a,
  body.site-edu .source h2 { color: #e9f1e9; }
  body.site-edu h1,
  body.site-edu .near { border-color: #4f7a64; }
  body.site-edu .summary,
  body.site-edu .qa-list,
  body.site-edu section.qa > .qa-item,
  body.site-edu .near-block,
  body.site-edu .place-list,
  body.site-edu .region-links li,
  body.site-edu .data-date,
  body.site-edu .removal,
  body.site-edu .btn-phone,
  body.site-edu .site-search input[type="search"] { background-color: #19201c; }
  body.site-edu .summary { border-top-color: #4f7a64; border-bottom-color: #4f7a64; }
  body.site-edu .summary th { color: #a2e0bf; }
  body.site-edu .place-list li:not(.ad-row):nth-child(even) { background: #1b231f; }
  body.site-edu .place-list li:not(.ad-row)::before { border-right-color: #6b3a35; }
  body.site-edu .menu-cards li { background: linear-gradient(90deg, #3c6e56 0 16px, #19201c 16px); box-shadow: 4px 4px 0 #0c100e; }
  body.site-edu .menu-cards li:nth-child(2) { background: linear-gradient(90deg, #8a3a2e 0 16px, #19201c 16px); }
  body.site-edu .region-links li,
  body.site-edu .qa-list,
  body.site-edu section.qa > .qa-item { box-shadow: none; }
  body.site-edu .btn-phone { color: #a2e0bf; border-color: #4f7a64; }
  body.site-edu .dist { background: #3a1e1b; color: #ffb1a8; }
}