@charset "utf-8";
/* CSS Document */
body{ background-color:#FFF;}
.float{ width:750px; left:50%; top:0; height:100%; position:fixed; margin-left:-375px; background-color:rgba(0,0,0,0.9); z-index:1200; display:none; }
.float > .f-navlist{ width:100%; position:absolute; left:0; top:0; z-index:1002; display:none;}
.float > .f-navlist > h3{ width:100%; height:48px; line-height:48px; font-size:16px; box-sizing:border-box; padding-left:10px; padding-right:10px; border-bottom:1px solid rgba(255,255,255,0.8); color:#333; text-align:center; font-weight:normal; color:#FFF;} 
.float > .f-navlist > h3 > span{ float:right;}
.float > .f-navlist > h3 > span a,.float > .f-navlist > h3 > span a:hover{ color:#FFF;}
.float > .f-navlist > h3 > span:nth-of-type(2){ float:right; }
.float > .f-navlist > h3 > span > i{ font-size:14px;}
.float > .f-navlist > ul{ width:100%; box-sizing:border-box; box-sizing:border-box;}
.float > .f-navlist > ul > li{ width:100%; height:auto; overflow:hidden; text-align:left; box-sizing:border-box; padding-left:10px; padding-right:10px; border-bottom:1px solid rgba(255,255,255,0.6);}
.float > .f-navlist > ul > li + li{}
.float > .f-navlist > ul > li > a{ display: block; width: 100%; height: 40px; line-height:40px; font-size:12px; position: relative;}
.float > .f-navlist > ul > li > a::after{ content: '\e63e'; width:20px; height: 20px; line-height: 20px; text-align: right; position: absolute; right:0; top:50%; margin-top: -10px; font-family:"iconfont" !important;  font-size:16px; display: none;}
.float > .f-navlist > ul > li > a.fnavliItems::after{display: block;}
.float > .f-navlist > ul > li > a,.float > .f-navlist > ul > li > a:hover{ color:#FFF !important; }
.float > .f-navlist > ul > li > a > i{ color:#FFF; font-size:14px;}
.float > .f-navlist > ul > li > p{ width: 100%; height: auto; box-sizing: border-box; padding-left:10%; padding-bottom:10px; display: none;animation: fadeInDown 0.5s ease-in-out; -webkit-animation: fadeInDown 0.5s ease-in-out;}
.float > .f-navlist > ul > li:hover > p{ display: block;}
.float > .f-navlist > ul > li > p > a{ width: 100%; height: 30px; line-height: 30px; height: 30px; display: block; text-align: left; font-size: 12px; color: #FFF !important; }
.float > .f-navlist > ul > li:hover{ background-color:#000;}
.float > .f-navlist > ul > li:hover > a,.float > .f-navlist > ul > li > a:hover,.float > .f-navlist > ul > li:hover > a > i,.float > .f-navlist > ul > li:hover > a:hover > i{ color:#FFF !important;}
.header{ width:750px; height:auto; padding:0 0; box-sizing:border-box; background-color:rgba(255,255,255,0); position:fixed; left:50%; top:0; margin-left:-375px;  text-align:center; z-index:1000; /*border-bottom:1px solid #f2f2f2;*/ }
.header > .logo{ display: block; width: 12rem; box-sizing: border-box; padding:1rem; overflow: hidden; }
.header > .logo img{ width: 100%; }
.header > .menu{ width: 3rem; position: absolute; right:1rem; top:50%; margin-top: -1.5rem; box-sizing: 0.5rem; box-sizing: border-box; }
.header > .menu img{ width: 100%; }

.scrolltop{ background-color:#2c2c2c; border-bottom:1px solid rgba(120,120,120,0.1);  animation: fadeInDown 0.5s ease-in-out; -webkit-animation: fadeInDown 0.5s ease-in-out;}


/*.header-blank{ background-color:transparent; height:3rem;}*/


/*底部*/
/*.foot-blank{ height:5.4rem; width:100%;  }*/
.footer{ width:750px; background-color:#2c2c2c; z-index:999; margin:0 auto; box-sizing: border-box; padding-top: 2rem;}
.footer > .contact{ width: 100%; box-sizing: border-box; padding:0 1rem; }
.footer > .contact > header{ width: 100%; }
.footer > .contact > header > a{ width: 30%; display: block; margin:0 auto; }
.footer > .contact > header > a img{ width:100%; }
.footer > .contact > div{width: 80%; margin:0 auto; padding-top: 1rem; padding-bottom:1rem;}
.footer > .contact > div > ul > li{ width: 100%; line-height: 1.6rem; font-size: 0.8rem; box-sizing: border-box; padding-left:1.6rem; color: rgba(255,255,255,0.5); position: relative; }
.footer > .contact > div > ul > li::after{ content: '\e61e'; width: 1.6rem; height: 1.6rem; position: absolute; left:0; top:0; font-family:"iconfont" !important;  font-size:1rem; color: #FFF; }
.footer > .contact > div > ul > li:nth-of-type(2)::after{ content: ' ';}
.footer > .contact > div > ul > li:nth-of-type(3)::after{ content: '\e767';}
.footer > .copyright{ width: 100%; box-sizing: border-box; padding:1rem; border-top: 1px solid rgba(255,255,255,0.2); line-height: 1.6; font-size: 0.8rem; text-align: center; color: rgba(255,255,255,0.5);}
.footer > .copyright a,.footer > .contact > div > ul > li a{color: rgba(255,255,255,0.5);}
 
.main{  height:auto; }

/*首页*/
/*焦点图*/
.swiper1 .swiper-pagination {right:0; display:inline-block;  padding-top:2%; padding-bottom:2%; bottom:0; left:auto; text-align:center; padding-right:10px; box-sizing:border-box;}
.swiper1 .swiper-pagination-bullet{opacity:1; background:rgba(255,255,255,0.5); margin:0 3px!important;width:30px; height:4px; border-radius:0;}
.swiper1 .swiper-pagination-bullet-active{background:rgba(255,255,255,1);}
.swiper1 .swiper-slide{ position:relative;}
.swiper1 .swiper-slide img{ width:100%;}
.swiper1 .swiper-button-next,.swiper1 .swiper-button-prev{ color:rgba(255,255,255,0.8); background-color:rgba(9,138,216,0.5); border-radius:3px; height:50px; width:30px; text-align:center; background-image:url(none); cursor:pointer; margin-top:-25px; display:none;  } 
.swiper1 .swiper-button-next:hover,.swiper1 .swiper-button-prev:hover{  background-color:rgba(9,138,216,1);color:rgba(255,255,255,1)} 
.swiper1 .swiper-button-next i,.swiper1 .swiper-button-prev i{ font-size:24px; text-align:center; /*color:rgba(0,0,0,0.64);*/ line-height:50px;}

.tongjiList{ width: 100%;background-color: #f4f4f4; box-sizing: border-box; padding:1rem;}
.tongjiList > ul > li{ width: 25%; float: left; box-sizing: border-box;}
.tongjiList > ul > li + li{ border-left:1px solid #d7d7d7; }
.tongjiList > ul > li > h3,.tongjiList > ul > li > p{ width:100%; text-align: center; font-weight: normal; line-height: 1.5; font-size: 0.8rem; }
.tongjiList > ul > li > h3{ font-size: 2rem; }
.tongjiList > ul > li > h3 > span{ font-size: 0.8rem; }

.prodServ{ width: 100%; padding-top: 1rem; padding-bottom:1rem;}
.prodServ > header{ width:100%; font-size: 1.3rem; line-height: 3rem; text-align: center; }
.prodServ > .prodServ-tab{ width:100%;/* border-bottom:1px solid #f4f4f4;*/ text-align: center;  }
.prodServ > .prodServ-tab > p{ width:50%; display: inline-block; font-size: 1.2rem; line-height:3rem; box-sizing: border-box; border-bottom:2px solid #FFF; cursor: pointer; float: left; }
.prodServ > .prodServ-tab > p > span{ font-size: 0.8rem; text-transform: uppercase; color: #999; }
.prodServ > .prodServ-tab > p.on{ border-bottom-color: #2aa5ed; }
.prodServ-cont{ width: 100%; padding-top:1rem; }
.prodServ-list{ width:100%; display: none;border-top: 1px solid #EEE; }
.prodServ-list > ul > li{ width: 50%; float: left; /*background-color: #f6f6f6;*/ background-color: #FFF; box-sizing: border-box; border-bottom: 1px solid #EEE; padding-bottom:1rem;}
.prodServ-list > ul > li:nth-of-type(2n){ border-left:1px solid #EEE; }
.prodServ-list > ul > li:nth-of-type(2),.prodServ-list > ul > li:nth-of-type(3),.prodServ-list > ul > li:nth-of-type(6),.prodServ-list > ul > li:nth-of-type(7){ background-color: #f6f6f6; }
.prodServ-list > ul > li > a{ width: 100%; display: block; overflow: hidden; }
.prodServ-list > ul > li > a > p{ width: 96px; margin:0 auto; overflow: hidden; }
.prodServ-list > ul > li > a > p img{ width: 100%; }
.prodServ-list > ul > li > a > h3{ width: 100%; line-height: 0.8rem; height:3.2rem; line-height: 1.6rem; font-weight: normal; font-size: 0.8rem; text-align: center; } 

.casesList{ width: 100%; background-color: #f4f4f4; box-sizing: border-box; padding:1rem 1rem 0 1rem;  }
.casesList > ul > li{ width: 100%; float: left; }
.casesList > ul > li + li{ margin-right:0; margin-top: 1rem; }
.casesList > ul > li > a{ display: block; width:100%; background-color: #FFF; box-sizing: border-box;  transition: all 0.5s linear; -webkit-transition: all 0.5s linear; }
.casesList > ul > li > a > p{ width: 100%;max-height:200px;overflow: hidden; }
.casesList > ul > li > a > p img{ width: 100%; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; }
.casesList > ul > li > a > div{ width:100%; box-sizing: border-box; padding:10px; border-top: 1px solid #F4F4F4;border-bottom: 1px solid #F4F4F4; position: relative; }
.casesList > ul > li > a > div > h3{ width: 100%; font-weight: normal; font-size: 1.2rem; height: 1.6rem; line-height: 1.6rem; color: #333; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;  }
.casesList > ul > li > a > div > p{ font-size: 0.8rem; color: #999; margin-top: 0.3rem; height: 1.2rem; line-height: 1.2rem; }
.casesList > ul > li > a > div > h4{ width: 1.6rem; height: 1.6rem; line-height: 0rem; text-align: center; border-radius: 50%; box-sizing: border-box; border:1px solid #999;  color: #999 !important; position: absolute; right:1rem; top:50%; margin-top: -0.8rem; font-weight: normal; overflow: hidden;}
.casesList > ul > li > a > div > h4 i{ font-size: 1rem; }
.casesList > ul > li > a:hover{  background-color: #2aa5ed; color: #FFF !important;}
.casesList > ul > li > a:hover > p img{ transform:scale(1.05,1.05); -webkit-transform:scale(1.05,1.05); opacity: 0.8}
.casesList > ul > li > a:hover > div{  border-top: 1px solid #2aa5ed;border-bottom: 1px solid #2aa5ed; }
.casesList > ul > li > a:hover > div > h3{ color: rgba(255,255,255,1) !important; }
.casesList > ul > li > a:hover > div > p{ color: rgba(255,255,255,0.6) !important; }
.casesList > ul > li > a:hover > div > h4{border:1px solid #FFF; color: #FFF !important;}

.btnMore{ width: 100%; padding-top: 1rem; padding-bottom: 1rem; float: left; text-align: center; }
.btnMore > a{ display: inline-block; width: 100%;  line-height: 3rem; margin:0 auto; font-size: 1.1;  color: #333 !important; text-align: center; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; background-color: #FFF;}
.btnMore > a:hover{  border:1px solid #2aa5ed; background-color: #2aa5ed; color: #FFF !important; }

.ads{ width: 100%; position: relative;}
.ads > img{ width: 100%; }
.ads > header{ width:100%; position: absolute; left:0; top:5%;}
.ads > header > h3,.ads > header > p{ width:100%; font-size: 1.3rem; line-height:3rem; text-align: center; font-weight: normal; text-transform: uppercase; color: #FFF; }
.ads > header > p{  font-size: 1rem; line-height: 1.6rem; }

.leader{ width: 100%; padding:1rem; box-sizing: border-box;}
.leader > header{ width:100%; }
.leader > header > p{ width: 50%; font-size: 1.2rem; height: 3.5rem; line-height: 3.5rem; box-sizing: border-box; border-bottom:2px solid #FFF; color: #333; text-align: center; cursor: pointer; float: left; }
.leader > header > p.on{ border-bottom: 2px solid #2aa5ed; color: #000; }

.leader-cont,.leader-list{ width: 100%; }
.leader-cont{ margin-top: 1rem; }
.leader-list{ height: 0; overflow: hidden; }
.swiper2{ padding-bottom:3rem; }
.swiper2 .swiper-pagination {right:0; display:inline-block;  padding-top:2%; padding-bottom:0; bottom:0; left:auto; text-align:center; padding-right:10px; box-sizing:border-box; }
.swiper2 .swiper-pagination-bullet{opacity:1; margin:0 1px!important;width:24px; height:24px; border-radius:0%; box-sizing:border-box; /*border:1px solid #FFF;*/ background-color: transparent; color: #999; }
.swiper2 .swiper-pagination-bullet-active{background-color: transparent; color: #333;}
.swiper2 .swiper-slide{ position:relative;}
.swiper2 .swiper-slide > a{ display: block; width: 100%; background-color: #2aa5ed ; color: #FFF !important; transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.swiper2 .swiper-slide > a > p{ width: 100%; overflow: hidden; }
.swiper2 .swiper-slide > a > p img{ width: 100%; transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.swiper2 .swiper-slide > a > h3{ width: 100%; padding:0.5rem 1rem; height: 4.2rem; line-height: 1.6rem; box-sizing: border-box; white-space: nowrap; text-overflow: ellipsis; font-size: 1rem; font-weight: normal; }
.swiper2 .swiper-slide > a > h3 > p{width:100%; line-height: 1.6rem; font-size: 0.8rem; color: rgba(255,255,255,1); }
.swiper2 .swiper-slide > a > h3 > p > span{ color:  rgba(255,255,255,0.6); }
.swiper2 .swiper-slide > a:hover{  background-color: #2aa5ed ; }
.swiper2 .swiper-slide > a:hover > p img{ transform:scale(1.05,1.05); -webkit-transform:scale(1.05,1.05); opacity: 0.9}
.swiper2 .swiper-button-next,.swiper2 .swiper-button-prev{display:none; color:rgba(0,0,0,0.5);  border-radius:0%; height:30px; width:30px; line-height:30px; text-align:center; background-image:url(none); cursor:pointer; margin-top:0; top:auto; bottom:0; box-sizing:border-box;  } 
.swiper2 .swiper-button-next{ right:50%; margin-right:-70px;  } 
.swiper2 .swiper-button-prev{ left:50%; margin-left:-80px;  }
.swiper2 .swiper-button-next:hover,.swiper2 .swiper-button-prev:hover{ color:#2aa5ed !important; } 
.swiper2 .swiper-button-next i,.swiper2 .swiper-button-prev i{ font-size:14px; }

.swiper3{ padding-bottom:2.5rem; }
.swiper3 .swiper-pagination {right:0; display:inline-block;  padding-top:2%; padding-bottom:0; bottom:0; left:auto; text-align:center; padding-right:10px; box-sizing:border-box; }
.swiper3 .swiper-pagination-bullet{opacity:1; margin:0 1px!important;width:24px; height:24px; border-radius:0%; box-sizing:border-box; /*border:1px solid #FFF;*/ background-color: transparent; color: #999; }
.swiper3 .swiper-pagination-bullet-active{background-color: transparent; color: #333;}
.swiper3 .swiper-slide{ position:relative;}
.swiper3 .swiper-slide > a{ display: block; width: 100%; background-color: #2aa5ed ; color: #FFF !important; transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.swiper3 .swiper-slide > a > p{ width: 100%; overflow: hidden; }
.swiper3 .swiper-slide > a > p img{ width: 100%; transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.swiper3 .swiper-slide > a > h3{ width: 100%; padding:0.5rem 1rem; height: 4.2rem; line-height: 1.6rem; box-sizing: border-box; white-space: nowrap; text-overflow: ellipsis; font-size: 1rem; font-weight: normal; }
.swiper3 .swiper-slide > a > h3 > p{width:100%; line-height: 1.6rem; font-size: 0.8rem; color: rgba(255,255,255,1); }
.swiper3 .swiper-slide > a > h3 > p > span{ color:  rgba(255,255,255,0.6); }
.swiper3 .swiper-slide > a:hover{  background-color: #2aa5ed ; }
.swiper3 .swiper-slide > a:hover > p img{ transform:scale(1.05,1.05); -webkit-transform:scale(1.05,1.05); opacity: 0.9}
.swiper3 .swiper-button-next,.swiper3 .swiper-button-prev{ color:rgba(0,0,0,0.5);  border-radius:0%; height:30px; width:30px; line-height:30px; text-align:center; background-image:url(none); cursor:pointer; margin-top:0; top:auto; bottom:0; box-sizing:border-box;  } 
.swiper3 .swiper-button-next{ right:50%; margin-right:-70px;  } 
.swiper3 .swiper-button-prev{ left:50%; margin-left:-80px;  }
.swiper3 .swiper-button-next:hover,.swiper3 .swiper-button-prev:hover{ color:#2aa5ed !important; } 
.swiper3 .swiper-button-next i,.swiper3 .swiper-button-prev i{ font-size:14px; }

.news{ box-sizing: border-box; padding:1rem; background-color: #f4f4f4; }
.newsHeader{ width:100%;  font-size: 1.2rem; height: 3.5rem; line-height: 3.5rem; box-sizing: border-box;  color: #333; text-align: left; cursor: pointer; }
.newsHeader > a{ font-size: 0.8rem; display: inline-block; float: right; height: 3.5rem; line-height: 3.5rem; color: #999; }
.newsList{ width: 100%;}
.newsList > ul > li{ width: 100%; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; background-color: #FFF; padding-bottom:1rem;}
.newsList > ul > li + li{ margin-top: 0.3rem; }
.newsList > ul > li > .nl-date{ width: 100%; height: 2rem; padding:0 10px; box-sizing: border-box; color: #333 ;transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.newsList > ul > li > .nl-date > p{ height:2rem; line-height: 2rem; font-size: 0.8rem; width:6rem; text-align: center; background-color: #2aa5ed; color: #FFF !important; float: right;}
.newsList > ul > li > .nl-about{ display: block; width:100%; box-sizing: border-box; padding:0 1rem; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; overflow: hidden;margin-top:0.5rem;}
.newsList > ul > li > .nl-about > h3{ width: 100%; height: auto; line-height: 1.6rem; font-weight: normal; font-size: 1rem; text-align: left; }
.newsList > ul > li > .nl-about > p{ width: 100%; line-height: 1.6rem; height: auto; overflow: hidden; margin-top:0.5rem; font-size: 0.8rem; color: #999 !important; text-align: left;}
.newsList > ul > li > .nl-more{ display: block; font-size: 0.8rem; line-height: 1.6rem; color: #999 !important; text-align: left;box-sizing: border-box; padding:0 1rem; text-transform: uppercase; margin-top: 1rem; }

.cooperation{ width:100%; padding-top: 1rem; padding-bottom: 1rem; }
.cooperation > header{ width:100%; }
.cooperation > header > h3,.cooperation > header > p{ width:100%; font-size: 1.3rem; line-height:2; text-align: center; font-weight: normal; text-transform: uppercase; }
.cooperation > header > p{  font-size: 1rem; line-height: 1.6rem; }
.cooperation > header > p > a{ color: #2aa5ed !important; }
.hezuo{width: 94%; margin:0 auto; margin-top: 1rem; box-sizing: border-box; }
.cooperList{ width:101%; padding-bottom:2.5rem; position: relative;  }
.swiper4{ /*border-right:1px solid #EEE; border-left:1px solid #EEE;*/ }
.cooperList .swiper-pagination { width:100%; right:0; display:inline-block;  padding-top:2%; padding-bottom:0; bottom:0; left:auto; text-align:center; padding-right:10px; box-sizing:border-box; }
.cooperList .swiper-pagination-bullet{opacity:1; margin:0 5px!important;width:10px; height:10px; border-radius:50%; box-sizing:border-box; /*border:1px solid #FFF;*/ background-color: #cacaca; color: #999; }
.cooperList .swiper-pagination-bullet-active{background-color: #2aa5ed;}
.swiper4 .swiper-slide{ position:relative;border:1px solid #EEE; box-sizing: border-box; /*border-right:0;*/}
.swiper4 .swiper-slide > a{ display: block; width: 100%; background-color: #2aa5ed ; color: #FFF !important; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; }
.swiper4 .swiper-slide:nth-of-type(2n) > a{ border-top: 0; }
.swiper4 .swiper-slide:nth-last-of-type(1) > a,.swiper4 .swiper-slide:nth-last-of-type(2) > a{ border-right: 1px solid #EEE; }
/*.swiper4 .swiper-slide:nth-lof-type(1) > a,.swiper4 .swiper-slide:nth-lof-type(2) > a{ border-left: 0; }*/
.swiper4 .swiper-slide > a img{ width: 100%; transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.swiper4 .swiper-button-next,.swiper4 .swiper-button-prev{ color:rgba(0,0,0,0.5);  border-radius:0%; height:30px; width:30px; line-height:30px; text-align:center; background-image:url(none); cursor:pointer; margin-top:0; top:auto; bottom:0; box-sizing:border-box; display: none; } 
.swiper4 .swiper-button-next{ right:50%; margin-right:-70px;  } 
.swiper4 .swiper-button-prev{ left:50%; margin-left:-80px;  }
.swiper4 .swiper-button-next:hover,.swiper4 .swiper-button-prev:hover{ color:#2aa5ed !important; } 
.swiper4 .swiper-button-next i,.swiper4 .swiper-button-prev i{ font-size:14px; }


.mc-1{
    position: absolute;
    z-index: 55;
    top: 12%;
    text-align: center;
    width: 100%;
    left: 0;
}
.mc-1 >p{
    font-size: 14px;
    color: rgba(255, 255, 255, .6);
    font-weight: lighter;
    text-align: center;
    margin-bottom: 10px;
}

.mc-1 >span p{
    color: #fff;
    font-size: 24px;
    font-weight: lighter;
    line-height: 1.33;
}
.mc-1 >span p span{
    color: #ffdc3b;
}

.mc-btn{
    width: 100%;
    display: flex;
    justify-content: center;
    position: absolute;
    bottom:35px;
}
.mc-btn a{
    display: flex;
    align-items: center;
    justify-content: center;
    bottom: 35px;
    width: 132px;
    height: 30px;
    border: solid 1px white;
    border-radius: 30px;
    font-size: 12px;
    color: white;
}
.mc-btn a i{
    color: #fff;
    font-size: 12px;
    margin-left: 10px;
}

.mc-2{
    position: absolute;
    z-index: 55;
    top: 12%;
    text-align: center;
    width: 100%;
    left: 0;
}
.mc-2 p:nth-child(1){
    font-size: 24px;
    color: #fff;
}

.mc-2 span{
    width: 20px;
    height: 2px;
    background: #fff;
    margin: 10px auto;
    display: block;
}
.mc-2 p:nth-child(3){
    font-size: 16px;
    color: #fff;
    line-height: 24px;
}