﻿@charset "utf-8";
#section2{ overflow:hidden; height:825px; position:relative; background:url(../../images/bg02.jpg) no-repeat center}
.section2 .title{clear:both; padding:80px 0px 0px 0px; overflow:hidden}
.section2 .title .left{width: calc(100% - 150px); text-align:left}
.section2 .title .right{width:131px; padding:20px 0px 0px 0px}
.section2 .title .right img:hover { position:relative;top:-10px; }
.ct_height{clear:both; overflow:hidden; height:80px;}

#section2 .Solut{ float:left; width:100%; position:relative; z-index:6; animation:slideInUp 2s;-moz-animation:slideInUp 2s; -webkit-animation:slideInUp 2s;-o-animation:slideInUp 2s; height:480px;}
#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:49.84%;}
#section2 .Solut .det .tit{ float:left; width:100%; color:#000; font-size:36px; line-height:46px; margin:10px 0 17px 0; text-align:left}
#section2 .Solut .det .info{ float:left; width:100%; color:#000; font-size:16px; line-height:32px; height:200px; overflow:hidden; text-align:left}
#section2 .Solut .det .tit{ float:left; width:100%; color:#000; font-size:36px; line-height:46px;}
#section2 .Solut .det .img{ float:right; width:45.625%; line-height:0; position:relative;  }
#section2 .Solut .det .tol{ float:left; width:320px; text-align:right; position:absolute; left:0; bottom:20px; font-size:24px; font-family:Arial; font-weight:bold; text-transform:uppercase; line-height:24px; color:#e0e0e0; padding-bottom:48px; text-align:left; padding:0px 0px 0px 20px}
#section2 .Solut .det .tol span{ display:block; color:#bd371e; 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:50%; position:absolute; left:0; bottom:0;}
#section2 .Solut .down .l1{ position:relative; line-height:0; background:#bd371e; overflow:hidden; margin-right:0.65%; }
#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 #bd371e; background-size:auto 100%;}
#section2 .Solut .down .slick-next:hover{ background:url(../../images/i06.png) right center no-repeat #bd371e; background-size:auto 100%;}
#section2 .bgTit1{ float:left; width:32.23%; position:absolute; left:0; bottom:0; z-index:1; line-height:0;}



@media only screen and (max-width: 1366px) {
    .container{width:1200px;}
	#section2 .Solut{ float:left; width:100%; position:relative; z-index:6; animation:slideInUp 2s;-moz-animation:slideInUp 2s; -webkit-animation:slideInUp 2s;-o-animation:slideInUp 2s; height:410px;}
	#section2 .Solut .det .info{ float:left; width:100%; color:#000; font-size:16px; line-height:32px; height:120px; overflow:hidden; text-align:left}
}
@media only screen and (min-width: 1367px) and (max-width: 1600px) and (min-width: 1367px){
    .container{width:1200px;}
	#section2 .Solut{ float:left; width:100%; position:relative; z-index:6; animation:slideInUp 2s;-moz-animation:slideInUp 2s; -webkit-animation:slideInUp 2s;-o-animation:slideInUp 2s; height:410px;}
	#section2 .Solut .det .info{ float:left; width:100%; color:#000; font-size:16px; line-height:32px; height:120px; overflow:hidden; text-align:left}
}
