body{min-width:1000px;position:relative;}
.wrapper{min-width:1000px;max-width:1200px;margin:0 auto;box-sizing: border-box;}
.min-wrapper{width:1000px;margin:0 auto;}
.img-box img{display:block;width:100%;}
/*header*/
.main-header{height:600px;background:url(../img/indexbanner.png) no-repeat center center;}
.main-header.about{height:400px;background:url(../img/top-aboutbanner.png) no-repeat center center;}
.main-header.contact{height:400px;background:url(../img/top-contactbanner.png) no-repeat center center;}
.main-header.case{height:400px;background:url(../img/top-anlbanner.png) no-repeat center center;}
.main-header.product{height:400px;background:url(../img/top-cpbanner.jpg) no-repeat center center;}
.main-header.cooperate{height:400px;background:url(../img/top-swbanner.png) no-repeat center center;}
.main-header .wrapper{display:flex;}
.main-header .logo{flex:0 0 136px;}
.main-header .icon-logo{display:block;margin:16px auto;text-indent:-9999px;width:190px;height:48px;background:url(../img/logo.png) no-repeat center center;background-size:contain;}
.main-header .nav-bar{flex:1;text-align:right;}
.main-header .nav-bar>a{display:inline-block;line-height:80px;color:#fff;padding:0 24px;font-size:16px;}
.main-header .nav-bar>a.now{height:76px;border-bottom:4px solid #fff;}
/*slider*/
.slider{margin: 20px auto;display: flex;  width: 600px;  height: 365px;  margin-top: 70px;}
.slider img{width: 260px;height: auto}
.slider img.img-responsive {height: auto; max-width: 100% ;display: block}
.round_conrol {  position: relative;  width: 100%;  height: 80px;  z-index: 100;  }
#bt-previous {  position: absolute;  width: 54px;  height: 54px;  display: block!important;  background: url(../img/arrowright.png) no-repeat left;  right: 0;  top: -300%;  cursor: pointer;  text-indent: -9999px;  z-index: 100;  }
#bt-next {position: absolute;  width: 54px;  height: 54px;  display: block!important;  background: url(../img/arrowleft.png) no-repeat left;  top: -300%;  cursor: pointer;  text-indent: -9999px;  }
/*footer*/
.main-footer{background: #2a2a2a;padding: 60px 0}
.main-footer .wrapper{display:flex;}
.main-footer .text{flex:1; color: #fff;line-height: 22px}
.main-footer .text p:first-child{margin-bottom:10px;}
.main-footer .erwm-box{flex:0 0 300px;}
.main-footer .erwm-box img:first-child{margin-right: 20px;}
/*title-box*/
.title-box{text-align:center;}
/*home.html*/
.home-main .title-box,.contact-main .title-box,.case-main .title-box,.product-main .title-box{margin:0 auto 60px;}
.home-main .con-box,.contact-main .con-box,.case-main .con-box,.product-main .con-box,.pro-body2 .con-box{display:flex;}
.home-main .con-box .img-box,.home-main .con-box .text-box,.contact-main .con-box .img-box,.contact-main .con-box .text-box,.case-main .con-box .img-box,.case-main .con-box .text-box,.product-main .con-box .img-box,.product-main .con-box .text-box{flex:1;position:relative;overflow:visible;}
.home-main .con-box .operatorList{position: absolute;  top: 0;  left: -63px;}
.operatorList li{position: relative; width: 126px;    margin-top: 5rem;cursor: pointer;
    background: #fff;
    border-radius: 63px;
    height: 126px;
    box-shadow: rgba(2,52,102,.2) 6px 3px 33px;
    transition: width 1.5s,background-color 1.5s;
    -moz-transition: width 1.5s,background-color 1.5s; /* Firefox 4 */
    -webkit-transition: width 1.5s,background-color 1.5s; /* Safari 和 Chrome */
    -o-transition: width 1.5s,background-color 1.5s; /* Opera */}
.operatorList li img{width: 94px; height:94px; padding: 16px 0 0 16px}
.operatorList li.active{width:655px;
    background: #317cfc;
    transition: width 1.5s,background-color 1.5s;
    -moz-transition: width 1.5s,background-color 1.5s; /* Firefox 4 */
    -webkit-transition: width 1.5s,background-color 1.5s; /* Safari 和 Chrome */
    -o-transition: width 1.5s,background-color 1.5s; /* Opera */}
.operatorList .word{width:340px;color: #fff; position: absolute; top: 11px; left: 165px;visibility: hidden}
.operatorList .active .word{visibility: visible}
.operatorList .word p{font-size: 14px;line-height: 22px}
.operatorList .word h1{line-height: 24px;margin-top: 4px}
.home-main .text-box,.contact-main .text-box,.case-main .text-box,.product-main .text-box{position:relative;background: #FAFAFA ;flex-direction:column}
.home-main .text-box div{width: 600px;margin: 21% 0 10% auto;}
.home-main .text-box div.container-more{width: 600px;margin: 0 0 0 auto;}
.home-main .text-box p{overflow:hidden;line-height:30px;font-size:16px; width: 400px; color: #666666; text-align: justify; margin: 0 0 0 auto; padding: 0 200px 34px 0}
.more{cursor:pointer;line-height:28px;font-size:14px;color:#317cfc;border: 1px solid #317cfc;border-radius: 14px;padding: 0 10px}
.product-center-box{padding-top:88px;}
.product-center-box .factory div{text-align: right}
.product-list{flex: 1;}
.product-list li{width:500px;text-align: center;margin-left: 5rem;padding: 26px 0;margin-bottom: 20px ;box-shadow:rgba(2,52,102,.1) -1px 3px 12px;border-radius: 8px }
.product-list h1{color: #317cfc;font-size: 20px;line-height: 28px}
.product-list p{color: #666666;line-height: 28px;margin-top: 10px}
.home3,.contact2{min-height: 600px;margin-top: 88px;background:url(../img/part4bg-water.png) no-repeat center center;overflow: hidden}
.home3 div{text-align: center}
.home3 div:nth-child(2) img{margin-bottom: 150px}
.home4{background: #317cfc;margin-top: -100px;padding: 88px 0}
.home4 div{text-align: center}
.home4 .advantage-list{display: flex;flex-wrap: wrap}
.advantage-list li{margin-top:60px; width: 33.33%;color:#fff;}
.advantage-list h1{font-size: 20px;font-weight: bold;margin-bottom: 20px}
.advantage-list p{line-height: 24px;opacity: .85}
.advantage-list i{display: block;  width: 158px;  height: 158px;  overflow: hidden;  margin: 0 auto 30px;  background-position: center 0;  background-size: 100% auto;}
.icon-znhgl{background-image: url(../img/homepart5-icon01.png);}
.icon-sypl{background-image: url(../img/homepart5-icon02.png);}
.icon-wh{background-image: url(../img/homepart5-icon03.png);}
.icon-zjhl{background-image: url(../img/homepart5-icon04.png);}
.icon-ys{background-image: url(../img/homepart5-icon05.png);}
.icon-jk{background-image: url(../img/homepart5-icon06.png);}
/*about.html*/
.about-main{background:url(../img/aboutusbg.png) no-repeat center center }
.about1{text-align: center;height: 600px;padding-top: 88px}
.about1 p{text-align: justify;color: #666666;font-size: 16px;line-height: 30px;text-indent: 32px}
.about1 div:first-child{margin-bottom: 88px}
.about2{background: #317cfc;padding: 88px 0}
.about2 div{text-align: center}
.about2 ul{display: flex;flex-wrap: wrap}
.about2 ul li{margin-top:60px; width: 20%;color:#fff;}
.about2 ul i{display: block;  width: 190px;  height: 263px;  overflow: hidden;  margin: 0 auto;  background-position: center 0;  background-size: 100% auto;}
.icon-ab1{background-image: url(../img/ab_img01.png);}
.icon-ab2{background-image: url(../img/ab_img02.png);}
.icon-ab3{background-image: url(../img/ab_img03.png);}
.icon-ab4{background-image: url(../img/ab_img04.png);}
.icon-ab5{background-image: url(../img/ab_img05.png);}
.icon-ab6{background-image: url(../img/ab_img06.png);}
.icon-ab7{background-image: url(../img/ab_img07.png);}
.icon-ab8{background-image: url(../img/ab_img08.png);}
.icon-ab9{background-image: url(../img/ab_img09.png);}
/*contact.html*/
.map{height:600px;}
.contact-main .text-box div,.case-main .text-box div,.product-main .text-box div{width: 600px;margin: 10% 0 5% auto;}
.contact-main .text-box p,.product-main .text-box p{width: 600px;margin: 0 0 0 auto;color: #666666;line-height: 30px;font-size: 16px; letter-spacing: 6px;}
.contact2>div:first-child{text-align: center;margin-bottom: 60px}
.form-box label{color:#317cfc;font-weight: normal }
.contact2 .form-horizontal>div:nth-child(5){font-size: 20px;text-align: center}
.contact2 .form-horizontal>div:nth-child(6){text-align: center}
.contact2 #addus{margin: 9px 0 0 15px}
.contact2 button{color: #fff;background: #317cfc;border-radius: 24px;width: 100px;}
.contact2 button:hover{color: #fff}
/*case.html*/
.case-main .con-box>div:nth-child(2),.product-main .con-box>div:nth-child(2){background: rgba(49,124,252,.4)}
.case-main .case-list,.product-main .case-list{position: absolute;  top: 0;  left: -63px;}
.case-list li{position: relative; width: 610px; margin-top: 3rem;padding: 15px 10px 30px 30px;  background: #fff;  border-radius: 10px;  box-shadow: rgba(2,52,102,.2) 6px 3px 33px;  }
.case-list .word p{line-height: 30px;color: #666666}
.case-list .word h1{line-height: 24px;color: #317cfc;font-weight: bold}
.case-body>div{padding:90px 0}
.case-body ul{display: flex;flex-wrap: wrap;margin-top: 82px}
.case-body ul li{width: 25%}
.case-body ul img{display: block;  width: 270px;  height: 380px;  overflow: hidden;  margin: 0 auto;  background-position: center 0;  background-size: 100% auto;}
/*product.html*/
.product-main .text-box p{letter-spacing: 0}
.product-main .pro-img span{border-radius: 8px;box-shadow: rgba(2,52,102,.2) 6px 3px 33px;width: 200px;height: 140px ;display: inline-block}
.product-main .pro-img span:first-child{margin-right:25px }
.pro-body{background:url(../img/part4bg-water.png) no-repeat center center; overflow: hidden}
.pro-body>div:first-child{text-align: center }
.pro-body2{background:#317cfc;padding: 80px 0 100px}
.pro-body2 .text-box{flex: 1}
.pro-body2 .text-box div{margin: 15% 0 5% auto;}
.pro-body2 .text-box div:last-child{  position: absolute;  left: 45px;  bottom: 90px;}
.mode-list li{position: relative}
.mode-list div{height: 0;position:absolute; left:15px; bottom:0;text-align: center;color: #fff;font-size: 20px;background: rgba(0,0,0,.65);width: 270px;margin: 0 auto;line-height: 30px;border-radius: 8px}
.mode-list div h1{margin-top: 15px}

/*cooperate.html*/
.co-main .text-box div:nth-child(2){margin: 0 0 3% auto}
.co-main .word{text-align: center}
.co-main .word h1{font-size: 24px;margin: 20px auto}
.co-main .word p{font-size: 18px}
.co-body{min-height: 600px;}
.co-title{text-align: center;margin-top: 80px}
.co-body ul{display: flex}
.co-body ul li{border-radius: 75px;box-shadow: rgba(2,52,102,.2) 6px 3px 33px; width: 150px;height: 150px;background: #fff}
.co-body ul li img{margin-top: 61px;margin-left: 10px}
.co-body ul li:nth-child(1){  position: relative;  left: 25%;  top: 70px;  }
.co-body ul li:nth-child(2){  position: relative;  left: 35%;  top: 270px;  }
.co-body ul li:nth-child(3){  position: relative;  left: 50%;  top: 60px;  }






@-webkit-keyframes start {
    0% {opacity: 0;-webkit-transform: translate(0,280px);}
    100% {opacity: 1;-webkit-transform: translate(0,0);}
}
@-webkit-keyframes end {
    0% {opacity: 1;-webkit-transform: translate(0,-30px);}
    100% {opacity: 0;-webkit-transform: translate(0,-280px);}
}

@media screen and (max-width: 1199px) {
    .product-center-box,.main-footer,.main-header{min-width:1000px;max-width:1200px;overflow:hidden;}
    .home-main .con-box .img-box, .home-main .con-box .text-box{box-sizing: border-box}
    .case-list li {width: 410px;margin-top: 1.4rem}
    .case-body ul img{width: 230px;height: auto}
    .pro-body2 .text-box div:last-child{left: -10%;bottom: 5%;}
    .pro-body2 .text-box div:last-child img{width: 70%}
    .pro-body2 .con-box>div:nth-child(2) img{width: 90%}
    .operatorList li{margin-top: 0}
    .home-main .con-box .operatorList{left: -108px}
    .operatorList li.active{width:500px}
    .mode-list div{width: 230px;left: 10px}
}

@media screen and (min-width: 1200px) and (max-width: 1400px) {
    .operatorList li{margin-top: 0.9rem}
    .case-list li{margin-top: 2rem}
    .pro-body2 .text-box div:last-child{left: -10%;bottom: 4%;}
    .pro-body2 .text-box div:last-child img{width: 80%}
}
@media screen and (min-width: 1400px) and (max-width: 1600px) {
    .operatorList li{margin-top: 2rem}
    .case-list li{margin-top: 2.5rem}
    .pro-body2 .text-box div:last-child{left: -10%; bottom: 4%;}
    .pro-body2 .text-box div:last-child img{width: 90%}
}
@media screen and (min-width: 1600px) and (max-width: 1800px) {
    .operatorList li{margin-top: 3.2rem}
    .pro-body2 .text-box div:last-child{left: -2%}
}