@charset "utf-8";

/* -----------------------------------------------------------
CSS Information

 File name:      faq.css

----------------------------------------------------------- */

.col04 > ul > li{
border-right: 1px solid #eee;
border-bottom: 1px solid #eee;
        display:-webkit-box;
        display:-moz-box;
        display:-ms-flexbox;
        display:-webkit-flex;
        display:-moz-flex;
        display:flex;
        -webkit-box-align:center;
        -moz-box-align:center;
        -ms-flex-align:center;
        -webkit-align-items:center;
        -moz-align-items:center;
        align-items:center;
        -webkit-box-pack:center;
        -moz-box-pack:center;
        -webkit-flex-pack:center;
        -moz-flex-pack:center;
        -ms-flex-pack:center;
        -webkit-justify-content:center;
        -moz-justify-content:center;
        justify-content:center;
}

.col04 > ul > li:first-child{
background:#9a7d54;
color: #FFF;
padding: 3.5% 1%;
}


.col04 > ul > li a{
color: #000;
width: 100%;
height: 100%;
box-sizing: border-box;
padding: 12% 5%;
        display:-webkit-box;
        display:-moz-box;
        display:-ms-flexbox;
        display:-webkit-flex;
        display:-moz-flex;
        display:flex;
        -webkit-box-align:center;
        -moz-box-align:center;
        -ms-flex-align:center;
        -webkit-align-items:center;
        -moz-align-items:center;
        align-items:center;
        -webkit-box-pack:center;
        -moz-box-pack:center;
        -webkit-flex-pack:center;
        -moz-flex-pack:center;
        -ms-flex-pack:center;
        -webkit-justify-content:center;
        -moz-justify-content:center;
        justify-content:center;
}

.faq_btn{
letter-spacing: 1px;
text-align: center;
position: relative;
padding: 5px 0 15px 0;
}

.faq_btn::after{
position:absolute;
font-family: FontAwesome;
content: "\f107";
color: #9a7d54;
width: 14px;
height: 14px;
margin: auto;
top:auto;
bottom:0;
left: 0;
right: 0;
}

.col02 > ul {
margin: 0;
}


.col02 > ul > li{
border-right: 1px solid #eee;
border-bottom: 1px solid #eee;
margin: 0;
padding: 50px 0; 
}

.col02 > ul > li:first-child{
width: 100%;
padding: 80px 0;
border-right: none;
border-top: 1px solid #eee;
background: #9a7d54;
color: #fff;
}

.col02 > ul > li:first-child .col_tit:after {
    border-bottom: 1px solid #fff;
}

.faq_area{
width: 70%;
box-sizing: border-box;
position: relative;
margin: 0 auto;
text-align: left;
}

.contentWrap {
padding: 20px 20px 20px 50px;
position:relative;
}
.contentWrap::before {
    position: absolute;
    font-family: 'Spectral SC', serif;
    content: "A";
    line-height: 1;
    font-size: 40px;
    width: 40px;
    height: 40px;
    top: 30%;
    bottom: auto;
    left: 0;
    right: auto;
    margin: auto;
    color: rgba(000,000,000,0.2);
	}

.switch {
font-weight: bold;
padding:30px 40px 30px 50px;
border-bottom: 1px solid RGBA(0,0,0,0.2);
position: relative;
}

.switch::before {
    position: absolute;
    font-family: 'Spectral SC', serif;
    content: "Q";
	font-weight: normal;
    line-height: 1;
    font-size: 40px;
    width: 40px;
    height: 40px;
    top: 0;
    bottom: 0;
    left: 0;
    right: auto;
    margin: auto;
    color: rgba(000,000,000,0.2);
	}


@media screen and (max-width: 1000px){
.faq_area{
width: 90%;
}
}
@media screen and (max-width: 800px){
.col02 > ul > li,
.col02 > ul > li:first-child{
width: 100%;
}
.col02 > ul > li {
    padding: 40px 20px;
}

.col02 > ul > li:first-child{
padding: 30px 1%;
}

.col04 > ul > li a {
    padding: 0 5px;
	height: 80px;
}
}