html{margin: 0px; padding: 0px; width: 100%; overflow-x: hidden;}
body{margin: 0px; padding: 0px; background-color: #fff; overflow-x: hidden;}

.relative{position: relative;}
.absolute{position: absolute;}

img.full{display: block; width: 100%;}

.box{display: -webkit-flex; display: flex;}
.flex-direction-row{flex-direction: row;}
.flex-direction-row-r{flex-direction: row-reverse;}
.flex-direction-column{flex-direction: column;}
.flex-direction-column-r{flex-direction: column-reverse;}
.flex-wrap-now{flex-wrap: nowrap}
.flex-wrap-wrap{flex-wrap: wrap}
.flex-wrap-wrap-r{flex-wrap: wrap-reverse}
.justify-content-start{justify-content: flex-start}
.justify-content-end{justify-content: flex-end}
.justify-content-center{justify-content: center}
.justify-content-between{justify-content: space-between}
.justify-content-around{justify-content: space-around}
.align-items-start{align-items: flex-start}
.align-items-end{align-items: flex-end}
.align-items-center{align-items: center}
.align-items-baseline{align-items: baseline}
.align-items-stretch{align-items: stretch}
.align-content-start{align-content: flex-start}
.align-content-end{align-content: flex-end}
.align-content-center{align-content: center}
.align-content-between{align-content: space-between}
.align-content-around{align-content: space-around}
.align-content-stretch{align-content: stretch}

.w1920{max-width: 1600px; width: 100%; margin: 0px auto;}
.w1218{max-width: 990px; width: 100%; margin: 0px auto;}

/* .w1218{height: 100%;} */

#wrap{max-width: 1280px; width: 100%; margin: 0px auto;}
.block{position: absolute; width: 64%; top: 0px; left: 50%; margin-left: -32%; height: 100%;}

@media (max-width:750px){
    .contentBlock{width: 150%; margin-left: -25%;}
}

#navbar .block{top: 0%; position: absolute;}
#bar{width: 100%; margin: 0px auto;}
#bar .block{width: 66%; margin-left: -33%;}

.menu{position: absolute; top: 0%; width: 94%; left: 3%; height: 100%;}
.menu a{padding: 0px 2%; display: block; position: relative;}
.menu a:hover{opacity: 1;}

.menu a .active{display: block; width: 100%;}
.menu a:hover .active{display: none;}

.menu a .hover{display: none; width: 100%;}
.menu a:hover .hover{display: block;}

._buuttonList{position: absolute; width: 48%; font-size: 0px;}
._buuttonList .button{display: inline-block; width: 50%; box-sizing: border-box; padding: 0px 2px; position: relative;}

#imgBlock01 ._buuttonList{top: 63.5%; left: 8%;}
#imgBlock02 ._buuttonList{top: 47%; left: 48.5%;}
#imgBlock03 ._buuttonList{top: 47.5%; left: 8%;}
#imgBlock04 ._buuttonList{top: 47%; left: 48.5%;}
#imgBlock04-02 ._buuttonList{top: 47%; left: 8%;}
#imgBlock05 ._buuttonList{top: 51%; left: 48.5%;}
#imgBlock06 ._buuttonList{top: 37%; left: 8%;}
#imgBlock07 ._buuttonList{top: 65%; left: 8%;}
#imgBlock07-02 ._buuttonList{top: 44%; left: 48.5%;}
#imgBlock08 ._buuttonList{top: 46%; left: 8%;}
#imgBlock09 ._buuttonList{top: 40%; left: 48.5%;}
#imgBlock10 ._buuttonList{top: 64%; left: 8%;}
#imgBlock11 ._buuttonList{top: 50%; left: 48.5%;}
#imgBlock12 ._buuttonList{top: 33%; left: 8%;}

.sub_buuttonList{width: 120%; position: absolute; top: 88%; left: -10%; padding-top: 4px; display: none; text-align: center; vertical-align: top;}
.sub_buuttonList a{margin: 10px 5px 5px; display: inline-block; width: 45px; height: auto; vertical-align: top;}

#pcKv{display: block; position: relative;}
#mobileKv{display: none; position: relative;}

#pcKv .imgBlock{position: absolute; top: 0px; left: 0px; width: 64%; top: 0px; left: 50%; margin-left: -32%; height: 100%; display: flex;}
#pcKv .imgBlock .title,
#pcKv .imgBlock .chahua{padding: 0px 20px;}

@media (max-width:750px){
    /* #pcKv{display: none;}
    #mobileKv{display: block;} */
    .sub_buuttonList{background-color: #fff; border: 1px solid #c38e64; border-radius: 10px; overflow: hidden; z-index: 100;}
}

.menu-nav{display: block; position: absolute; top: 0px; width: 100%; height: 100%;}

/* .buttonBlock{display: block; width: 40%; position: absolute; top: 70%; left: 30%;} */

#imgSwiper{width: 35%; position: absolute; top: 38%; left: 12%;}
#imgSwiper .imgSwiperItem{display: none; position: absolute; top: 0px; left: 0px; width: 100%;}

.erButtonList{position: absolute; height: 50%; top: 20%; width: 27%; left: 48%;}
.erButtonList .erButton{display: block; width: 33%; height: 100%; float: left;}

#erPop{position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; background-color: rgba(0,0,0,0.8); z-index: 1000; display: none;}
.erPopBlock{width: 40%; left: 50%; margin-left: -20%; top: 50%; margin-top: -25%; position: absolute;}

.product-content{
    width: 60%;
    position: absolute;
    left: 20%;
    top: 0%;
    height: 100%;
}

._buuttonList{position: absolute; width: 44%; font-size: 0px;}
._buuttonList .button{display: inline-block; width: 50%; box-sizing: border-box; position: relative;}

.sub_buuttonList{width: 120%; position: absolute; top: 100%; left: -10%; padding: 8px 4px 4px; display: none; text-align: center; border-radius: 10px; background-color: #eee1cb; overflow: hidden;}
.sub_buuttonList a{margin: 0px 0px 4px; display: inline-block; width: 33%; box-sizing: border-box; padding: 0px 5px;}
/* 
#imgBlock01 ._buuttonList{
    top: 55%;
}

#imgBlock02 ._buuttonList{
    top: 44%;
    left: 9.5%;
}

#imgBlock03 ._buuttonList{
    top: 43%;
}

#imgBlock04 ._buuttonList{
    top: 44%;
    left: 9%;
}

#imgBlock05 ._buuttonList{
    top: 42%;
}

#imgBlock06 ._buuttonList{
    top: 44%;
    left: 9%;
}

#imgBlock07 ._buuttonList{
    top: 35%;
}

#imgBlock08 ._buuttonList{
    top: 53%;
}

#imgBlock09 ._buuttonList{
    top: 44%;
    left: 9%;
}

#imgBlock10 ._buuttonList{
    top: 42%;
    left: 50%;
}

#imgBlock11 ._buuttonList{
    top: 43%;
    left: 9%;
}

#imgBlock12 ._buuttonList{
    top: 54%;
    left: 50%;
}

#imgBlock13 ._buuttonList{
    top: 44%;
    left: 9%;
}

#imgBlock14 ._buuttonList{
    top: 43%;
    left: 50%;
}

#imgBlock15 ._buuttonList{
    top: 44%;
    left: 9%;
}

#imgBlock16 ._buuttonList{
    top: 33.5%;
    left: 50%;
} */