/* 共通レイアウト：運営情報・規約系ページ用 */
:root{
  --ink:#403744;
  --muted:#756b77;
  --pink:#d979a0;
  --line:#f0e5e9;
  --paper:#fffaf6;
  --lav:#f2edff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:radial-gradient(circle at 5% 0,#ffe9f1 0,transparent 26rem),var(--paper);
  color:var(--ink);
  font-family:system-ui,-apple-system,"Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  line-height:1.85;
  -webkit-text-size-adjust:100%;
}
a{color:#ad5d80;text-underline-offset:3px}
a:hover{color:#7f3d5d}

.site-header{max-width:1100px;margin:auto;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:900}
.brand-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:14px;background:#f5bfd2;color:#fff;font-size:21px;box-shadow:0 5px 14px #e9a7c266}
.brand small{display:block;font-size:9px;letter-spacing:.14em;color:#958795}
.site-nav{display:flex;align-items:center;gap:14px;font-size:12px;font-weight:800}
.site-nav a{text-decoration:none;white-space:nowrap}

main{max-width:900px;margin:0 auto;padding:8px 20px 60px}
.breadcrumb{font-size:12px;color:#9b8d99;margin:8px 0 16px}
.breadcrumb a{color:#9b8d99;text-decoration:none}

.article-hero{background:linear-gradient(120deg,#fff0f5,#fffaf1 55%,#f1edff);border:1px solid #f4dce6;border-radius:24px;padding:28px 30px;margin:0 0 20px;box-shadow:0 10px 28px #6b46510b}
.eyebrow{font-size:11px;letter-spacing:.12em;font-weight:900;color:#a96683}
h1{font-size:clamp(25px,4vw,36px);line-height:1.35;letter-spacing:-.03em;margin:7px 0 12px}
.lead{font-size:15px;line-height:1.9;color:#6f6470;margin:0}
.hero-meta{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px;font-size:11px;color:#9b8d99;font-weight:700}

.article-body{background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px 30px;box-shadow:0 7px 24px #6b465108}
.article-body h2{font-size:21px;line-height:1.45;margin:32px 0 10px;padding-bottom:8px;border-bottom:1px solid #f1e7eb;scroll-margin-top:20px}
.article-body h2:first-child{margin-top:0}
.article-body h3{font-size:16px;line-height:1.6;margin:22px 0 7px}
.article-body p{margin:9px 0 15px;color:#514753}
.article-body ul,.article-body ol{padding-left:1.4em;margin:8px 0 18px}
.article-body li{padding:3px 0;color:#514753}
.article-body strong{color:#443642}
.article-body table{width:100%;border-collapse:collapse;margin:14px 0 22px;font-size:13px;display:block;overflow-x:auto}
.article-body th,.article-body td{border:1px solid #eee3e9;padding:9px 11px;text-align:left;vertical-align:top;min-width:120px}
.article-body th{background:#fff2f6;color:#81516a;white-space:nowrap}
.article-body hr{border:0;border-top:1px solid var(--line);margin:26px 0}

.toc{background:#fff8fb;border:1px solid #f4e3ea;border-radius:18px;padding:16px 20px;margin:0 0 24px}
.toc p{margin:0 0 8px;font-size:12px;font-weight:900;color:#9a6a80;letter-spacing:.06em}
.toc ol{margin:0;padding-left:1.2em;columns:2;column-gap:26px}
.toc li{padding:2px 0;font-size:13px;break-inside:avoid}
.toc a{text-decoration:none}

.note{background:#fff8f2;border:1px solid #f3e3d4;border-left:4px solid #e3b78f;border-radius:12px;padding:12px 16px;margin:16px 0 22px;font-size:13.5px;color:#6a5a4c}
.note p{margin:4px 0}

.page-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:18px 0 4px}
.page-links a{display:block;padding:14px 16px;border:1px solid #f3e2e9;border-radius:14px;background:#fff9fb;text-decoration:none;font-size:13px;font-weight:800;line-height:1.5}
.page-links a span{display:block;margin-top:4px;font-size:11.5px;font-weight:600;color:#948791;line-height:1.6}

.site-footer{max-width:900px;margin:auto;padding:18px 20px 34px;color:#9a8d98;font-size:11px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
.site-footer nav{display:flex;flex-wrap:wrap;gap:6px 12px}
.site-footer a{text-decoration:none;color:#9a8d98}

@media(max-width:640px){
  .site-header{padding:13px 14px;flex-wrap:wrap}
  .site-nav{font-size:11px;gap:10px}
  main{padding:5px 13px 40px}
  .article-hero{padding:22px 19px;border-radius:19px}
  .article-body{padding:21px 18px;border-radius:19px}
  .article-body h2{font-size:19px}
  .lead{font-size:14px}
  .toc ol{columns:1}
}
