/* =========================================================
   読み物のページ（プライバシーポリシー・404）。body は .pat-e .pat-doc。
   色・書体・単位・タイル・バー・フッターは core-x.css + style-e.css をそのまま使い、
   ここは本文の組みだけを足す。
   ========================================================= */

.tile--dochead{grid-column:span 12;
  padding:clamp(40px,9vh,calc(120 * var(--px))) clamp(16px,1.8vw,calc(30 * var(--px))) 0}
.tile--dochead .tile-head{margin-bottom:0}

.tile--doc{grid-column:span 12}
/* 条文なので、本文より少し狭い一段組み（約38字）で組む */
.doc{max-width:calc(720 * var(--px));margin:0 auto;
  padding:clamp(10px,2.4vh,calc(40 * var(--px))) 0}
.doc-lead{font-size:var(--t-body);line-height:2.2;letter-spacing:.04em;color:rgba(245,242,236,.82);
  padding-bottom:clamp(24px,4vh,calc(44 * var(--px)));border-bottom:1px solid var(--rule);
  overflow-wrap:anywhere}   /* 本文中のURLが枠を突き抜けないように。
                               break-all は入れない（収まる場合でもURLの途中で割れる） */

.doc-sec{padding-top:clamp(28px,4.4vh,calc(52 * var(--px)))}
.doc-sec h2{display:flex;align-items:baseline;gap:calc(14 * var(--px));
  font-weight:600;letter-spacing:.05em;line-height:1.6;color:var(--fg);
  font-size:clamp(16px,13px + .6vw,calc(22 * var(--px)));
  margin-bottom:clamp(12px,1.8vh,calc(18 * var(--px)))}
/* 番号は小さく斜体にして、見出しの頭の目印に留める */
.doc-no{flex:none;font-style:italic;font-weight:400;color:var(--fg-faint);
  font-size:var(--t-small);min-width:1.4em}
.doc-sec p{font-size:var(--t-small);line-height:2.15;letter-spacing:.04em;color:rgba(245,242,236,.78)}
.doc-sec p + p{margin-top:1.2em}
.doc-note{margin-top:1.4em;color:var(--fg-soft)}

.doc-list{list-style:none;display:grid;gap:.7em;margin-top:1em}
.doc-list li{position:relative;padding-left:1.4em;
  font-size:var(--t-small);line-height:2.15;letter-spacing:.04em;color:rgba(245,242,236,.78)}
.doc-list li::before{content:"";position:absolute;left:.2em;top:1.02em;
  width:calc(10 * var(--px));height:1px;background:var(--fg-faint)}

/* 表。狭い画面では横に逃がす。縦に潰すと項目の対応が読めなくなる */
.doc-tablewrap{margin-top:1.4em;overflow-x:auto;-webkit-overflow-scrolling:touch}
.doc-table{width:100%;border-collapse:collapse;min-width:calc(420 * var(--px))}
.doc-table th,.doc-table td{text-align:left;vertical-align:top;
  padding:calc(12 * var(--px)) calc(14 * var(--px)) calc(12 * var(--px)) 0;
  border-top:1px solid var(--rule);
  font-size:var(--t-small);line-height:1.95;letter-spacing:.04em}
.doc-table thead th{border-top:0;padding-top:0;
  font-weight:500;font-size:var(--t-label);letter-spacing:.14em;color:var(--fg-soft)}
.doc-table tbody th{width:38%;font-weight:500;color:var(--fg)}
.doc-table tbody td{color:rgba(245,242,236,.78)}

.doc-link{border-bottom:1px solid var(--rule-strong);padding-bottom:.1em;
  transition:border-color .3s var(--ease-out-quad),color .3s}
@media (hover:hover) and (pointer:fine){ .doc-link:hover{color:var(--fg);border-color:var(--fg)} }

.tile--docnext{grid-column:span 12;display:flex;flex-wrap:wrap;align-items:center;
  justify-content:space-between;gap:calc(16 * var(--px))}

/* 条文の中の小見出し（カスハラ方針の ①② など）。h2 より一段下げ、本文と同じ色味で頭だけ立てる */
.doc-sub{margin-top:clamp(20px,3vh,calc(30 * var(--px)));
  font-weight:500;font-size:var(--t-small);line-height:1.9;letter-spacing:.05em;color:var(--fg)}
.doc-sub + .doc-list{margin-top:.6em}
/* 番号つきの箇条。罫の代わりに原文の①②③を頭に置く */
.doc-list--num li{padding-left:1.8em}
.doc-list--num li::before{content:none}
.doc-mark{position:absolute;left:0;color:var(--fg-soft)}

/* 制定日と署名（情報セキュリティ基本方針）。条文の下、右に寄せて閉じる */
.doc-sign{margin-top:clamp(36px,6vh,calc(64 * var(--px)));padding-top:clamp(20px,3vh,calc(28 * var(--px)));
  border-top:1px solid var(--rule);text-align:right;
  font-size:var(--t-small);line-height:2.1;letter-spacing:.06em;color:rgba(245,242,236,.78)}
