.banner{position:relative;height:670px;line-height:670px;overflow:hidden;}
.banner .top-con{height:100%;}
.banner .footer_con{height:100%;}
.banner .content{position:absolute;top:0px;left:0px;width:100%;height:100%;background:no-repeat center center;}
.banner .content .infos{position:absolute;top:232px;left:0px;width:550px;overflow:hidden;}
.banner .content .infos h1{line-height:62px;padding-bottom:12px;color:#fff;font-size:40px;font-weight: bold; text-shadow:0 2px 2px rgba(0,0,0,0.29);-webkit-text-shadow:0 2px 2px rgba(0,0,0,0.29); transform: translateX(-100%);-webkit-transform: translateX(-100%);transition-duration: .3s;-webkit-transition-duration:.3s;transition-delay:.3s;-webkit-transition-delay:.3s; }
.banner .content .infos .info{line-height:36px;color:#fff;font-size:24px;transform: translateX(-100%);-webkit-transform: translateX(-100%);transition-duration: .3s;-webkit-transition-duration:.3s; transition-delay:.6s;-webkit-transition-delay:.6s; }
.banner .content .infos .info p{text-shadow:0 2px 2px rgba(0,0,0,0.29);-webkit-text-shadow:0 2px 2px rgba(0,0,0,0.29);} 
.banner .content.in .infos h1{ transform: translateX(0%);-webkit-transform: translateX(0%);}
.banner .content.in .infos .info{ transform: translateX(0%);-webkit-transform: translateX(0%);}

.banner .content .imgs{top:0px;bottom:0px;margin:auto 0;right:0px;width:50%;transform: scale(0);-webkit-transform:scale(0);transition-delay:.3s;-webkit-transition-delay:.3s;transition-duration: .3s;-webkit-transition-duration:.3s;display:none;}
.banner .content .imgs img{max-width:100%;max-height:80%;vertical-align:middle;}
.banner .content.in .imgs{transform: scale(1);-webkit-transform:scale(1);}

.banner .top-con .btn{transition-duration: .3s;-webkit-transition-duration:.3s;cursor:pointer;position:absolute;top:0px;bottom:0px;margin:auto 0;width:46px;height:46px;line-height:46px;text-align:center;border:1px solid #fff;border-radius:46px;-webkit-border-radius:46px;}
.banner .top-con .btn img{ vertical-align:middle; }
.banner .top-con .btn.left-btn{left:0px;}
.banner .top-con .btn.right-btn{right:0px;}
.banner .top-con .btn:hover{background:#86c126;border:1px solid #86c126;}
.banner .banner-nav{position:absolute;left:0px;right:0px;bottom:20px;height:8px;line-height:8px;text-align:center;}
.banner .banner-nav .child{vertical-align:middle;display:inline-block;*display:inline;*zoom:1;width:8px;height:8px;border-radius:8px;-webkit-border-radius:8px;background:#fff;cursor:pointer;margin:0 4px;}
.banner .banner-nav .child.on{background:#86c126;}
.banner .content1 .imgs{right:-60px;}
.contapro{border-bottom:1px solid #e5e5e5;}
.contapro:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}
.contapro .contapro-child{position:relative;width:25%;height:340px;float:left;overflow:hidden;}
.contapro .contapro-child h2{position:relative;z-index:2;line-height:34px;padding-bottom:10px;color:#434343;font-size:22px;}
.contapro .contapro-child .info{position:relative;z-index:2;line-height:22px;padding-bottom:26px;color:#878787;font-size:14px;}
.contapro .contapro-child .icon{position:relative;z-index:2;}
.contapro .contapro-child .bg{position:absolute;top:0px;bottom:0px;left:0px;right:0px;background:no-repeat center center;background-size:cover;transition-duration: 2s;-webkit-transition-duration:2s;}
.contapro .contapro-child .bg img{position:absolute;bottom:0px;right:0px;}
.contapro .contapro-child .bg .h{position:absolute;top:0px;bottom:0px;left:0px;right:0px; opacity: 0.8;}
.contapro .contapro-child:hover .bg{ transform: scale(1.1);-webkit-transform: scale(1.1); }

.contapro .contapro-child.odd .center{padding:74px 38px 0 38px;}
.contapro .contapro-child.even .center{padding:62px 68px 0 68px;}
.contapro .contapro-child.even h2{position:relative;z-index:2;line-height:42px;padding-bottom:10px;color:#fff;}
.contapro .contapro-child.even .info{position:relative;z-index:2;line-height:28px;padding-bottom:26px;color:#fff;}
.contapro .contapro-child1 .bg img{bottom: 10px;right: 20px;}
.contapro .contapro-child2 .bg .h{background:#750173;}
.contapro .contapro-child4 .bg .h{background:#022981;}


.contapro .contapro-child h2{animation:contapro-child-left .6s cubic-bezier(0.62, -0.14, 0.6, 1.45) 0s both;-webkit-animation:contapro-child-left .6s cubic-bezier(0.62, -0.14, 0.6, 1.45) 0s both;}
.contapro .contapro-child .info{animation:contapro-child-left .6s cubic-bezier(0.62, -0.14, 0.6, 1.45) .4s both;-webkit-animation:contapro-child-left .6s cubic-bezier(0.62, -0.14, 0.6, 1.45) .4s both;}
.contapro .contapro-child .icon{animation:contapro-child-left .6s cubic-bezier(0.62, -0.14, 0.6, 1.45) .8s both;-webkit-animation:contapro-child-left .6s cubic-bezier(0.62, -0.14, 0.6, 1.45) .8s both;}

@keyframes contapro-child-left{
0%{ transform:translateX(-200%); }
100%{transform:translateX(0);}
}
@-webkit-keyframes contapro-child-left{
0%{ -webkit-transform:translateX(-200%); }
100%{-webkit-transform:translateX(0);}
}



@media (max-width: 767px) {
.banner{height:200px;line-height:200px;}
.banner .content .infos{top:60px;left:0px;right:0px;margin:0 auto;width:260px;}
.banner .content .infos h1{line-height:24px;padding-bottom:8px;font-size:20px; }
.banner .content .infos .info{line-height:20px;font-size:14px;}
.banner .content .imgs{display:none;}

.banner .top-con .btn{width:46px;height:46px;line-height:46px;}
.banner .banner-nav{bottom:20px;height:8px;line-height:8px;}
.banner .banner-nav .child{width:8px;height:8px;margin:0 4px;}
.banner .content1 .imgs{right:-45px;}
.contapro{border-bottom:0;}
.contapro .contapro-child{height:180px;width:50%;border-bottom: 1px solid #e5e5e5;}
.contapro .contapro-child h2{line-height:26px;padding-bottom:8px;font-size:18px;}
.contapro .contapro-child .info{line-height:20px;padding-bottom:16px;font-size:12px;}


.contapro .contapro-child.odd .center{padding:20px 12px;}
.contapro .contapro-child.even .center{padding:20px 12px;}
.contapro .contapro-child.even h2{line-height:26px;padding-bottom:8px;font-size:18px;}
.contapro .contapro-child.even .info{line-height:20px;padding-bottom:16px;font-size:12px;}
.contapro .contapro-child1 .bg img{bottom: 6px;right: 10px;width:80px;}
.contapro .contapro-child3 .bg img{width:121px;}

}
@media (min-width: 768px) and (max-width:1200px ) {
.banner{height:320px;line-height:320px;}
.banner .content .infos{top:80px;left:0px;right:0px;margin:0 auto;width:420px;}
.banner .content .infos h1{line-height:46px;padding-bottom:10px;font-size:30px; }
.banner .content .infos .info{line-height:28px;font-size:18px;}
.banner .content .imgs{display:none;}

.banner .top-con .btn{width:46px;height:46px;line-height:46px;}
.banner .banner-nav{bottom:20px;height:8px;line-height:8px;}
.banner .banner-nav .child{width:8px;height:8px;margin:0 4px;}
.banner .content1 .imgs{right:-45px;}
.contapro{border-bottom:0;}
.contapro .contapro-child{height:255px;width:50%;border-bottom: 1px solid #e5e5e5;}
.contapro .contapro-child h2{line-height:26px;padding-bottom:8px;font-size:18px;}
.contapro .contapro-child .info{line-height:20px;padding-bottom:16px;font-size:12px;}


.contapro .contapro-child.odd .center{padding:55px 28px 0 28px;}
.contapro .contapro-child.even .center{padding:46px 51px 0 51px;}
.contapro .contapro-child.even h2{line-height:42px;padding-bottom:16px;font-size:28px;}
.contapro .contapro-child.even .info{line-height:28px;padding-bottom:36px;font-size:18px;}
.contapro .contapro-child1 .bg img{bottom: 10px;right: 20px;width:140px;}
.contapro .contapro-child3 .bg img{width:242px;}

}
@media (min-width:1200px) {
.banner{height:420px;line-height:420px;}
.banner .content .infos{top:174px;width:420px;}
.banner .content .infos h1{line-height:46px;padding-bottom:10px;font-size:30px; }
.banner .content .infos .info{line-height:28px;font-size:18px;}


.banner .top-con .btn{width:46px;height:46px;line-height:46px;}
.banner .banner-nav{bottom:20px;height:8px;line-height:8px;}
.banner .banner-nav .child{width:8px;height:8px;margin:0 4px;}
.banner .content1 .imgs{right:-45px;}
.contapro .contapro-child{height:255px;}
.contapro .contapro-child h2{line-height:26px;padding-bottom:8px;font-size:20px;}
.contapro .contapro-child .info{line-height:20px;padding-bottom:16px;font-size:14px;}


.contapro .contapro-child.odd .center{padding:45px 28px 0 28px;}
.contapro .contapro-child.even .center{padding:46px 51px 0 51px;}
.contapro .contapro-child.even h2{line-height:42px;padding-bottom:10px;font-size:24px;}
.contapro .contapro-child.even .info{line-height:28px;padding-bottom:36px;font-size:15px;}
.contapro .contapro-child1 .bg img{bottom: 10px;right: 20px;width:140px;}
.contapro .contapro-child3 .bg img{width:242px;}


}