/* =========================================================
   規約系ページ（利用規約・プライバシー・特商法）の本文用CSS
   common.css のあとに読み込む（上部の見出しエリアは common.css）
   ========================================================= */

/* ---------- 本文のカード（角を切ったパネル） ---------- */
main { padding: 56px 0 140px; }
main > .wrap { width: min(860px, 100%); }
.paper { --cut: 34px; }
.paper.cut-in { padding: clamp(24px, 5vw, 50px); }
.paper > p:first-child { font-size: 1.02rem; }

/* 目次：花浅葱のグラデ＋ひし形 */
.toc { position: relative; margin: 6px 0 8px; padding: 18px 22px 20px; color: #fff; text-shadow: var(--edge); background: var(--grad);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px)); }
.toc::before { content: ""; position: absolute; inset: 0; background-image: repeating-conic-gradient(from 45deg, rgba(255,255,255,.09) 0 25%, transparent 0 50%); background-size: 40px 40px; pointer-events: none; }
.toc > * { position: relative; }
.paper .toc p { text-shadow: none; display: inline-block; margin: 0 0 10px; transform: skewX(var(--skew)); background: #fff; color: var(--blue-d); padding: 0 16px; font-family: var(--f-display); font-size: calc(1rem * var(--dz)); }
.paper .toc p::after { content: " CONTENTS"; font-family: var(--f-thin); font-size: .66rem; letter-spacing: .3em; }
.paper .toc ol { margin: 0; padding: 0; list-style: none; columns: 2 15em; column-gap: 28px; font-size: .9rem; line-height: 1.75; }
.paper .toc li { break-inside: avoid; margin: 0 0 4px; padding: 0 0 0 1.1em; position: relative; }
.toc li::before { content: ""; position: absolute; left: 0; top: .62em; width: 7px; height: 7px; transform: rotate(45deg); background: rgba(255,255,255,.75); }
.paper .toc li a { color: #fff; text-decoration-color: rgba(255,255,255,.5); text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.paper .toc li a:hover { text-decoration-color: var(--berry-l); }

/* 見出し：ななめの番号＋ななめの線 */
.paper h2 { display: flex; align-items: center; gap: 14px; font-family: var(--f-display); font-weight: 400; font-size: calc(1.24rem * var(--dz)); line-height: 1.45;
  margin: 2.4em 0 .9em; padding: 0 0 10px; scroll-margin-top: 16px;
  background: repeating-linear-gradient(-45deg, var(--blue-l) 0 2px, transparent 2px 6px) left bottom / 100% 6px no-repeat; }
.paper h2 .no { flex: none; display: grid; place-items: center; min-width: 2.6em; height: 2.1em; padding: 0 .4em; font-size: .92em; line-height: 1;
  transform: skewX(var(--skew)); background: var(--grad); color: #fff; text-shadow: var(--edge); box-shadow: 3px 3px 0 var(--ink); }
.paper h2 .no.deep { background: var(--blue-xd); color: #fff; }
.paper h2 .no.pale { background: var(--sky); color: var(--blue-d); text-shadow: none; }
.paper .toc + h2 { margin-top: 1.8em; }

.paper p { margin: 0 0 1em; }
.paper ol, .paper ul { margin: 0 0 1em; padding-left: 1.8em; }
.paper li { margin: 0 0 .5em; padding-left: .25em; }
.paper ol > li::marker { font-family: var(--f-mid); color: var(--blue-d); }
.paper ul > li::marker { content: "◆ "; color: var(--blue); font-size: .8em; }
.paper li > ol { margin: .5em 0 0; list-style: lower-alpha; }
.paper a, .paper td, .paper li, .paper p { overflow-wrap: anywhere; }
.paper a:not(.sk) { color: var(--blue-d); text-decoration-color: var(--berry); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.paper strong { font-weight: 400; font-family: var(--f-display); font-size: calc(.95em * var(--dz)); background: linear-gradient(transparent 60%, rgba(194,52,111,.24) 60%); }

/* 表 */
.table-scroll { overflow-x: auto; margin: 0 0 1.3em; padding: 0 6px 8px 0; -webkit-overflow-scrolling: touch; }
table { border-collapse: separate; border-spacing: 0; width: 100%; min-width: 32em; font-size: .9rem; line-height: 1.75;
  border: 2.5px solid var(--ink); box-shadow: 4px 4px 0 var(--ink); background: #fff; }
th, td { padding: 9px 13px; text-align: left; vertical-align: top; border-bottom: 2px solid var(--ink); }
th + th, td + td { border-left: 2px solid var(--ink); }
tr:last-child td { border-bottom: 0; }
th { background: var(--grad); color: #fff; text-shadow: var(--edge); font-family: var(--f-display); font-weight: 400; font-size: calc(.86rem * var(--dz)); white-space: nowrap; }
tbody tr:nth-child(even) td { background: var(--sky-2); }
.tokushoho table { min-width: 0; }
.tokushoho thead { display: none; }
.tokushoho td:first-child { width: 11em; background: var(--sky); font-family: var(--f-display); font-size: calc(.86rem * var(--dz)); }
.totop { margin: 36px 0 0; text-align: right; }
.totop .sk { font-size: .9rem; }

@media (max-width: 600px) {
  .paper { --cut: 22px; }
  .paper h2 { font-size: calc(1.1rem * var(--dz)); gap: 12px; }
  .tokushoho td:first-child { width: auto; }
  .tokushoho tr { display: block; }
  .tokushoho td { display: block; }
  .tokushoho td + td { border-left: 0; }
  .tokushoho tr:last-child td:first-child { border-bottom: 2px solid var(--ink); }
}
@media print {
  body { background: none; }
  .scene, .pg-head::after { display: none; }
  footer { background: none; }
  .pg-head { color: var(--ink); }
  .pg-head .brand, .pg-head .lead { color: var(--ink); text-shadow: none; }
  .pg-head .pg-nav, .toc, .totop, .pg-head .mascot, .fwave, .duo { display: none; }
  .cut-sh { filter: none; }
  .cut, .paper.cut-in { clip-path: none; background: none; padding: 0; }
  .pg-head h1 { color: var(--ink); -webkit-text-stroke: 0; text-shadow: none; }
}