@charset "utf-8";

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

	TOP MV

----------------------------------------------------*/
.MV {
    margin-top: 80px;
}

.MV .MVIn {
    background-image: url(/common/images/mv_img_pc_202506.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    height: 800px;
    padding: 0 3% 0 3%;
}

.MV .MVIn .MV_left .MV_title {
    width: 32vw;
    margin: 2% auto 1% auto;
    display: block;
    max-width: 690px;
}

.MV .MVIn .MV_left .MV_txt {
    width: 28vw;
    margin: 0 auto 4% auto;
    display: block;
    max-width: 640px;
}

.MV .MVIn .MV_left {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    width: 760px;
}

/*MVバッジ*/
.MV .MVIn .badgeArea {
    position: absolute;
    top: 5%;
    left: 56%;
}

.MV .MVIn .badgeArea img {
    max-width: 130px;
    width: 6vw;
}

/*MVボタン*/

.MV .MVIn .btArea a {
    text-align: center;
    color: #333;
    padding: 18px 3% 18px 3%;
    border-radius: 40px;
    font-size: 18px;
    width: 400px;
    margin: 1%;
}

.MV .MVIn .btArea a:hover {
    color: #fff;
}

.MV .MVIn .btArea .btn06 {
    outline: inherit;
}


/*------------MVお問い合わせ------------*/
.MV .MV_right {
    width: 25vw;
    position: absolute;
    right: 2%;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.MV .mv_form {
    padding: 24px;
    background-color: #fff;
    border-radius: 8px;
}

.MV .mv_form h2 {
    text-align: center;
    border-bottom: 1px dashed #004476;
    margin-bottom: 16px;
    padding-bottom: 8px;
    color: #004476;
}

.MV .mv_form h2 span {
    display: block;
    background-color: #004476;
    color: #fff;
    padding: 2px 8px;
    max-width: 100px;
    margin: 0 auto 8px auto;
    border-radius: 4px;
}

/*----------------------------------------------------
	MV (1920px以下)
----------------------------------------------------*/
@media screen and (max-width: 1920px) {

    .MV .MVIn {
        background-image: url(/common/images/mv_img_pc_202506_02.jpg);
    }

    .MV .MVIn .MV_left .MV_title {
        max-width: 600px;
        margin: 2% auto 2% auto;
    }

    .MV .MVIn .MV_left {}

    .MV .MVIn .MV_left .MV_txt {
        max-width: 520px;
        margin: 0 auto 5% auto;
    }


    .MV .MVIn .btArea a {
        padding: 2% 3.5% 2% 3%;
        font-size: 0.92vw;
        margin: 1% 0.5%;
    }

    /*MVバッジ*/
    .MV .MVIn .badgeArea {
        left: 2%;
        top: 4%;
    }

    .MV .MVIn .badgeArea img {
        width: 6.5vw;
        min-width: 90px;
    }

    /*------------MVお問い合わせ------------*/
    .MV .MV_right {
        min-width: 450px;
    }

}

/*----------------------------------------------------
	MV (1600px以下)
----------------------------------------------------*/
@media screen and (max-width: 1600px) {
    .MV .MVIn {
        background-image: url(/common/images/mv_img_pc_202506_03.jpg);
        height: 660px;
    }

    .MV .MVIn .MV_left {
        top: 5%;
        left: 6%;
        transform: inherit;
        -webkit-transform: inherit;
        -ms-transform: inherit;
        width: 63%;
    }

    .MV .MVIn .MV_left .MV_title {
        margin: 2% auto 0 auto;
        max-width: 480px;
    }

    .MV .MVIn .MV_left .MV_txt {
        margin: 0 auto 1% auto;
        width: 32vw;
        max-width: 450px;
    }

    .MV .MVIn .btArea a {
        width: 250px;
        padding: 1.5% 3.5% 1.5% 3%;
    }

    /*MVバッジ*/
    .MV .MVIn .badgeArea img {
        width: 5.5vw;
    }

    /*------------MVお問い合わせ------------*/
    .MV .mv_form {
        transform: scale(0.8);
    }

    .MV .MV_right {
        right: 0%;
    }
}

/*----------------------------------------------------
	MV (1280px以下)
----------------------------------------------------*/
@media screen and (max-width: 1280px) {
    .MV {
        margin-top: 70px;
    }

    .MV .MVIn {
        height: 690px;
        background-position: 25%;
    }

    .MV .MVIn .MV_left {
        top: 10%;
        left: 6%;
        width: 50%;
    }

    .MV .MVIn .MV_title {
        width: 42vw;
        min-width: 360px;
        margin: 2% auto 0 auto;
    }

    .MV .MVIn .MV_left .MV_txt {
        width: 33vw;
        min-width: 300px;
        margin: 0 auto 3% auto;
    }

    .MV .MVIn .btArea a {
        margin: 1% 1% 1% 1%;
        padding: 1.5% 2% 1.5% 1%;
        font-size: 15px;
        min-width: 270px;
    }

    /*MVバッジ*/
    .MV .MVIn .badgeArea {
        left: 42%;
        top: 2%;
    }

    .MV .MVIn .badgeArea img {
        width: 7vw;
        min-width: 60px;
    }

    /*------------MVお問い合わせ------------*/


    .MV .mv_form h2 .br_sp {
        display: block;
    }


}

/*----------------------------------------------------
	MV (1000px以下)
----------------------------------------------------*/
@media screen and (max-width: 1000px) {
    .MV {
        margin-top: 60px;
    }

    .MV .MVIn {
        background-image: url(/common/images/mv_img_pc.jpg);
        height: 440px;
        background-position: 80%;
    }

    .MV .MVIn .MV_left {
        top: 50%;
        left: 4%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
    }

    .MV .MVIn .MV_title {
        min-width: 360px;
    }

    .MV .MVIn .MV_left .MV_txt {
        margin: 0 auto 5% auto;
    }

    .MV .MVIn .btArea a {
        margin: 0% auto 3% auto;
    }

    /*バッジ*/
    .MV .MVIn .badgeArea {
        left: 36%;
        top: 5%;
    }

    /*------------MVお問い合わせ------------*/
    .MV .MV_right {
        display: none;
    }
}

/*----------------------------------------------------
	MV (768px以下)
----------------------------------------------------*/
@media screen and (max-width: 768px) {
    .MV {
        margin-top: 60px;
    }

    .MV .MVIn {
        background-image: url(/common/images/mv_img_sp.jpg);
        height: 100vw;
        max-height: 540px;
        padding: 12% 4% 37% 4%;
        background-position: center;
    }


    .MV .MVIn .MV_left .MV_title {
        width: 90%;
        min-width: auto;
        max-width: 530px;
        margin: 2% auto 0% auto;
    }

    .MV .MVIn .MV_left .MV_txt {
        width: 88%;
        min-width: auto;
        max-width: 500px;
    }


    .MV .MVIn .MV_left {
        width: 95%;
        top: 23%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
    }

    .MV .MVIn .btArea {
        position: absolute;
        width: 100%;
        bottom: -175%;
    }

    .MV .MVIn .btArea a {
        width: 86%;
        margin: 0.5em auto;
        max-width: inherit;
        padding: 14px 3% 14px 3%;
    }

    /*MVバッジ*/
    .MV .MVIn .badgeArea {
        bottom: 0;
        top: 1.5%;
        left: auto;
        right: 1.5%;
    }

    .MV .MVIn .badgeArea img {
        width: 14.5vw;
        min-width: auto;
    }

    /*------------MVお問い合わせ------------*/
    .MV .MV_right {
        display: none;
    }
}
