/* 行政書士 過去問ノート … すべてのページで共通の見た目
   99応用数学A と同じデザイン（明朝・ラベル色・左に色の帯・ライトのみ）に、
   もくじ・行間・○×の目立たせ方などを足したもの */
:root {
  --bg: #fff;
  --fg: #111;
  --muted: #555;
  --rule: #111;
  --thin: #bbb;
  --def: #2e7d4f;  --def-bg: #e4f3e9;
  --thm: #2b5d8a;  --thm-bg: #e2ecf7;
  --prob: #b35c14; --prob-bg: #fcebd9;
  --ex: #6a4c9c;   --ex-bg: #eee8f8;
  --ok: #2e7d4f;   --ok-bg: #e4f3e9;
  --ng: #c0392b;   --ng-bg: #fbe4e1;
  --left: #faf8f2;
  --marker: #fde9a8;
  --sans: "Hiragino Sans", "Noto Sans JP", sans-serif;
  --serif: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
}

/* ---------- 全体 ---------- */
body {
  margin: 0;
  padding: 20px 24px 60px;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--serif);          /* 数字も明朝にそろえる */
  font-size: 16px;
  line-height: 1.85;
  text-align: justify;
}
main { max-width: 1180px; margin: 0 auto; counter-reset: sec; }
h1, h2, th, .label, .sub, .goal, .mark, .back, .toc, .hanrei-link, .link, .ronsho-title, .kou-no {
  font-family: var(--sans);
}
/* 見出しとラベルだけ、かっこ・点のすきまをつめる */
h1, h2, th, .label, .mark { font-feature-settings: "palt"; }
p { margin: 0.25em 0; }

a { color: var(--thm); text-decoration: none; }
a:hover { text-decoration: underline; }

h1 { font-size: 1.45rem; font-weight: 700; text-align: center; margin: 4px 0 2px; letter-spacing: 0.05em; }
.sub { color: var(--muted); margin: 0 0 10px; font-size: 0.85rem; text-align: center; }
.back { font-size: 0.85rem; margin: 0 0 6px; }
h2 {
  counter-increment: sec;
  font-size: 1.15rem; font-weight: 700; color: #1d3f60;
  margin: 36px 0 8px; padding-bottom: 4px;
  border-bottom: 2px solid var(--thm-bg);
  scroll-margin-top: 12px;
}
h2::before { content: counter(sec) "\2003"; color: var(--thm); }

/* ---------- もくじ ---------- */
.toc {
  max-width: 720px; margin: 10px auto 0; padding: 8px 16px;
  background: var(--left); border-radius: 6px;
  font-size: 0.88rem; line-height: 1.7;
}
.toc:empty { display: none; }
.toc b { color: var(--muted); font-size: 0.8rem; }
.toc ol { margin: 2px 0; padding-left: 1.6em; }

/* ---------- 表（左右 2 列） ---------- */
table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  border-top: 1.5px solid var(--rule);
  border-bottom: 1.5px solid var(--rule);
}
th, td { padding: 10px 14px; vertical-align: top; text-align: left; border: none; }
th { font-weight: 700; font-size: 0.9rem; padding-top: 3px; padding-bottom: 3px; border-bottom: 0.8px solid var(--rule); }
tbody tr + tr td { border-top: 0.5px solid var(--thin); }
td + td, th + th { border-left: 0.5px solid var(--thin); }
td:not(.left) { width: 54%; }
td.left { background: var(--left); padding-left: 12px; }
td.left.def  { box-shadow: inset 3px 0 0 var(--def); }
td.left.thm  { box-shadow: inset 3px 0 0 var(--thm); }
td.left.prob { box-shadow: inset 3px 0 0 var(--prob); }
/* 過去問ノート：左の問題の文は、空きがあるので大きめに */
.page-kakomon td.left { font-size: 1.15em; line-height: 1.9; -webkit-text-stroke: 0.3px; }  /* 線をすこし太く */
/* 過去問ノート：「問題／解説」の見出し行は、見ればわかるので出さない */
.page-kakomon thead { display: none; }
.page-kakomon td:not(.left) { width: 50%; }  /* 見出し行を消しても、左右のはばは前と同じ半分ずつ */
/* リンクで飛んできた行を目立たせる */
tr:target td.left { background: #fff6d6; }

/* ---------- ラベル ---------- */
.label {
  display: inline-block;
  font-size: 0.85rem;
  font-weight: 700;
  margin: 0.1em 0 0.15em;
  padding: 0 8px 0 6px;
  border-radius: 999px;
  line-height: 1.6;
}
.label::before { margin-right: 4px; }
.label.def  { color: var(--def);  background: var(--def-bg); }
.label.thm  { color: var(--thm);  background: var(--thm-bg); }
.label.prob { color: var(--prob); background: var(--prob-bg); }
.label.ex   { color: var(--ex);   background: var(--ex-bg); }
.label.def::before  { content: "📘"; }
.label.thm::before  { content: "⚖️"; }
.label.prob::before { content: "✏️"; }
.label.ex::before   { content: "🔍"; }
.page-joubun .label.def::before { content: "📜"; }

/* ---------- 過去問：○ × ---------- */
.mark {
  display: inline-block;
  font-weight: 700; font-size: 0.95rem;
  padding: 0 10px; border-radius: 4px; line-height: 1.7;
  margin-right: 8px;
}
.mark.ok { color: var(--ok); background: var(--ok-bg); }
.mark.ng { color: var(--ng); background: var(--ng-bg); }
/* 過去問ノート：○×は、すぐ目に入らないようにセルの右はしへ（解説の 1 行目はそのまま左から） */
.page-kakomon .mark { float: right; margin: 0 0 0 10px; }
/* 誤りの部分：答えがわかってしまうので、問題の文には印を出さない（span は目印としてのこす） */
.ng-part { text-decoration: none; }
.answer { margin-top: 10px; padding: 6px 12px; background: var(--ng-bg); border-radius: 4px; }
.answer strong { color: var(--ng); }
.hanrei-link { font-size: 0.85rem; font-weight: 700; }

/* ---------- 補足・引用 ---------- */
.goal {
  font-size: 0.9em;
  color: #444;
  border-left: 2px solid var(--thin);
  padding: 0 0 0 8px;
  margin: 0.2em 0 0.4em;
}
blockquote {
  margin: 0.3em 0;
  padding: 2px 10px;
  border-left: 2px solid var(--thm);
  background: var(--thm-bg);
  font-size: 0.95em;
}

/* ---------- 判例ページ ---------- */
.hanshi { font-size: 0.95em; }
.hanshi strong, .joubun strong { font-weight: 700; background: linear-gradient(transparent 62%, var(--marker) 62%); }
.ronsho {
  margin: 0.5em 0;
  padding: 6px 12px;
  border: 0.8px solid var(--thm);
  background: var(--thm-bg);
  border-radius: 4px;
}
.ronsho-title { font-size: 0.8rem; font-weight: 700; color: var(--thm); }
.ronsho p { margin: 0.15em 0; }
ol.flow { margin: 0.2em 0; padding-left: 1.5em; }
ol.flow li { margin: 0.1em 0; }

/* ---------- 条文ページ ---------- */
.kou { margin: 0.2em 0; }
.kou-no { font-weight: 700; font-size: 0.85em; color: var(--def); margin-right: 4px; }
.link { font-size: 0.85rem; font-weight: 700; margin-top: 4px; }

/* ---------- ちら見せ（略）… note.js が右のセルを包む ---------- */
.peek .body { position: relative; }
.peek.clamped .body { overflow: hidden; }
.peek.clamped .body::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0;
  height: 2.5em;
  background: linear-gradient(to bottom, rgba(255,255,255,0), var(--bg));
  pointer-events: none;
}
.peek .more {
  display: none;
  margin-top: 2px; padding: 0;
  border: none; background: none;
  font-family: var(--sans); font-size: 0.85rem; font-weight: 600;
  color: var(--thm);
  cursor: pointer;
}
.peek.long .more { display: inline-block; }
.peek .more:hover, td:has(.peek.clamped):hover .more { text-decoration: underline; }
td:has(.peek.clamped) { cursor: pointer; }

.controls { margin: 16px 0 6px; display: flex; gap: 6px; justify-content: flex-end; }
.controls button {
  font-family: var(--sans); font-size: 0.8rem;
  padding: 1px 8px;
  border: 0.5px solid var(--thin); border-radius: 2px;
  background: none; color: var(--muted);
  cursor: pointer;
}
.controls button:hover { color: var(--fg); border-color: var(--fg); }

/* ---------- 条文ノートのもくじ（joubun.html） ---------- */
.law-list td.left { width: 30%; }
.law-list td:not(.left) { width: 70%; }
.law-list .label a { color: inherit; }
.law-list td p { margin: 0.1em 0; }
.law-list .cat { display: inline-block; min-width: 15em; margin-right: 8px; font-family: var(--sans); font-size: 0.85rem; color: var(--muted); }
.law-list td p { display: grid; grid-template-columns: 15em 1fr; align-items: start; gap: 6px; margin: 0.35em 0; }
.law-list .cat { min-width: 0; margin: 0; padding-top: 2px; }
.law-list .arts { display: flex; flex-wrap: wrap; gap: 6px; }
@media (max-width: 640px) { .law-list td p { grid-template-columns: 1fr; } }
/* 重要度の濃淡（濃いほど よく出る） */
.law-list a.imp1, .law-list a.imp2, .law-list a.imp3, .imp-legend span {
  display: inline-block; min-width: 4.2em; padding: 1px 10px; border-radius: 4px; text-align: center;
  font-family: var(--sans); font-size: 0.85rem; line-height: 1.7; text-decoration: none;
}
.imp3 { background: #1f4f80; color: #fff !important; }
.imp2 { background: #6f97c2; color: #fff !important; }
.imp1 { background: #dbe6f2; color: #1d3f60 !important; }
.law-list a.imp1:hover, .law-list a.imp2:hover, .law-list a.imp3:hover { filter: brightness(1.12); text-decoration: none; }
.imp-legend { font-family: var(--sans); font-size: 0.8rem; color: var(--muted); text-align: right; margin: 8px 0 6px; }
.imp-legend span { margin-left: 6px; min-width: 0; font-size: 0.75rem; }

/* ---------- 一問一答（ichimon.html） ---------- */
.page-ichimon td.left { font-size: 1.1em; -webkit-text-stroke: 0.3px; }
.page-ichimon col.ans { width: 32%; }
.page-ichimon td.kp-title { padding-top: 8px; padding-bottom: 0; }
/* 区切りは知識点のさかいめ（太い黒線）だけ。同じ知識点の中の行には線を引かない */
.page-ichimon tbody tr + tr td { border-top: none; }
.page-ichimon tbody tr.kp td { border-top: 2px solid var(--rule); }
.page-ichimon td { padding-top: 6px; padding-bottom: 6px; }
.page-ichimon td:not(.left) { font-weight: 700; }

/* ---------- 状況図（<figure class="zu"> の SVG） ---------- */
.zu { margin: 0 0 8px; }
.zu svg { display: block; width: 100%; height: auto; max-width: 560px; }
.zu figcaption { font-family: var(--sans); font-size: 0.75rem; color: var(--muted); text-align: right; }
.zu text { font-family: var(--sans); text-anchor: middle; fill: #222; }
.zu .zu-name { font-size: 14px; font-weight: 700; }
.zu .zu-note { font-size: 11.5px; fill: #555; }
.zu .zu-label { font-size: 12.5px; font-weight: 700; }
.zu .zu-red { fill: var(--ng); }
.zu .zu-green { fill: var(--ok); }
.zu .zu-blue { fill: var(--thm); }
.zu .zu-box { fill: #fff; stroke: #333; stroke-width: 1.2; }
.zu .zu-thing { fill: var(--left); stroke: var(--prob); stroke-width: 1.5; }
.zu .zu-other { fill: #f3f3f3; stroke: #aaa; stroke-dasharray: 4 3; }

/* ---------- スマホ ---------- */
@media (max-width: 640px) {
  body { padding: 12px 16px 40px; }
  table, tbody, tr, td { display: block; width: auto; }
  thead { display: none; }
  td.left, td:not(.left) { width: auto; padding: 6px 10px; }
  td + td { border-left: none; border-top: 0.5px dashed var(--thin) !important; }
  tbody tr + tr td.left { border-top: 0.8px solid var(--rule); }
}

/* ---------- 印刷 ---------- */
@media print {
  body { padding: 0; font-size: 10.5pt; line-height: 1.7; }
  main { max-width: none; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .back, .toc { display: none; }
  .controls, .peek .more { display: none !important; }
  .peek .body { max-height: none !important; overflow: visible !important; }
  .peek .body::after { display: none !important; }
  tr { break-inside: avoid; }
  h2 { break-after: avoid; }
}