/* ============================================================
   ベースのリセットと配色・タイポグラフィのトークン
   ------------------------------------------------------------
   ヘッダー・フッターはこのファイルに含まれない。
   ============================================================ */

:root{
  --red:#b62434;
  --red-dark:#931b2a;
  --ink:#161719;
  --muted:#63666c;
  --line:#e3e4e7;
  --soft:#f5f6f7;
  --white:#fff;
  --radius:8px;
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
  color:var(--ink);
  font-size:16px;
  line-height:1.7;
  background:#fff;
}
*{box-sizing:border-box}
body{margin:0}
a{color:inherit;text-decoration:none}
a,button{touch-action:manipulation}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--red);outline-offset:5px}

/* 2段目のナビ（ページが増えたら使う。今は出していません） */
.main-nav{border-top:1px solid var(--line)}
.nav-inner{display:flex;justify-content:flex-start;gap:10px;white-space:nowrap;overflow:auto}
.nav-inner a{padding:13px 8px;font-size:.88rem;font-weight:700;position:relative}
.nav-inner a:first-child{padding-left:0}
.nav-inner a:hover{color:var(--red)}
.nav-inner a.active::after{content:"";height:3px;background:var(--red);position:absolute;bottom:0;left:0;right:0}

@media(max-width:700px){
  .nav-inner{gap:14px}
  .nav-inner a{font-size:.8rem;padding:11px 4px}
}
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto !important;transition:none !important;animation:none !important}
}
@media print{
  .main-nav{display:none}
}