@charset "UTF-8";
/* ==========================================================================
   学力診断テスト（/test/） page-test.php 専用
   デザイン：Figma「1920w light」（PC）／「390w 新デザイン」（SP）2026-10-27
   PC＝960px以上、SP＝959px以下（SWELLと同じ境目）
   ========================================================================== */

/* ---------- ページ全体 ---------- */
.p-test-page main#main_content { width: 100%; }
.p-test-page #sidebar,
.p-test-page .l-sidebar { display: none !important; }
.p-test-page .l-mainContent__inner { max-width: none; }
/* 旧デザインのタイトル画像の緑の帯（固定ページのカスタムフィールド PA-Title-Image）。新しいMVと重なるので入れ物ごと出さない */
.p-test-page #pa_on_main_contents { display: none; }
/* ヘッダー直下にMV、最後のCTAの直下にフッターを付ける（テーマの上の余白・フッター前の余白を消す） */
.p-test-page #content.l-content { padding-top: 0; margin-bottom: 0; }
/* SWELLの「枠あり」設定の .-frame-on .l-mainContent { padding: 32px }（詳細度0,2,0）を消す。
   IDを足して勝たせる（taxonomy-locations.css の #main_content.loc-archive と同じ方法） */
.p-test-page #main_content.l-mainContent { padding: 0; }
.p-test-page { overflow-x: clip; }

.p-test {
	--p-test-green: #004d26;
	--p-test-green2: #006039;
	--p-test-orange: #ed6c00;
	--p-test-text: #333;
	--p-test-gutter: 16px;
	color: var(--p-test-text);
	font-feature-settings: "palt";
}
/* リセットは詳細度0（:where）にして、各部品の指定が必ず勝つようにする */
.p-test :where(img) { max-width: 100%; height: auto; }
.p-test :where(ul, ol) { margin: 0; padding: 0; list-style: none; }
.p-test :where(p) { margin: 0; }
.p-test-accent { color: var(--p-test-orange); }
.p-test-sp { display: none; }

/* 全幅セクション：背景は画面いっぱい、中身は1000px */
.p-test-sec,
.p-test-mv,
.p-test-cta {
	margin-inline: calc(50% - 50vw);
}
.p-test-sec { padding: 60px var(--p-test-gutter) 80px; background: #fff; } /* 枠あり設定でページ背景がグレーなので、白も明示して全幅にする */
.p-test-sec__inner { max-width: 1000px; margin-inline: auto; }

/* ---------- H2（中央・黄色の下線） ---------- */
.p-test-h2 {
	margin: 0 0 40px;
	padding: 0 0 19px;
	position: relative;
	background: none;
	border: 0;
	color: var(--p-test-green);
	font-size: 32px; /* TOPのセクション見出しと同じ（SPは22px） */
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
}
.p-test-h2::before { content: none; }
.p-test-h2::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 68px;
	height: 8px;
	transform: translateX(-50%);
	background: #fff100;
}

.p-test-lead {
	font-size: 18px;
	line-height: 1.6;
	text-align: center;
}

/* ---------- MV ---------- */
.p-test-mv__inner {
	position: relative;
	max-width: 1000px;
	height: 400px;
	margin-inline: auto;
	background-size: cover;
	background-position: center;
}
.p-test-mv__text {
	position: absolute;
	left: 52px;
	top: 128px;
	z-index: 1;
}
.p-test-mv__lead {
	color: #333;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
}
.p-test-mv__title {
	margin: 6px 0 0;
	padding: 0;
	background: none;
	border: 0;
	color: var(--p-test-green2);
	font-size: 60px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: 0;
	/* 白の縁取り（Figma：白1px・外側） */
	text-shadow:
		1px 0 #fff, -1px 0 #fff, 0 1px #fff, 0 -1px #fff,
		1px 1px #fff, -1px -1px #fff, 1px -1px #fff, -1px 1px #fff;
}
.p-test-mv__title span {
	/* 下線：文字の下部に7pxのオレンジ（Figma：文字枠の上から60px） */
	background: linear-gradient(transparent 82%, #ff9c31 82%, #ff9c31 92%, transparent 92%);
}
.p-test-mv__badges {
	display: flex;
	gap: 18px;
	margin-top: 35px;
}
.p-test-mv__badge {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 130px;
	height: 43px;
	border-radius: 12px;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
}
.p-test-mv__badge--free { background: #ff9c31; }
.p-test-mv__badge--twice { background: var(--p-test-orange); }
/* 文字をひとかたまりで包み、大きい「2」も基準線でそろえる（flexの子に分かれると上下中央でずれる） */
.p-test-mv__num { font-size: 20px; line-height: 0; } /* 行の高さを押し広げず、全塾生無料と文字の上下位置をそろえる */
.p-test-mv__person {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 55%;
}

/* ---------- CTA（共通の [cta_banner]） ---------- */
.p-test-cta .cta-banner { margin-top: 0; margin-bottom: 0; }

/* ---------- 学力診断テストとは ---------- */
.p-test-about .p-test-lead { margin-bottom: 48px; }
.p-test-about__label {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 24px;
}
.p-test-about__pill {
	padding: 10px 32px;
	border-radius: 999px;
	background: linear-gradient(110deg, #2a6643 0%, #004d26 85%), #004d26;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.03em;
}
.p-test-about__pill span { color: #fff34d; }
.p-test-about__label::after {
	/* 下向きのしっぽ */
	content: "";
	width: 14px;
	height: 9px;
	margin-top: -1px; /* カプセルに1px重ねて、境目の白いすき間を出さない */
	background: rgb(17, 87, 50);
	clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.p-test-about__cards {
	display: flex;
	justify-content: center;
	gap: 16px;
}
.p-test-about__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	width: 210px;
	height: 160px;
	padding-top: 16px;
	border-radius: 8px;
	background: #f7f9ed;
	color: var(--p-test-text); /* 本文と同じ#333 */
	font-size: 20px;
	line-height: 1.2;
	text-align: center;
}
.p-test-about__icon { flex-shrink: 0; }

/* ---------- 学力診断テストの目的 ---------- */
.p-test-purpose { background: #f9f9f9; padding-bottom: 80px; }
.p-test-purpose .p-test-h2 { margin-bottom: 33px; }
.p-test-purpose .p-test-lead { margin-bottom: 60px; }

/* 緑の帯（料金ページ .p-tuition-compare-lead と同じ型） */
.p-test-need__head {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	padding: 24px 40px;
	border-radius: 8px 8px 0 0;
	background: linear-gradient(110deg, #2a6643 0%, #004d26 85%), #004d26;
}
.p-test-need__title {
	color: #fff;
	font-size: 26px;
	font-weight: 900;
	line-height: 1.4;
	text-align: center;
}
.p-test-need__title span { color: #fff34d; }
.p-test-need__chara {
	flex-shrink: 0;
	width: 100px;
	height: 100px;
	margin: -92px 0 -28px 22px;
}
.p-test-need__list {
	/* 項目の並びは左揃えのまま、かたまりを中央に置く */
	display: grid;
	justify-content: center;
	gap: 10px;
	padding: 32px 28px;
	border-radius: 0 0 8px 8px;
	background: #fff;
}
.p-test-need__list li {
	position: relative;
	padding-left: 30px;
	color: #333;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.7;
}
.p-test-need__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: calc(0.85em - 8px + 0.1em);
	width: 16px;
	height: 16px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M0.6 9.0 Q2.1 7.4 4.0 9.1 L5.8 11.1 Q8.8 5.2 14.2 0.6 Q15.6 0.0 15.6 1.4 Q10.6 7.8 7.4 14.5 Q6.3 16.0 5.0 14.6 Z' fill='%23006039'/%3E%3C/svg%3E") no-repeat center / contain;
}

.p-test-purpose__use {
	margin-top: 40px;
	color: var(--p-test-orange);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
}

/* 成績アップの3ステップ（背景は上端を透明にぼかす） */
.p-test-steps {
	position: relative;
	max-width: 1000px;
	margin: 20px auto 0;
	border-radius: 8px;
	overflow: hidden;
}
.p-test-steps::before {
	content: "";
	position: absolute;
	inset: 0;
	/* Figma（PC）：枠1000×426に画像1236×695を左184・上125ずらして配置 → 幅123.6%、位置 184/236=78%・125/269=46.5% */
	background: var(--p-test-steps-bg) 78% 46.5% / 123.6% auto no-repeat;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 30%);
	mask-image: linear-gradient(to bottom, transparent 0, #000 30%);
}
.p-test-steps__inner {
	position: relative;
	display: grid;
	grid-template-columns: 424px auto;
	justify-content: center;
	column-gap: 32px;
	padding-top: 32px;
}
.p-test-steps__title {
	grid-column: 1;
	margin-bottom: 16px;
	color: var(--p-test-green);
	font-size: 26px;
	font-weight: 800;
	font-style: italic;
	line-height: 1.3;
}
.p-test-steps__body { display: contents; }
.p-test-steps__list {
	grid-column: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding-bottom: 20px;
}
.p-test-steps__student {
	grid-column: 2;
	grid-row: 1 / 3;
	align-self: end;
	width: 300px;
	display: block;
}
.p-test-step {
	display: flex;
	align-items: center;
	gap: 18px;
	width: 100%;
	padding: 12px 18px;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}
.p-test-step { position: relative; }
.p-test-step + .p-test-step { margin-top: 28px; }
.p-test-step + .p-test-step::before {
	/* ステップ間の▼（上のカードとの間の中央） */
	content: "";
	position: absolute;
	top: -20px;
	left: 50%;
	width: 22px;
	height: 12px;
	transform: translateX(-50%);
	background: #7ab22e;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.p-test-step__num {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 60px;
	height: 60px;
	padding-top: 0; /* TOPのPOINTの丸から写した padding-top:16% は、中央寄せと重なって数字が下に落ちるので外す */
	border-radius: 50%;
	background: var(--p-test-green2);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.03em;
	line-height: 1;
}
.p-test-step__num b {
	color: #f5e35a;
	font-size: 30px;
	font-weight: 500;
	line-height: 1;
}
.p-test-step__text { display: flex; flex-direction: column; gap: 2px; }
.p-test-step__sub {
	color: var(--p-test-orange);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
}
.p-test-step__main {
	color: #1e5b2e;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.3;
}

/* ---------- 学力診断テストを無料にする理由 ---------- */
/* 寸法の決まり：基準寸法 d=64px。写真・キャッチは面の左に64px、写真は面の下に64pxはみ出す。
   ボタンは中心が面の下端に来る。写真は黄金比。 */
.p-test-reason { background: #fff; }
.p-test-reason__stage {
	--d: 64px;
	position: relative;
	display: grid;
	grid-template-columns: 435px 1fr;
	column-gap: var(--d);
	padding-top: calc(33px + var(--d));
}
.p-test-reason__panel {
	position: absolute;
	top: 33px;
	bottom: var(--d);
	left: var(--d);
	right: calc(50% - 50vw); /* どの幅でも画面の右端まで */
	background: #f9f9f9;
}
.p-test-reason__left {
	position: relative;
	display: flex;
	flex-direction: column;
}
.p-test-reason__catch {
	margin-top: -4px;
	color: var(--p-test-green2);
	font-size: 30px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: 0.04em;
}
.p-test-reason__photo {
	display: block;
	width: 435px;
	aspect-ratio: 1.618 / 1;
	object-fit: cover;
	margin-top: auto;
	padding-top: var(--d);
	box-sizing: content-box;
}
.p-test-reason__right {
	position: relative;
	display: flex;
	flex-direction: column;
	padding-bottom: calc(var(--d) - 36px);
}
.p-test-reason__body {
	color: #222;
	font-size: 18px;
	line-height: 1.6;
	letter-spacing: 0.04em;
}
.p-test-reason__body p + p { margin-top: 18px; }
.p-test-reason__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	height: 72px;
	margin-top: auto;
	padding-top: 0;
	border-radius: 50px;
	background: #e6204d;
	box-shadow: inset 0 4px 4px rgba(255, 255, 255, 0.25);
	color: #fff !important;
	font-size: 19px;
	font-weight: 700;
	text-decoration: none !important;
	transition: opacity 0.2s;
}
.p-test-reason__btn::after {
	content: "";
	width: 8px;
	height: 8px;
	border-top: 2.5px solid #fff;
	border-right: 2.5px solid #fff;
	transform: rotate(45deg);
}
.p-test-reason__btn:hover { opacity: 0.85; }
.p-test-cta--reason { display: none; } /* SPだけ出す（PCは面の下端をまたぐボタン） */
/* 資料請求の上の一言を外したぶん、ボタン同士が共通の間隔12pxだけになるので20pxに（料金ページのSPボタン間と同じ） */
.p-test-cta--reason .cta-banner .inner { row-gap: 20px; }
.p-test-reason__body { margin-bottom: 32px; }

/* ---------- 【学年別】学力診断テストの活かし方 ---------- */
.p-test-grade { background: #f7f9ed; }
.p-test-grade__list { display: flex; flex-direction: column; gap: 58px; }
.p-test-grade__card {
	display: flex;
	flex-direction: column;
	gap: 30px;
	padding: 32px 38px;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}
.p-test-grade__title {
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	color: var(--p-test-green2);
	font-size: 28px;
	font-weight: 700;
	line-height: 1.4;
}
.p-test-grade__title::before,
.p-test-grade__title::after { content: none; }
.p-test-grade__content { display: flex; align-items: flex-start; gap: 38px; }
.p-test-grade__image {
	position: relative;
	flex-shrink: 0;
	width: 425px;
	aspect-ratio: 425 / 263;
	overflow: hidden;
	border-radius: 8px;
	background:
		radial-gradient(ellipse at center, rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0) 70%),
		linear-gradient(180deg, #e8e5da 0%, #d9d4c6 100%);
}
.p-test-grade__image img {
	position: absolute;
	left: 7.76%;   /* 33 / 425 */
	top: 3.04%;    /* 8 / 263 */
	width: 84.71%; /* 360 / 425 */
	height: auto;
}
.p-test-grade__text {
	flex: 1;
	color: #222;
	font-size: 18px;
	line-height: 1.75;
}

/* ---------- 受験概要 ---------- */
.p-test-overview__table {
	width: 100%;
	margin: 0;
	border: 1px solid #dcdcdc;
	border-collapse: collapse;
	background: #fff;
}
.p-test-overview__table th,
.p-test-overview__table td {
	padding: 12px 16px;
	border: 0;
	border-bottom: 1px solid #dcdcdc;
	line-height: 1.6;
	vertical-align: middle;
}
.p-test-overview__table th {
	width: 300px;
	border-right: 1px solid #dcdcdc;
	background: #eef4e2;
	color: var(--p-test-green);
	font-size: 18px;
	font-weight: 700;
	text-align: center;
}
.p-test-overview__table td { color: #333; font-size: 16px; }
.p-test-overview__table small { display: block; font-size: 13px; }
/* 測定内容：頭に「・」。折り返した2行目は「・」の後ろにそろえる */
.p-test-overview__list li { padding-left: 1em; text-indent: -1em; }
.p-test-overview__list li::before { content: "・"; display: inline-block; width: 1em; text-indent: 0; } /* 文字詰め(palt)で「・」が半分の幅になり2行目とずれるので、幅を1文字分に固定 */

/* ---------- お近くの教室を探す（GPS付き） ----------
   [school_search_section]（functions.php・/result/ と同じ部品）の見た目を page-result.css から移植。
   見出しはこのページのH2と同じ形（緑の太字＋黄色の下線・PC32px/SP22px）、地はこのページの薄緑 #f7f9ed。
   GPSボタン本体（.sl-openBtn）の形は共通の school-locator.css。ここは大きさと余白だけ。 */
.p-test-area {
	margin-inline: calc(50% - 50vw);
	padding: 60px var(--p-test-gutter) 64px;
	background: #f7f9ed;
}
.p-test .kc-near { max-width: 1000px; margin: 0 auto; text-align: center; }
.p-test h2.kc-near__label {
	position: relative;
	margin: 0 0 40px;
	padding: 0 0 19px;
	background: none;
	border: 0;
	color: var(--p-test-green);
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
}
.p-test h2.kc-near__label::before { content: none; }
.p-test h2.kc-near__label::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 68px;
	height: 8px;
	transform: translateX(-50%);
	background: #fff100;
}
.p-test p.kc-near__sub { margin: 0 0 18px; color: #333; font-size: 16px; font-weight: 700; }
.p-test .kc-near__sub b { color: var(--p-test-green); font-size: 22px; margin: 0 2px; }
.p-test .kc-near .kc-near__gps { min-height: 60px; margin: 0 auto 36px; font-size: 19px; gap: 10px; }
.p-test .kc-near .kc-near__gps svg { width: 24px; height: 24px; }
.p-test ul.kc-near__grid {
	list-style: none;
	max-width: 850px;
	margin: 0 auto;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}
.p-test ul.kc-near__grid > li { list-style: none; margin: 0; padding: 0; }
.p-test ul.kc-near__grid > li::before { content: none; }
.p-test a.kc-near__btn {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 18px 10px;
	background: #fff;
	border-radius: 4px;
	box-shadow: 0 0 4px rgba(0, 0, 0, .05);
	text-decoration: none;
	transition: box-shadow .2s ease, transform .15s ease;
}
@media (hover: hover) {
	.p-test a.kc-near__btn:hover { box-shadow: 0 2px 8px rgba(0, 77, 44, .15); transform: translateY(-1px); }
}
.p-test .kc-near__name { font-weight: 700; font-size: 20px; line-height: 1; color: var(--p-test-green); white-space: nowrap; }
.p-test .kc-near__chev {
	position: absolute;
	right: 18px;
	top: 50%;
	width: 8px;
	height: 8px;
	border-top: 2px solid var(--p-test-green);
	border-right: 2px solid var(--p-test-green);
	transform: translateY(-50%) rotate(45deg);
}

/* ==========================================================================
   SP（959px以下）
   ========================================================================== */
@media (max-width: 959px) {
	.p-test-pc { display: none; }
	.p-test-sp { display: inline; }

	.p-test-sec { padding: 48px var(--p-test-gutter) 56px; }
	.p-test-h2 { margin-bottom: 32px; padding-bottom: 15px; font-size: 22px; line-height: 1.4; }
	.p-test-h2::after { height: 6px; }
	.p-test-lead { font-size: 16px; line-height: 1.75; text-align: left; }

	/* MV：文字を上、人物を下に */
	.p-test-mv__inner { height: auto; max-width: none; }
	.p-test-mv__text { position: static; padding: 28px 16px 20px; }
	.p-test-mv__lead { font-size: 16px; }
	.p-test-mv__title { font-size: 40px; }
	.p-test-mv__badges { gap: 10px; margin-top: 16px; }
	.p-test-mv__badge { width: 112px; height: 34px; border-radius: 10px; font-size: 14px; }
	.p-test-mv__num { font-size: 17px; }
	.p-test-mv__person { position: static; display: block; width: 100%; }


	/* とは：カード2列×2段 */
	.p-test-about .p-test-lead { margin-bottom: 40px; }
	.p-test-about__pill { padding: 10px 24px; font-size: 16px; }
	.p-test-about__cards { flex-wrap: wrap; gap: 12px; }
	.p-test-about__card { width: calc((100% - 12px) / 2); height: 132px; font-size: 16px; }

	/* 目的 */
	.p-test-purpose { padding-inline: 0; }
	.p-test-purpose .p-test-sec__inner { padding-inline: var(--p-test-gutter); }
	.p-test-purpose .p-test-h2 { margin-bottom: 32px; }
	.p-test-purpose .p-test-lead { margin-bottom: 48px; }
	.p-test-need__head { justify-content: space-between; gap: 12px; padding: 12px 12px 12px 16px; }
	.p-test-need__title { font-size: 17px; font-weight: 700; text-align: left; } /* PCの900はSPでは字がつぶれる */
	/* PCと同じく帯の上にはみ出させる。上-28px・下-4pxで、帯の中では48px（文字2行の高さ）だけ使い、上に16pxはみ出す */
	.p-test-need__chara { width: 80px; height: 80px; margin: -28px 0 -4px; }
	.p-test-need__list { padding: 24px 16px; }
	.p-test-need__list { justify-content: stretch; }
	.p-test-need__list li { font-size: 16px; }
	.p-test-purpose__use { margin-top: 40px; font-size: 18px; }

	/* 3ステップ：背景は全幅、見出し上・ステップと生徒を横並び */
	.p-test-steps { max-width: none; margin-top: 16px; border-radius: 0; }
	/* Figma（SP）：枠390×362に画像600×338を左174・上0で配置 → 幅153.8%、位置 174/210=83%・上端 */
	/* 枠の高さちょうどにして、下にすき間を作らない（Figmaの幅153.8%だと高さが24px足りず、人物が背景からはみ出して見えた）。横位置はFigmaの83% */
	.p-test-steps::before { background-size: auto 100%; background-position: 83% 0; }
	.p-test-steps__inner {
		/* ステップと生徒を2列ひとかたまりで中央に。390pxでは隙間0、広いときは最大48px */
		grid-template-columns: 198px 160px;
		justify-content: center;
		column-gap: clamp(0px, calc(100vw - 390px), 48px);
		padding: 24px var(--p-test-gutter) 0;
	}
	.p-test-steps__title { grid-column: 1 / 3; margin-bottom: 16px; font-size: 20px; text-align: center; }
	.p-test-steps__list { padding-bottom: 24px; }
	.p-test-steps__student { grid-row: 2; width: 160px; justify-self: end; }
	.p-test-step { gap: 10px; padding: 10px; }
	.p-test-step + .p-test-step { margin-top: 26px; }
	.p-test-step__num { width: 48px; height: 48px; font-size: 10px; }
	.p-test-step__num b { font-size: 17px; }
	.p-test-step__sub { font-size: 11px; }
	.p-test-step__main { font-size: 16px; }

	/* 無料にする理由：淡い面を全幅に、キャッチ→写真→本文→ボタン */
	.p-test-reason { padding-inline: 0; }
	.p-test-reason .p-test-h2 { margin-inline: var(--p-test-gutter); }
	.p-test-reason__stage { display: block; padding: 0 var(--p-test-gutter); }
	.p-test-reason__panel { display: none; } /* 重ねる構図はPCだけ。SPは白地 */
	.p-test-reason__catch { margin-top: 0; font-size: 18px; } /* H2(22px)より小さく。本文(16px)より一段大きい補足の大きさ */
	.p-test-reason__photo { width: 100%; padding-top: 16px; }
	.p-test-reason__right { padding-bottom: 0; margin-top: 24px; }
	.p-test-reason__body { font-size: 16px; }
	.p-test-reason__body { margin-bottom: 0; }
	.p-test-reason__btn { display: none; } /* SPは下のCTAの帯で受ける */
	.p-test-cta--reason { display: block; }

	/* 活かし方：縦積み */
	.p-test-grade__list { gap: 24px; }
	.p-test-grade__card { gap: 16px; padding: 20px; }
	.p-test-grade__title { font-size: 20px; }
	.p-test-grade__content { flex-direction: column; gap: 16px; }
	.p-test-grade__image { width: 100%; }
	.p-test-grade__text { font-size: 16px; }

	/* お近くの教室を探す（GPSボタンはエリアページと同じ寸法・文言は「現在地から教室を探す」） */
	.p-test-area { padding: 48px var(--p-test-gutter) 56px; }
	.p-test h2.kc-near__label { margin-bottom: 32px; padding-bottom: 15px; font-size: 22px; line-height: 1.4; }
	.p-test h2.kc-near__label::after { height: 6px; }
	.p-test p.kc-near__sub { font-size: 14px; margin-bottom: 14px; }
	.p-test .kc-near__sub b { font-size: 18px; }
	.p-test .kc-near .kc-near__gps { width: 100%; min-width: 0; min-height: 0; margin-bottom: 24px; padding: 15px 16px; font-size: 15px; gap: 8px; }
	.p-test .kc-near .kc-near__gps svg { width: 18px; height: 18px; }
	.p-test .kc-near__gps-pc { display: none; }
	.p-test ul.kc-near__grid { gap: 8px 6px; }
	.p-test a.kc-near__btn { padding: 14px 6px; }
	.p-test .kc-near__name { font-size: 16px; }
	.p-test .kc-near__chev { right: 8px; width: 7px; height: 7px; }

	/* 受験概要 */
	.p-test-overview__table th { width: 96px; padding: 12px 10px; font-size: 16px; }
	.p-test-overview__table td { padding: 12px; }
}

/* タブレット・狭めたブラウザ（600〜959px）：SPの組み方のまま、中身を600pxに収めて中央へ。背景は全幅のまま */
@media (min-width: 600px) and (max-width: 959px) {
	.p-test-steps::before { background-size: 153.8% auto; }
	.p-test-sec__inner,
	.p-test-mv__text,
	.p-test-mv__person {
		max-width: 600px;
		margin-inline: auto;
	}
	.p-test-mv__text { padding-inline: 0; }
}

/* ==========================================================================
   お近くの教室を探す：TOP（2026-10-30 本番反映）の新しい見た目にそろえる（2026-10-30 ユーザー指示）。
   見出しはこのページのほかの見出しの形（黄色の下線）のまま。「全国約370校！」もこのページでは重複しないので残す。
   ========================================================================== */
/* 背景：#f7f9ed → ミント #F0F8F5。上下の余白は TOP と同じ PC40px・SP32px */
.p-test-area { background: #F0F8F5; padding-top: 40px; padding-bottom: 40px; }
@media (max-width: 959px) { .p-test-area { padding-top: 32px; padding-bottom: 32px; } }
/* 現在地ボタン：深緑のグラデーション＋影（白いふちは無し）。ボタン→都道府県ボタンの間は32px */
.p-test .kc-near .kc-near__gps {
	background: linear-gradient(to bottom, #135F38 0%, #004D26 50%);
	border: 0;
	color: #fff;
	box-shadow: 0 4px 6px -2px rgba(0, 0, 0, 0.2);
	transition: filter 0.15s ease;
	margin-bottom: 32px;
}
.p-test .kc-near .kc-near__gps:hover {
	background: linear-gradient(to bottom, #135F38 0%, #004D26 50%);
	color: #fff;
	filter: brightness(1.15);
}
/* PCは4列・最大1000px（コンテンツ幅） */
@media (min-width: 960px) {
	.p-test ul.kc-near__grid { max-width: 1000px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* SPは矢印を出さない（県名はカードの中央） */
@media (max-width: 959px) { .p-test .kc-near__chev { display: none; } }
/* 「個別指導キャンパスは全国約370校！」を出さない（2026-10-30 ユーザー指示・TOPと同じ）。共通部品の中身は変えない */
.p-test p.kc-near__sub { display: none; }
/* 見出し→現在地ボタンの間を32px（PC40px → TOPと同じ32px。SPは元から32px。2026-10-30 ユーザー指示） */
.p-test h2.kc-near__label { margin-bottom: 32px; }