/* ===================================================================
   legal.css — 規約・ポリシー等の長文ドキュメント用スタイル
   ===================================================================
   読み込み順：grid.css → lp.css → legal.css
   LP と同じトークン (--ink / --accent / --lh 等) を使い、意匠を揃える。
   LP はスプレッド単位のグリッド前提だが、規約は 1 カラムの通読ドキュメントなので
   ここで専用のレイアウトを定義する。
   =================================================================== */

/* 長文の可読性を優先し、1 行の文字数を抑える */
body.legal{ background:var(--paper); }
body.legal .wrap{
  max-width:880px; margin:0 auto; padding:0 var(--margin);
}

/* ---- ヘッダー（ロゴ + パンくず） ---- */
.lg-head{
  border-bottom:1px solid rgba(17,19,21,.12);
  padding:24px 0;
}
.lg-head .wrap{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.lg-head .brand{ display:block; width:180px; }
.lg-head .brand img{ width:100%; height:auto; object-fit:contain; }
.lg-nav{
  font-family:"Inter","Zen Kaku Gothic New",system-ui,sans-serif;
  font-size:12px; line-height:24px; color:var(--ink-soft);
  display:flex; align-items:center; gap:8px;
}
.lg-nav a{ color:var(--ink-soft); text-decoration:none; border-bottom:1px solid rgba(17,19,21,.24); }
.lg-nav a:hover{ color:var(--accent); border-color:var(--accent); }

/* ---- 本文 ---- */
.lg-main{ padding:64px 0 96px; }
.lg-title{
  font-family:"Inter","Zen Kaku Gothic New",system-ui,sans-serif;
  font-weight:800; font-size:32px; line-height:40px; letter-spacing:-0.015em;
  margin:0 0 48px;
}
/* 章見出し。上に余白を大きく取り、条との階層差を明確にする */
.lg-chap{
  font-family:"Inter","Zen Kaku Gothic New",system-ui,sans-serif;
  font-weight:800; font-size:20px; line-height:24px; letter-spacing:-0.01em;
  margin:56px 0 8px; padding-top:24px;
  border-top:2px solid var(--ink);
}
.lg-chap:first-of-type{ margin-top:24px; }
/* 条見出し */
.lg-art{
  font-family:"Inter","Zen Kaku Gothic New",system-ui,sans-serif;
  font-weight:700; font-size:16px; line-height:24px;
  margin:32px 0 8px;
}
/* 条文段落。項番号は原文のまま本文に含まれるため、字下げのみで階層を表す */
.lg-p{
  font-size:14px; line-height:24px; color:var(--ink);
  margin:0 0 8px; text-wrap:pretty;
}
.lg-p.lg-i1{ padding-left:16px; color:var(--ink-soft); }
.lg-p.lg-i2{ padding-left:32px; color:var(--ink-soft); }
/* 本文中のリンク。lp.css の a{color:inherit} リセットのままだと地の文と見分けが
   つかないため、.lg-nav / .lg-back と同じアクセント色 + 下線で明示する。 */
.lg-p a{ color:var(--accent); text-decoration:none; border-bottom:1px solid var(--accent); }
.lg-p a:hover{ opacity:.8; }

/* ---- 制定日・改定日 ---- */
.lg-dates{
  margin-top:56px; padding-top:24px; border-top:1px solid rgba(17,19,21,.12);
}
.lg-meta{
  font-family:"Inter","Zen Kaku Gothic New",system-ui,sans-serif;
  font-size:13px; line-height:24px; color:var(--ink-soft); margin:0;
}

.lg-back{ margin-top:48px; font-size:14px; line-height:24px; }
.lg-back a{ color:var(--accent); text-decoration:none; border-bottom:1px solid var(--accent); }

/* ---- フッター ---- */
.lg-foot{
  background:var(--ink); color:rgba(255,255,255,.72);
  padding:32px 0;
}
.lg-foot .wrap{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px;
  font-size:12px; line-height:24px;
}
.lg-foot a{ color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.4); }

@media (max-width:720px){
  .lg-main{ padding:48px 0 72px; }
  .lg-title{ font-size:24px; line-height:32px; margin-bottom:32px; }
  .lg-head .brand{ width:140px; }
  .lg-foot .wrap{ flex-direction:column; align-items:flex-start; }
}