:root{
  --navy:#0A1F3D; --navy-l:#1B3460; --navy-m:#243d6e;
  --white:#FFFFFF; --red:#8B1A1A; --red-s:#b52b2b;
  --cream:#F5F3EE; --cream-d:#EAE7E0;
  --coal:#3A3A3A; --mid:#6B6B6B; --soft:#9a958d;
  --surface:#FBFAF7; --surface-2:#F1EEE8; --surface-3:#E8E4DC;
  --r-sm:6px; --r-md:12px; --r-lg:20px; --r-pill:999px;
  --sh-1:0 1px 3px rgba(10,31,61,.04), 0 1px 2px rgba(10,31,61,.03);
  --sh-2:0 4px 16px rgba(10,31,61,.07);
  --sh-3:0 8px 30px rgba(10,31,61,.10);
  --rule:rgba(10,31,61,.10); --rule-strong:rgba(10,31,61,.16);
  --hdr:64px; --measure:42rem;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Noto Serif JP','Yu Mincho','游明朝',serif;
  background-color:var(--cream);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.5' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeBlend in='SourceGraphic' mode='multiply'/%3E%3C/filter%3E%3Crect width='600' height='600' filter='url(%23n)' opacity='0.045'/%3E%3C/svg%3E");
  color:var(--coal);line-height:1.95;-webkit-font-smoothing:antialiased;
}
a{color:inherit;}

/* ═══ ヘッダー ═══ */
.site-header{background:var(--navy);position:sticky;top:0;z-index:200;height:var(--hdr);box-shadow:0 1px 0 rgba(139,26,26,.5);}
.hdr-inner{max-width:1200px;margin:0 auto;height:100%;padding:0 24px;display:flex;align-items:center;justify-content:space-between;}
.site-logo{display:block;text-decoration:none;color:var(--cream);}
.logo-title{font-size:1.05rem;font-weight:700;letter-spacing:.02em;}
.logo-en{font-size:.62rem;letter-spacing:.18em;color:#9fb0c8;font-family:'Helvetica Neue',Arial,sans-serif;margin-top:1px;}
.desk-nav{display:flex;gap:22px;align-items:center;}
.desk-nav a{color:#d7dee9;text-decoration:none;font-size:.84rem;letter-spacing:.04em;padding:6px 2px;position:relative;transition:color .2s;}
.desk-nav a:hover{color:var(--white);}
.desk-nav a.active{color:var(--white);}
.desk-nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red-s);}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;}
.hamburger span{display:block;width:24px;height:2px;background:var(--cream);transition:.3s;}

/* ═══ ドロワー ═══ */
.drw-overlay{position:fixed;inset:0;background:rgba(10,31,61,.45);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:.3s;z-index:300;}
.drw-overlay.open{opacity:1;visibility:visible;}
.drawer{position:fixed;top:0;right:-340px;width:330px;max-width:85vw;height:100%;background:var(--navy);z-index:310;transition:right .32s cubic-bezier(.4,0,.2,1);overflow-y:auto;padding:24px 0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E");}
.drawer.open{right:0;}
.drw-sec{padding:8px 22px 18px;}
.drw-label{font-size:.66rem;letter-spacing:.2em;color:#7d8da6;margin:10px 0 8px;text-transform:uppercase;}
.drw-item{display:block;text-decoration:none;color:var(--cream);padding:11px 12px;border-radius:var(--r-sm);position:relative;transition:background .2s;}
.drw-item::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:0;background:var(--red-s);border-radius:2px;transition:height .2s;}
.drw-item:hover{background:rgba(255,255,255,.05);}
.drw-item:hover::before,.drw-item.active::before{height:62%;}
.drw-item strong{display:block;font-size:.92rem;font-weight:600;}
.drw-item span{display:block;font-size:.7rem;color:#9fb0c8;margin-top:2px;font-family:'Helvetica Neue',Arial,sans-serif;}

/* ═══ ヒーロー ═══ */
.m-hero{max-width:1080px;margin:0 auto;padding:54px 24px 30px;position:relative;}
.m-hero-eyebrow{font-family:'Helvetica Neue',Arial,sans-serif;font-size:.7rem;letter-spacing:.24em;color:var(--red);margin-bottom:14px;}
.m-hero-title{font-size:clamp(2rem,1.4rem+2.4vw,3rem);color:var(--navy);font-weight:700;letter-spacing:.04em;line-height:1.25;}
.m-hero-sub{font-size:clamp(1.05rem,.9rem+.6vw,1.3rem);color:var(--red);font-weight:600;letter-spacing:.06em;margin-top:6px;}
.m-hero-lead{margin-top:18px;max-width:var(--measure);color:var(--mid);font-size:.98rem;line-height:1.9;}
.m-hero-jump{margin-top:22px;display:inline-flex;align-items:center;gap:8px;text-decoration:none;background:var(--navy);color:var(--cream);font-size:.85rem;letter-spacing:.04em;padding:11px 22px;border-radius:var(--r-pill);box-shadow:var(--sh-2);transition:transform .2s,background .2s;}
.m-hero-jump:hover{background:var(--navy-l);transform:translateY(-1px);}
.m-hero-jump svg{width:14px;height:14px;}

/* ═══ 共通：セクション枠 ═══ */
.wrap{max-width:1080px;margin:0 auto;padding:0 24px;}
.sec{padding:30px 0;}
.sec-head{display:flex;align-items:baseline;gap:14px;margin-bottom:18px;}
.sec-head .bar{width:4px;align-self:stretch;background:var(--red);border-radius:2px;min-height:1.4em;}
.sec-head h2{font-size:1.4rem;color:var(--navy);font-weight:700;letter-spacing:.04em;}
.sec-head .en{font-family:'Helvetica Neue',Arial,sans-serif;font-size:.66rem;letter-spacing:.2em;color:var(--soft);}

/* ═══ はじめに（読書レイヤー） ═══ */
/* スマホで縦長になるのを防ぐ開閉。PCは常時表示・トグル非表示。JS無効でも全文表示 */
.intro-disc{width:100%;}
.intro-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;list-style:none;
  background:var(--surface);box-shadow:var(--sh-1);border-radius:var(--r-md);padding:16px 20px;color:var(--navy);font-weight:700;font-size:1rem;letter-spacing:.03em;transition:background .2s;}
.intro-summary::-webkit-details-marker{display:none;}
.intro-summary:hover{background:var(--surface-2);}
.intro-summary-act{display:inline-flex;align-items:center;gap:6px;font-family:'Helvetica Neue',Arial,sans-serif;font-size:.76rem;font-weight:600;color:var(--red);letter-spacing:.06em;white-space:nowrap;}
.intro-summary-act svg{width:13px;height:13px;transition:transform .25s;}
.intro-disc[open] .intro-summary-act svg{transform:rotate(180deg);}
.intro-disc:not([open]) .intro-summary-act .lbl::after{content:"開く";}
.intro-disc[open] .intro-summary-act .lbl::after{content:"閉じる";}
.intro-disc > .intro{margin-top:16px;}
@media(min-width:861px){
  .intro-disc > summary{display:none;}
  .intro-disc > .intro{margin-top:0;}
}
.intro{width:100%;}
.intro p,.intro .note,.intro .ack{max-width:var(--measure);}
.intro p{margin:0 0 1.1em;font-size:1.0625rem;line-height:1.95;letter-spacing:.02em;color:var(--coal);}
.intro .note{background:var(--surface-2);border-radius:var(--r-md);padding:18px 22px;margin:0 0 1.4em;font-size:.96rem;line-height:1.85;color:#4a4a4a;}
.intro .note .note-label{display:block;font-size:.7rem;letter-spacing:.18em;color:var(--red);margin-bottom:6px;font-family:'Helvetica Neue',Arial,sans-serif;}
.intro .ack{font-size:.95rem;color:var(--mid);border-top:1px solid var(--rule);padding-top:1.1em;margin-top:1.4em;}

/* ═══ 出典略称 凡例 ═══ */
.legend{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:26px 28px;width:100%;}
.legend-ttl{font-size:1rem;color:var(--navy);font-weight:700;letter-spacing:.04em;margin-bottom:4px;}
.legend-desc{font-size:.84rem;color:var(--mid);margin-bottom:16px;}
.legend-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;}
.legend-grid dl{display:contents;}
.legend-item{display:flex;gap:12px;align-items:baseline;padding:10px 6px;border-bottom:1px solid var(--rule);}
.legend-item dt{flex:0 0 auto;color:var(--red);font-weight:700;font-size:.96rem;min-width:3.4em;}
.legend-item dd{color:var(--coal);font-size:.9rem;line-height:1.6;}

/* ═══ 目次（索引） ═══ */
.toc-intro{max-width:var(--measure);color:var(--mid);font-size:.95rem;margin-bottom:8px;}
.part{margin:0 0 14px;background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--sh-1);overflow:hidden;}
.part-head{display:flex;align-items:center;gap:16px;padding:20px 26px;background:linear-gradient(to right,rgba(10,31,61,.04),transparent);border-bottom:1px solid var(--rule);}
.part-num{flex:0 0 auto;width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:var(--navy);color:var(--cream);border-radius:50%;font-size:1.05rem;font-weight:700;letter-spacing:.02em;}
.part-title{font-size:1.18rem;color:var(--navy);font-weight:700;letter-spacing:.03em;}
.part-body{padding:8px 26px 18px;}
/* 小グループ（1．普遍 等）：番号があるため「・」は付けない。区切りは余白で表現 */
.grp{padding:14px 0 4px;}
.grp-label{display:flex;align-items:center;gap:10px;font-size:.98rem;color:var(--red);font-weight:700;letter-spacing:.04em;margin:6px 0 10px;}
/* リーフ：発言テーマのリンク群（ヘアライン罫で区切る） */
.leaf-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;}
.leaf{display:flex;align-items:center;gap:12px;text-decoration:none;padding:13px 8px;border-bottom:1px solid var(--rule);transition:background .18s;border-radius:var(--r-sm);min-height:48px;}
.leaf:hover{background:var(--surface-2);}
.leaf-num{flex:0 0 auto;width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-family:'Helvetica Neue',Arial,sans-serif;font-size:.78rem;color:var(--navy-m);background:var(--surface-3);border-radius:50%;font-weight:600;transition:background .18s,color .18s,transform .18s;}
.leaf:hover .leaf-num{background:var(--red);color:#fff;transform:translateX(6px);}
.leaf-txt{font-size:1rem;color:var(--coal);letter-spacing:.02em;transition:color .18s,transform .18s;}
.leaf:hover .leaf-txt{color:var(--navy);transform:translateX(6px);}
.leaf-arrow{margin-left:auto;color:var(--soft);transition:transform .18s,color .18s;}
.leaf:hover .leaf-arrow{color:var(--red);transform:translateX(3px);}

/* 直下にグループがない部（Ⅰ・Ⅱ）はpart-body直下にleaf-grid */
.note-renew{max-width:var(--measure);margin:22px auto 0;font-size:.82rem;color:var(--soft);text-align:center;}

/* ═══ フッター ═══ */
footer{background:var(--navy);color:var(--cream);margin-top:40px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");}
.ftr-inner{max-width:1080px;margin:0 auto;padding:40px 24px;display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;}
.ftr-logo{font-size:1.05rem;font-weight:700;display:flex;align-items:center;gap:10px;}
.ftr-logo-mark{width:10px;height:10px;background:var(--red-s);border-radius:2px;display:inline-block;}
.ftr-sub{font-size:.78rem;color:#9fb0c8;margin-top:6px;}
.ftr-copy{font-size:.72rem;color:#7d8da6;margin-top:14px;font-family:'Helvetica Neue',Arial,sans-serif;}
.ftr-links{display:flex;flex-direction:column;gap:9px;}
.ftr-links a{color:#d7dee9;text-decoration:none;font-size:.82rem;transition:color .2s;}
.ftr-links a:hover{color:#fff;}

/* ═══ レスポンシブ ═══ */
@media(max-width:860px){
  .desk-nav{display:none;}
  .hamburger{display:flex;}
  .legend-grid,.leaf-grid{grid-template-columns:1fr;}
  .m-hero{padding:40px 20px 24px;}
}

/* ═══════════════════════════════════════════════════════════
   単一ソースchrome 対応（新パーツ _header/_drawer/_footer 用の追従）
   ── 本CSSは旧chrome（.active／SNS行なし）向けに書かれていたため、
      新パーツが用いるクラスへ最小限で追従させる。丸山固有の意匠は保持。
      各ブロックは独立・可逆（不要なら該当行の削除のみで戻せる）。
   ─────────────────────────────────────────────────────────── */

/* ① 現在地表示：新パーツは .active ではなく aria-current="page" で示す。
      丸山既存の .active と同じ視覚（白文字＋赤下線／赤バー）を与える。
      ※これが無いと移行後、現在地ハイライトが消える（機能・A11Y上の必須対応）。 */
.desk-nav a[aria-current="page"]{color:var(--white);}
.desk-nav a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red-s);}
.drw-item[aria-current="page"]{background:rgba(255,255,255,.05);}
.drw-item[aria-current="page"]::before{height:62%;}

/* ② フッターSNS行：新_footer.html で追加。丸山の紺フッター上で成立する配色で補う。
      未定義だと素のSVGアイコンが窮屈に並ぶため補完（推奨）。 */
.ftr-social{display:flex;gap:10px;margin-top:1.1rem;}
.ftr-social-btn{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.55);background:rgba(255,255,255,.06);transition:color .2s,background .2s,transform .15s;text-decoration:none;}
.ftr-social-btn:hover{color:var(--white);background:rgba(255,255,255,.14);transform:translateY(-2px);}

/* 注) .drw-txt / .drw-item.sp は追加不要と判断。
   ・.drw-txt … 本CSSの子孫セレクタ `.drw-item strong` `.drw-item span` が
     ラッパ越しでもそのまま適用されるため文字装飾は維持される。
   ・.drw-item.sp … 本CSSの ::before は既定で赤(--red-s)。sp用の色差は
     元デザインに無いため付けない（付けても無害）。 */
