@charset "UTF-8";
@import url("../../common/css/reset.css?v=20250501");
@import url("../../common/css/base.css?v=20250501");
@import url("../../common/css/content.css?v=20250501");

.faq_box ul li {
	float: left;
	padding-right: 20px;
}
.faq_box {
	margin-top: 20px;
}

.faq_box.clearfix ul li a {
	color: #666;
	text-decoration: none;
}
.faq_box.clearfix .faq_box_02 {
	clear: both;
	height: 20px;
}


.qa_box details {
	border-bottom: 2px solid #FFF;
	margin-bottom: 0.5rem;
	width: 100%;
}

.qa_box details summary {
	background-image: url("../../faq/images/question.gif");
	background-repeat: no-repeat;
	background-position: left center;
	font-size: 1.2em;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	padding: .5em .5em .5em 2em;
	color: #666;
	cursor: pointer;
}

.qa_box details summary::after {
	transform: translateY(-25%) rotate(45deg);
	width: 7px;
	height: 7px;
	margin-left: 10px;
	border-bottom: 3px solid #666666b3;
	border-right: 3px solid #666666b3;
	content: '';
	transition: transform .3s;
}

.qa_box details[open] summary::after {
    transform: rotate(225deg);
}
.qa_box details p {
	background-image: url("../../faq/images/answer.gif");
	background-repeat: no-repeat;
	background-position-y: 0.5em;
	transform: translateY(-10px);
	opacity: 0;
	margin: 0 !important;
	padding: .25em 2em 0.5em;
	color: #67D;
	transition: transform .5s, opacity .5s;
	line-height: 1.1em;
	font-size: 1.1em;
}
.qa_box details[open] p {
	transform: none;
	opacity: 1;
}