ul,
li,
ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

dl,
dt,
dd {
    margin: 0;
    padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
    padding: 0;
}

li img,
dt img,
dd img {
    vertical-align: top;
}

img {
    border: 0;
}

form {
    margin: 0;
    padding: 0;
}

a {
    cursor: pointer;
    outline: none;
}

* {
    box-sizing: border-box;
    text-decoration: none;
}




@media screen and (min-width: 1100px) {

    html {
        height: 100vh;
    }

    body {
        height: 100vh;
        margin: 0;
        padding: 0;
        font-size: 18px;
        font-family: "Noto Sans SC", Helvetica, arial, sans-serif;
        /* background: url("../images/bg.jpg") bottom center/cover no-repeat fixed; */
    }


    .wrapper {
        width: 148vh;
        height: 100%;
        margin: auto;
    }

    .zone1 {
        width: 100%;
        height: 100%;
        display: flex;
        padding-top: 10.2%;
    }

    .zone1_left {
        width: 51%;
        height: 100%;
        background: url(../image/main.png) center 15px no-repeat;
        background-size: 100% auto;
        margin-left: 7.5%;
    }

    .zone1_right {
        width: 25.8%;
        height: 100%;
        margin-left: 9.5%;
    }

    .logo {
        width: 86.5%;
        height: 14%;
        background: url(../image/logo.png) center top no-repeat;
        background-size: 100% auto;
        margin: 2% auto 4% 4%;
    }

    .logo_m {
        display: none;
    }

    .btn_1 {
        width: 100%;
        height: 10.1%;
        background: url(../image/btn1.png) center top no-repeat;
        background-size: 100% auto;
        display: block;
        margin-bottom: 3%;
    }

    .btn_2 {
        width: 100%;
        height: 10.1%;
        background: url(../image/btn2.png) center top no-repeat;
        background-size: 100% auto;
        display: block;
        margin-bottom: 3%;
    }

    .btn_3 {
        width: 100%;
        height: 10.2%;
        background: url(../image/btn3.png) center top no-repeat;
        background-size: 100% auto;
        display: block;
        margin-bottom: 3%;
    }

    .btn_4 {
        width: 100%;
        height: 10.2%;
        background: url(../image/btn4.png) center top no-repeat;
        background-size: 100% auto;
        display: block;
        margin-bottom: 3%;
    }

    .btn_5 {
        width: 100%;
        height: 10.2%;
        background: url(../image/btn5.png) center top no-repeat;
        background-size: 100% auto;
        display: block;
        margin-bottom: 3%;
    }

    .btn_1:hover {
        background: url(../image/btn1_hov.png) center top no-repeat;
        background-size: 100% auto;
    }

    .btn_2:hover {
        background: url(../image/btn2_hov.png) center top no-repeat;
        background-size: 100% auto;
    }

    .btn_3:hover {
        background: url(../image/btn3_hov.png) center top no-repeat;
        background-size: 100% auto;
    }

    .btn_4:hover {
        background: url(../image/btn4_hov.png) center top no-repeat;
        background-size: 100% auto;
    }

    .btn_5:hover {
        background: url(../image/btn5_hov.png) center top no-repeat;
        background-size: 100% auto;
    }


}






@media screen and (max-width:1099px) {

    /*.zone1,.logo_m,.zone1_left,.zone1_right,.btn_1,.btn_2,.btn_3,.btn_4,.btn_5 { border:#0000FF 1px solid; } */


    html {}

    body {
        margin: 0;
        padding: 0;
        font-size: 18px;
        font-family: "Noto Sans SC", Helvetica, arial, sans-serif;
        background: url("../image/bg_m.jpg") top center/cover no-repeat fixed;
    }

    .wrapper {
        width: 100%;
        height: 100%;
        margin: auto;
    }

    .zone1 {
        width: 98%;
        max-width: 1200px;
        height: 100%;
        max-height: 100vh;
        margin: auto;
        padding-top: 0vh;
        overflow: hidden;
    }

    .logo_m {
        display: flex;
        justify-content: center;
        width: 100%;
        max-width: 60vw;
        margin: 2vh auto 1vh auto;
        height: 10vh;
    }

    .logo_mimg {
        width: 100%;
        height: 100%;
        /*max-width: 311px; max-height: 112px;*/
        /*padding: 1vh 1vw;*/
        background: url(../image/logo.png) no-repeat center center;
        background-size: contain;
    }

    .zone1_left {
        display: flex;
        justify-content: center;
        width: 100%;
        max-width: 80vw;
        margin: 1vh auto 2vh auto;
        height: 35vh;
    }

    .zone1_leftimg {
        width: 100%;
        height: 100%;
        /*padding: 1vh 1vw;*/
        background: url(../image/main.png) no-repeat center center;
        background-size: contain;
    }

    .logo {
        display: none;
    }

    .zone1_right {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 100%;
        max-width: 50vw;
        margin: 1vh auto 1vh auto;
        height: 45vh;
    }

    .btn_1 {
        background: url(../image/btn1.png) no-repeat center center;
        background-size: contain;
    }

    .btn_2 {
        background: url(../image/btn2.png) no-repeat center center;
        background-size: contain;
    }

    .btn_3 {
        background: url(../image/btn3.png) no-repeat center center;
        background-size: contain;
    }

    .btn_4 {
        background: url(../image/btn4.png) no-repeat center center;
        background-size: contain;
    }

    .btn_5 {
        background: url(../image/btn5.png) no-repeat center center;
        background-size: contain;
    }

    .btn_1,
    .btn_2,
    .btn_3,
    .btn_4,
    .btn_5 {
        width: 100%;
        height: 100%;
        /*max-width: 354px; max-height: 80px;*/
        margin: 3px auto;
        display: flex;
    }

}

@media screen and (max-width:700px) {

    .zone1_right {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 100%;
        max-width: 60vw;
        margin: 1vh auto 1vh auto;
        height: 40vh;
    }


}