/* Itakuu 共通スタイル（本体・直受けガイドが両方 <link> で読む唯一の正） */
/* ここを直すと本体もガイドも同時に変わる。body の font-size/line-height だけは各ページ側（本体15px / ガイド16px）。 */

:root{
  --paper:#F1EFE7; --card:#FBFAF6; --ink:#1B1B19; --ink-2:#595850; --ink-3:#8B897E;
  --rule:#DCD9CF; --rule-2:#C8C4B7; --navy:#20365A; --navy-d:#172741; --navy-soft:#E8EBF1;
  --ochre:#6E5A1E; --ochre-soft:#EFE7CC; --moss:#3E6B4F; --moss-soft:#E2E9DE; --warn:#9C3A2D;
  --jp:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","YuGothic","Noto Sans JP","Meiryo",sans-serif;
  --pixel:"DotGothic16",ui-monospace,monospace;
}
*{box-sizing:border-box;}
html{overflow-y:scroll;}
html,body{margin:0;padding:0;}
body{background:var(--paper);color:var(--ink);font-family:var(--jp);-webkit-font-smoothing:antialiased;}
button{font-family:inherit;cursor:pointer;}
a{color:var(--navy);}
:focus-visible{outline:2px solid var(--navy);outline-offset:2px;}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px;}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* ===== ヘッダー（本体・ガイド共通） ===== */
/* 高さに効く値は全て明示。body の line-height（本体1.7 / ガイド1.9）を継承させない＝ページ間でズレない。
   ボタンは固定高さ＋inline-flex中央揃えで、フォント継承に左右されず常に同じ高さ。 */
.top{background:var(--paper);}
.top-in{display:flex;align-items:center;justify-content:space-between;gap:14px 18px;padding:20px 0 0;flex-wrap:wrap;}
.brand{display:inline-flex;align-items:baseline;gap:9px;cursor:pointer;text-decoration:none;line-height:1;}
.brand h1,.brand .bname{font-family:var(--pixel);font-weight:400;font-size:20px;letter-spacing:.02em;line-height:1;margin:0;color:var(--ink);}
.brand .by{font-family:var(--pixel);font-size:9px;color:var(--ink-3);letter-spacing:.1em;line-height:1;}
.hdr-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
.count{display:inline-flex;align-items:center;height:34px;font-family:var(--pixel);font-size:12px;color:var(--ink-2);letter-spacing:.02em;line-height:1;margin-right:3px;}
.count b{color:var(--navy);font-size:13px;}
.reg-btn{display:inline-flex;align-items:center;height:34px;border:1px solid var(--navy-d);background:var(--navy);color:#fff;font-size:13px;font-weight:700;letter-spacing:.03em;line-height:1;padding:0 15px;white-space:nowrap;text-decoration:none;}
.reg-btn:hover{background:var(--navy-d);}
.reg-btn .free{font-family:var(--pixel);font-size:10px;font-weight:400;opacity:.85;margin-left:7px;}
.hdr-link{display:inline-flex;align-items:center;height:34px;border:1px solid var(--rule-2);background:var(--card);color:var(--ink-2);font-size:13px;letter-spacing:.02em;line-height:1;padding:0 13px;white-space:nowrap;text-decoration:none;}
.hdr-link:hover{border-color:var(--navy);color:var(--navy);}
.hdr-link.act{background:var(--navy-soft);border-color:#cdd8ea;color:var(--navy);}

/* サイト内ナビ（TOP・ガイド）本体・ガイド共通。現在地は .on でハイライト */
.subnav{display:flex;gap:20px;padding:0;margin:0;}
.subnav a{font-size:13px;color:var(--ink-2);text-decoration:none;letter-spacing:.02em;line-height:1;padding:0 0 3px;border-bottom:2px solid transparent;}
.subnav a:hover{color:var(--navy);}
.subnav a.on{color:var(--ink);font-weight:700;border-bottom-color:var(--navy);}
.lede{padding:9px 0 15px;margin:0;color:var(--ink-2);font-size:14px;max-width:720px;line-height:1.7;}
.lede .big{color:var(--ink);font-weight:700;}
.lede .sep{color:var(--rule-2);margin:0 7px;}

/* ===== フッター（本体・ガイド共通） ===== */
footer{border-top:1px solid var(--rule);padding:22px 0 44px;}
footer .fnote{font-size:11.5px;color:var(--ink-3);line-height:1.7;}
footer .flinks{font-size:11.5px;margin-bottom:8px;}
footer .flinks a{color:var(--ink-3);text-decoration:underline;margin-right:14px;}

@media (max-width:680px){
  .wrap{padding:0 20px;}
  .brand h1,.brand .bname{font-size:18px;}
}
