@charset "UTF-8";
/* ---------------------------------------
  よくあるご質問
-----------------------------------------*/
.faq_nav {
	padding: 7rem 0 8rem;
}
@media screen and (max-width: 767px) {
	.faq_nav {
		padding: 3rem 0 8rem;
	}
}
.faq_nav .list {
	counter-reset: faq_nav;
}
@media screen and (min-width: 768px) {
	.faq_nav .list {
		columns: 2;
		column-gap: 5.7rem;
	}
}
.faq_nav .list li {
	color: #000000;
	font-size: 1.8rem;
	line-height: 1.8888888889;
}
@media screen and (max-width: 767px) {
	.faq_nav .list li {
		font-size: 2.4rem;
		line-height: 1.8333333333;
	}
}
.faq_nav .list li a {
	display: block;
	padding: 1rem 5rem;
	background-image: linear-gradient(to right, #D0D0D0 0.2rem, transparent 0.2rem);
	background-repeat: repeat-x;
	background-size: 0.4rem 1px;
	background-position: left bottom;
	position: relative;
	transition: color 0.3s ease;
}
@media screen and (max-width: 767px) {
	.faq_nav .list li a {
		padding: 1.8rem 5.6rem;
	}
}
.faq_nav .list li a::before {
	content: "Q" counter(faq_nav);
	counter-increment: faq_nav;
	color: #188060;
	font-family: "EB Garamond", serif;
	font-weight: 400;
	font-size: 2rem;
	line-height: 1;
	letter-spacing: 0.04em;
	position: absolute;
	left: 0.6rem;
	top: 1.8rem;
}
@media screen and (max-width: 767px) {
	.faq_nav .list li a::before {
		font-size: 2.4rem;
		left: 0;
		top: 2.8rem;
	}
}
.faq_nav .list li a::after {
	content: "";
	width: 1.1rem;
	height: 1.1rem;
	border-right: 0.3rem solid #188060;
	border-bottom: 0.3rem solid #188060;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-60%) rotate(45deg);
	transition: transform 0.3s ease;
}
@media screen and (max-width: 767px) {
	.faq_nav .list li a::after {
		width: 1.7rem;
		height: 1.7rem;
		border-width: 0.4rem;
	}
}
@media (any-hover: hover) {
	.faq_nav .list li a:hover {
		color: #188060;
	}
	.faq_nav .list li a:hover::after {
		transform: translateY(-20%) rotate(45deg);
	}
}

/* sec_faq
--------------------------------*/
#sec_faq {
	padding: 14rem 0;
	margin-bottom: 14rem;
}
@media screen and (min-width: 768px) {
	#sec_faq::before {
		content: "";
		width: calc(100% + (100vw - 134rem) / 2);
		height: 100%;
		background-color: #FAF9F5;
		position: absolute;
		right: 0;
		top: 0;
	}
}
@media screen and (max-width: 767px) {
	#sec_faq {
		padding: 6rem 0 11rem;
		background-color: #FAF9F5;
		margin-bottom: 11rem;
	}
}
#sec_faq .faq_list {
	position: relative;
	counter-reset: faq_list;
}
#sec_faq .faq_list .item + .item {
	margin-top: 3.7rem;
}
@media screen and (max-width: 767px) {
	#sec_faq .faq_list .item + .item {
		margin-top: 6.7rem;
	}
}
#sec_faq .faq_list .item .ttl {
	color: #000000;
	font-weight: 700;
	font-size: 2rem;
	line-height: 1.7;
	padding: 0.8rem 0 1.6rem 7.7rem;
	position: relative;
}
@media screen and (max-width: 767px) {
	#sec_faq .faq_list .item .ttl {
		font-size: 3rem;
		line-height: 1.4666666667;
		padding: 0 9.7rem 1.6rem 9.5rem;
		cursor: pointer;
	}
}
#sec_faq .faq_list .item .ttl::before {
	content: "Q" counter(faq_list);
	counter-increment: faq_list;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 5.8rem;
	height: 5.8rem;
	color: #ffffff;
	font-family: "EB Garamond", serif;
	font-weight: 600;
	font-size: 2.4rem;
	line-height: 1;
	background-color: #188060;
	position: absolute;
	left: 0;
	top: 0;
}
@media screen and (max-width: 767px) {
	#sec_faq .faq_list .item .ttl::before {
		width: 6.8rem;
		height: 6.8rem;
		font-size: 2.8rem;
	}
}
#sec_faq .faq_list .item .ttl::after {
	content: "";
	width: calc(100% - 7.7rem);
	height: 0.2rem;
	background-color: #188060;
	position: absolute;
	left: 7.7rem;
	bottom: 0;
}
@media screen and (max-width: 767px) {
	#sec_faq .faq_list .item .ttl::after {
		width: calc(100% - 9.5rem);
		left: 9.5rem;
	}
}
@media screen and (max-width: 767px) {
	#sec_faq .faq_list .item .ttl .ico {
		width: 5.2rem;
		height: 5.2rem;
		position: absolute;
		right: 0;
		top: 1.1rem;
	}
	#sec_faq .faq_list .item .ttl .ico::before, #sec_faq .faq_list .item .ttl .ico::after {
		content: "";
		width: 100%;
		height: 0.2rem;
		background-color: #188060;
		position: absolute;
		left: 50%;
		top: 50%;
		translate: -50% -50%;
		transition: rotate 0.3s ease;
	}
	#sec_faq .faq_list .item .ttl .ico::after {
		rotate: 90deg;
	}
}
#sec_faq .faq_list .item.is-open .ttl .ico::after {
	rotate: 0deg;
}
#sec_faq .faq_list .item .txt_wrap {
	padding: 0 0 2.9rem 7.7rem;
	position: relative;
	margin-top: 4rem;
}
@media screen and (max-width: 767px) {
	#sec_faq .faq_list .item .txt_wrap {
		display: none;
		padding: 0 0 2.9rem 9.5rem;
		margin-top: 3.4rem;
	}
}
#sec_faq .faq_list .item .txt_wrap::before {
	content: "A";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 5.8rem;
	height: 5.8rem;
	color: #000000;
	font-family: "EB Garamond", serif;
	font-weight: 600;
	font-size: 3rem;
	line-height: 1;
	background-color: #ffffff;
	border: 1px solid #188060;
	position: absolute;
	left: 0;
	top: 0;
}
@media screen and (max-width: 767px) {
	#sec_faq .faq_list .item .txt_wrap::before {
		width: 6.8rem;
		height: 6.8rem;
		font-size: 3.5rem;
	}
}
#sec_faq .faq_list .item .txt_wrap::after {
	content: "";
	width: calc(100% - 7.7rem);
	height: 1px;
	background-image: linear-gradient(to right, #B6B6B6 0.2rem, transparent 0.2rem);
	background-repeat: repeat-x;
	background-size: 0.4rem 1px;
	background-position: left bottom;
	position: absolute;
	left: 7.7rem;
	bottom: 0;
}
#sec_faq .faq_list .item .txt_wrap .txt {
	color: #000000;
}
#sec_faq .faq_list .item .txt_wrap .txt .bold {
	font-weight: 500;
}