/*
 * 区画のページで、本文の器の柱を外して画面の全幅へ広げる（Task #2454）。
 *
 * 移行元の 1 枚もののページは、帯や主役の絵を画面の全幅に広げて組んでいる。
 * テーマの本文の器は柱（`.page-content__body`）の中にあり幅が決まっているため、
 * 写しただけでは全幅にならない。この 1 本がその柱を外す。
 *
 * ## なぜ 1 本にまとめられるか
 *
 * **配る幅の条件は、この CSS ではなく読み込みの段（`inc/*-page-css.php`）が
 * 持っている。**区画ごとに条件が違うので、同じ中身を 5 本の `bridge.css` へ
 * 写して配っていた。
 *
 * 🚨 **下の一覧は読み込みの段の実体と食い違いやすい。**2026-09-07 に確かめた
 * ところ、入会案内・ご成婚報告・はじめての方へ・サービス紹介の 4 つが、
 * 一覧の値と実体（`PA_*_MEDIA`）で食い違っていた（いずれも実体は 750px）。
 * **値を書き換えたら、この一覧も同じ変更で直すこと。**
 *
 *   記事シリーズ qol           all（Bug #4630。移行元はこの区画で携帯へ別の
 *                              ページを返さず（`/sp/qol/` が無い）、写し自身が
 *                              狭い画面向けの塊を持つため、幅で絞る必要が無い）
 *   マンガ                     all  ← 狭い画面でも本文の器を全幅で見せる区画（反映後の実機確認: /comic-story/ は幅 1440px・375px とも本文の器が全幅）
 *   入会案内                   (min-width: 750px)
 *   ご成婚報告                 (min-width: 750px)
 *   婚活川柳                   (min-width: 750px)（#4199。もとは 1117px だったが、
 *                              750px 以上は移行元と同じく横スクロールを許容する
 *                              方針（裁定 265 / 272）に合わせて下げた）
 *   サービス紹介               (min-width: 750px)（写しの 8 本は全部の幅へ配って
 *                              中の幅条件つきの塊で包む形だが、この 1 本は
 *                              8 区画で実体を共有するため配る側で絞る。
 *                              下の「入会案内のコースと料金」の注意書きのとおり、
 *                              ここでは「＠」＋「media」の文字並びを使えない）
 *   はじめての方へ             (min-width: 750px)
 *   集客用の単発 LP /pac/      all（Bug #6079。移行元は共通のヘッダーとフッターの中に
 *                              ありながら中身を全幅で組む（`.site-cont` が幅 1440）。
 *                              携帯幅でも同じ器が幅を止めるので（375 が 345 になる）、
 *                              パソコン幅だけに絞らない）
 *   入会案内のコースと料金     all（Issue #2709。移行元のページ専用 CSS 自身が
 *                              携帯幅向けの幅条件つき規則を持ち、パソコン幅だけに
 *                              絞る必要が無いため。「@」+「media」の文字並びは、
 *                              柱を外す 1 本が幅の条件を自前で持たないことを固定
 *                              する検査（`tests-retired/pa-cms-section-page-css/`）が
 *                              文字列一致で見ているため、コメントでも使わない）
 *
 * **`.pa-page--guide` は `/guide/` 配下のページ全体に付く目印だが、
 * この 1 本を配るのは `/guide/course/` だけである
 * （`inc/guide-course-page-css.php` の {@see pa_section_page_is_path()} が
 * 経路の完全一致で絞るため、他の `/guide/` ページには漏れない）。**
 *
 * **中身は区画名を除いて 1 文字も違わなかった。**そこで中身だけをこの 1 本へ
 * 寄せ、**条件は読み込みの段に残したまま、区画ごとに違う条件でこの 1 本を配る。**
 * 条件を CSS の中へ書き写すと 5 通りの条件が 1 つに潰れ、どの区画でも計算後の
 * 値が変わってしまう（同じ型の不具合が Bug #2363 で実際に起きた）。
 *
 * ## セレクタに区画の目印を残す理由
 *
 * この 1 本は対象の区画のページにしか配られないので、目印が無くても当たる。
 * それでも残すのは **強さ（詳細度）を変えないため**である。
 *
 *   これまで  body .pa-page--<区画> .page-content__body   → クラス 2 ＋ タグ 1
 *   目印なし  body .page-content__body                     → クラス 1 ＋ タグ 1
 *
 * 目印を落とすと 1 段弱くなり、区画の写しが同じ性質へ当てている規則に負けうる。
 * `:is()` の強さは中で最も強いものになるため、下の書き方は**これまでと同じ
 * クラス 2 ＋ タグ 1** である。
 *
 * 🚨 **`.pa-page--pac` は `/pac-nohin/` には当たらない。**あちらの目印は
 * `pa-page--pac-nohin` という別の類名で、類名の照合は前方一致ではない。
 * `/pac-nohin/` は移行元でも共通の器を持たない作りで、広告 LP の外枠を共用する
 * （Bug #6053）ため、この 1 本を配ってはいけない。
 *
 * ## 区画を足すとき
 *
 * 下の **3 つ**の並びへ目印を足し、その区画の読み込みの段でこの 1 本を配る
 * （`pa_section_page_enqueue_fullwidth()`）。
 */

body :is(
	.pa-page--comic-story,
	.pa-page--concierge,
	.pa-page--guide,
	.pa-page--qol,
	.pa-page--guidance,
	.pa-page--pac,
	.pa-page--report,
	.pa-page--senryu,
	.pa-page--service,
	.pa-page--visitor
) .page-content__body {
	max-width: none;
	width: 100vw;
	margin-inline: calc(50% - 50vw);
}

/* 広げた器のぶんの横方向のはみ出しを切る。
   `hidden` ではなく `clip` を使うのは、スクロールの器を作らずヘッダーの
   貼り付き（position: sticky）を保つためである. */
body:has(:is(
	.pa-page--comic-story,
	.pa-page--concierge,
	.pa-page--guide,
	.pa-page--qol,
	.pa-page--guidance,
	.pa-page--pac,
	.pa-page--report,
	.pa-page--senryu,
	.pa-page--service,
	.pa-page--visitor
)) {
	overflow-x: clip;
}

/* 🚨 **`body` へ置いた切り落としは Chromium では効かない**（Greptile の指摘・#6106）。
   `main.css` の「店舗ページの横方向のはみ出し」の節に実測が記録してある。
   **`body` / `html` に置くと `scrollWidth` が縮まず、`.site-main` に置いたときだけ
   縮んだ。**`.site-main` は幅の指定を持たない素の箱なので、その右端は常に画面の
   右端と一致し、広げた区画のはみ出しをちょうど画面の端で切れる。

   はみ出しは `width: 100vw` に縦スクロールバーの幅も含まれるために起きる。
   バーが場所を取る閲覧環境（Windows の既定など）だけで出る。

   🚨 **上の `body` の規則は消さない。**マンガの区画は本文の外枠が
   `main.pa-comic-frame__main` で、**`.site-main` を持たない**（実測: dev の
   `/comic-story/` に `site-main` の印は 0 件・`/pac/` と `/report/` は 2 件）。
   消すとあの区画だけ切り落とす先が無くなる。ここは**足すだけ**にする.

   `hidden` ではなく `clip` を使う理由は上と同じ（貼り付きを壊さない）. */
.site-main:has(:is(
	.pa-page--comic-story,
	.pa-page--concierge,
	.pa-page--guide,
	.pa-page--qol,
	.pa-page--guidance,
	.pa-page--pac,
	.pa-page--report,
	.pa-page--senryu,
	.pa-page--service,
	.pa-page--visitor
)) {
	overflow-x: clip;
}
