@charset "utf-8";

/* ==========================================================
   採用FAQ (page-faq.php)
   ========================================================== */

/* ----------------------------------------------------------
   パンくず / c-page-title 前後余白
   ---------------------------------------------------------- */
.faq-page .c-breadcrumb {
	padding-top: 26px;
}

.faq-page .c-page-title {
	margin-top: 108px;
}
@media (max-width: 767px) {
	.faq-page .c-page-title {
		margin-top: 60px;
	}
}

/* ----------------------------------------------------------
   コンテンツラッパー
   ---------------------------------------------------------- */
.faq {
	max-width: 1160px;
	margin: 120px auto 0;       /* c-page-title からの距離 */
	padding: 0 30px;
}
@media (max-width: 767px) {
	.faq {
		margin-top: 60px;
	}
}

/* ----------------------------------------------------------
   Qブロック
   ---------------------------------------------------------- */
.faq__block + .faq__block {
	margin-top: 62px;
}
@media (max-width: 767px) {
	.faq__block + .faq__block {
		margin-top: 36px;         /* PC 62 × 0.58 */
	}
}

/* --- 見出し (番号バッジ + 質問文) --- */
.faq__head {
	display: flex;
	align-items: center;
	gap: 22px;
	padding-bottom: 15px;
	border-bottom: 4px solid #333;
}
@media (max-width: 767px) {
	.faq__head {
		gap: 20px;
		padding-bottom: 10px;
	}
}

.faq__num {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 48px;
	height: 50px;
	background: var(--color-primary);
	color: var(--color-white);
	font-family: var(--font-heading);
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 2.4px;
	text-align: center;
}
@media (max-width: 767px) {
	.faq__num {
		font-size: 16px;
		letter-spacing: 1.6px;
	}
}

.faq__question {
	color: #333;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.4;
}
@media (max-width: 767px) {
	.faq__question {
		font-size: 14px;
		line-height: 1.5;
	}
}

/* --- 本文エリア --- */
.faq__body {
	margin-top: 18px;
}
@media (max-width: 767px) {
	.faq__body {
		margin-top: 24px;
	}
}

.faq__body p {
	color: #535353;
	line-height: 2;
}

@media (max-width: 767px) {
	.faq__body p {
		font-size: 12px;
		line-height: 1.6;
	}
}

.faq__body p + p {
	margin-top: 16px;             /* 段落間 (PC 仮値) */
}
@media (max-width: 767px) {
	.faq__body p + p {
		margin-top: 16px;
	}
}

/* --- 【】付き小見出し / 「1.寮」など --- */
.faq__sub {
	margin-top: 24px;              /* 小見出し上 (仮) */
	color: #000;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
}
.faq__body > .faq__sub:first-child {
	margin-top: 0;                 /* body先頭の小見出しは上余白なし */
}
@media (max-width: 767px) {
	.faq__sub {
		margin-top: 22px;
		font-size: 12px;
	}
}


/* ----------------------------------------------------------
   STEP エリア (02)
   ---------------------------------------------------------- */


.faq__step {
	display: flex;
	gap: 28px;
}

.faq__step + .faq__step {
	margin-top: 27px;
}
@media (max-width: 767px) {
	.faq__step {
		gap: 18px;
	}
	.faq__step + .faq__step {
		margin-top: 18px;
	}
}

.faq__step-badge {
	display: flex;
	justify-content: center;
	flex-shrink: 0;
	padding-top: 7px;
	width: 72px;
	height: 44px;
	background: url(../../images/faq/faq_step-badge.svg) no-repeat center / contain;
	color: #333;
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
	text-align: center;
}
@media (max-width: 767px) {
	.faq__step-badge {
		width: 58px;                 /* PC 72 × 0.8 (バッジ内文字がはみ出さない範囲で縮小) */
		height: 36px;
		font-size: 12px;
	}
}

.faq__body .faq__step-text {
	color: #000;
	padding-top: 8px;
	line-height: 1;
}
@media (max-width: 767px) {
	.faq__body .faq__step-text {
		line-height: 1.6;
		padding-top: 4px;
		
	}
}

/* --- 内々定 --- */
p.faq__naitei {
	margin-top: 20px;             
	margin-bottom: 33px;           
	color: var(--color-primary);
	font-size: 24px;
	font-weight: 500;
	line-height: 1;
}
@media (max-width: 767px) {
	p.faq__naitei {
		margin-top: 22px;
		margin-bottom: 28px;
		font-size: 20px;
	}
}

/* ----------------------------------------------------------
   お問い合わせ
   ---------------------------------------------------------- */
.faq__contact {
	margin-top: 43px; 
}
@media (max-width: 767px) {
	.faq__contact {
		margin-top: 90px;
	}
}

.faq__contact-lead {
	color: #000;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.6;
}
@media (max-width: 767px) {
	.faq__contact-lead {
		font-size: 12px;
	}
}

.faq__contact-dept {
	margin-top: 12px;
	color: var(--color-text);
	font-size: 16px;
	line-height: 1.6;
	padding-left: 20px;
}
@media (max-width: 767px) {
	.faq__contact-dept {
		margin-top: 10px;
		font-size: 12px;
		padding-left: 0;
	}
}

.faq__contact-info {
	margin-top: 8px; 
	display: flex;
	flex-wrap: wrap;
	column-gap: 24px;
	row-gap: 4px;
	align-items: center;
	padding-left: 20px;
}
@media (max-width: 767px) {
	.faq__contact-info {
		display: grid;                /* 1列目: ラベル / 2列目: 値 の2行 */
		grid-template-columns: auto 1fr;
		align-items: baseline;
		justify-content: start;
		column-gap: 4px;
		row-gap: 4px;
		padding-left: 0;
	}
}

.faq__contact-label {
	color: var(--color-text);
	line-height: 2;
}
@media (max-width: 767px) {
	.faq__contact-label {
		font-size: 12px;
	}
}
/* 2つ目以降のラベル (E-mail) は、前の値 (電話番号) との間隔を広げる */
.faq__contact-info .faq__contact-label:not(:first-child) {
	margin-left: 32px;
}
@media (max-width: 767px) {
	.faq__contact-info .faq__contact-label:not(:first-child) {
		margin-left: 0;               /* SP は縦積みのため不要 */
	}
}

.faq__contact-info a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;              /* SP タップ領域 44px 確保 */
	color: var(--color-primary);
	font-size: 18px;
	line-height: 1.8;
}

@media (max-width: 767px) {
	.faq__contact-info a {
		font-size: 16px;
	}
}