/* Faq */
 
.faq_list_section h3.title {
	margin-bottom: 1em;
	font-size: 1.3em;
}
#faq_list_side h2.title {
	font-size: 1.2em;
}
.faq_pane {
	position: relative;
	display: block;
	padding: 1.5em 2em;
	padding: 1.5em 0;
	border-bottom: solid 1px #ccc;
	transition: all 200ms ease-in-out;
}
._faq_pane::before {
	position: absolute;
	left: 2em;
	bottom: 0;
	content: '';
	width: calc(100% - 4em);
	height: 1px;
	background: #ededed;
}
.faq_pane.active {
	background: #fff;
	background: #f3f3f3;
	transition: all 200ms ease-in-out;
}

.faq_pane h4 {
	position: relative;
	margin-bottom: 0;
	font-size: 1.2em;
	font-size: 1.15em;
	font-weight: 500;
	line-height: 1.47em;
	z-index: 10;
}
.faq_q {
	padding: 1rem 0;
	padding-left: 55px;
	width: calc(100% - 90px);
	cursor: pointer;
}
.faq_q::before {
	position: absolute;
	left: 0;
	top: 26px;
	top: 13px;
	content: 'Q';
	font-weight: 500;
	font-size: 1.8em;
	font-size: 1.6em;
	font-family: 'Inter', sans-serif;
}
.faq_a {
	display: none;
	position: relative;
	margin-top: 1em;
	padding: 2em;
	padding-left: 90px;
	background: #f3f3f3;
	background: #fff;
	font-size: 1.15em;
	font-size: 1.07em;
	font-size: 1em;
	border-radius: 14px;
	word-break: keep-all;
	z-index: 10;
}
.faq_a::before {
	position: absolute;
	left: 38px;
	top: 32px;
	content: 'A';
	font-weight: 500;
	font-size: 1.8em;
	font-size: 1.6em;
	font-family: 'Inter', sans-serif;
}
.active .faq_a {
	display: block !important;
	animation: a_show 300ms ease-in-out 1 forwards;
}
@keyframes a_show {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
.faq_a .note {
	line-height: 1.6em;
}
.faq_a a {
	text-decoration: underline;
}
.faq_a p,
.faq_a ul {
	margin-bottom: 1em;
}
.faq_a ul {
	padding-left: 1.5em;
}
.faq_a li {
	list-style-type: disc;
}
.faq_switch {
	position: absolute;
	right: 45px;
	right: 0;
	top: 31px;
	content: '';
	width: 35px;
	height: 35px;
	background: url(../images/common/icon_plus.png) no-repeat center / 70%;
	cursor: pointer;
	animation: faq_close 200ms ease-in-out 1 forwards;
}
.active .faq_switch {
	animation: faq_open 200ms ease-in-out 1 forwards;
}
.faq_pane.active .faq_switch {
	animation: faq_open 200ms ease-in-out 1 forwards;
}

@keyframes faq_open {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(45deg);
	}
}
@keyframes faq_close {
	0% {
		transform: rotate(45deg);
	}
	100% {
		transform: rotate(0deg);
	}
}