/*******************************************
*
* css for よくある質問
*
********************************************/
@charset "UTF-8";


#topImage {
	background-image: url("../images/ttlbg/faq.png")
}



/*------------------------------------------
 FAQリスト
 ------------------------------------------*/
ul.faqList{
	display: block;
	overflow:hidden;
	/*margin:40px 0 25px;*/
}

ul.faqList > li{
	display: block;
	background-color:#ffffff;
	border:1px solid #e6e6e6;
	margin-bottom:15px;
}

ul.faqList > .qBox{
	display: block;
	overflow:hidden;
	font-size:1.8rem;
	line-height:155%;
}

.qBox > a,
.aBox > h5{
	display:block;
	overflow:hidden;
    font-size:1.8rem;
    line-height:155%;
    font-weight:bold;
}


.qBox > a{
	padding:20px;
	color:#000000;
}

.qBox > a:before {
    content: "Q";
    float: left;
    margin-right: 0.5em;
    line-height: 155%;
    font-weight:bold;
}

.qBox > a:after {
    content: "\f106";
    float: right;
    font-size:2.6rem;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.2s ease-out;
}
.qBox > a.show:after{
	transform:rotate(180deg);
}

.qBox > a > span{
	display: inline-block;
    width: calc(100% - 3em);
}


.aBox{
	display:none;
	overflow:hidden;
	padding:0 20px 20px;
}
.aBox > h5{
	border-top:1px solid #e6e6e6;
	padding:20px 0;
}
.aBox > h5:before {
    content: "A";
    float: left;
    margin-right: 0.5em;
    line-height: 155%;
    font-weight:bold;
    color:#ff0000;
}

.aBox > p{
	display:block;
	overflow:hidden;
	font-size:1.4rem;
	line-height:175%;
	padding-left:1.5em;
}



/* for SP --------------------------*/
@media screen and ( max-width:896px) {

	.qBox > a,
	.aBox > h5{
	    font-size:1.4rem;
	}
	
}



/*------------------------------------------
 アンカーリンク
 ------------------------------------------*/
#ancarlink{
	display:block;
	overflow:hidden;
	text-align:center;
	margin-bottom:40px;
	/*padding:0.5em 0;
	margin:30px 0 15px;*/
}

#ancarlink > ul{
	display:block;
	overflow:hidden;
	letter-spacing: -.4em;
}

#ancarlink > ul > li{
	display:inline-block;
	overflow: hidden;
	letter-spacing:normal;
	padding:0 10px;
	margin-bottom:10px;
}

#ancarlink > ul > li > a{
	display:block;
	overflow: hidden;
	min-width:230px;
	position:relative;
	color:#000000;

	text-align:center;
	padding:0.5em 1em;
	font-size:1.8rem;
	line-height:125%;
	border:1px solid #333333;
}


#ancarlink li > a:hover{
	text-decoration:none;
	color:#ffffff;
	background-color:#000000;
}

#ancarlink li > a:after{
	display:inline-block;
	content: "\e901";
	position:absolute;
    top:50%;
    right:1em;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}


/* for SP ---------------------------------*/
@media screen and ( max-width:896px) {

	#ancarlink{
		margin-bottom:20px;
	}

	#ancarlink > ul > li{
		width: 50%;
		padding:0 5px;
		margin-bottom:10px;
	}
	#ancarlink > ul > li > a{
		min-width:100%;
		font-size:1.4rem;
		padding:0.5em 0.25em;
	}

	#ancarlink li > a:after{
		display:block;
		width:100%;
		position:relative;
		top:auto;
		right:auto;
	    transform:none;
	    -webkit-transform:none;
	}
}


/*------------------------------------------
 本文フレーム
 ------------------------------------------*/
#faqBody{
	display:block;
	overflow:hidden;
	background-color:#ededee;
	/*margin-bottom:50px;*/
	padding-bottom:50px;
}

#faqBody h3{
	display:block;
	overflow:hidden;
	color:#333333;
	font-size: 2.8rem;
	font-weight:bold;
	line-height:125%;
	text-align:center;
	margin-bottom:40px;
}

.listBox{
	display:block;
	overflow:hidden;
	padding-top:60px;
}

/* for SP --------------------------*/
@media screen and ( max-width:896px) {

	#faqBody{
		/*margin-bottom:40px;*/
		padding-bottom:40px;
	}

	#faqBody h3{
		font-size: 1.8rem;
		margin-bottom:40px;
	}

	.listBox{
		padding-top:40px;
	}

}