@charset "UTF-8";
/* ===== 2026-09-30 採用サイト17ページのスクロール構成（コーポレートの課題ページと同じ構成）の採用向け上書き =====
 *
 * 岡田さん原文（9/30）：「じゃあ、他のページをコーポレートサイトのコスト最適化とかのページと同じように揃えてみて。」
 * 経緯・対象・戻し方は inc/recruit-scenes.php の冒頭。レイアウトの部品は solution-scenes.css を共用し、ここは採用の色と、
 * 採用の既存の見た目（recruit.css）が構成の変更で効かなくなる分を帯の中の位置に向け直すだけ。
 * すべて body.gasp-scenes-recruit の下（コーポレート31本・採用トップには当たらない）。新しい色・動き・文言は作らない。
 * 色は採用の既存の値だけ：地 var(--recruit-ground)=#195d84（2026-10-01 に朱 #9e3040 から青へ）／白 #fff／本文 #eef1f8（recruit.css 675 ほか）／被せ rgba(8,28,40,…)（同日 rgba(54,17,22,…) から・recruit.css）。
 * 戻し方＝gasp_recruit_scenes_pages() を array() にする（このファイルは読まれなくなる）。
 */

/* ---------- 1. 色のトークンと地（solution-scenes.css の紺の直書きを採用の地色に置き換える。2026-10-01 に朱→青 #195d84） ---------- */
body.gasp-scenes.gasp-scenes-recruit {
	/* 地と帯：#141c3a → 採用の地。solution-scenes.css 107・193行の直書きもここで上書き（下の .gs-lane） */
	background: var(--recruit-ground, #195d84);
	--gs-navy: var(--recruit-ground, #195d84);
	--gs-ink: #fff;
	--gs-sub: #eef1f8;
	--gs-panel-bg: var(--recruit-ground, #195d84);
	--recruit-accent-on-ground: #fff; /* 紺地でのアクセント #9ec1ff の代わり（採用の地では白。10/1 から地は青） */
}
body.gasp-scenes-recruit .gs-lane {
	background: var(--recruit-ground, #195d84);
	--gs-ink: #fff;
	--gs-sub: #eef1f8;
	/* --gs-line はコーポレートのまま（rgba(255,255,255,0.12)） */
	--gs-panel-bg: var(--recruit-ground, #195d84);
	/* 帯の文字色は採用の既存（body の --recruit-text）のまま：コーポレートの color:#eef1f8 を継がせると白いカードの中の文字が白になる。
	 * 地の上に直接載る文字（節の導入文など）は recruit.css が個別に色を持っている */
	color: var(--recruit-text, #282424);
}
/* 白いカードの中は採用の既存の色（recruit.css）に任せる：コーポレートの「カードの中だけ元のトークンに戻す」規則の値を採用の本文色に */
body.gasp-scenes-recruit .gs-lane .gs-scene--section .has-card-bg-background-color {
	--gs-ink: var(--recruit-heading, #29294b);
	--gs-sub: var(--recruit-text, #282424);
}

/* ---------- 2. ヒーロー（グループ recruit-hero の中身をヒーローの文字にする） ---------- */
/* 写真・動画・地色の一色（10/1 から青・以前は朱）。被せの色は inc/recruit-scenes.php が span に inline で持つ（recruit.css の既存値）。
 * cover の地は地色＝10/1 から青（写真の外側・動画が読めない時に見える面）。solution-scenes.css の被せ rgba(20,28,58,.5) は inline に負ける */
body.gasp-scenes-recruit .gs-scene--hero .wp-block-cover {
	background-color: var(--recruit-ground, #195d84);
}
body.gasp-scenes-recruit .gs-scene--hero .wp-block-cover__inner-container {
	color: #fff;
}
/* 文字は recruit.css の .recruit-hero 配下の規則（1044〜1056・1688〜1696・1724）を、ヒーローの入れ物 .gs-scene--hero に向け直したもの（値は写し） */
body.gasp-scenes-recruit .gs-scene--hero .recruit-section-label {
	color: #eef1f8;
	text-align: left;
	margin: 0;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
}
body.gasp-scenes-recruit .gs-scene--hero .recruit-section-label a {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 3px;
}
body.gasp-scenes-recruit .gs-scene--hero .recruit-section-label a:hover {
	color: #fff;
	text-decoration: none;
}
/* h1（3853・3855 は h2）。大きさ・影はコーポレートのヒーロー（solution-scenes.css 264〜271）と同じ */
body.gasp-scenes-recruit .gs-scene--hero h1,
body.gasp-scenes-recruit .gs-scene--hero h2 {
	color: #fff;
	font-size: 44px;
	line-height: 1.3;
	font-weight: 700;
	text-align: left;
	text-shadow: 0 2px 16px rgba(0, 0, 0, 0.5);
	display: block;
	margin-top: var(--gasp-sp-8, 8px);
	margin-bottom: var(--gasp-sp-16, 16px);
}
body.gasp-scenes-recruit .gs-scene--hero .recruit-hero-lead {
	max-width: none;
	margin: 0 0 var(--gasp-sp-8, 8px) !important;
	color: #eef1f8;
	font-size: var(--gasp-fs-16, 16px);
	line-height: var(--gasp-lh-loose, 1.9);
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
}
body.gasp-scenes-recruit .gs-scene--hero span.recruit-role-person {
	color: #fff;
}
@media (max-width: 767px) {
	body.gasp-scenes-recruit .gs-scene--hero h1,
	body.gasp-scenes-recruit .gs-scene--hero h2 { font-size: 30px; }
}
/* 動画：スマホと「動きを減らす」では出さない（今の見出し帯と同じ条件＝recruit.css 2647〜2664）。
 * 3792 はポスターを cover の背景に出す。3802 はポスターが無い（今も無い）ので被せだけ残る */
@media (max-width: 767px), (prefers-reduced-motion: reduce) {
	body.gasp-scenes-recruit .gs-recruit-cover video.recruit-hero-video {
		display: none;
	}
	body.gasp-scenes-recruit .gs-recruit-cover--poster {
		background-image: var(--gs-hero-poster);
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	}
}

/* ---------- 3. 真ん中の見出し（採用の青ティック＋点の飾りを残し、コーポレートの下線は出さない） ---------- */
/* 真ん中は inc/recruit-scenes.php が <div class="wp-block-group recruit-section-head"> で包む（recruit.css の飾りの規則がこのクラスに付いているため）。
 * solution-scenes.css の下線（8・11・12 節の ::after＝40×3px の棒）を、recruit.css 470〜480 行の ::before（棒 30px）＋::after（点 3つ）に戻す。値は写し、色は白（採用の地＝10/1 から青） */
body.gasp-scenes-recruit .gs-scene .gs-stage-mid .recruit-section-head h3.wp-block-heading::before,
body.gasp-scenes-recruit .gs-scene .gs-stage-mid .recruit-section-head h3.wp-block-heading::after,
body.gasp-scenes-recruit .gs-scene .gs-stage-mid .recruit-section-head h2.wp-block-heading::before,
body.gasp-scenes-recruit .gs-scene .gs-stage-mid .recruit-section-head h2.wp-block-heading::after {
	content: "";
	position: absolute;
	bottom: 0;
	height: 3px;
	background: #fff;
	border-radius: var(--gasp-r-pill, 50px);
	z-index: -1;
}
body.gasp-scenes-recruit .gs-scene .gs-stage-mid .recruit-section-head h3.wp-block-heading::before,
body.gasp-scenes-recruit .gs-scene .gs-stage-mid .recruit-section-head h2.wp-block-heading::before {
	width: 30px;
	left: 0;
}
body.gasp-scenes-recruit .gs-scene .gs-stage-mid .recruit-section-head h3.wp-block-heading::after,
body.gasp-scenes-recruit .gs-scene .gs-stage-mid .recruit-section-head h2.wp-block-heading::after {
	width: 3px;
	left: 35px;
	box-shadow: 8px 0 0 #fff, 16px 0 0 #fff;
}
body.gasp-scenes-recruit .gs-scene .gs-stage-mid .recruit-section-head h3.wp-block-heading,
body.gasp-scenes-recruit .gs-scene .gs-stage-mid .recruit-section-head h2.wp-block-heading {
	z-index: 0;
	margin-top: 0;
}
body.gasp-scenes-recruit .gs-scene .gs-stage-mid .recruit-section-label {
	color: #eef1f8;
	margin: 0 0 4px;
}

/* ---------- 4. 帯の中のパネル（外側の余白・幅は帯のレイアウトに任せる。パネルの中の見た目は採用のまま） ---------- */
body.gasp-scenes-recruit .gs-stage-body > .recruit-panel,
body.gasp-scenes-recruit .gs-stage-body > .recruit-cta {
	max-width: none;
	margin: 0;
	padding: 0;
	background: transparent;
	box-shadow: none;
	width: auto;
}
/* 節の本文の先頭に入れた素の段落・引用（95105〜95108 の帯直後の引用など） */
body.gasp-scenes-recruit .gs-stage-body > p {
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}

/* ---------- 5. 末尾の帯（cover だけの group）：コーポレートの末尾帯と同じく全幅 ---------- */
body.gasp-scenes-recruit .gs-scene--closing .recruit-cta,
body.gasp-scenes-recruit .gs-scene--closing > .wp-block-group,
body.gasp-scenes-recruit .gs-scene--closing > .wp-block-cover {
	max-width: none;
	margin: 0;
}
body.gasp-scenes-recruit .gs-scene--closing .wp-block-cover {
	border-radius: 0;
	max-width: none;
}

/* ---------- 6. recruit.css の `.recruit-main >` 直下指定が、帯の中へ移して効かなくなる見た目の規則の向け直し（値は写し） ---------- */
/* recruit.css 2469：パネル直下の導入文の色（3772。白いカードの中の同クラスは巻き込まない＝パネルの直下に限る） */
body.gasp-scenes-recruit .gs-stage-body > .recruit-panel > .recruit-hero-lead {
	color: #eef1f8;
}
/* recruit.css 3088：導入文の大きさ。ヒーローの導入文は上の 2 節で 1.6rem 相当（var(--gasp-fs-16)）にしてある */
/* recruit.css 3337：3693「私たちの仕事の流儀」（最初の節）の見出し内の導入文 */
body.gasp-scenes-recruit.page-id-3693 .gs-feed > .gs-scene:first-child .recruit-section-head .recruit-hero-lead {
	font-size: var(--gasp-fs-16, 16px);
}
/* recruit.css 3255〜3257：動画カードの中の文字は中央揃え（3693・3772。岡田さん「中央のままでよい」9/17）。
 * ※実装役の点検（前後の computed style 比較）で見つけた分＝指示文の4つには入っていなかった */
body.gasp-scenes-recruit.recruit-corp-aligned .gs-stage-body > .recruit-panel .recruit-video-card .wp-block-cover__inner-container,
body.gasp-scenes-recruit.recruit-corp-aligned .gs-stage-body > .recruit-panel .recruit-video-card .wp-block-cover__inner-container h4,
body.gasp-scenes-recruit.recruit-corp-aligned .gs-stage-body > .recruit-panel .recruit-video-card .wp-block-cover__inner-container p {
	text-align: center;
}
/* 3786 Communication のカードの背景写真（recruit.css 3888〜3910 の向け直し）は 2026-10-02 に削除（岡田さん「これは画像いらないかな。」）。戻すときは退避 _taihi/blogsy_gasp_20261002_before_p3786_noimg から */

/* ---------- 7. コーポレートの「見出し・段落の装飾を解除する」規則（solution-scenes.css 136〜146＝p/h の background・width・padding・margin-top を 0）に消される採用の部品 ----------
 * 採用は p にバッジ・タグ・引用枠・番号の丸などの見た目を持たせている（recruit.css）。ページ前後の computed style 比較（実装役の点検）で見つけた分。値は recruit.css の写し。
 * 詳細度は body.gasp-scenes-recruit（0,2,1）+ クラスで、コーポレートの body.gasp-scenes .gs-scene p（0,2,2）に勝たせる */
body.gasp-scenes-recruit .gs-scene p.recruit-role-badge {
	margin: 0;
	padding: var(--gasp-sp-4, 4px) var(--gasp-sp-12, 12px);
	background: color-mix(in srgb, var(--recruit-accent) 10%, #fff);
	width: auto;
}
body.gasp-scenes-recruit .gs-scene p.recruit-tag {
	margin: 0;
	padding: var(--gasp-sp-4, 4px) var(--gasp-sp-12, 12px);
	background: #f0f0f3;
}
body.gasp-scenes-recruit .gs-scene p.recruit-quote {
	padding: var(--gasp-sp-16, 16px);
	background: #f3f4f8;
}
body.gasp-scenes-recruit .gs-scene .recruit-step-card p.recruit-step-num {
	margin: 0 auto var(--gasp-sp-12, 12px);
	background: #1b58c4;
	width: 40px;
}
body.gasp-scenes-recruit .gs-scene .recruit-step-card p.recruit-step-num--wide {
	margin: 0 0 var(--gasp-sp-12, 12px);
	padding: 0 var(--gasp-sp-16, 16px);
	width: auto;
}
/* 段落・見出しの上の間隔（margin-top）も同じ規則で 0 にされる。WP の flow／constrained レイアウトが 2 つ目以降のブロックに置く間隔（24px＝block-gap）と、
 * 採用のクラスが持つ上余白（recruit.css）を戻す。最初の子は WP も 0 にするので対象外（節の頭に来た導入文などは 0 のまま） */
body.gasp-scenes-recruit .gs-scene :is(.is-layout-flow, .is-layout-constrained) > p:not(:first-child):is(:not([class*="recruit-"]), .recruit-timeline-item, .recruit-note, .recruit-hero-lead):not(.margin_top_5_, .margin_top_10_):not(.recruit-body-card p) {
	margin-top: var(--wp--style--block-gap, 24px);
}
/* 白い本文カード（.recruit-body-card）の中の段落は recruit.css 1536 が margin:0 0 16px（上は 0）。引用は body-card の外の 2 つ目以降だけ上 16px（recruit.css 1515） */
body.gasp-scenes-recruit .gs-scene p.recruit-quote:not(:first-child):not(.recruit-body-card p) {
	margin-top: var(--gasp-sp-16, 16px);
}
/* 上余白のユーティリティ（common.css 214〜219）も同じ規則で 0 にされる */
body.gasp-scenes-recruit .gs-scene p.margin_top_5_ {
	margin-top: var(--gasp-sp-4, 4px);
}
body.gasp-scenes-recruit .gs-scene p.margin_top_10_ {
	margin-top: var(--gasp-sp-12, 12px);
}
body.gasp-scenes-recruit .gs-scene p.recruit-card-label {
	margin-top: var(--gasp-sp-24, 24px); /* recruit.css 1287 */
}
body.gasp-scenes-recruit .gs-scene p.recruit-draft-note {
	margin-top: var(--gasp-sp-16, 16px); /* recruit.css 399 */
}
body.gasp-scenes-recruit .gs-scene p.recruit-quote-cite {
	margin-top: -4px; /* recruit.css 1730 */
}
/* 節の本文の直下に入れた引用（95105〜95108。元は帯の次の素の段落＝recruit.css 1515 の margin:16px 0） */
body.gasp-scenes-recruit .gs-stage-body > p.recruit-quote {
	margin-top: var(--gasp-sp-16, 16px);
	margin-bottom: var(--gasp-sp-16, 16px);
}
body.gasp-scenes-recruit .gs-scene .recruit-stat-tile p.recruit-stat-value,
body.gasp-scenes-recruit .gs-scene .recruit-stat-tile p.recruit-stat-note {
	margin-top: var(--gasp-sp-4, 4px); /* recruit.css 1623・1629 */
}

/* ---------- 8. 代表メッセージ（page-id-95101）：ヒーロー写真を高さ基準で左の列へ（帯が上がっても人にかぶらない位置） ----------
 * コーポレートの代表メッセージ 97（solution-scenes.css 13 節の 989〜1006 行）の置き方を、同じ写真（gasp代表.jpg・1800×1200・人の中心は幅の 48%）で写したもの。
 * **リードの判断・岡田さん未確認**（指示文の「95101 の置き方は 97 を写す」）。値は写し。767px 以下は帯が全幅で被らないので cover のまま */
@media screen and (min-width: 768px) {
	body.gasp-scenes-recruit.page-id-95101 .gs-scene--hero .wp-block-cover__image-background {
		--gs-ceo-band: 25vw; /* 2列（768〜1024px）＝帯は右 50% */
		width: auto;
		height: 100%;
		max-width: none;
		left: var(--gs-ceo-band);
		transform: translateX(-48%);
		object-fit: fill;
		-webkit-mask-image: linear-gradient(to right, #000 calc(100% - 160px), transparent 100%);
		mask-image: linear-gradient(to right, #000 calc(100% - 160px), transparent 100%);
	}
}
@media screen and (min-width: 1025px) {
	body.gasp-scenes-recruit.page-id-95101 .gs-scene--hero .wp-block-cover__image-background {
		--gs-ceo-band: 17vw; /* 3列＝帯は右 66%・左の列は 34% */
	}
}

/* ---------- 9. 地の上に直接載る暗い文字（元のページから AA 未満だったもの） ----------
 * 3802・3851 の「1日の流れ」の時刻・予定と、3851 の注記（p.recruit-note）は、元の recruit.css で文字色が本文色 #282424 のまま朱の地（#9e3040）に直接載っていた
 * （コントラスト 2.16:1。着手前の表示でも同じ）。帯の中の文字を AA 以上にする確認（実装役の点検）で見つけたので、帯の中だけ採用の既存の本文色 #eef1f8
 * （地の上の導入文と同じ値＝recruit.css 675 ほか）にする。白いカードの中（95107 の1日の流れ）は対象外。 */
body.gasp-scenes-recruit .gs-lane :is(.recruit-timeline-time, .recruit-timeline-item, .recruit-note):not(.has-card-bg-background-color *) {
	color: #eef1f8;
}

/* ---------- 10. 動きを止めたとき（フィルタ gasp_recruit_scenes_pin_enabled = false → body.gasp-scenes-nopin。JS は読まれない） ----------
 * ヒーローは止めず（static）、帯は全幅で下に続く。構成（ヒーロー・帯・節・末尾帯）は残る。solution-scenes.css 1b 節の sticky・右 66% の帯を打ち消すだけ */
@media screen and (min-width: 768px) {
	body.gasp-scenes-recruit.gasp-scenes-nopin .gs-scene--hero {
		position: static;
		height: auto;
	}
	body.gasp-scenes-recruit.gasp-scenes-nopin .gs-scene--hero .eye-catch-contents,
	body.gasp-scenes-recruit.gasp-scenes-nopin .gs-scene--hero .wp-block-cover {
		height: auto;
		min-height: calc(100vh - var(--gs-header-h));
	}
	body.gasp-scenes-recruit.gasp-scenes-nopin .gs-scene--hero .wp-block-cover__inner-container {
		max-width: min(620px, calc(100% - 96px));
		transform: none;
	}
	body.gasp-scenes-recruit.gasp-scenes-nopin .gs-lane {
		margin-left: 0;
		width: 100%;
	}
}

/* ---------- 9. 人を知る（page-id-3792）「Culture／文化が再現される仕組み」の導入文を目立たせる（2026-10-02） ----------
 * 岡田さん（「人柄依存にしないため、相談の拾い上げと責めないレビューを仕組みにしています。」の画面写真を添えて）
 * 「この部分の文章は太字にして字をもう少し大きく。少し目立たせたい。」
 * この1文だけ（他の節の導入文は 15px・通常の太さのまま）。節は帯の4番目＝最後（Sales／Engineer／Director／Culture。2026-10-02 実DOM）。
 * 本文に節を足すと番号がずれる。大きさ 15px → 18px はリードの置き値 */
body.gasp-scenes-recruit.page-id-3792 .gs-feed > .gs-scene:nth-child(4) .recruit-section-head > p.recruit-hero-lead {
	/* 大きさは 14節（30px）に寄せた。2026-10-02 当初は 18px */
	font-weight: 700;
}
/* 同じ節の2枚（相談の運用／レビューのやり方）：高さを倍にし、動画をやめて写真にする（2026-10-02）
 * 岡田さん「この二つは結論なので、パネルの高さを倍に。あと、内容に即した画像にしよう。動画だと過剰。」
 * ・高さ：本文インラインの min-height:240px → 480px（!important はインラインに勝つため）
 * ・動画は表示しない（本文の video は残したまま display:none。本文DBは変えていない）。カードの背景に写真を敷く。暗い覆い（本文の wp-block-cover__background）はそのまま
 * ・写真は自社撮影・人物なし（リードの選定・岡田さん未確認）：
 *   相談の運用＝小さな打合せ席（モニター2台・窓）PXL_20261001_051129544 → recruit_culture_soudan.jpg
 *   レビューのやり方＝ホワイトボード（「物理的アプローチ／論理的アプローチ→機能一覧」等。顧客名なし・人の映り込みなし）PXL_20260312_055514098 → recruit_culture_review.jpg
 *   どちらも 1600×1000 に切り出し。列の順番（1枚目＝相談・2枚目＝レビュー）で指す */
body.gasp-scenes-recruit.page-id-3792 .gs-feed > .gs-scene:nth-child(4) .recruit-video-card {
	min-height: 480px !important;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
body.gasp-scenes-recruit.page-id-3792 .gs-feed > .gs-scene:nth-child(4) .recruit-video-card > video {
	display: none;
}
body.gasp-scenes-recruit.page-id-3792 .gs-feed > .gs-scene:nth-child(4) .wp-block-column:nth-child(1) > .recruit-video-card {
	background-image: url(/wp-content/uploads/2026/09/recruit_culture_soudan.jpg);
}
body.gasp-scenes-recruit.page-id-3792 .gs-feed > .gs-scene:nth-child(4) .wp-block-column:nth-child(2) > .recruit-video-card {
	background-image: url(/wp-content/uploads/2026/09/recruit_culture_review.jpg);
}

/* ---------- 10. 仕事を知る（page-id-3772）「Common Template」の6枚（ミッション〜向いている人・難しい人）の高さを低く（2026-10-02） ----------
 * 岡田さん（ミッション〜オンボーディングの画面写真を添えて）「このパネルはもっと薄くていい。」「薄くてってのは、高さが低くていい」
 * 本文インラインの min-height:320px → 160px（半分・リードの置き値）。1366×768 で中身は 102px＋上下の余白 15px×2＝132px（実測）なので収まる。
 * min-height なので、文字が折り返して高くなる幅では中身に合わせて伸びる。節は帯の2番目（1 Positions／2 Common Template。2026-10-02 実DOM）。本文に節を足すと番号がずれる */
body.gasp-scenes-recruit.page-id-3772 .gs-feed > .gs-scene:nth-child(2) .recruit-video-card {
	min-height: 160px !important;
}

/* ---------- 11. 会社を知る（page-id-3693）「Work Style／私たちの仕事の流儀」の導入文「価値観から行動へ」を目立たせる（2026-10-02） ----------
 * 岡田さん（この1文の画面写真を添えて）「この左上の文字も太字、少し大きくして目立つように。」
 * 「も」＝同じ日の 3792 の導入文（9節：18px・太字）と同じ扱いと読んだ（リードの判断）。16px（6節の 177行の規則）→ 18px・太字。
 * この節の導入文だけ。節は帯の1番目（6節と同じ指し方） */
body.gasp-scenes-recruit.page-id-3693 .gs-feed > .gs-scene:first-child .recruit-section-head > p.recruit-hero-lead {
	/* 大きさは 14節と同じ 30px（当初は 18px）。ここに書くのは、6節の 16px の規則（177行）の方が 14節より強く、14節だけでは 16px のままだったため（実測） */
	font-size: 30px;
	font-weight: 700;
}

/* ---------- 12. 会社を知る（page-id-3693）「Trust／信頼のつくり方」を「仕事の流儀」と同じ形に（2026-10-02） ----------
 * 岡田さん（Trust の3枚の画面写真を添えて）「信頼のつくり方も、仕事の流儀のパネルと同様に。」
 * 「同様」＝リードの読み：①3枚を横3列（recruit.css「2026-09-17 Trustの3枚を横に並べる」）から、仕事の流儀と同じ縦1列・幅いっぱいに
 * ②高さを仕事の流儀のカードと同じ 320px（本文インラインは 200px）③導入文「仕組みで担保する品質」も 11節と同じ 18px・太字。
 * 帯の形（gasp-scenes-recruit）のときだけ。recruit.css の横3列の規則は残したまま、ここで1列に上書きする */
body.gasp-scenes-recruit.page-id-3693 .recruit-panel:has(> .recruit-icon-item) {
	grid-template-columns: minmax(0, 1fr);
	row-gap: 24px; /* 仕事の流儀のカード同士の間隔（1366×768 の実測 24px）に合わせる */
}
body.gasp-scenes-recruit.page-id-3693 .recruit-panel:has(> .recruit-icon-item) > .recruit-video-card {
	min-height: 320px !important;
	margin-top: 0 !important;    /* カード自身の上下の余白で間隔が 63px になっていた（実測）。間隔は row-gap に任せる */
	margin-bottom: 0 !important;
}
body.gasp-scenes-recruit.page-id-3693 .recruit-panel:has(> .recruit-icon-item) > .recruit-section-head > p.recruit-hero-lead {
	/* 大きさは 14節（30px）に寄せた。2026-10-02 当初は 18px */
	font-weight: 700;
}

/* ---------- 13. 仕事を知る（page-id-3772）「How We Work」の導入文（4枚のカードの上の1文。当初は下にあり、同日 本文を並べ替えて上へ）を強調（2026-10-02） ----------
 * 岡田さん（「当社の標準プロセスは、会話して要件を具体化 → …責任を持つ進め方です。」の画面写真を添えて）
 * 「この文章は真ん中に寄せて、文字を大きく。倍くらいのサイズで。強調したい。」
 * 15px → 30px（倍）・中央寄せ・太字（太字は「強調したい」からのリードの判断）。行の高さは 1.6（置き値）。
 * 節は帯の3番目（1 Positions／2 Common Template／3 How We Work。2026-10-02 実DOM）。パネル直下の導入文だけ（節の見出しの中の導入文は別）。本文に節を足すと番号がずれる */
body.gasp-scenes-recruit.page-id-3772 .gs-feed > .gs-scene:nth-child(3) .gs-stage-body > .recruit-panel > p.recruit-hero-lead {
	font-size: 30px;
	line-height: 1.6;
	font-weight: 700;
	text-align: center;
}
/* 2026-10-08 タンさん指摘 S10（スマホで導入文のフォントに違和感）。岡田さん「スマホだけでなく、解像度を下げた時に文字サイズが大きくなる。できれば対処したい。」
 * 30px 固定のまま段が狭くなるので行が増えていた（実測・106字：1920＝段766px 5行／1366＝522px 7行／1024＝409px 9行／768＝281px 14行／375＝335px 11行）。
 * 文字の大きさを段の幅に比例させる：「倍くらい」を見た 1366 の比率（段522px で 30px ＝ 5.75cqi）を基準に、上限 30px・下限 18px（本文 15px より大きく残す＝リードの判断）。
 * cqi の基準にするため、パネル（.recruit-panel）を inline-size のコンテナにする（幅は親から決まる block なので、レイアウトは変わらない）。
 * 戻し方：この2規則を削除（上の 30px 固定に戻る）。 */
body.gasp-scenes-recruit.page-id-3772 .gs-feed > .gs-scene:nth-child(3) .gs-stage-body > .recruit-panel {
	container-type: inline-size;
}
body.gasp-scenes-recruit.page-id-3772 .gs-feed > .gs-scene:nth-child(3) .gs-stage-body > .recruit-panel > p.recruit-hero-lead {
	/* 2026-10-08 タンさん指摘 N4（「解像度は対応できたけど、拡大縮小は対応できていない」）：段の幅だけに比例させると、ブラウザで拡大したとき
	 * 段の幅（CSS の px）が縮む分だけ文字の計算値も縮み、見た目の大きさがほとんど変わらなかった（リードの読み）。
	 * 固定の 12px ＋ 段の幅の 3.45%（1366 の段 522px で 30px になるのは前と同じ）に分け、拡大すると固定の分は大きくなるようにした。
	 * 戻し方：下の1行を clamp(18px, 5.75cqi, 30px) に戻す */
	font-size: clamp(18px, calc(12px + 3.45cqi), 30px);
}

/* ---------- 14. 採用の下層：節の見出しの中の導入文を倍の大きさに（2026-10-02） ----------
 * 岡田さん（3792「未経験からでも、関係性を育てる営業として成長できる理由を紹介します。」の画面写真を添えて）
 * 「画面上の文章も、倍くらいのサイズでいい。類似箇所も同様に。」
 * 「類似箇所」＝節の見出し（.recruit-section-head）の中の導入文（p.recruit-hero-lead）すべて、と読んだ（リードの判断）。
 * 本文にあるのは 3693（2）・3792（4）・3802（4）・3851（5）の15文（ローカルDBで確認）。ヒーローの導入文とパネル直下の導入文（3772 は 13節）は対象外。
 * 15px → 30px（倍）・行の高さ 1.5（置き値）。太さはそのまま（9・11・12節で太字にした3文は太字のまま）。
 * 9・11・12節の 18px はこの節に寄せて外した */
body.gasp-scenes-recruit .gs-scene .recruit-section-head > p.recruit-hero-lead {
	font-size: 30px;
	line-height: 1.5;
}