@import url('/css/board.css');

.s-faq-page {
	min-height:620px;
	padding:80px 0 110px;
	background:#f4f5f6;
}

.s-faq-container {
	width:min(calc(100% - 48px), 1040px);
}

.s-faq-list {
	margin-top:44px;
	padding:36px;
	background:#fff;
}

.s-faq-list::before {
	display:block;
	border-top:1px solid #163c54;
	content:"";
}

.s-faq-item { border-bottom:1px solid #dce7e8; }
.s-faq-question { display:flex; width:100%; min-height:74px; align-items:center; justify-content:space-between; padding:0 24px; color:#163c54; text-align:left; font-size:15px; font-weight:700; }
.s-faq-icon { position:relative; display:block; width:22px; height:22px; flex:0 0 22px; color:#2d8d80; }
.s-faq-icon::before,
.s-faq-icon::after { position:absolute; top:50%; left:50%; width:16px; height:2px; border-radius:2px; background:currentColor; content:""; transform:translate(-50%, -50%); transition:transform .2s ease; }
.s-faq-icon::after { transform:translate(-50%, -50%) rotate(90deg); }
.s-faq-item.is-open .s-faq-icon::after { transform:translate(-50%, -50%) rotate(0); }
.s-faq-answer { display:none; padding:0 64px 25px 24px; color:#667783; font-size:13px; line-height:1.8; }
.s-faq-item.is-open .s-faq-answer { display:block; }

@media (max-width:640px) {
	.s-faq-page {
		padding:45px 0 65px;
	}

	.s-faq-container {
		width:min(calc(100% - 32px), var(--s-max));
	}

	.s-faq-list {
		margin-top:30px;
		padding:18px 12px;
	}

	.s-faq-question {
		min-height:64px;
		padding:0 4px;
		font-size:13px;
	}

	.s-faq-answer {
		padding:0 4px 20px;
		font-size:12px;
	}
}
