@charset "utf-8";
/*==================================================
	【サブ】ページ固有のスタイル
==================================================*/
#faq h3 {
	margin-bottom: 20px;
	color: var(--color-primary);
	font-size: 30px;
}
#faq p+h3 {
	margin-top: 50px;
}
#faq dl {
	background: #f5f5f5;
}
#faq .bg_gray dl {
	background: #fff;
}
#faq dl+dl {
	margin-top: 30px;
}
#faq dt,
#faq dd {
	position: relative;
	padding: 15px;
	padding-left: 80px;
}
#faq dt {
	background: var(--color-primary);
	color: #fff;
	font-size: 115%;
	font-weight: bold;
}
#faq dt::before,
#faq dd::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 60px;
	height: 100%;
	background: var(--color-secondary);
	color: var(--color-primary);
	font-size: 30px;
	font-weight: bold;
	content: "Q";
	/* 縦方向中央揃え */
	display: flex;
	align-items: center;
	justify-content: center;
}
#faq dd::before {
	height: 60px;
	background: none;
	color: var(--color-primary);
	content: "A";
}
@media only screen and (max-width: 768px) {  /* タブレット以下 */
	#faq h3 {
		font-size: 25px;
	}
}
@media only screen and (max-width: 640px){ /* スマホ */
	#faq h3 {
		font-size: 20px;
	}
	#faq dt {
		padding-left: 60px;
		font-size: 110%;
		line-height: 1.5;
	}
	#faq dd {
		padding-left: 50px;
	}
	#faq dt::before,
	#faq dd::before {
		width: 40px;
		font-size: 25px;
	}
}