@charset "utf-8";
/*
機　　能　　名：よくあるご質問
作　　成　　日：2020/04/28
作　　成　　者：52WEB WORKS. 関本
更　　新　　日：

/* ***************************************
	faq
**************************************** */

div#faq {
}

/* h_ttl */
@media screen and (min-width: 769px) {/* PC */
#faq .h_ttl_in {
	background:url(../images/faq/main_img_pc.png) center bottom no-repeat;
}
}
@media screen and (max-width: 768px) {/* SP */
#faq .h_ttl {
	background:url(../images/faq/main_img_sp.png) center bottom no-repeat;
	background-size:100% auto;
	-webkit-background-size:100% auto;
}
}

/* ***************************************
	intro
**************************************** */
#intro h3 {
	text-align:center;
	color:#3399CC;
	font-weight:normal;
}
#intro p {
	margin:0 auto;
}
@media screen and (min-width: 769px) {/* PC */
#intro {
	margin-bottom:40px;
}
#intro h3 {
	margin-bottom:40px;
	font-size:35px;
}
}
@media screen and (max-width: 768px) {/* SP */
#intro {
	margin-bottom:30px;
}
#intro h3 {
	margin-bottom:20px;
	font-size:20px;
}
@media screen and (max-width: 320px) {/* w320 */
}
}

/* ***************************************
	faq_contents
**************************************** */
#faq_contents h4 {
	text-align:center;
}
/* faq_box */
div.faq_box {
background:#ECF4FB;
border-top:1px solid #CCC;
margin-top:10px;
}
div.faq_box div.faq_box_in {
margin:0 auto;
}
div.faq_box ul li {
text-align:center;
}
div.faq_box ul li a {
display:block;
color:#FFF;
font-weight:bold;
position:relative;
}
#faq_contents .faq_trouble li a {
	background:url(../images/common/bg_blue.png) 0 0 repeat;
}
#faq_contents .faq_service li a {
	background:url(../images/common/bg_green_2.png) 0 0 repeat;
}
div.faq_box ul li a:after {
	content:"";
	display:block;
	position:absolute;
	left:50%;
	-webkit-transform:translateY(-50%) rotate(135deg);
	transform:translateY(-50%) rotate(135deg);
	width:8px;
	height:8px;
	border-top:2px solid #FFF;
	border-right:2px solid #FFF;
	margin-left:-4px;
}

/* faq_answer */
#faq_contents h5 {
	color:#FFFFFF;
	position:relative;
}
#faq_contents .faq_blue h5 {
	background:#50AEDC;
}
#faq_contents .faq_green h5 {
	background:#56BAA6;
}
#faq_contents h5 {
	font-size:18px;
	padding:15px;
}
.faq_answer dt,
.faq_answer dd {
position:relative;
padding:15px 20px 15px 80px;
line-height:2.2;
}
.faq_answer dt {
line-height:1.5;
}

.faq_blue dt {
background:#DAEDF5;
}
.faq_green dt {
background:#DAF5E8;
}

.faq_answer dd {
line-height:1.8;
}
.faq_answer dt .icon,
.faq_answer dd .icon {
position:absolute;
top:10px;
left:20px;
}
.faq_answer .icon {
position:absolute;
color:#FFFFFF;
border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;
display:inline-block;
text-align:center;
font-weight:bold;
}
.faq_blue dt .icon {
	background:#3C9DCC;
}
.faq_blue dd .icon {
	background:#77BADB;
}
.faq_green dt .icon {
	background:#56BAA6;
}
.faq_green dd .icon {
	background:#8FD1C5;
}
.faq_answer .icon:after {
	content: "";
	position: absolute;
	top: 50%;
	width: 0px;
	height: 0px;
	margin: auto;
	border-style: solid;
	transform: rotate(270deg);
}
.faq_blue dt .icon:after {
	border-color:#3C9DCC transparent transparent transparent;
}
.faq_blue dd .icon:after {
	border-color:#77BADB transparent transparent transparent;
}
.faq_green dt .icon:after {
	border-color:#56BAA6 transparent transparent transparent;
}
.faq_green dd .icon:after {
	border-color:#8FD1C5 transparent transparent transparent;
}

@media screen and (min-width: 769px) {/* PC */
#faq_contents .faq_trouble {
	margin-bottom:40px;
}
#faq_contents .faq_service {
	margin-bottom:100px;
}
/* faq_box */
div.faq_box div.faq_box_in {
width:980px;
padding:20px 0;
}
div.faq_box ul li {
	float:left;
margin:0 6px 10px 0;
}
div.faq_box ul li:nth-child(4),
div.faq_box ul li:nth-child(8) {
	margin-right:0;
}
div.faq_box ul li a {
width:240px;
height:45px;/* total 60px */
padding-top:15px;
font-size:18px;
}
div.faq_box ul li a:hover {
opacity:0.6;
filter:alpha(opacity=60);
text-decoration:none;
}
div.faq_box ul li a:after {
	bottom:4px;
}
/* faq_answer */
.faq_answer {
	margin-bottom:60px;
}
#faq_contents h5 {
	margin-bottom:30px;
}
#faq_contents h5 span {
	position:absolute;
	top:15px;
	right:15px;
	font-size:13px;
	display:inline-block;
	padding-left:20px;
	min-height:17px;
	background:url(../images/common/icon_tool.png) 0 center no-repeat;
	background-size:auto 17px;
	-webkit-background-size:auto 17px;
}
.faq_answer li {
	margin-bottom:30px;
}
.faq_answer li .icon {
top:13px;
left:20px;
	width:41px;
	height:41px;
	line-height:38px;
}
.faq_answer li dt {
font-size:1.4em;
}
.faq_answer li dd .icon {
font-size:1.3em;
}
.faq_answer li .icon:after {
	right:-9px;
	margin-top:-5px;
	border-width: 10px 7px 0 7px;
}

}
@media screen and (max-width: 768px) {/* SP */
#faq_contents .faq_trouble,
#faq_contents .faq_service {
	margin-bottom:40px;
}
/* faq_box */
div.faq_box div.faq_box_in {
	width:90%;
	margin:0 auto;
padding:20px 0;
}
div.faq_box ul li {
margin-bottom:7px;
}
div.faq_box ul li a {
padding-top:7px;
padding-bottom:20px;
font-size:18px;
}
div.faq_box ul li a:after {
	bottom:3px;
}
/* faq_answer */
.faq_answer {
	margin-bottom:30px;
}
#faq_contents h5 {
	margin-bottom:15px;
}
.faq_answer li {
	margin-bottom:20px;
}
.faq_answer li dt,
.faq_answer li dd {
padding:10px 10px 10px 58px;
}
.faq_answer li dt {
font-size:1.2em;
}
.faq_answer li .icon {
top:10px;
left:10px;
	width:33px;
	height:33px;
	line-height:30px;
}
.faq_answer li .icon:after {
	right:-7px;
	margin-top:-4px;
	border-width: 8px 5px 0 5px;
}
@media screen and (max-width: 320px) {/* w320 */
}
}