/* 【初心者向けガイド】規約系ページ（/terms/ と /privacy/）専用のスタイルです。
   販促色を持たない「白地・黒文字・罫線だけ」の法務文書レイアウトを目指しています。
   他の公開情報ページ（/legal/ /security/ /service/ /environment/ /status/）は
   従来どおり public-info.css を使うので、こちらを変更しても影響しません。 */

:root {
  --doc-ink: #222;
  --doc-sub: #555;
  --doc-line: #c8c8c8;
  --doc-fill: #f4f4f4;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: #fff;
  color: var(--doc-ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif;
  font-size: .95rem;
  line-height: 1.9;
}

a { color: inherit; text-decoration: underline; }
a:focus-visible { outline: 2px solid #222; outline-offset: 2px; }

.skip { position: absolute; left: -10000px; }
.skip:focus { left: 1rem; top: 1rem; z-index: 5; background: #fff; border: 1px solid var(--doc-ink); padding: .5rem .8rem; }

/* ヘッダー・フッター（装飾なし。細い罫線のみ） */

.doc-header,
.doc-footer {
  max-width: 44rem;
  margin: 0 auto;
  padding: .9rem 1.2rem;
  font-size: .82rem;
  color: var(--doc-sub);
}

.doc-header { border-bottom: 1px solid var(--doc-line); }
.doc-footer { margin-top: 3.5rem; border-top: 1px solid var(--doc-line); }

.doc-header .doc-brand { text-decoration: none; font-weight: 700; color: var(--doc-ink); }
.doc-header .doc-path::before { content: "｜"; margin: 0 .1em; color: var(--doc-line); }

.doc-footer nav { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; }

/* 本文 */

.doc {
  max-width: 44rem;
  margin: 0 auto;
  padding: 2.5rem 1.2rem 0;
}

.doc h1 {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 700;
  text-align: center;
  letter-spacing: .04em;
}

.doc-meta {
  margin: .4rem 0 2rem;
  text-align: center;
  font-size: .8rem;
  color: var(--doc-sub);
}

.doc-notice {
  margin: 0 0 2rem;
  padding: .8rem 1rem;
  border: 1px solid var(--doc-line);
  background: var(--doc-fill);
  font-size: .85rem;
}

.doc-lead { margin: 0 0 2rem; }

/* 条・項・号 */

.doc .article { margin: 0 0 1.9rem; }

.doc .article h2 {
  margin: 0 0 .4rem;
  font-size: 1rem;
  font-weight: 700;
}

.doc .article > p { margin: 0 0 .6rem; }

.doc ol.para {
  margin: 0;
  padding-left: 2.2em;
}

.doc ol.para > li { margin-bottom: .35rem; }

.doc ol.item {
  counter-reset: item;
  margin: .35rem 0;
  padding-left: 2.6em;
  list-style: none;
}

.doc ol.item > li {
  position: relative;
  counter-increment: item;
  margin-bottom: .2rem;
}

.doc ol.item > li::before {
  content: "(" counter(item) ")";
  position: absolute;
  left: -2.6em;
  width: 2.6em;
}

/* 表（総罫のみ） */

.doc-table { overflow-x: auto; margin: .6rem 0 .2rem; }

.doc table {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
  line-height: 1.7;
}

.doc th,
.doc td {
  padding: .5rem .7rem;
  border: 1px solid var(--doc-line);
  text-align: left;
  vertical-align: top;
}

.doc th { background: var(--doc-fill); font-weight: 700; white-space: nowrap; }
.doc tbody th { width: 11em; }

.doc-version {
  margin: 2.5rem 0 0;
  padding-top: .8rem;
  border-top: 1px solid var(--doc-line);
  font-size: .8rem;
  color: var(--doc-sub);
}

@media (max-width: 700px) {
  body { font-size: .9rem; line-height: 1.85; }
  .doc { padding-top: 1.8rem; }
  .doc th { white-space: normal; }
  .doc tbody th { width: auto; }
  .doc table,
  .doc tbody,
  .doc tr,
  .doc th,
  .doc td { display: block; width: 100%; }
  .doc tr { border-bottom: 1px solid var(--doc-line); }
  .doc tr:last-child { border-bottom: 0; }
  .doc th { border-bottom: 0; }
  .doc td { border-top: 0; }
  .doc thead { display: none; }
  /* 列見出しが消えるので、3列表だけ各セルに項目名を出します。 */
  .doc td[data-label]::before { content: attr(data-label) "："; font-weight: 700; }
}

@media print {
  body { font-size: 10.5pt; line-height: 1.7; }
  .skip,
  .doc-header .doc-path,
  .doc-footer nav { display: none; }
  .doc-header,
  .doc-footer,
  .doc { max-width: none; padding-left: 0; padding-right: 0; }
  .doc th,
  .doc td,
  .doc-notice { border-color: #000; }
  .doc .article { break-inside: avoid; }
}