@charset "UTF-8";
/* -------------------------------------------
FAQ
-------------------------------------------*/
.faqttl {
  position: relative;
  display: block;
  padding: 0;
  margin: 0;
  height: 350px;
  background-color: #222529;
  color: #FFFFFF;
  text-align: center;
}
.faqttl h1 {
  position: relative;
  display:block;
  background-image: linear-gradient(135deg, #89BB2F 10%, #74A261 100%);
  background-repeat: no-repeat;
  background-size: 15rem 0.1rem;
  background-position:bottom;
  text-align: center;
  font-size:2em;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  letter-spacing: 0.3rem;
  padding: 200px 0 0.9rem 0;
}
.faqttl p {
  position: relative;
  display: block;  
  color: #DDDDDD;
  font-size: 1em;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
  padding: 0.4rem 0 0 0;
}
.faqdescription{
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  min-height: 300px;
  padding: 70px 15% 20px 15%;
  margin: 0 auto;
}
.faqdescription h2{
  font-family: 'Noto Serif JP', serif;
  font-weight: 300;
  font-size: 2.5em;
  letter-spacing: 0.3rem;
  line-height: 1.8em;
  padding: 0 0 30px 0;
  color: #fff;
}
.faqdescription h3{
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 1.3em;
  letter-spacing: 0.3rem;
  line-height: 2rem;
  padding: 0 0 30px 0;
  color: #fff;
}
.faqdescription p{
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
  padding: 0 0 30px 0;
  color: #fff;
}

.mdbg_faq{
  background: url("../img/faq/m-faq.png") no-repeat center top / cover;
}

.faqmenu h3{
	text-align: center;
	font-weight: 300;
	padding: 0;
	margin: 0 0 10px 0;
}
.faqmenu nav{
  	width: 100%;
  	background-color: #74A261;
	margin: 0 0 20px 0;
	padding: 12px 0 0 0;
	opacity: 0.8;
}
.faqmenu ul{
 	display: flex;
 	justify-content: space-around;
	list-style: none;
	padding: 0 0 10px 0;
	margin: 0;
}
.faqmenu li a{
	color: #fff;
	margin: 0;
	padding: 0;

}
.faqmenu li a:link{
	list-style: none;
	text-decoration: none;
	margin: 0;
	padding: 0;
}
.faqmenu li a:hover{
	display: block;
	opacity: 0.5;
	transition : 1s;	
	margin: 0;
	padding: 0;
}


.faqcol{
  position: relative; 
  padding: 50px 0 50px 0;
}



h2.faqcol{
  font-family: 'Noto Serif JP', serif;
  font-weight: 300;
  font-size: 2.5em;
  letter-spacing: 0.3rem;
  padding: 30px 0 80px 0;
  color: #74A261;
}
h3.faqcol{
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 1.3em;
  letter-spacing: 0.3rem;
  line-height: 2rem;
  padding: 0 0 10px 0;
}
p.faqcol{
  padding: 0 0 2rem 0;
}


.faqcol .accordion-button{
  color: #fff;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;	
  font-size: 0.6em;
  background-image: linear-gradient(45deg, #74A261 50%, #BCDE7E);
}

.faqcol .accordion-button:hover{
  background-image: linear-gradient(45deg, #689356 50%, #96CB35);
}


.faqcol button:before {
	position:relative;
	content: "Q";
    margin-right:0.6em;
    top:0;
    left:0;
    font-family: 'Noto Serif JP', serif;
	font-size: 1.2em;
    color: #9AC370
}

.faqcol .accordion-body{
  font-family: 'Noto Serif JP', serif;
}

.faqcol .accordion-body .h6{
  font-family: 'Noto Sans JP', sans-serif;
}




@media screen and (max-width: 640px) {
	
.faqdescription{
  padding: 50px 20px 20px 20px;
}
.faqmenu ul{
 	display:block;
	text-align: center;	
}
.faqmenu li a{
	color: #fff;
	margin: 0;
	padding: 0;
}
.faqmenu li a:link{
	font-size: 0.9em;
	text-align: center;
}
.faqmenu li a:hover{
	margin: 0;
	padding: 0;
}
h2.faqcol{
  font-size: 1.8em;
  padding: 10px 0 50px 0;
}
h3.faqcol{
	text-align: center;
}
}