@charset "utf-8";



.infoText ul{
    width: 55%;
    float: left;
    font-size: 1.6rem;
    line-height:1.4;
}

.infoText ul li{
    margin-bottom: 10px;
    padding-left:1em;
    text-indent:-1em;
}



.infoText img{
    width: 43%;
    float: right;
}


/* corpSection */

#tabSection .categoryList li {
    width: 32%;
    float: left;
    margin-right: 2%;
    height: 74px;
    text-align: center;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-weight: 500;
    font-size: 1.8rem;
    position: relative;
    color: #fff;
}

#tabSection .categoryList li a{
    color: #009481;
    display: block;
    height: 100%;
    background-image: url(/_assets/img/her/web/tab.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#kepco #tabSection .categoryList li:nth-child(1) a{
    color: #fff;
    display: block;
    height: 100%;
    background-image: url(/_assets/img/her/web/tab_cr.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#kepco #tabSection .categoryList li:nth-child(2) a{
    color: #009481;
    display: block;
    height: 100%;
    background-image: url(/_assets/img/her/web/tab.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#kepco #tabSection .categoryList li:nth-child(3) a{
    color: #009481;
    display: block;
    height: 100%;
    background-image: url(/_assets/img/her/web/tab.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#okiden #tabSection .categoryList li:nth-child(1) a{
    color: #009481;
    display: block;
    height: 100%;
    background-image: url(/_assets/img/her/web/tab.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#okiden #tabSection .categoryList li:nth-child(2) a{
    color: #fff;
    display: block;
    height: 100%;
    background-image: url(/_assets/img/her/web/tab_cr.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#okiden #tabSection .categoryList li:nth-child(3) a{
    color: #009481;
    display: block;
    height: 100%;
    background-image: url(/_assets/img/her/web/tab.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#kitagas #tabSection .categoryList li:nth-child(1) a{
    color: #009481;
    display: block;
    height: 100%;
    background-image: url(/_assets/img/her/web/tab.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#kitagas #tabSection .categoryList li:nth-child(2) a{
    color: #009481;
    display: block;
    height: 100%;
    background-image: url(/_assets/img/her/web/tab.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#kitagas #tabSection .categoryList li:nth-child(3) a{
    color: #fff;
    display: block;
    height: 100%;
    background-image: url(/_assets/img/her/web/tab_cr.png);
    background-size: contain;
    background-repeat: no-repeat;
}



#tabSection .categoryList li .soon{
    background-image: url(/_assets/img/her/web/tab_nolink.png);
    background-size: contain;
    background-repeat: no-repeat;
    height: 100%;
}




#tabSection .categoryList li p {
    position: absolute;
    top: 36%;
    transform: translateY(-50%);
    left: 0;
    width: 100%;
}

#tabSection .categoryList li p span{
    font-size: 2.2rem;
}

#tabSection .categoryList li:last-of-type {
    margin-right: 0;
}


#tabSection{
    background: #f6f6f6;
}

#tabSection{
    padding-bottom: 20px;
}

/* stepSection */

#stepSection{
    background: #f6f6f6;
    padding-top: 30px;
}

#stepSection .step .box{
    width: 48.4%;
    float: left;   
    background: #fff; 
    border-radius: 10px;
    box-shadow:0px 0px 6px 3px rgba(0,0,0,0.06);
    font-size: 1.6rem;
    line-height:1.8;


}

#stepSection .step .box:nth-child(even){
    float: right;    
}

#stepSection .step .box:nth-child(1),
#stepSection .step .box:nth-child(2){
    min-height: 670px;
    margin-bottom: 60px;
}

#kitagas #stepSection .step .box:nth-child(1),
#kitagas #stepSection .step .box:nth-child(2){
    min-height: 550px;
    margin-bottom: 60px;
}


#stepSection .step .box:nth-child(3),
#stepSection .step .box:nth-child(4){
    min-height: 525px;
}

#stepSection .step .box .step{
    text-align: center;
    margin-top: -20px;
}

#stepSection .step .box .inner{
    padding: 6%;
}

#stepSection .step .box .ann{
    font-size: 1.2rem;
    line-height:1.5;
    padding-left:1em;
    text-indent:-1em;
    margin-top: 10px;
}

#stepSection .step .box .ann li{
    margin-bottom: 5px;
}


#stepSection .annOut{
    padding-top: 15px;
}

#stepSection .annOut li{
    font-size: 1.4rem;
    line-height:1.5;
    padding-left:1em;
    text-indent:-1em;
    margin-bottom: 10px;

}

/* faqSection */
#faqSection {
    background-color: #d3fff9;
}

#faqSection h3 {
    font-size: 2.4rem;
    text-align: center;
    margin-bottom: 50px;
}

#faqSection .tabBody {
    display: none;
}

#faqSection .tabBody:first-of-type {
    display: block;
}


.tabArea{
    display: none;
}
#kepco #tabKansai{
    display: block;
}
#okiden #tabOkinawa{
    display: block;
}
#kitagas #tabKitagas{
    display: block;
}


/* PC */
@media screen and (min-width: 768px) {




}

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




    .infoText ul{
        width: 100%;
        float: none;
        margin-bottom: 20px;

    }



    .infoText img{
        width: 100%;
        float: none;
    }


    #stepSection{

        padding-top: 40px;
    }


    #tabSection .categoryList li {
        width: calc((100% - 24px) / 3);
        float: left;
        margin-right: 12px;
        height: auto;

        text-align: center;
        font-family: 'M PLUS Rounded 1c', sans-serif;
        font-weight: 500;
        font-size: 1.2rem;
        position: relative;
        color: #fff;
    }



    #tabSection .categoryList li a{
        background-image: url(/_assets/img/her/web/sp/tab.png);
        background-size: 100% auto;
        background-repeat: no-repeat;
        padding-bottom: 57%;
    }




    #kepco #tabSection .categoryList li:nth-child(1) a{
        color: #fff;
        display: block;
        height: 100%;
        background-image: url(/_assets/img/her/web/sp/tab_cr.png);
        background-size: 100% auto;
        background-repeat: no-repeat;
    }

    #kepco #tabSection .categoryList li:nth-child(2) a{
        color: #009481;
        display: block;
        height: 100%;
        background-image: url(/_assets/img/her/web/sp/tab.png);
        background-size: 100% auto;
        background-repeat: no-repeat;
    }

    #kepco #tabSection .categoryList li:nth-child(3) a{
        color: #009481;
        display: block;
        height: 100%;
        background-image: url(/_assets/img/her/web/sp/tab.png);
        background-size: 100% auto;
        background-repeat: no-repeat;
    }

    #okiden #tabSection .categoryList li:nth-child(1) a{
        color: #009481;
        display: block;
        height: 100%;
        background-image: url(/_assets/img/her/web/sp/tab.png);
        background-size: 100% auto;
        background-repeat: no-repeat;
    }

    #okiden #tabSection .categoryList li:nth-child(2) a{
        color: #fff;
        display: block;
        height: 100%;
        background-image: url(/_assets/img/her/web/sp/tab_cr.png);
        background-size: 100% auto;
        background-repeat: no-repeat;
    }

    #okiden #tabSection .categoryList li:nth-child(3) a{
        color: #009481;
        display: block;
        height: 100%;
        background-image: url(/_assets/img/her/web/sp/tab.png);
        background-size: 100% auto;
        background-repeat: no-repeat;
    }

    #kitagas #tabSection .categoryList li:nth-child(1) a{
        color: #009481;
        display: block;
        height: 100%;
        background-image: url(/_assets/img/her/web/sp/tab.png);
        background-size: 100% auto;
        background-repeat: no-repeat;
    }

    #kitagas #tabSection .categoryList li:nth-child(2) a{
        color: #009481;
        display: block;
        height: 100%;
        background-image: url(/_assets/img/her/web/sp/tab.png);
        background-size: 100% auto;
        background-repeat: no-repeat;
    }

    #kitagas #tabSection .categoryList li:nth-child(3) a{
        color: #fff;
        display: block;
        height: 100%;
        background-image: url(/_assets/img/her/web/sp/tab_cr.png);
        background-size: 100% auto;
        background-repeat: no-repeat;
    }



    #tabSection .categoryList li .soon{
        background-image: url(/_assets/img/her/web/sp/tab_nolink.png);
        background-size:  100% auto;
        background-repeat: no-repeat;
        padding-bottom: 57%;
    }


    #tabSection .categoryList li p {
        position: absolute;
        top: 38%;
        transform: translateY(-50%);
        left: 0;
        width: 100%;
    }

    #tabSection .categoryList li p span{
        font-size: 1.3rem;
    }

    #tabSection .categoryList li:last-of-type {
        margin-right: 0;
    }


    #tabSection{
        background: #f6f6f6;
    }

    #tabSection{
        padding-bottom: 20px;
    }




    #stepSection .step .box{
        width: 100%;
        float: none;   
        background: #fff; 
        border-radius: 10px;
        box-shadow:0px 0px 6px 3px rgba(0,0,0,0.06);
        font-size: 1.6rem;
        line-height:1.8;

        margin-bottom: 60px;



    }

    #stepSection .step .box:nth-child(even){
        float: none;    
    }
    #stepSection .step .box:nth-child(1),
    #stepSection .step .box:nth-child(2),
    #stepSection .step .box:nth-child(3),
    #stepSection .step .box:nth-child(4){
        min-height: auto;

    }

    #kitagas #stepSection .step .box:nth-child(1),
    #kitagas #stepSection .step .box:nth-child(2){
        min-height: auto;
    }



    #stepSection .step .box .step{
        text-align: center;

    }


    #stepSection .step .box .step img{
        display: inline-block;
        margin-top: -40px;
    }

    #stepSection .step .box .inner{
        padding: 6%;
    }

    #stepSection .step .box .ann{
        font-size: 1.2rem;
        line-height:1.5;
        padding-left:1em;
        text-indent:-1em;
        margin-top: 10px;
    }

    #stepSection .step .box .ann li{
        margin-bottom: 5px;
    }


    #stepSection .annOut{
        padding-top: 15px;
        margin-top: -40px;
    }

    #stepSection .annOut li{
        font-size: 1.4rem;
        line-height:1.5;
        padding-left:1em;
        text-indent:-1em;
        margin-bottom: 10px;

    }

    
    /* faqSection */
    #faqSection h3 {
        font-size: 1.8rem;
        margin-bottom: 30px;
    }

}