/* 全ページ共通の幅（2026-10-10）。各ページの style の後に読み込む。
 *   中身（カード・表・グリッド）: 最大 1080px / 長い文章: 最大 780px / スマホ: 左右 16px
 */
:root { --lp-content: 1080px; --lp-prose: 780px; --lp-gutter: clamp(16px, 4vw, 32px); }
.wrap { max-width: var(--lp-content) !important; padding-left: var(--lp-gutter) !important; padding-right: var(--lp-gutter) !important; box-sizing: border-box; }
/* 文章は読みやすい幅に（グリッドや表は広いまま） */
.wrap > p, .wrap > ul, .wrap > ol:not(.setup-steps), .wrap > details, .wrap > .foundation-box, .wrap > .section-lead, .wrap > h2, .wrap > h3 { max-width: var(--lp-prose); margin-left: auto; margin-right: auto; }
.foundation-box { box-sizing: border-box; }
/* 規約・ポリシーなど文章のページ */
body.lp-prose .wrap { max-width: calc(var(--lp-prose) + 2 * var(--lp-gutter)) !important; }
/* はみ出し防止（clip はスクロール領域を作らないので sticky を壊さない） */
html, body { overflow-x: clip; }
img, video, iframe, svg { max-width: 100%; height: auto; }
table { max-width: 100%; }
.wrap { overflow-wrap: anywhere; }
@media (max-width: 640px) {
  table { display: block; overflow-x: auto; }
  #providers .pv-table { display: block; overflow-x: visible; }
}
/* トップの見本（PCでは少し広く） */
@media (min-width: 1024px) {
  .fv-demo-grid { max-width: 860px !important; }
  .hero-mail-visual, .hero-mail-visual-note { max-width: 960px !important; }
  .section-lead { max-width: 720px !important; }
}
