/*
 * 広告 LP `/ad/man2/` の横のはみ出しを、移行元と同じところで止める（Bug #8237）。
 * 落ちた囲みの地の色と、ヘッダーの押しボタンの並びも、ここで移行元に合わせる（Bug #8449・末尾の 2 つ）。
 *
 * ## 何が起きていたか
 *
 * 幅 375 で `document.documentElement.scrollWidth` が **392** になり、画面（375）より
 * 17px 広かった。移行元は 375 でぴったり収まる。
 *
 * 右へ出ているのは `IMG.bg` 9 個（`position: absolute`）で、**同じ絵が両側に在る**。
 * 違うのは**止める器**である。
 *
 * | | 移行元 | dev |
 * |---|---|---|
 * | 器の並び | `body > div.container > main` | `body > main`（**`div.container` が無い**） |
 * | `IMG.bg` を止める一番近い祖先 | `div.container`（`overflow: hidden`） | `body`（`overflow-x: auto`） |
 *
 * 🚨 **`div.container` は投入で落ちている。**移行元 `public/ad/man2/index.php` は
 * `<body><div class="container">…` で始まるが、dev の本文にこの囲みは無い。
 * 移行元の `asset/css/style.css` は `.container { width: 100%; margin: auto; overflow: hidden; }`
 * を持ち、この `overflow: hidden` がはみ出しを止めていた。
 *
 * ## なぜ器を足さずに CSS で止めるのか
 *
 * 囲みを本文へ足すと**再投入で元へ戻る**（`inc/spot-map.php` ほかと同じ理由）。
 * 型紙側で足すこともできるが、**止めたいのは巻き取りだけ**で、囲みそのものは
 * 見た目に出ない（`width: 100%; margin: auto` は `main` と同じ結果になる）。
 * そこで**同じ役目を `main` に持たせる**。
 *
 * ## `body` は触らない
 *
 * `body` の `overflow-x` を変えるとテーマ全体へ波及する（統括の決まり・2026-09-20 20:18）。
 *
 * ## このファイルが読まれるページ
 *
 * `inc/ad-lp-assets.php` が `/ad/man2/` のときだけ配る。ほかの広告 LP 10 本は
 * 幅 375 で `scrollWidth` が 375 のままで、はみ出していない（実測・2026-09-20）。
 */

body > main {
	/* 移行元の `.container` と同じ指定。`overflow-x` だけにすると `overflow-y` が
	   `auto` に変わり、縦の巻き取りが増えてしまう. */
	overflow: hidden;

	/* 🚨 落ちた囲みは地の色も持っていた（Bug #8449）。移行元の `asset/css/common.css` の
	   14 行 `.container { background-color: rgba(220, 225, 227, 0.6) }`。囲みが無いと、
	   自前の地を持たない区画が白になり、白い箱が背景に同化する（携帯幅の `.top008` の上など）.
	   値は移行元と同じにする（`common.css` はテーマの写しと md5 が同じで、当たり先だけが無い）. */
	background-color: rgba(220, 225, 227, 0.6);
}

/*
 * 🚨 ヘッダーの押しボタンが中央へ押し出されるのを止める（Bug #8449）。
 *
 * 移行元の `.header-inner` は `justify-content: space-between` で、子はロゴ・押しボタン群・
 * 携帯の引き出しを開く `a.header-inner-menu.sp` の 3 つ。パソコン幅では最後の `a` が
 * `.sp { display: none }` で消え、並ぶのは 2 つになる。
 *
 * dev では本文の組み立て（wpautop）がこの `a` を `<p>` で包んでいる。中の `a` が消えても
 * `<p>` が 3 つ目の子として残り、押しボタン群が中央へ寄る
 * （実測 2026-09-25: 幅 1440 で来店予約の左端が 移行元 x1010 / dev x774）。
 *
 * `<p>` を `display: contents` で透かし、`a` を移行元と同じく `.header-inner` の子として扱わせる。
 * 携帯幅の `a` は `position: absolute` なので、透かしても描かれる位置は変わらない.
 */
.header-inner > p {
	display: contents;
}
