@charset "UTF-8";
/* =====================================================
ポテンシャル(未経験)採用 | /recruit/potential/

読み込み: header-recruit.php（$page_slug = potential）
Figma: 採用HPデザイン node 472:6615（recruit/potential 短縮案）

メインビジュアルは経験者採用（css/career.css の .recruit-career-mv）と同じ構成。
OUR STANCE 以降の本文は短縮案に合わせる。メインビジュアルも本文も、中身の幅は --recruit--contents--width。
セクション背景は .is-stance（ピンクのぼかし）／.is-ai（写真＋黒 40%）／.is-gradient（グラデ＋ノイズ）／.is-pattern（ベージュ＋柄）。
======================================================== */

/* -----------------------------------------------------
メインビジュアル（Figma: Frame 49）
-------------------------------------------------------- */
.recruit-potential-mv {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 40px;
	min-height: 680px;
	padding: 40px var(--recruit--gutter);
	background: url("../img/recruit/potential/mv-bg.png") no-repeat center center / cover;
	overflow: hidden;
}

/* 斜めの白い帯（Figma: Vector 2。白 50%＋背景ぼかし・45度）
   上端で左から 280px〜1123px（1440px 幅のとき）の帯を、高さぶんだけ右へ倒す */
.recruit-potential-mv__band {
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(280 / 1440 * 100%);
	width: calc(843 / 1440 * 100%);
	background-color: rgba(255, 255, 255, .5);
	-webkit-backdrop-filter: blur(10.7px);
	backdrop-filter: blur(10.7px);
	transform: skewX(45deg);
	transform-origin: left top;
	pointer-events: none;
}

/* 人物（Figma: 878 × 638・上端から左に置く。ボタンの裏に回る） */
.recruit-potential-mv__person {
	position: absolute;
	top: 40px;
	left: 0;
	width: calc(878 / 1440 * 100%);
	height: auto;
	max-width: none;
	pointer-events: none;
}

.recruit-potential-mv__body {
	position: relative;
	flex: 1 0 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 33px;
	width: 100%;
	max-width: var(--recruit--contents--width);
	margin-inline: auto;
	padding: 20px;
	color: var(--recruit--color--text);
}

/* コピーは右寄せ（Figma: 幅 699px の箱に余白 20px） */
.recruit-potential-mv__ttl,
.recruit-potential-mv__lead {
	width: 659px;
	max-width: 100%;
	margin: 0 0 0 auto;
	mix-blend-mode: multiply;
}

.recruit-potential-mv__btns {
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 30px;
	width: 100%;
	max-width: var(--recruit--contents--width);
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

/* ---- Curriculum／ENTRY ボタン（Figma: btn-xl） ---- */
.recruit-potential-mv-btn__in {
	display: flex;
	align-items: center;
	gap: 20px;
	height: 100%;
	padding: 20px 20px 20px 40px;
	border-radius: var(--recruit--radius--lg);
	color: var(--recruit--color--white);
	text-decoration: none;
	overflow: hidden;
	transition: opacity .2s;
}

.recruit-potential-mv-btn__in:hover {
	opacity: .85;
}

.recruit-potential-mv-btn.is-red .recruit-potential-mv-btn__in {
	background-color: var(--recruit--color--red);
}

/* ENTRY はヘッダー／フッターの Enter と同じ柄（common/bg_mv01.png） */
.recruit-potential-mv-btn.is-teal .recruit-potential-mv-btn__in {
	background: var(--recruit--color--teal) url("../img/recruit/common/bg_mv01.png") no-repeat center center / cover;
}

.recruit-potential-mv-btn__txt {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
}

.recruit-potential-mv-btn__ja {
	font-size: 3.2rem;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: 0.05em;
}

.recruit-potential-mv-btn__en {
	font-family: var(--recruit--font--en);
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0;
}

/* 矢印アイコン（四角が currentColor、矢印は --recruit-btn-arw--color） */
.recruit-potential-mv-btn__ico {
	flex: 0 0 auto;
	display: block;
	width: 25px;
	height: 25px;
	border-radius: 3px;
	background-color: currentColor;
	overflow: hidden;
}

.recruit-potential-mv-btn__ico svg {
	display: block;
	width: 100%;
	height: 100%;
}

/* Figma: 赤ボタンの矢印は黒地に白矢印 */
.recruit-potential-mv-btn.is-red .recruit-potential-mv-btn__ico {
	--recruit-btn-arw--color: var(--recruit--color--white);
	color: var(--recruit--color--text);
}

.recruit-potential-mv-btn.is-teal .recruit-potential-mv-btn__ico {
	--recruit-btn-arw--color: var(--recruit--color--teal);
	color: var(--recruit--color--white);
}

.recruit-potential-mv-btn__in:hover .recruit-potential-mv-btn__ico svg {
	animation: recruit-btn-arrow .5s ease-in-out;
}

/* -----------------------------------------------------
本文セクション共通（中身の幅は採用サイト共通の --recruit--contents--width）
-------------------------------------------------------- */
.recruit-potential-sec {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 40px;
	padding: 80px var(--recruit--gutter);
	color: var(--recruit--color--text);
}

/* 背景（::before / ::after）より前に出す */
.recruit-potential-sec > * {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: var(--recruit--contents--width);
	margin-inline: auto;
}

/* リード文は読みやすい幅に収めて中央へ */
.recruit-potential-sec > .recruit-potential-sec__lead {
	max-width: 960px;
	text-align: center;
}

.recruit-potential-sec > .recruit-potential-sec__lead.is-narrow {
	max-width: 760px;
}

.recruit-potential-sec__lead,
.recruit-potential-sec__lead p {
	margin-block: 0;
}

/* 見出しの行間は Figma に合わせる（共通の ttl01 は 2 で、本文より間延びする。応募だけ 58px） */
.recruit-potential-sec .c-recruit-ttl01__ja {
	line-height: 1.55;
}

.recruit-potential-sec.is-pattern .c-recruit-ttl01__ja {
	line-height: 2;
}

.recruit-potential-sec__lead p + p {
	margin-top: 12px;
}

.recruit-potential-sec__lead .recruit-potential-sec__sub {
	color: #666;
}

.recruit-potential-sec a:not([class]) {
	color: var(--recruit--color--teal);
	text-decoration: underline;
}

.recruit-potential-sec em,
.recruit-potential-modal em {
	color: var(--recruit--color--red);
	font-style: normal;
	font-weight: 700;
}

/* リセットは :where() で詳細度 0 にする（.recruit-potential-sec > * の margin-inline: auto を消さないため） */
:where(.recruit-potential-sec) :where(h3, p, ul, ol, dl, dd) {
	margin-block: 0;
}

:where(.recruit-potential-sec) :where(ul, ol) {
	padding: 0;
	list-style: none;
}

/* 番号（01 など。英字見出しと同じ書体・赤） */
.recruit-potential-num {
	display: inline-block;
	font-family: var(--recruit--font--en);
	font-size: 2.4rem;
	font-weight: 400;
	line-height: 1.7;
	letter-spacing: .04em;
	color: var(--recruit--color--red);
}

.recruit-potential-note {
	color: #666;
}

.recruit-potential-sec > .recruit-potential-note {
	text-align: center;
}

/* ---- 背景のバリエーション ---- */
/* OUR STANCE: 白地に左上と右下だけピンクのぼかし（Figma: img/bg02 ＋ Frame 87） */
.recruit-potential-sec.is-stance {
	overflow: hidden;
	background-color: var(--recruit--color--white);
}

.recruit-potential-sec.is-stance::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 42% 60% at 0% 12%, rgb(255 168 156 / 50%), transparent 100%),
		radial-gradient(ellipse 40% 40% at 100% 100%, rgb(255 205 190 / 45%), transparent 100%);
	pointer-events: none;
}

/* AI時代: 写真（インライン style で指定）に黒 40% */
.recruit-potential-sec.is-ai {
	background-position: center;
	background-size: cover;
	color: var(--recruit--color--white);
}

.recruit-potential-sec.is-ai::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: rgb(0 0 0 / 40%);
	pointer-events: none;
}

/* カリキュラム／成長イメージ: ベージュ→ピンクのグラデーション＋ノイズ（interview の band と同じ） */
.recruit-potential-sec.is-gradient::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgb(240 237 229 / 50%), rgb(255 203 203 / 50%));
	pointer-events: none;
}

.recruit-potential-sec.is-gradient::after {
	content: "";
	position: absolute;
	inset: 0;
	background: url("../img/recruit/common/bg_noise02.png") repeat left top / 256px;
	opacity: .5;
	pointer-events: none;
}

/* 応募: ベージュ＋柄（recruit.css の .recruit-category__item と同じ bg_mv02） */
.recruit-potential-sec.is-pattern {
	background-color: var(--recruit--color--bg);
}

.recruit-potential-sec.is-pattern::before {
	content: "";
	position: absolute;
	inset: 0;
	background: url("../img/recruit/common/bg_mv02.png") repeat left top / 960px auto;
	opacity: .6;
	pointer-events: none;
}

/* -----------------------------------------------------
チップ（角丸100px の小さなラベル）
-------------------------------------------------------- */
.recruit-potential-chips {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
}

.recruit-potential-chips li {
	padding: 6px 14px;
	border-radius: 100px;
	background-color: var(--recruit--color--bg);
	color: var(--recruit--color--text);
}

.recruit-potential-chips.is-teal li {
	padding: 8px 16px;
	background-color: var(--recruit--color--white);
	color: var(--recruit--color--teal);
}

.recruit-potential-chips.is-left {
	justify-content: flex-start;
	gap: 8px;
}

/* -----------------------------------------------------
OUR STANCE: 選考で確認すること（4列 × 2行）
-------------------------------------------------------- */
.recruit-potential-points {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
}

.recruit-potential-points__item {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 20px;
	border-radius: 8px;
	background-color: var(--recruit--color--bg);
}

.recruit-potential-points__txt {
	color: #666;
}

/* 不安に思うこと（水色のボックス） */
.recruit-potential-concerns {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	padding: 32px 40px;
	border-radius: 12px;
	background-color: #e0f3f6;
	text-align: center;
}

.recruit-potential-concerns p {
	margin: 0;
}

/* -----------------------------------------------------
AI時代
-------------------------------------------------------- */
.recruit-potential-ai {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.recruit-potential-ai__box {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 32px;
	border-radius: 12px;
	color: var(--recruit--color--white);
}

.recruit-potential-ai__box.is-glass {
	background-color: rgb(255 255 255 / 20%);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}

.recruit-potential-ai__box.is-teal {
	background-color: var(--recruit--color--teal);
}

.recruit-potential-ai__ttl {
	margin: 0;
}

.recruit-potential-ai__list {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.recruit-potential-ai__list li {
	display: flex;
	align-items: center;
	gap: 12px;
}

.recruit-potential-ai__q {
	flex: 0 0 auto;
	font-family: var(--recruit--font--en);
	font-size: 1.4rem;
	line-height: 1.7;
}

.recruit-potential-ai__chk {
	flex: 0 0 auto;
	font-weight: 700;
}

/* 締めの一文（Figma: 18px で 1 行に収める） */
.recruit-potential-ai__closing {
	font-size: 1.8rem;
}

/* -----------------------------------------------------
社長メッセージ（共通バナー。Figma: 上下 40px）
-------------------------------------------------------- */
.recruit-potential-msg {
	padding-block: 40px;
}

/* -----------------------------------------------------
カリキュラム（4ステップ）
-------------------------------------------------------- */
.recruit-potential-steps {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
}

.recruit-potential-step {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: var(--recruit--radius--lg);
	background-color: var(--recruit--color--white);
}

.recruit-potential-step__img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.recruit-potential-step__body {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 24px;
}

.recruit-potential-step__label {
	display: flex;
	align-items: center;
	gap: 10px;
}

.recruit-potential-step__no {
	display: inline-block;
	padding: 4px 10px;
	border-radius: var(--recruit--radius--sm);
	background-color: var(--recruit--color--red);
	color: var(--recruit--color--white);
	font-family: var(--recruit--font--en);
	font-size: 1.2rem;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: .04em;
	white-space: nowrap;
}

.recruit-potential-step__spec {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: auto !important;
	padding-top: 16px;
	border-top: 1px solid rgba(51, 51, 51, .15);
}

.recruit-potential-step__spec > div {
	display: grid;
	grid-template-columns: 75px minmax(0, 1fr);
	gap: 10px;
}

.recruit-potential-step__spec dt {
	color: var(--recruit--color--teal);
}

/* 受講形式（白いボックス） */
.recruit-potential-format {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	padding: 24px 32px;
	border-radius: 12px;
	background-color: var(--recruit--color--white);
}

.recruit-potential-format__ttl {
	margin: 0;
	color: var(--recruit--color--red);
	font-size: 1.6rem;
}

/* -----------------------------------------------------
受講条件・歓迎する方（3列。Figma: #f5f5f5 のカード）
-------------------------------------------------------- */
.recruit-potential-cond {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.recruit-potential-card {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 28px;
	border-radius: 12px;
	background-color: #f5f5f5;
}

.recruit-potential-card__ttl {
	padding-bottom: 10px;
	font-size: 1.8rem;
}

.recruit-potential-card.is-conditions .recruit-potential-card__ttl {
	color: var(--recruit--color--teal);
}

.recruit-potential-card.is-yes .recruit-potential-card__ttl {
	color: var(--recruit--color--red);
}

.recruit-potential-card.is-no .recruit-potential-card__ttl {
	color: #666;
}

.recruit-potential-list,
.recruit-potential-fit__list {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.recruit-potential-list__item {
	display: flex;
	gap: 10px;
}

.recruit-potential-list__item::before {
	content: "✓";
	flex: 0 0 auto;
	color: var(--recruit--color--teal);
	font-weight: 700;
}

.recruit-potential-card__note {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 14px;
	border-radius: 8px;
	background-color: #e0f3f6;
}

.recruit-potential-card__note p {
	margin: 0;
}

.recruit-potential-card__note p:first-child {
	color: var(--recruit--color--teal);
}

/* チェックすると数を数える（js/potential.js） */
.recruit-potential-fit__item {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	cursor: pointer;
}

/* style.css のフォームリセットで checkbox が消えるため、四角とチェックを自前で描く */
.recruit-potential-fit__item input[type="checkbox"] {
	--fit-color: var(--recruit--color--red);
	position: static;
	display: block;
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin: .3em 0 0;
	border: 2px solid var(--fit-color);
	border-radius: var(--recruit--radius--sm);
	background: var(--recruit--color--white) no-repeat center / 12px;
	opacity: 1;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}

.recruit-potential-card.is-no .recruit-potential-fit__item input[type="checkbox"] {
	--fit-color: #666;
}

.recruit-potential-fit__item input[type="checkbox"]:checked {
	background-color: var(--fit-color);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E");
}

.recruit-potential-fit__item input[type="checkbox"]:focus-visible {
	outline: 2px solid var(--fit-color);
	outline-offset: 2px;
}

.recruit-potential-fit__tally {
	margin-top: auto !important;
	text-align: right;
}

.recruit-potential-fit__tally span {
	font-family: var(--recruit--font--en);
	font-size: 2rem;
}

/* -----------------------------------------------------
成長イメージ（3ステップ）・配属後に関わる仕事（2列）
-------------------------------------------------------- */
.recruit-potential-path {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.recruit-potential-path__item {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 24px;
	border-radius: 12px;
	background-color: var(--recruit--color--white);
}

.recruit-potential-path__item.is-last {
	background-color: var(--recruit--color--teal);
	color: var(--recruit--color--white);
}

.recruit-potential-path__no,
.recruit-potential-biz__en {
	color: var(--recruit--color--red);
	font-family: var(--recruit--font--en);
	font-size: 1.2rem;
	line-height: 1.7;
	letter-spacing: .05em;
}

.recruit-potential-path__item.is-last .recruit-potential-path__no {
	color: var(--recruit--color--white);
}

.recruit-potential-business {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}

.recruit-potential-biz {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	padding: 28px;
	border: 1px solid #ddd;
	border-radius: 12px;
	background-color: var(--recruit--color--white);
}

.recruit-potential-biz__ttl {
	margin: 0;
	font-size: 2.2rem;
	line-height: 1.45;
}

.recruit-potential-biz__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: auto;
	color: var(--recruit--color--red);
	text-decoration: none;
}

.recruit-potential-biz__link:hover {
	text-decoration: underline;
}

/* -----------------------------------------------------
働く魅力（2列 × 2行）
-------------------------------------------------------- */
.recruit-potential-reasons {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}

.recruit-potential-reason {
	display: flex;
	align-items: flex-start;
	gap: 20px;
	padding: 28px;
	border-radius: 12px;
	background-color: var(--recruit--color--bg);
}

.recruit-potential-reason__no {
	flex: 0 0 64px;
	width: 64px;
	color: var(--recruit--color--red);
	font-family: var(--recruit--font--en);
	font-size: 2.8rem;
	line-height: 48px;
	letter-spacing: .04em;
}

.recruit-potential-reason__body {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.recruit-potential-reason__body h3 {
	margin: 0;
	font-size: 1.8rem;
}

.recruit-potential-reason__body em {
	font-weight: inherit;
}

/* -----------------------------------------------------
応募を検討している方へ（ボタンは btn01。Figma: 250 / 250 / 残り）
-------------------------------------------------------- */
.recruit-potential-sec > .recruit-potential-apply {
	display: flex;
	gap: 20px;
	max-width: 960px;
}

.recruit-potential-apply__btn {
	flex: 0 0 250px;
}

.recruit-potential-apply__btn.is-enter {
	flex: 1 1 0;
	min-width: 0;
}

.recruit-potential-apply .c-recruit-btn__txt {
	font-size: 1.8rem;
}

/* -----------------------------------------------------
応募前の確認モーダル（<dialog>）
-------------------------------------------------------- */
/* style.css のリセット（margin: 0 など）でブラウザ既定の中央配置・背景が消えるため、すべて明示する */
.recruit-potential-modal {
	position: fixed;
	inset: 0;
	z-index: 1000;
	width: min(760px, calc(100% - 40px));
	max-width: none;
	height: fit-content;
	max-height: calc(100dvh - 40px);
	margin: auto;
	padding: 0;
	border: 0;
	border-radius: var(--recruit--radius--xl);
	background-color: var(--recruit--color--white);
	box-shadow: 0 10px 40px rgba(0, 0, 0, .25);
	color: var(--recruit--color--text);
	overflow: hidden;
}

.recruit-potential-modal:not([open]) {
	display: none;
}

.recruit-potential-modal[open] {
	display: flex;
	flex-direction: column;
}

.recruit-potential-modal::backdrop {
	background-color: rgba(0, 0, 0, .5);
}

.recruit-potential-modal__body {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 50px 40px 30px;
	overflow-y: auto;
}

.recruit-potential-modal__body h2,
.recruit-potential-modal__body p {
	margin: 0;
}

.recruit-potential-modal__body h2:not(:first-child) {
	margin-top: 20px;
}

.recruit-potential-modal__list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding-left: 1.5em;
	list-style: decimal;
}

.recruit-potential-modal__list li {
	display: list-item;
}

.recruit-potential-modal__list li::marker {
	color: var(--recruit--color--red);
	font-weight: 700;
}

.recruit-potential-modal__actions {
	display: flex;
	justify-content: center;
	gap: 20px;
	padding: 20px 40px;
	border-top: 1px solid rgba(51, 51, 51, .15);
}

.recruit-potential-modal__actions > * {
	flex: 0 0 auto;
	width: auto;
	margin: 0;
}

/* モーダル表示中は背面をスクロールさせない */
body:has(.recruit-potential-modal[open]) {
	overflow: hidden;
}

.recruit-potential-modal__cancel {
	min-width: 160px;
	padding: 10px 30px;
	border: 1px solid var(--recruit--color--text);
	border-radius: var(--recruit--radius--md);
	background: var(--recruit--color--white);
	color: var(--recruit--color--text);
	cursor: pointer;
}

.recruit-potential-modal__close {
	position: absolute;
	top: 10px;
	right: 14px;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--recruit--color--text);
	font-size: 2.8rem;
	line-height: 1;
	cursor: pointer;
}

/* -----------------------------------------------------
PC 幅が狭いとき
-------------------------------------------------------- */
@media (768px <= width < 1180px) {
	.recruit-potential-points,
	.recruit-potential-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.recruit-potential-cond,
	.recruit-potential-path,
	.recruit-potential-business,
	.recruit-potential-reasons {
		grid-template-columns: minmax(0, 1fr);
	}

	.recruit-potential-sec > .recruit-potential-apply {
		flex-wrap: wrap;
	}

	.recruit-potential-apply__btn {
		flex: 1 1 calc(50% - 10px);
	}

	.recruit-potential-apply__btn.is-enter {
		flex: 1 1 100%;
	}
}

/* -----------------------------------------------------
SP（Figma は PC のみのため暫定）
-------------------------------------------------------- */
@media (width < 768px) {
	/* メインビジュアル: 人物を上、コピーとボタンを下に積む */
	.recruit-potential-mv {
		min-height: 0;
		gap: 20px;
		padding-top: calc(100vw * 854 / 1181 * .85);
		padding-bottom: 20px;
	}

	.recruit-potential-mv__band {
		left: 30%;
		width: 80%;
	}

	.recruit-potential-mv__person {
		top: 0;
		left: 0;
		width: 100%;
	}

	.recruit-potential-mv__body {
		gap: 16px;
		padding: 20px;
		border-radius: var(--recruit--radius--lg);
		background-color: rgba(255, 255, 255, .7);
	}

	.recruit-potential-mv__ttl,
	.recruit-potential-mv__lead {
		width: auto;
		margin-left: 0;
	}

	.recruit-potential-mv__lead br {
		display: none;
	}

	.recruit-potential-mv__btns {
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
	}

	.recruit-potential-mv-btn__in {
		padding: 14px 16px 14px 20px;
	}

	.recruit-potential-mv-btn__ja {
		font-size: 2.4rem;
	}

	.recruit-potential-mv-btn__en {
		font-size: 1.4rem;
	}

	/* 本文 */
	.recruit-potential-sec {
		gap: 30px;
		padding-block: 50px;
	}

	.recruit-potential-msg {
		padding-block: 20px;
	}

	.recruit-potential-points {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.recruit-potential-points__item {
		padding: 16px;
	}

	.recruit-potential-concerns {
		padding: 24px 20px;
	}

	.recruit-potential-ai,
	.recruit-potential-steps,
	.recruit-potential-cond,
	.recruit-potential-path,
	.recruit-potential-business,
	.recruit-potential-reasons {
		grid-template-columns: minmax(0, 1fr);
		gap: 20px;
	}

	.recruit-potential-ai__box {
		padding: 24px 20px;
	}

	.recruit-potential-card {
		padding: 24px 20px;
	}

	.recruit-potential-biz {
		padding: 24px 20px;
	}

	.recruit-potential-reason {
		gap: 14px;
		padding: 24px 20px;
	}

	.recruit-potential-reason__no {
		flex-basis: 44px;
		width: 44px;
		font-size: 2.2rem;
	}

	.recruit-potential-format {
		padding: 20px;
	}

	.recruit-potential-sec > .recruit-potential-apply {
		flex-direction: column;
	}

	.recruit-potential-apply__btn,
	.recruit-potential-apply__btn.is-enter {
		flex: 0 0 auto;
		width: 100%;
	}

	.recruit-potential-modal__body {
		padding: 50px 20px 20px;
	}

	.recruit-potential-modal__actions {
		flex-direction: column-reverse;
		padding: 16px 20px;
		gap: 10px;
	}
}