/* ============================================================================
   S3 DriveBridge — 規約・ポリシー系ページの共通スタイル
   tokushoho.html / privacy.html / terms.html から参照する。
   index.html (LP本体) とはトークン体系を揃えてあるが、あちらは単体配信のため
   スタイルを内包している。
   ========================================================================== */

:root {
  --ground:#F2F5F7; --surface:#FFFFFF; --surface-alt:#E9EEF1;
  --ink:#0B141C; --ink-soft:#3D4C58; --ink-mute:#63747F;
  --line:#D6DFE4; --line-soft:#E4EAEE;
  --accent:#0C6F7B; --accent-edge:#17A3B0; --accent-lite:#E0F1F3;
  --sans:"Yu Gothic UI","Yu Gothic",YuGothic,"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",Meiryo,system-ui,sans-serif;
  --mono:ui-monospace,"SF Mono","Cascadia Mono",Consolas,"BIZ UDGothic",monospace;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground:#080F15; --surface:#101B23; --surface-alt:#16242E;
    --ink:#E6EFF3; --ink-soft:#B0C2CC; --ink-mute:#7E939F;
    --line:#24363F; --line-soft:#1B2A33;
    --accent:#2FBECB; --accent-edge:#2FBECB; --accent-lite:#10333A;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --ground:#080F15; --surface:#101B23; --surface-alt:#16242E;
  --ink:#E6EFF3; --ink-soft:#B0C2CC; --ink-mute:#7E939F;
  --line:#24363F; --line-soft:#1B2A33;
  --accent:#2FBECB; --accent-edge:#2FBECB; --accent-lite:#10333A;
  color-scheme: dark;
}

*,*::before,*::after { box-sizing: border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }

body {
  margin:0; background:var(--ground); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.95;
  font-feature-settings:"palt" 1; line-break:strict;
  overflow-wrap:break-word; -webkit-font-smoothing:antialiased;
}

h1,h2,h3 { margin:0; line-height:1.5; font-weight:700; text-wrap:balance; }
p,ul,ol,dl { margin:0; }
a { color:var(--accent); text-underline-offset:3px; }
:focus-visible { outline:2px solid var(--accent-edge); outline-offset:3px; }

.wrap { width:100%; max-width:860px; margin-inline:auto; padding-inline:clamp(20px,5vw,40px); }

/* ---------- ヘッダー / フッター ---------- */

.site-header { background:var(--surface); border-bottom:1px solid var(--line-soft); }
.site-header__inner { display:flex; align-items:center; min-height:62px; gap:16px; }
.brand {
  display:flex; align-items:center; gap:10px; font-weight:700; font-size:16px;
  color:var(--ink); text-decoration:none; white-space:nowrap;
}
.back { margin-left:auto; font-size:14px; color:var(--ink-soft); text-decoration:none; }
.back:hover { color:var(--accent); }

.site-footer {
  border-top:1px solid var(--line-soft); background:var(--surface);
  padding-block:32px; font-size:13px; color:var(--ink-mute);
}
.site-footer nav { display:flex; flex-wrap:wrap; gap:8px 18px; margin-bottom:12px; }

/* ---------- 本文 ---------- */

main { padding-block:clamp(40px,6vw,72px); }
h1 { font-size:clamp(23px,3.4vw,32px); }
.lead { margin-top:16px; color:var(--ink-soft); font-size:15px; }
.updated { margin-top:26px; font-size:13px; color:var(--ink-mute); font-family:var(--mono); }

/* 条文。番号は content ではなく ol に持たせ、コピペしても番号が残るようにする */
.articles { counter-reset:article; margin-top:40px; }

.article {
  border-top:1px solid var(--line-soft);
  padding-top:28px;
  margin-top:28px;
}
.article:first-child { border-top:0; padding-top:0; margin-top:0; }

.article > h2 {
  font-size:17px;
  display:flex;
  gap:12px;
  align-items:baseline;
}
.article > h2::before {
  counter-increment:article;
  content:"第 " counter(article) " 条";
  flex:none;
  font-family:var(--mono);
  font-size:12px;
  font-weight:600;
  letter-spacing:.04em;
  color:var(--accent);
}

/* 番号を振らない節（プライバシーポリシー等） */
.section { border-top:1px solid var(--line-soft); padding-top:28px; margin-top:28px; }
.section:first-child { border-top:0; padding-top:0; margin-top:0; }
.section > h2 { font-size:17px; color:var(--accent); }

.article p, .section p { margin-top:12px; color:var(--ink-soft); font-size:15px; }

/* 号立て */
ol.items { margin-top:12px; padding-left:0; list-style:none; counter-reset:item; }
ol.items > li {
  position:relative; padding-left:2.2em; margin-top:9px;
  color:var(--ink-soft); font-size:15px;
}
ol.items > li::before {
  counter-increment:item;
  content:"(" counter(item) ")";
  position:absolute; left:0; top:0;
  font-family:var(--mono); font-size:13px; color:var(--ink-mute);
}

ul.bullets { margin-top:12px; padding-left:0; list-style:none; }
ul.bullets > li {
  position:relative; padding-left:1.2em; margin-top:8px;
  color:var(--ink-soft); font-size:15px;
}
ul.bullets > li::before {
  content:""; position:absolute; left:2px; top:.85em;
  width:5px; height:5px; border-radius:50%; background:var(--ink-mute);
}

/* ---------- 表 ---------- */

.table-scroll { overflow-x:auto; margin-top:20px; }
table.legal {
  width:100%; min-width:520px; border-collapse:collapse; font-size:15px;
  background:var(--surface); border:1px solid var(--line);
}
table.legal th, table.legal td {
  padding:14px 18px; border-bottom:1px solid var(--line-soft);
  text-align:left; vertical-align:top;
}
table.legal th {
  width:31%; font-weight:600; color:var(--ink);
  background:var(--surface-alt); white-space:nowrap;
}
table.legal td { color:var(--ink-soft); }
table.legal tr:last-child th, table.legal tr:last-child td { border-bottom:0; }
table.legal .mono { font-family:var(--mono); font-variant-numeric:tabular-nums; }

/* 入れ子の価格表 */
table.price { width:100%; border-collapse:collapse; font-size:14px; margin-top:4px; font-variant-numeric:tabular-nums; }
table.price th, table.price td { padding:7px 10px; border-bottom:1px solid var(--line-soft); text-align:left; }
table.price thead th { font-size:12px; font-weight:600; color:var(--ink-mute); background:transparent; width:auto; white-space:nowrap; }
table.price tbody th { background:transparent; width:auto; font-weight:400; color:var(--ink-soft); white-space:normal; }
table.price td { font-family:var(--mono); white-space:nowrap; }
table.price tr:last-child th, table.price tr:last-child td { border-bottom:0; }

/* ---------- 補足ブロック ---------- */

.note {
  margin-top:20px; padding:18px 20px; font-size:14px;
  background:var(--accent-lite); border-radius:4px;
  border:1px solid color-mix(in srgb, var(--accent) 24%, transparent);
  color:var(--ink-soft);
}
.note b { color:var(--ink); }
.note p { margin-top:10px; font-size:14px; }
.note p:first-child { margin-top:0; }

/* ---------- 目次 ---------- */

.toc {
  margin-top:32px; padding:20px 24px;
  background:var(--surface); border:1px solid var(--line); border-radius:4px;
}
.toc h2 { font-size:13px; color:var(--ink-mute); letter-spacing:.06em; }
.toc ol { margin-top:12px; padding-left:0; list-style:none; counter-reset:toc; }
.toc li { position:relative; padding-left:3.4em; margin-top:6px; font-size:14.5px; }
.toc li::before {
  counter-increment:toc; content:"第 " counter(toc) " 条";
  position:absolute; left:0; top:0;
  font-family:var(--mono); font-size:11.5px; color:var(--ink-mute);
}
.toc a { text-decoration:none; }
.toc a:hover { text-decoration:underline; }