@charset "UTF-8";

/*
 * 集客用の単発 LP `/pac/` の、携帯幅だけの上書き（Bug #6085）。
 *
 * ## なぜ要るのか
 *
 * 移行元は幅 375 で `/pac/` から `/sp/pac/` へ転送する（着地の URL を記録して確認）。
 * その `/sp/pac/` は意匠の CSS `css/styles.css` の前に `../css/basic.css` を読む。
 * basic.css の 3〜23 行目の打ち消しが **`html` を含む約 70 種の要素へ
 * `font-size: 13px` を直に当てている**ため、移行元の携帯版は
 *
 *   1. **根の字が 13px** になる（dev は browser 既定の 16px のまま）
 *   2. **要素そのものが 13px** になる（親からの継承より、直に当たる規則が勝つ）
 *
 * の 2 つが同時に起きる。意匠の CSS は字を `rem` で書くので、1 のせいで
 * `rem` の値がすべて 16/13 倍に膨らむ。2 のせいで `.common-section` のような
 * 素の `div` が、親の字を継がずに 13px になる。
 *
 * | | 移行元（`/sp/pac/`） | dev（この上書きの前） |
 * |---|---:|---:|
 * | 根の字 | 13px | 16px |
 * | `.site-cont`（`.875rem`） | 11.375px | 14px |
 * | `.common-section`（素の `div`） | 13px | 14px |
 *
 * ## 直し方
 *
 * 🚨 **根（`html`）そのものは 13px にしない。**このページは**テーマの共通の
 * ヘッダーとフッターを出す**（移行元も PHP で 7 本読み込む）。根を変えると
 * `.site-cont` の外にも効く。テーマの共通 CSS には `rem` の宣言が 48 件あり、
 * どれに当たるかを測っていない。そこで **`.site-cont` の中だけ**を直す。
 *
 * 中身は次の 2 つで、移行元の読み込む順（basic.css → styles.css）と同じ順に置く。
 *
 *   1. basic.css の `font-size: 13px` を、`.site-cont` の中へ写す
 *   2. 意匠の CSS の `rem` 16 件を、根が 13px だったときの px で置き直す
 *
 * ## 触ってはいけないもの
 *
 * `assets/pac/` の下は移行元の本番とバイト単位で一致する写しで、md5 を
 * `tests-retired/pa-cms-ad-lp-assets9/` が見張っている。**写しは編集しない。**
 * 差はこのファイルで足す。読み込む順は意匠の CSS の**後ろ**である
 * （`inc/lead-lp-pac.php` が意匠の登録名に依存させている）。
 *
 * ## 幅の境目を 749px にした理由
 *
 * 意匠の写しは自前の帯を `min-width: 768px` で切る。750〜767px では写しの
 * 携帯版の並びが出るが、**移行元も同じ幅ではパソコン版（根 16px）を出す**
 * （移行元の出し分けは幅ではなく名乗り（UA））。つまりその帯では dev の
 * いまの値が移行元と一致しているので、**触ってはいけない**。テーマの携帯幅の
 * 境目もここだけ別にしない（`@media (max-width: 749px)`）。
 */

/*
 * 1. 移行元スマホ版の打ち消し（`sp/css/basic.css` 3〜23 行目）の `font-size` を、
 *    `.site-cont` の中へ写す。
 *
 * 🚨 **要素の並びは移行元の一覧をそのまま写さない。**写しの意匠 CSS には
 * `.site-cont h1` `.site-cont pre` `.site-cont code, .site-cont kbd, .site-cont samp`
 * `.site-cont small` という**同じ詳しさ (0,1,1) の規則**が在る。移行元では
 * basic.css が先・意匠が後なので意匠が勝つが、こちらは意匠より後に読むため、
 * 同じ顔ぶれを並べると**逆に打ち消してしまう**。
 *
 * そこで **`.site-cont` の中に実際に出る要素だけ**を並べる。移行元の写し
 * `legacy/www.p-a.jp/public/sp/pac/index.html` の `div#site-cont` の中を数えると
 * 14 種で、そのうち basic.css の一覧に載るのは次の 10 種である
 * （`br` `picture` `source` `main` は一覧に無い）。**この 10 種に、上の 4 本と
 * ぶつかる要素は 1 つも含まれない。**要素が増えたら検査が落ちる。
 */
@media (max-width: 749px) {

	.site-cont a,
	.site-cont div,
	.site-cont h2,
	.site-cont h3,
	.site-cont img,
	.site-cont li,
	.site-cont p,
	.site-cont section,
	.site-cont span,
	.site-cont ul {
		font-size: 13px;
	}

	/*
	 * 2. 意匠の CSS の `rem` 16 件を、根が 13px だったときの px で置き直す。
	 *    値は「`rem` の数 × 13」で、割り切れない桁もそのまま書く（移行元の
	 *    計算後の値と 1px も違わないようにするため）。
	 *
	 * 🚨 **`.index-service … .ttl::before` は写しが既に `19px` と px で書いて
	 * いる**ので、ここには要らない（根の値に左右されない）。
	 */

	/* 写しの 30 行目 `.875rem`. */
	.site-cont {
		font-size: 11.375px;
	}

	/* 写しの 663・783・796・991 行目 `.625rem`. */
	.site-cont .common-section > .inner .subttl,
	.site-cont .index-intro .intro-concept .box .content > .txt > ul,
	.site-cont .index-intro .intro-concept .box .figure > ul,
	.site-cont .index-reviews .reviews-slider .reviews-wrap .icon p {
		font-size: 8.125px;
	}

	/* 写しの 1002 行目 `.75rem`. */
	.site-cont .index-reviews .reviews-slider .reviews-wrap .voice {
		font-size: 9.75px;
	}

	/* 写しの 774・815・953 行目 `.875rem`. */
	.site-cont .index-intro .intro-concept .box .content > .txt,
	.site-cont .index-ba .ba-slider .mv-img .about,
	.site-cont .index-service .flow-box .item .info-cont .txt {
		font-size: 11.375px;
	}

	/* 写しの 671 行目 `1.0625rem`. */
	.site-cont .common-section > .inner .common-intro {
		font-size: 13.8125px;
	}

	/* 写しの 638・869・1051 行目 `1.1875rem`. */
	.site-cont .common-section > .inner .hdl-ttl,
	.site-cont .index-service .flow-box .item .info-cont .ttl,
	.site-cont .index-contact .ttl {
		font-size: 15.4375px;
	}

	/* 写しの 1117 行目 `1.25rem`. */
	.site-cont .index-contact .button.-red a {
		font-size: 16.25px;
	}

	/* 写しの 767 行目 `1.5rem`. */
	.site-cont .index-intro .intro-concept .box .content > .ttl {
		font-size: 19.5px;
	}

	/* 写しの 1104 行目 `1.75rem`. */
	.site-cont .index-contact .button.-primary a {
		font-size: 22.75px;
	}
}