*{box-sizing: border-box}

/* .wrap{width:1020px;margin: auto;} */
a{display: block;}

header{position: fixed;width: 100%;height: 70px;background: #fff;z-index: 400;
left: 0;top: 0;border-bottom: 1px solid #ccc;text-align: center;}
.inheader{width:1020px;margin: auto;}
.logo{width: 90px;padding: 8px;float: left;}
header img{width:100%;}
.navlist{float: left;margin-left: 140px}
.navlist .level1{display: inline-block;vertical-align: top;position: relative;
margin-top: 20px;padding-bottom: 10px;font-size: 1.1em;width: 113px;cursor: pointer;}
.opennav{position: absolute;width: 100%;height: 0;background: #eee;left: 0;top: 70px;z-index: -1;}
.level2{padding: 30px 0;line-height: 2.2;font-size: .8em;position: absolute;
left: -15%;top: 40px;width: 150px;color: #888;display: none}
.level1 span:hover,.level2 li:hover{color: #00833f}
.search{width: 30px;float: right;padding-top: 20px;cursor: pointer;}
.searchbar{position: absolute;top: 17px;right: 30%;
width: 37%;height: 36px;line-height: 60px;display: none}
.inputinner{position: relative;display: inline-block;
width: 100%;height: 36px;line-height: 36px;
border-radius: 18px;background-color: #00833f;overflow: hidden;}
.search_input{float: left;width: 93%;height: 36px;
line-height: 36px;border: 0px;font-size: 16px;color: #fff;
text-indent: 20px;position: relative;background: transparent}
input::placeholder{color: #fff;}
.searchesc{position: absolute;right: 10px;top: 4px;width: 20px;height: 20px;cursor: pointer;}

.head{width:1020px;margin: auto;text-align: center;font-size: 1.3em;line-height: 2;border-bottom: 1px solid #ccc;padding: 20px 0;margin-bottom: 60px}

.productlist{width:1020px;margin: auto;}
.productlist li{display: inline-block;border: 1px solid #ccc;width: 23%;margin: 0 8px;
text-align: center;padding-bottom: 20px;position: relative;}
.productlist li img{width: 100%;}
.productlist span{display: inline-block;
margin: 10px 0;color: #00833f;
cursor: pointer;}
span.arrow{position: absolute;width: 58px;height: 58px;left: 87px;bottom: -70px;transition: all .5s ease;opacity: 0;}
.arrow.on{opacity: 1;}
.productlist span a{padding: 6px 60px;border-radius: 30px;border: 1px solid #00833f ;}
.productlist span a:hover{color: #fff;background: #00833f}

.bgslide{background: #00833f;margin-top: 20px;position: relative;margin-bottom: 20px}
.productDetail{width:1020px;height: 0;margin: auto;color: #fff;position: relative;overflow: hidden;transition: all .5s ease}
.topslide{position: absolute;z-index: 100;width: 100%;padding: 10px 0;overflow: hidden;opacity: 0;transition: all .5s ease}
.topslide.on{opacity: 1;z-index: 200;}

.detailist{width: 50%;float: right;padding: 20px 0;}
.detailist h3{font-size: 1.5em;}
.detailist h2{font-size: 3em;padding: 10px 0}
.detailist h4{padding-bottom: 10px;font-size: 1.2em}
.detailist ul.detail li{padding-bottom: 60px;line-height: 1.3;
position: absolute;opacity: 0;transition: all .5s ease}
.detailist ul.detail li.on{opacity: 1;}
.detailist ul.imgbtn{width: 90%;display: flex;margin-top: 150px}
.detailist ul.imgbtn li{flex: 1;font-size: .85em;text-align: center;
width: 90%;}

.detailist ul.imgbtn li:nth-child(1n+2){margin-left: 16px}
.detailist li img{width: 100%;background: #fff;cursor: pointer;}
.detailist li img.on{border: 3px solid #000}

.slideUp{position: absolute;right: 10px;top: 10px;width: 49px;height: 48px;cursor: pointer;}

.heinav{position: absolute;right: 20%;top:1000px;
background: #fff url(../02_11/img/btn_top.png)no-repeat center 10%;font-size: .8em;
text-align: center;border: 1px solid #666;z-index: 1000;}
.heinav a{width: 35px;height: 35px;padding-top: 10px}

footer{margin-top: 50px;text-align: center}
footer p{font-size: .8em;color: #666;padding: 5px 0}
footer .bgtop{height: 80px;background: #efefef;
border-bottom: 1px solid #e6e6e6;margin-bottom: 20px}
footer .ftrwrap{width: 1020px;height: 100%;margin: auto;position: relative;}
.btmlogo{width: 75px;margin: auto;padding-top:1.3%}
.btmlogo img{width: 100%;}
.flag, .sitelink{position: absolute;top: 30%}
.flag{left: 10px}
.sitelink{right: 10px}
.flag li{display: inline-block;width: 30px;height: 30px;cursor: pointer;margin: 0 10px;float: left;}
.flag li:nth-child(1){background: url(../02_11/img/btn_footer_lang_1.png)no-repeat left top}
.flag li:nth-child(2){background: url(../02_11/img/btn_footer_lang_2.png)no-repeat left top}
.flag li:nth-child(3){background: url(../02_11/img/btn_footer_lang_3.png)no-repeat left top}
.flag li:nth-child(4){background: url(../02_11/img/btn_footer_lang_4.png)no-repeat left top}
.flag li:hover{background-position: left bottom}

.sitelink li{display: inline-block;width: 32px;height: 32px;cursor: pointer;margin: 0 10px;float: left;}
.sitelink li:nth-child(1){background: url(../02_11/img/btn_link_1.png)no-repeat left top}
.sitelink li:nth-child(2){background: url(../02_11/img/btn_link_3.png)no-repeat left top}
.sitelink li:nth-child(3){background: url(../02_11/img/btn_link_4.png)no-repeat left top}
.sitelink li:hover{background-position: 0 -30px}



html, body {
position: relative;
height: 100%;
}
.swiper-container {
width: 100%;
height: 78vh;
}
.swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.swiper-slide img{width: 100%;}
.swiper-pagination-bullet {
width: 70px;
height: 5px;
text-align: center;
line-height: 20px;
font-size: 12px;
color:#000;
opacity: 1;
background: rgba(0,0,0,0.2);
border-radius:  0;
}
.swiper-pagination-bullet-active {
color:#eee;
background: #00833f;
}

.swiper-button-prev,.swiper-button-next{width: 36px;height: 71px}
.swiper-button-prev{background: url(../02_11/img/btn_main_slide_prev.png)no-repeat left top;left: 60px}
.swiper-button-next{background: url(../02_11/img/btn_main_slide_next.png)no-repeat left top;right: 60px}