/* =========================================================
   FAQ ページ専用スタイル
   ========================================================= */

/* 2つ目以降のセクション（採用・求職者向け）の上パディングを半分に */
.page-faq .sec + .sec { padding-top: 45px; }

/* 両セクション同じベース色で統一 */
.page-faq .sec--white { background: #E3ECE9; }

.faq-block__title {
	font-family: var(--ff-jp);
	font-size: 26px;
	font-weight: 700;
	color: #231815;
	line-height: 1.2;
}

.faq-list { margin-top: 30px; }

/* Q&Aカード */
.faq-item {
	background: #FFFFFF;
	padding: 22px 26px 22px 82px;
	margin-bottom: 14px;
	position: relative;
	border-radius: 2px;
}
.faq-item dt {
	font-family: var(--ff-jp);
	font-size: 17px;
	font-weight: 700;
	color: #231815;
	line-height: 1.5;
	position: relative;
}
.faq-item dd {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px dashed #C7CFCB;
	font-family: var(--ff-jp);
	font-size: 15px;
	font-weight: 400;
	color: #2F2F2F;
	line-height: 1.9;
	position: relative;
}

/* Q（緑）/ A（水色）の丸マーク。上下ともテキストの1行目に揃える */
.faq-item__mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	left: -56px;
	top: 50%;
	transform: translateY(-50%);
	width: 32px; height: 32px;
	border-radius: 50%;
	background: #2EC39C;
	color: #FFF;
	font-family: var(--ff-en);
	font-size: 16px;
	font-weight: 700;
}
/* Q は dt(1行目) の中央、A は dd(1行目)の中央に */
.faq-item dt .faq-item__mark { top: 14px; transform: none; }
.faq-item dd .faq-item__mark--a {
	top: 24px; transform: none; background: #4FB8DE;
}

/* その他ボタン（1行に収める・グラデ） */
.faq-cta { margin-top: 46px; text-align: center; }
.faq-cta__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: auto;
	max-width: 100%;
	min-height: 64px;
	padding: 16px 60px;
	background: linear-gradient(90deg, #4FB8DE 0%, #2EC39C 60%);
	color: #FFF;
	font-family: var(--ff-jp);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	border-radius: 4px;
	white-space: nowrap;
}

/* =========================================================
   SP
   ========================================================= */
@media (max-width: 768px) {
	.faq-block__title { font-size: 18px; }
	.faq-list { margin-top: 20px; }

	.faq-item { padding: 16px 16px 16px 56px; margin-bottom: 12px; }
	.faq-item dt { font-size: 14px; }
	.faq-item dd { margin-top: 10px; padding-top: 10px; font-size: 12.5px; line-height: 1.9; }
	.faq-item__mark {
		width: 26px; height: 26px; left: -40px; font-size: 13px;
	}
	.faq-item dt .faq-item__mark { top: 10px; }
	.faq-item dd .faq-item__mark--a { top: 20px; }

	.faq-cta { margin-top: 30px; }
	.faq-cta__btn {
		width: 100%;
		padding: 14px 16px;
		font-size: 13px;
		white-space: normal;
	}
}