/* =========================================================
   Veliq 共通「教科書」レイヤー vq-book（2026-11-04）
   全サイト共通。vq-ui.css の後に読み込む。色は --site（無ければ --u-accent）だけを使う。
   設計値
   - 本文列 720px、本文 16px、行間 1.85
   - 1180px以上：本文720＋右に「この章の節」240（間48）
   - 1400px以上：左に「教科書の地図（部→章）」240＋本文720＋右240（間48）＝1296px（外枠は左右24pxの余白込みで1344px）
   - 1180px未満：本文の上に「地図」と「この章の節」を折りたたみで置く
   - 進み具合（読んだ章）は localStorage。読めない環境でも表示は崩れない
   ========================================================= */
:root{--vb-c:var(--site,var(--u-accent,#8A6A2A));--vb-ink:var(--ink,#1d1d1f);--vb-ink3:var(--ink-3,#6e6e73);--vb-line:var(--line,rgba(60,60,67,.18));--vb-weak:var(--u-accent-weak,rgba(0,0,0,.04))}
.vb-shell{max-width:1344px;margin:0 auto;padding:0 24px 72px;display:grid;grid-template-columns:minmax(0,720px);justify-content:center;column-gap:48px}
@media(max-width:640px){.vb-shell{padding:0 16px 64px}}
.vb-shell>.vq-ch{grid-column:1;min-width:0}
/* 親の main の幅指定（記事用 688px など）を外す。外枠は .vb-shell が持つ */
.vb-host{max-width:none!important;width:auto!important;padding-left:0!important;padding-right:0!important;margin-left:0!important;margin-right:0!important;display:block!important}
.vb-tree,.vb-otoc{display:none}
@media(min-width:1180px){
  .vb-shell{grid-template-columns:minmax(0,720px) 240px}
  .vb-otoc{display:block;grid-column:2;grid-row:1;position:sticky;top:88px;align-self:start;max-height:calc(100vh - 120px);overflow:auto;padding:16px 0 0 20px;border-left:.5px solid var(--vb-line)}
  .vb-mob{display:none}
}
@media(min-width:1400px){
  .vb-shell{grid-template-columns:240px minmax(0,720px) 240px}
  .vb-tree{display:block;grid-column:1;grid-row:1;position:sticky;top:88px;align-self:start;max-height:calc(100vh - 120px);overflow:auto;padding:16px 20px 0 0;border-right:.5px solid var(--vb-line)}
  .vb-shell>.vq-ch{grid-column:2}
  .vb-otoc{grid-column:3}
}
/* 地図（部→章） */
.vb-h{font-size:12px;font-weight:700;color:var(--vb-ink3);margin:0 0 10px;letter-spacing:.02em}
.vb-part{margin:0 0 14px}
.vb-part>p{font-size:13px;font-weight:700;color:var(--vb-ink);margin:0 0 4px}
.vb-part ol{list-style:none;margin:0;padding:0}
.vb-part li a{display:flex;gap:8px;align-items:baseline;font-size:13px;line-height:1.5;padding:4px 8px;margin:0 -8px;border-radius:8px;color:var(--vb-ink3);text-decoration:none}
.vb-part li a:hover{background:var(--vb-weak);color:var(--vb-ink)}
.vb-part li a[aria-current]{background:var(--vb-weak);color:var(--vb-c);font-weight:700}
.vb-part .n{font-variant-numeric:tabular-nums;min-width:2.2em;flex:none}
.vb-part .ok{margin-left:auto;flex:none;color:var(--vb-c);font-size:12px}
/* この章の節 */
.vb-otoc ol{list-style:none;margin:0;padding:0}
.vb-otoc a{display:block;font-size:13px;line-height:1.55;padding:5px 0;color:var(--vb-ink3);text-decoration:none}
.vb-otoc a:hover,.vb-otoc a.on{color:var(--vb-c)}
.vb-otoc a.on{font-weight:700}
/* 1180px未満の折りたたみ（各サイトの FAQ 用 details の装飾を打ち消す） */
html body .vq-ch .vb-mob details,html body .vq-ch .vb-mob details[open]{border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;margin:0!important;padding:0!important}
html body .vq-ch .vb-mob summary::before,html body .vq-ch .vb-mob summary::after{content:none!important;display:none!important}
html body .vq-ch .vb-mob summary{text-align:left!important;background:none!important;border:0!important;margin:0!important;padding:12px 0!important;font-size:14px!important;font-weight:700!important;color:var(--vb-ink)!important;align-items:center!important}
.vb-mob{margin:0 0 20px;border-top:.5px solid var(--vb-line);border-bottom:.5px solid var(--vb-line)}
.vb-mob details{padding:0}
.vb-mob details+details{border-top:.5px solid var(--vb-line)}
.vb-mob summary{font-size:14px;font-weight:700;padding:12px 0;cursor:pointer;list-style:none;display:flex;justify-content:space-between}
.vb-mob summary::-webkit-details-marker{display:none}
.vb-mob summary::after{content:"＋";color:var(--vb-ink3);font-weight:400}
.vb-mob details[open] summary::after{content:"－"}
html body .vq-ch .vb-mob summary::after{content:"＋"!important;display:inline!important;color:var(--vb-ink3);font-weight:400;position:static!important;transform:none!important}
html body .vq-ch .vb-mob details[open] summary::after{content:"－"!important}
.vb-mob .vb-in{padding:0 0 12px}
/* 章の部品 */
.vq-ch .vb-crumb{font-size:12px;color:var(--vb-ink3);padding:16px 0 0;line-height:1.6}
.vq-ch .vb-crumb a{color:var(--vb-ink3);text-decoration:none}
.vq-ch .vb-learn{border-left:2px solid var(--vb-c);padding:2px 0 2px 14px;margin:0 0 24px}
.vq-ch .vb-learn p{margin:0;font-size:15px;line-height:1.75}
.vq-ch .vb-learn .lh{font-size:12px;font-weight:700;color:var(--vb-c);margin:0 0 2px}
.vq-ch h2{scroll-margin-top:80px}
/* 確認の4択 */
.vb-quiz{margin:44px 0 0;padding-top:16px;border-top:1px solid var(--vb-line)}
.vb-quiz>h2{margin-top:0!important;border-top:0!important;padding-top:0!important}
.vb-q{margin:0 0 22px}
.vb-q>p:first-child{font-weight:700;margin:0 0 8px}
.vb-q button{display:block;width:100%;text-align:left;font:inherit;font-size:15px;line-height:1.6;padding:11px 14px;margin:0 0 8px;border-radius:12px;border:.5px solid var(--vb-line);background:#fff;color:var(--vb-ink);cursor:pointer}
.vb-q button:disabled{cursor:default}
.vb-q button.ok{border-color:var(--vb-c);color:var(--vb-c);font-weight:700}
.vb-q button.ng{color:var(--vb-ink3);text-decoration:line-through}
.vb-q .vb-exp{display:none;font-size:14px;line-height:1.75;color:var(--vb-ink);background:var(--vb-weak);border-radius:12px;padding:12px 14px;margin:4px 0 0}
.vb-q.done .vb-exp{display:block}
/* 出典・前後 */
.vb-src{margin:36px 0 0;font-size:13px;line-height:1.7;color:var(--vb-ink3)}
.vb-src h2{font-size:14px!important;border:0!important;margin:0 0 6px!important;padding:0!important;color:var(--vb-ink)}
.vb-src ol{margin:0;padding:0 0 0 1.3em}
.vb-src a{color:var(--vb-ink3)}
.vb-pn{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:40px 0 0}
.vb-pn a{display:block;border:.5px solid var(--vb-line);border-radius:14px;padding:14px 16px;text-decoration:none;color:var(--vb-ink);min-height:64px}
.vb-pn a small{display:block;font-size:12px;color:var(--vb-ink3);margin:0 0 2px}
.vb-pn a b{font-size:15px;line-height:1.5}
.vb-pn .nx{grid-column:2;text-align:right}
.vb-done{display:block;width:100%;margin:28px 0 0;padding:13px;border-radius:999px;border:0;background:var(--vb-ink);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.vb-done[aria-pressed=true]{background:var(--vb-weak);color:var(--vb-c)}
/* 目次ページ（部→章の地図） */
.vb-map{display:grid;grid-template-columns:1fr;gap:28px;margin:8px 0 0}
@media(min-width:900px){.vb-map{grid-template-columns:1fr 1fr}}
.vb-mpart{border-top:1px solid var(--vb-ink);padding-top:14px}
.vb-mpart .pn{font-size:12px;font-weight:700;color:var(--vb-c);margin:0 0 2px}
.vb-mpart h3{font-size:19px;margin:0 0 4px}
.vb-mpart .pd{font-size:14px;color:var(--vb-ink3);line-height:1.7;margin:0 0 10px}
.vb-mpart ol{list-style:none;margin:0;padding:0}
.vb-mpart li a{display:grid;grid-template-columns:3em 1fr auto;gap:8px;align-items:baseline;padding:10px 0;border-top:.5px solid var(--vb-line);color:var(--vb-ink);text-decoration:none;font-size:15px;line-height:1.55}
.vb-mpart li a .n{color:var(--vb-c);font-weight:700;font-variant-numeric:tabular-nums}
.vb-mpart li a .m{font-size:12px;color:var(--vb-ink3);white-space:nowrap}
.vb-mpart li a .m.ok{color:var(--vb-c);font-weight:700}
.vb-prog{font-size:13px;color:var(--vb-ink3);margin:0 0 4px}
/* 各サイトの共通規則とぶつからないための打ち消し（2026-11-04 追補） */
html body section.vb-mpart{padding:14px 0 0!important;margin:0!important;background:none!important}
html body .vb-tree a,html body .vb-otoc a,html body .vb-mob a,html body .vb-mpart a,html body .vb-pn a{text-decoration:none!important;background-image:none!important}
