@charset "utf-8";
/* faq css */

.g_navi .gnav04 a::before {
opacity: 1;
top: -18px;
}

/*-------------------------------------------------
タブメニュー
-------------------------------------------------*/

.tabs_menu {
display: flex;
justify-content: space-between;
}

.tabs_menu-item {
width: calc( 100% / 2 - 3px);
padding: 16px 20px;
font-size: 1.8rem;
font-weight: 700;
line-height: 100%;
letter-spacing: 0.15em;
color: #555;
border-radius: 5px 5px 0 0;
background: #EFF1F3;
text-align: center;
cursor: pointer;
transition: ease 0.3s;
}
.tabs_menu-item:hover {
background: #5584A6;
color: #fff;
transition: ease 0.3s;
}
.tabs_menu-item.is-active {
background: #5584A6;
color: #fff;
cursor: default;
}
.tabs_body {
display: none;
padding: 50px 0px 40px;
}
.tabs_body.is-active {
display: block; 
}

@media all and (max-width : 820px ){
.tabs_body {
padding: 50px 0px 0px;
}
}

@media all and (max-width : 767px ){
.tabs_menu-item {
width: calc( 100% / 2 - 1px);
padding: 12px 5px;
font-size: 1.2rem;
letter-spacing: 0.05em;
}
.tabs_body {
padding: 15px 0px 0px;
}
}




/*-------------------------------------------------
faq
-------------------------------------------------*/


.list-faq li {
margin-bottom: 20px;
}
.list-faq li .q-ttl {
position: relative;
/*background: #F3F3F3;*/
display: block;
font-weight: 400;
cursor: pointer;
-webkit-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
}
#tab01 .list-faq li .q-ttl {
background: #1D50A2;
color: #fff;
}
#tab02 .list-faq li .q-ttl {
background: #ED99A3;
color: #fff;
}
.list-faq li .q-ttl::before {
content: "Q";
position: absolute;
top: 0;
bottom: 0;
left: 15px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-weight: normal;
color: #8E7742;
line-height: 1;
}
.list-faq li .q-ttl .icn-faq {
position: absolute;
top: 0;
right: 25px;
bottom: 0;
margin-top: auto;
margin-bottom: auto;
}
.list-faq li .list-faq-inner {
position: relative;
display: none;
}
.list-faq li .list-faq-inner a{
text-decoration: underline;
color: #0C4776;
}
.list-faq li .list-faq-inner a:hover{
text-decoration: none;
}
.list-faq-inner p {
font-size: 1.5rem;
line-height: 180%;
letter-spacing: 0.1em;
}
.list-faq-inner .highlight {
background-color: #FFFF26;
font-weight: 500;
}
.icn-faq, .icn-faq span {
display: inline-block;
transition: all .4s;
}
.icn-faq {
position: relative;
}
.icn-faq span {
position: absolute;
background: #fff;
}
.icn-faq span:nth-of-type(1) {
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
}
.icn-faq span:nth-of-type(2) {
transform: rotate(90deg);
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
}
.icn-faq.open span:nth-of-type(2) {
transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
}
.icn-faq.open span:nth-of-type(1) {
display: none;
}
.list-faq li .q-ttl {
padding: 20px 60px 20px 43px;
font-size: 1.5rem;
}
.list-faq li .q-ttl::before {
font-family: "Roboto", sans-serif;
font-size: 3.0rem;
font-weight: 400;
color: #fff;
}
.icn-faq {
width: 18px;
height: 18px;
}
.icn-faq span {
left: 0;
width: 18px;
height: 2px;
}
.icn-faq span:nth-of-type(1), .icn-faq span:nth-of-type(2) {
top: 11px;
}
.list-faq li .q-ttl:hover .icn-faq span {
background-color: #5584A6;
}
/*.list-faq li .list-faq-inner {
padding: 20px 30px 30px 40px;
background-color: rgba(255,255,255,0.90);
}*/
#tab01 .list-faq li .list-faq-inner {
padding: 20px 30px 30px 40px;
background-color: #EBF0F7;
}
#tab02 .list-faq li .list-faq-inner {
padding: 20px 30px 30px 40px;
background-color: #FFF6F7;
}

@media screen and (max-width:1260px) {
.faq_sec {
padding: 0 20px;
}
}

@media screen and (max-width:767px) {
.list-faq li .q-ttl::before {
top: 15px;
bottom: 0;
left: 20px;
}
.list-faq li .q-ttl .icn-faq {
right: 5px;
}
.list-faq li .list-faq-inner::before {
position: absolute;
top: 15px;
left: 0;
width: 20px;
height: 20px;
font-size: 1.4rem;
line-height: 20px;
}
.list-faq li .q-ttl::before {
left: 5px;
width: 20px;
height: 20px;
font-size: 1.5rem;
}
.list-faq li .q-ttl {
padding: 15px 35px 15px 26px;
font-size: 1.2rem;
}
.list-faq li .list-faq-inner {
padding: 13px 10px 15px 18px;
}
#tab01 .list-faq li .list-faq-inner,
#tab02 .list-faq li .list-faq-inner {
padding: 13px 10px 15px 18px;
}
.icn-faq {
width: 16px;
height: 16px;
}
.icn-faq span {
top: 4px;
left: 4px;
width: 8px;
height: 2px;
}
.icn-faq span:nth-of-type(1), .icn-faq span:nth-of-type(2) {
top: 7px;
}
.list-faq-inner p {
font-size: 1.2rem;
line-height: 180%;
}
}