@charset "UTF-8";

/*-----------------------------------------------------
	common
-----------------------------------------------------*/
img {
    max-width: 100%;
    height: auto;
    border: 0;
    vertical-align: bottom;
    -webkit-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
}
.sp {
    display: none;
}
#mainvisual a img,
.sec a img,
#sec04 a img {
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
#mainvisual a:hover img,
.sec a:hover img,
#sec04 a:hover img {
    opacity: .6;
}
#mainvisual .inner,
.sec .inner,
#sec04 .inner {
    display: block;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
    max-width: 1540px;
    box-sizing: content-box;
}

/*-----------------------------------------------------
	content
-----------------------------------------------------*/

/* #メインビジュアル、セクション
-----------------------------------------------------*/
#mainvisual {
    min-height: 400px;
    text-align: center;
    background-image: url(../img/top/mv_bg.webp);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: auto 100%;
}
#mainvisual .inner,
#sec03 .inner,
#sec04 .inner {
    position: relative;
}
#mainvisual .btnbox,
#sec03 .btnbox {
    display: flex;
    justify-content: space-between;
    position: absolute;
}
#mainvisual .btnbox {
    bottom: 16.1%;
    left: 36.3%;
    width: 35%;
}
#mainvisual .btnbox .button,
#sec03 .btnbox .button {
    width: 49%;
}
#sec03 .btnbox {
    bottom: 11%;
    left: 40.3%;
    width: 42.5%;
}
#sec04 .button {
    position: absolute;
    right: 18.8%;
    width: 31.7%;
}
#sec04 .button01 {
    bottom: 7%;
}
#sec04 .button02 {
    bottom: 17.7%;
}
.sec {
    min-height: 125px;
    text-align: center;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: auto 100%;
}

@media only screen and (max-width: 640px) {
    /*-----------------------------------------------------
        common
    -----------------------------------------------------*/
    .sp {
        display: block;
    }
    .pc {
        display: none;
    }
    #mainvisual .inner,
    .sec .inner,
    #sec04 .inner {
        padding-left: 0;
        padding-right: 0;
        width: auto;
    }

    /*-----------------------------------------------------
        content
    -----------------------------------------------------*/
    #mainvisual .btnbox,
    #sec03 .btnbox {
        display: flex;
        justify-content: space-between;
        position: absolute;
    }
    #mainvisual .btnbox {
        bottom: 6.1%;
        left: 10%;
        width: auto;
        flex-direction: column;
        right: 10%;
    }
    #mainvisual .btnbox .button,
    #sec03 .btnbox .button {
        width: auto;
    }
    #mainvisual .btnbox .button01,
    #sec03 .btnbox .button01 {
        margin-bottom: 4vw;
    }
    #sec03 .btnbox {
        flex-direction: column;
        bottom: 4.3%;
        left: 10%;
        right: 10%;
        width: auto;
    }
    #mainvisual .btnbox .tel,
    #sec03 .btnbox .tel,
    #sec04 .tel {
        position: absolute;
        left: 10%;
        right: 10%;
    }
    #mainvisual .btnbox .tel {
        bottom: 118%;
    }
    #sec03 .btnbox .tel {
        bottom: 118%;
    }
    #sec04 .tel {
        left: 19%;
        right: 19%;
    }
    #sec04_1 .tel {
        bottom: 7%;
    }
    #sec04_2 .tel {
        bottom: 8.4%;
    }
    #sec04 .button {
        right: 10%;
        width: auto;
        left: 10%;
    }
    #sec04 .button01 {
        bottom: 3.4%;
    }
    #sec04 .button02 {
        bottom: 4.2%;
    }
}
