@charset "utf-8";
#section1{ overflow:hidden; height:100vh; position:relative;}
#section1 .slide_banner{ float:left; width:100%; height:100%; position:relative; background:#000000;}
#section1 .slide_banner .slick-list{ height:100%;}
#section1 .slide_banner .slick-track{ height:100%;}
#section1 .slide_banner .slick-slide{height:100%; position:relative;}
#section1 .slide_banner .ph3{ float:left; width:100%; line-height:0; display:none;}
#section1 .slide_banner .img1{ width:100%; height:100%; position:relative}
#section1 .slide_banner .slick-dots{ bottom:122px; height:59px;}
#section1 .slide_banner .slick-dots li{ width:59px; height:59px; background:url(../images/btn02.png) center no-repeat no-repeat; background-size:100% 100%; overflow:hidden; vertical-align:top;  margin:0 20px;}
#section1 .slide_banner .slick-dots li.slick-active{ background:url(../images/btn03.png) center no-repeat no-repeat; background-size:100% 100%; overflow:hidden;}
#section1 .slide_banner .slick-dots li button{ width:59px; line-height:59px; height:59px; padding:0; font-size:18px; color:#cccccc; color:rgba(204,204,204,0.6)}
#section1 .slide_banner .slick-dots li.slick-active button{ color:#fff;}
#section1 .bann_btn{ float:left; width:13px; line-height:0; position:absolute; left:50%; bottom:0; margin-left:-6px; z-index:66;}
@media screen and  (max-width:1310px){

}
@media screen and  (max-width:1310px){
#section1 .slide_banner .img1{ display:none;}	
#section1 .slide_banner .ph3{ display:block;height:100%; position:relative;}
#section1 .slide_banner .ph3 img{ display:none;}
}
@media screen and  (max-width:1023px){
#section1{ height:auto !important; display:block; float:left; width:100%;}
#section1 .fp-tableCell{ height:auto !important; display:block; float:left;}
#section1 .slide_banner .ph3{ display:block; height:auto;}
#section1 .slide_banner .ph3 img{ display:block;}
#section1 .slide_banner .slick-dots{ height:10px; bottom:60px;}
#section1 .slide_banner .slick-dots li{ margin:0 6px; width:30px; height:30px;}
#section1 .slide_banner .slick-dots li button{ width:30px; line-height:30px; height:30px; font-size:12px;}
#section1 .bann_btn{ bottom:-50px;}

}
@media screen and  (max-width:768px){
    #section2 .hTit1 a font.ri-arrow-right-s-line:after{margin-top:-1px !important;}
}
#section2 .hTit1{ float:left; width:100%; color:#333; font-size:30px; line-height:40px; margin-top:110px; position:relative;animation:slideInDown 5s;-moz-animation:slideInDown 5s; -webkit-animation:slideInDown 5s;-o-animation:slideInDown 5s;}
#section2 .hTit1 span{ font-family:Arial; font-size:50px; font-weight:bold; padding-right:12px;}
#section2 .hTit1 a{ float:right; position:relative; margin-top:24px; height:11px; background:#bc371e; background:rgba(14,110,184,0.1); color:#bc371e; font-size:14px; font-weight:bold; font-family:'Open Sans'; text-transform:uppercase; padding:0 10px; line-height:22px;}
#section2 .hTit1 a font{ display:inline-block; vertical-align:top; margin-top:-12px;}
#section2 .hTit1 a font.ri-arrow-right-s-line{ padding:0 0 0 10px; position:relative;}
#section2 .hTit1 a font.ri-arrow-right-s-line:after{ float:left; width:18px; height:2px; position:absolute; left:0; top:50%; content:''; background:#bc371e; margin-top:-2px;}
#section2 .hTit2 a{ background:#fff; background:rgba(255,255,255,0.1); color:#fff}
#section2 .active .hTit1{animation:slideInDown 5s;-moz-animation:slideInDown 5s; -webkit-animation:slideInDown 5s;-o-animation:slideInDown 5s;}

@media screen and (max-height:900px) {
#section2 .hTit1{ font-size:26px;}
#section2 .hTit1 span{ font-size:40px;}
}

@media screen and (max-height:900px) {
#section2 .hTit1{ font-size:26px;}
#section2 .hTit1 span{ font-size:40px;}
}

#section2 .Solut{ float:left; width:100%; position:relative; z-index:6; margin-top:6.2%;animation:slideInUp 2s;-moz-animation:slideInUp 2s; -webkit-animation:slideInUp 2s;-o-animation:slideInUp 2s;}
#section2 .active .Solut{animation:slideInUp 2s;-moz-animation:slideInUp 2s; -webkit-animation:slideInUp 2s;-o-animation:slideInUp 2s;}
#section2 .Solut .det{ float:left; width:100%;}
#section2 .Solut .det .cont{ float:left; width:54.84%;}
#section2 .Solut .det .tit{ float:left; width:100%; color:#000; font-size:36px; line-height:46px; margin:22px 0 17px 0;}
#section2 .Solut .det .info{ float:left; width:100%; color:#727272; font-size:16px; line-height:36px; height:144px; overflow:hidden;}
#section2 .Solut .det .tit{ float:left; width:100%; color:#000; font-size:36px; line-height:46px;}
#section2 .Solut .det .img{ float:right; width:40.625%; line-height:0; position:relative; margin-bottom:106px;}
#section2 .Solut .det .tol{ float:left; width:184px; text-align:right; position:absolute; left:0; bottom:-106px; font-size:24px; font-family:Arial; font-weight:bold; text-transform:uppercase; line-height:24px; color:#e0e0e0; padding-bottom:48px;}
#section2 .Solut .det .tol span{ display:block; color:#282828; position:relative; z-index:6;}
#section2 .Solut .det .tol:after{ float:left; width:98px; height:350px;  content:''; position:absolute; right:25px; bottom:0; z-index:1;}
#section2 .Solut .down{ float:left; width:55.93%; position:absolute; left:0; bottom:0;}
#section2 .Solut .down .l1{ position:relative; line-height:0; background:#bc371e; overflow:hidden; margin-right:0.65%; margin-bottom:106px;}
#section2 .Solut .down .tit1{ float:left; width:100%; background:url(/template/theme/CN/780_main4.png) center bottom repeat-x; position:absolute; left:0; bottom:0; padding-bottom:7px; color:#fff; font-size:16px; line-height:26px; text-align:center; padding-left:6px; padding-right:6px; padding-top:51px; overflow:hidden;white-space: nowrap; text-overflow:ellipsis;-webkit-transition: all 0.5s ease-out 0s; 
-moz-transition: all 0.5s ease-out 0s; 
-o-transition: all 0.5s ease-out 0s; 
transition: all 0.5s ease-out 0s;  
}
#section2 .Solut .down .tit2{opacity:0; filter:alpha(opacity=00); float:left; width:100%; position:absolute; left:0; top:2px; margin-top:5px; color:#fff; font-size:14px; line-height:24px; text-align:center; padding:0 6px; overflow:hidden;white-space: nowrap; text-overflow:ellipsis; font-family:Arial;-webkit-transition: all 0.5s ease-out 0s; 
-moz-transition: all 0.5s ease-out 0s; 
-o-transition: all 0.5s ease-out 0s; 
transition: all 0.5s ease-out 0s;  
}
#section2 .Solut .down .l1.slick-current{ box-shadow:0 7px 13px rgba(0,0,0,0.27);}
#section2 .Solut .down .l1.slick-current img{opacity:0.1; filter:alpha(opacity=10);}
#section2 .Solut .down .l1.slick-current .tit1{ bottom:50%; margin-bottom:-5px; padding-top:0 !important; padding-bottom:0 !important; background:none;}
#section2 .Solut .down .l1.slick-current .tit2{ top:50%;opacity:1; filter:alpha(opacity=100);}
#section2 .Solut .down .slick-prev,
#section2 .Solut .down .slick-next{ width:30px; height:30px; background:url(../../images/i06.png) left center no-repeat #d3d3d3; border-radius:50%; background-size:auto 100%; top:-60px; left:0;transform:translate(0,0); -moz-transform:translate(0,0); -webkit-transform:translate(0,0);}
#section2 .Solut .down .slick-next{ right:auto; left:38px; background:url(../../images/i06.png) right center no-repeat #d3d3d3; background-size:auto 100%;}
#section2 .Solut .down .slick-prev:hover{ background:url(../../images/i06.png) left center no-repeat #0e6eb8; background-size:auto 100%;}
#section2 .Solut .down .slick-next:hover{ background:url(../../images/i06.png) right center no-repeat #bc371e; background-size:auto 100%;}
#section2 .bgTit1{ float:left; width:32.23%; position:absolute; left:0; bottom:0; z-index:1; line-height:0;}

@media screen and (max-height:900px) {
#section2 .Solut{ margin-top:2.2%;}
#section2 .Solut .det .tit{ font-size:30px; line-height:40px;}
#section2 .Solut .det .info{ line-height:30px; height:120px;}
#section2 .Solut .det .img{ width:36%; margin-bottom:20px;}
#section2 .Solut .det .tol{ bottom:-20px;}
#section2 .Solut .det .tol span{ color:#bc371e;}
#section2 .Solut .det .tol:after{ height:200px; width:90px;}
#section2 .Solut .down .l1{ margin-bottom:20px;}
#section2 .Solut .down .slick-prev,
#section2 .Solut .down .slick-next{ top:-40px;}
#section2 .bgTit1{ width:20%;}
}

#section2{ overflow:hidden; height:100vh; position:relative;}
@media screen and  (max-width:1310px){

}
@media screen and  (max-width:1310px){
#section2 .hTit1{ font-size:26px;}
#section2 .hTit1 span{ font-size:40px;}

#section2 .Solut .det .tit{ font-size:30px; line-height:40px; margin:10px 0 15px 0;}
#section2 .Solut .det .info{ line-height:30px; height:120px;}	
#section2 .Solut .down .slick-prev,
#section2 .Solut .down .slick-next{ top:-40px;}
#section2 .bgTit1{ width:20%;}
}
@media screen and  (max-width:1023px){
#section2 .hTit1{ font-size:16px; line-height:24px; margin-top:0; }
#section2 .hTit1 span{ font-size:25px; padding-right:6px;}
#section2 .hTit1 a{ margin-top:9px;}
#section2{ height:auto !important; display:block; float:left; width:100%;}
#section2 .fp-tableCell{ height:auto !important; display:block; float:left;}

#section2{ padding:30px 0 20px 0;}	
#section2 .Solut{ margin-top:4%;}
#section2 .Solut .det .tit{ font-size:20px; line-height:30px; margin:15px 0 12px 0;}
#section2 .Solut .det .info{ font-size:14px; line-height:26px; height:78px;}
#section2 .Solut .det .img{ margin-bottom:20px;}
#section2 .Solut .det .tol{ width:130px; bottom:-20px; padding-bottom:20px; font-size:18px;}
#section2 .Solut .det .tol span{ color:#bc371e;}
#section2 .Solut .det .tol:after{ width:78px; right:15px; height:120px;  }
#section2 .Solut .down .l1{ margin-bottom:15px;}
#section2 .Solut .down .l1.slick-current{ box-shadow:0 5px 10px rgba(0,0,0,0.27);}
#section2 .Solut .down .tit1{ font-size:14px; line-height:24px;}
#section2 .Solut .down .tit2{ font-size:12px; line-height:22px;}
#section2 .Solut .down .slick-prev,
#section2 .Solut .down .slick-next{ top:-40px;}
#section2 .bgTit1{ width:32%;}
}
@media screen and  (max-width:768px){
#section2 .hTit1 span{ display:block;}	
#section2 .hTit1 a{ position:absolute; right:0; top:50%; margin-top:-7px; padding:0 6px; font-size:12px; height:7px; line-height:18px;}
#section2 .hTit1 a font.ri-arrow-right-line{ padding:0 0 0 5px; position:relative;}
#section2 .hTit1 a font.ri-arrow-right-line:after{ width:10px; }


#section2 .Solut .det .cont{ width:100%;}
#section2 .Solut .det .tol{ width:95%;}
#section2 .Solut .det .img{ width:100%; margin-bottom:0;}
#section2 .Solut .det .tit{ margin:15px 0 0 0;}
#section2 .Solut .down{ width:100%; position:relative; margin-top:10px;}
#section2 .Solut .down .slick-prev,
#section2 .Solut .down .slick-next{ top:-172px; margin-left:10px;}