/* こどもこえログの規約類ページ 共通スタイル。
   サイトの CSP が style-src 'self' なので、**HTML の中に直接書けない**。
   必ずこの外部ファイルとして置き、各ページから読み込むこと
   （2026-08-23 に isasaka-lab.com のヘッダーを確認して分離した）。

   配色はサイト本体（assets/site.css）に合わせてグレースケールのみ。
   色は使わず、細い線と余白だけで区切る（2026-08-31） */
:root {
  color-scheme: light dark;
  --bg: #ffffff;
  --fg: #141414;
  --muted: #5c5c5c;
  --faint: #8e8e8e;
  --line: #e2e2e2;
  --line-strong: #c8c8c8;
  --tint: #f6f6f6;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #121212;
    --fg: #ededed;
    --muted: #a6a6a6;
    --faint: #7a7a7a;
    --line: #2c2c2c;
    --line-strong: #3f3f3f;
    --tint: #1a1a1a;
  }
}
body {
  margin: 0 auto; padding: 56px 24px 96px; max-width: 42rem;
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Noto Sans JP",
    "Helvetica Neue", Arial, sans-serif;
  font-size: 16px; line-height: 1.9; letter-spacing: .01em;
  color: var(--fg); background: var(--bg);
  font-feature-settings: "palt" 1;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  /* 本文に URL をそのまま載せている箇所があるので、折り返せるようにする
     （プライバシーポリシー 4章のリンク一覧。スマホで横にはみ出す） */
  overflow-wrap: break-word;
}
img { max-width: 100%; height: auto; }
a { color: var(--fg); text-decoration: none; border-bottom: 1px solid var(--line-strong); overflow-wrap: anywhere; }
a:hover { border-bottom-color: var(--fg); }
h1 { font-size: 1.625rem; line-height: 1.5; margin: 0 0 .25rem; letter-spacing: -.005em; }
h2 {
  font-size: 1.0625rem; margin: 3rem 0 .75rem; padding-top: 1.5rem;
  border-top: 1px solid var(--line);
}
h3 { font-size: .9375rem; margin: 1.75rem 0 .375rem; }
p, li { font-size: .9375rem; }
p { margin: 0 0 1.125rem; }
ol, ul { padding-left: 1.2em; }
ol.jo > li { margin-bottom: .5rem; }
.meta { font-size: .8125rem; color: var(--faint); margin: 0 0 2.5rem; }

/* 補足・要点・囲み。色を使わず、細い線と薄い地で区別する */
.note { font-size: .875rem; padding: 1rem 1.125rem; background: var(--tint); border: 1px solid var(--line); }
.lead { padding: 1rem 1.125rem; border-left: 2px solid var(--fg); font-size: .9375rem; color: var(--muted); }
.box { padding: 1rem 1.125rem; background: var(--tint); border: 1px solid var(--line); }
.box p { margin: 0; }

table { border-collapse: collapse; width: 100%; font-size: .875rem; margin: 1rem 0; }
th, td { border: 1px solid var(--line); padding: .625rem .75rem; text-align: left; vertical-align: top; }
th { font-weight: 700; background: var(--tint); }
.scroll { overflow-x: auto; }
footer { margin-top: 4rem; padding-top: 1.5rem; border-top: 1px solid var(--line); font-size: .8125rem; color: var(--faint); }

/* 特商法の表（項目名と中身の2列） */
table.commerce th { width: 34%; white-space: nowrap; }
table.commerce th, table.commerce td { padding: .75rem .875rem; }
@media (max-width: 560px) {
  body { padding: 40px 20px 72px; }
  table.commerce, table.commerce tbody, table.commerce tr,
  table.commerce th, table.commerce td { display: block; width: auto; }
  table.commerce th { border-bottom: none; white-space: normal; }
  table.commerce td { border-top: none; margin-bottom: .625rem; }
}