﻿@import url(public.css);
@import url(swiper.min.css);
@import url(style.css);
@import url(pscroll.css);
/*轮显*/
.banner{ width: 100%; overflow:hidden; position:relative;}
.banner .swiper-container{ width: 100%; height: 100%; position: absolute; z-index: 1; top: 0;left: 0; right: 0;bottom: 0;}
.banner .lzpic1,
.banner .lzpic2 { width: 100%;height: 100%; background: no-repeat center; background-size: cover;-moz-background-size: cover;-webkit-background-size: cover;}
.banner .text { max-width: 1600px; width: 96%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); z-index: 10; font-weight:normal; color: #fff; /*-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=6, Direction=45, Color=#989898)";*/ /*text-shadow: -2px 2px 6px rgba(152, 152, 152, 0.8);*/ /*filter: progid:DXImageTransform.Microsoft.Shadow(Strength=6, Direction=135, Color=#989898);*/ text-align:left;  line-height:1.2;}
.banner .text .h3{ font-weight:bold; overflow:hidden; position:relative; padding-top:4%;background:url(../images/index/i_pic1.png) left top no-repeat;}
.banner .text .desc{ color:#dddddd; margin-top:5px; overflow:hidden;  font-style:normal; max-width:430px;}
.banner .text .small { font-size: 15px; color:rgba(221,221,221,0.3);max-width:430px; text-transform:uppercase; margin-top:4px;}
.banner .text .txtr{ font-size:14px; padding-right:36px; background:url(../images/index/i_pic2.png) right center no-repeat; float:right; margin-top:4%;}
.banner .text .mores{ font-style:normal; display:block; border-radius:50%; border:1px solid rgba(255,255,255,0.2); text-align:center; line-height:140px; height:140px; width:140px; color:#dddddd; font-size:15px; margin-top:1.5%;transition:all 0.3s; margin-left:3%;}
.banner .text .mores:hover{ border-color:#1c71b6; color:#1c71b6;}
.banner .swiper-pagination { width: 100%;bottom: 30px; transition-duration: 0.4s;-webkit-transition-duration: 0.4s; -moz-transition-duration: 0.4s-ms-transition-duration: 0.4s;-o-transition-duration: 0.4s; display:none;}
.banner .swiper-pagination.gao {bottom: 380px;}
.banner .swiper-pagination .swiper-pagination-bullet { width: 20px; height: 20px; background:url(../images/dian.png) center center no-repeat; background-size:100% 100%;opacity: 1; margin: 0 8px; border-radius:0;}
.banner .swiper-pagination .swiper-pagination-bullet-active { background:url(../images/dian_on.png) center center no-repeat; background-size:100% 100%; }
.lzpic1{transition:all 0.3s;}
.lzpic1 img{ width:100%;opacity:0;filter:Alpha(opacity=0);}
/*.banner:hover .lzpic1{transform:scale(1.01, 1.01);}*/
.lzpic2 { display: none;}
.lzpic2 img{ width:100%;opacity:0;filter:Alpha(opacity=0);}
.banner .anim-1,.banner .anim-4{filter:alpha(opacity=0);opacity:0; }
.banner .swiper-slide-active .anim-1{animation:mymove6 0.6s; -webkit-animation:mymove6 0.6s linear;
	animation-iteration-count:1;
	animation-fill-mode:forwards;
	animation-delay:0.2s;

	-webkit-animation-iteration-count:1;
	-webkit-animation-fill-mode:forwards; 
	-webkit-animation-delay:0.2s;}
.banner .swiper-slide-active .anim-4{animation:mymove6 0.6s; -webkit-animation:mymove6 0.6s linear;
	animation-iteration-count:1;
	animation-fill-mode:forwards;
	animation-delay:0.8s;

	-webkit-animation-iteration-count:1;
	-webkit-animation-fill-mode:forwards; 
	-webkit-animation-delay:0.8s;
}
.banner_box{ max-width:1600px; width:96%; margin:0 auto; position:relative;}
.banner_page{ /*position:absolute; left:0; */color:#fff; font-size:14px;z-index:10;/* bottom:60px; */ line-height:1.3; overflow:hidden; margin-top:6%;}
.banner_page .current{ color:#ffffff; position:relative; overflow:hidden; margin-top:1.5%; padding-top:1.5%; display:block;}
.banner_page .current:after{ content:""; position:absolute; left:0; top:0; width:16px; height:1px; background:#fff;}
.banner_page .h4{ font-weight:normal; overflow:hidden;}
.banner_bnt{ position:absolute; bottom:0; left:0; width:100%; display:none!important;}
.banner_bnt .boxs{ width:76px; margin-left:203px; position:relative; height:60px; overflow:hidden; background:url(../images/index/banner_bg1.png) center center no-repeat; background-size:6px 14px; z-index:1;}
.banner_bnt .boxs .swiper-button-prev,.banner_bnt .boxs .swiper-button-next{ width:14px; height:60px; margin-top:-30px; background-size:100% auto;}
.banner_bnt .boxs .swiper-button-prev{ background-image:url(../images/index/left.png); left:0;}
.banner_bnt .boxs .swiper-button-next{ background-image:url(../images/index/right.png); right:0;}
/*产品中心*/
.i_one{ position:relative; overflow:hidden; }
.i_one_t{ overflow:hidden; margin-top:4%;}
.i_one_t .h3{  font-weight:normal; float:left;  position:relative; line-height:1.2; margin-top:30px;}
.i_one_t .h3 span{  position:absolute;bottom:65%; left:0;color:#000000; }
.i_one_t .h3 label{text-transform:uppercase; color:#f5f5f5;}
.i_one .i_one_t .renzheng_tc{width: 780px;  padding-left: 2%;overflow: hidden;display: block; vertical-align: top; position: relative; line-height: 57px; height: 57px;font-size: 16px; float:right; margin-right:100px;}
.i_one .i_one_t .scroller {position:absolute; /*transform: translate(-50%, 0px) translateZ(0px)!important; left:50%;*/}
.i_one .i_one_t .scroller li {/*float: left;*/ display:inline-block; padding-left:3%;  padding-right:13%; position:relative;}
.i_one .i_one_t .scroller li:first-child {padding-left:0%; } 
.i_one .i_one_t .scroller li dd{ overflow:hidden; float:left;/* border-bottom:2px solid #fff;*/}
.i_one .i_one_t .scroller li a{ color:#999999;}
.i_one .i_one_t .scroller li a:hover{ color:#1c71b6;}
.i_one .i_one_t .scroller li.cur dd{ /*border-bottom:3px solid #336699;*/}
.i_one .i_one_t .scroller li.cur a{color:#1c71b6;}
.i_one .i_one_boxs .divhidden{opacity: 0;filter: Alpha(opacity=0);transition: all 0.3s; display: block; height: 0; overflow: hidden;}
.i_one .i_one_boxs .divhidden.on{opacity:1.0;filter:Alpha(opacity=100); height:auto;}
/*成功案例*/
.i_two{position:relative; overflow:hidden; background:#f3f8f8; }
.i_two .i_one_t .renzheng_tc{width: 630px;  overflow: hidden;display: block; vertical-align: top; position: relative; line-height: 57px; height: 57px;font-size: 16px; float:right;}
.i_two .i_one_t .scroller {position:absolute; width:100%!important; /*transform: translate(-50%, 0px) translateZ(0px)!important; left:50%;*/}
.i_two .i_one_t .scroller li {/*float: left;*/ display:inline-block; padding-left:6%;   position:relative;}
.i_two .i_one_t .scroller li dd{ overflow:hidden; float:left;/* border-bottom:2px solid #fff;*/}
.i_two .i_one_t .scroller li a{ color:#999999;}
.i_two .i_one_t .scroller li a:hover{ color:#1c71b6;}
.i_two .i_one_t .scroller li.cur dd{ /*border-bottom:3px solid #336699;*/}
.i_two .i_one_t .scroller li.cur a{color:#1c71b6;}
.i_two .i_one_t .h3 label{ color:#efefef;}
.i_two .i_two_boxs .divhidden{opacity: 0;filter: Alpha(opacity=0);transition: all 0.3s; display: block; height: 0; overflow: hidden;}
.i_two .i_two_boxs .divhidden.on{opacity:1.0;filter:Alpha(opacity=100); height:auto;}
/*数字*/
.i_three{overflow:hidden; background:url(../img/i_img4.jpg) center center no-repeat; background-size:cover; height:449px;}
.i_three .counter{  text-align:center;  max-width:1360px; margin:0 auto;margin-top:6%;}
.i_three .counter ul li{ float:left; width:25%;   transition:all 0.3s; position:relative; text-align:center; margin-bottom:4%; }
.i_three .counter ul li:after{ content:""; position:absolute; right:0; top:50%; margin-top:-38px; height:76px; width:1px; background:rgba(237,237,237,0.2);}
.i_three .counter ul li:last-child:after{ width:0;}
.i_three .counter ul li .txts2{ display:inline-block; vertical-align:top; text-align:left; padding-left:3%; padding-right:3%; }
.i_three .counter ul li .nums{ color:#333; line-height:1;}
.i_three .counter span{display:inline-block; vertical-align:top; overflow:hidden; letter-spacing:1px; color:#fff; font-weight:bold; }
.i_three .counter label{display:inline-block;vertical-align:top; margin-top:-5%; line-height:2;font-weight:500; font-size:14px; color:#fff;  }
.i_three .counter .h6{ font-weight: normal; font-size:14px;  overflow:hidden; line-height:24px;  margin-top:2px; margin-bottom:6px; color:#fff;}
.i_three .counter ul li:hover{-webkit-transform: translate3d(0, -2px, 0); transform: translate3d(0, -2px, 0);}
/*关于我们*/
.i_four{ background:#fff; overflow:hidden; position:relative; text-align:center; margin-top:-210px;-webkit-box-shadow: 0 5px 25px rgba(0,0,0,0.05); box-shadow: 0 5px 25px rgba(0,0,0,0.05); padding-bottom:5%;}
.i_four .boxs{ margin:0 auto; width:96%; max-width:1000px;}
.i_four .i_one_t .h3{ float:none;}
.i_four .i_one_t .h3 span{ width:100%;}
/*.i_four .h3{ color:#000000; line-height:1.3; margin-top:5%; font-weight:normal;}*/
.i_four .p{line-height:28px;overflow:hidden;color:#7e7e7e; font-size:16px;margin-top:5%;}
.i_four .a{ font-style:normal; margin:0 auto; width:100px; height:36px; line-height:36px; text-align:center; background:#1c71b6; text-align:center; color:#fff; font-size:14px; display:block; margin-top:5%; position:relative;z-index:0; border-radius:20px; overflow:hidden;}
.i_four .a:after{ background:#059eeb; position:absolute; left:0; top:0; height:100%; width:0%;transition:all 0.3s; content:""; z-index:-1;}
.i_four .a:hover:after{ width:100%; background:#049eeb;}
/*新闻中心*/
.i_five{ text-align:center; overflow:hidden; margin-bottom:5%;}
.i_five .i_one_t .h3{ float:none;}
.i_five .i_one_t .h3 span{ width:100%;}
.i_five .a{ font-style:normal; margin:0 auto; width:100px; height:36px; line-height:36px; text-align:center; background:#1c71b6; text-align:center; color:#fff; font-size:14px; display:block; margin-top:5%; position:relative;z-index:0; border-radius:20px; overflow:hidden;}
.i_five .a:after{ background:#059eeb; position:absolute; left:0; top:0; height:100%; width:0%;transition:all 0.3s; content:""; z-index:-1;}
.i_five .a:hover:after{ width:100%; background:#049eeb;}


@media screen and (max-width:1600px) {
/*轮显*/
.banner .text .mores{ width:110px; height:110px; line-height:110px; font-size:14px;}
.banner .text .small{ font-size:14px;}
.banner_page{ margin-top:3%;}
.banner_page .current{ padding-top:1%; margin-top:1%;}
}
@media screen and (max-width:1440px) {
/*轮显*/
.banner .text .mores{ width:90px; height:90px; line-height:90px;}
/*产品中心*/
.i_one .i_one_t .renzheng_tc{ margin-right:70px;}
}
@media screen and (max-width:1360px) {
/*产品中心*/
.i_one .i_one_t .renzheng_tc{ margin-right:0px; width:720px;}
.i_one .i_one_t .scroller li{ padding-left:2%; padding-right:2%;}
}
@media screen and (max-width:1200px) {
/*轮显*/
.banner .text .mores{ margin-top:4%;}
.banner_page{ margin-top:4%;}
.banner .text .h3{ background-size:7px 18px; padding-top:5%;}
/*产品中心*/
.i_one .i_one_t .renzheng_tc{ margin-right:80px; padding-left:0; float:left; clear:both;}
/*成功案例*/
.i_two .i_one_t .renzheng_tc{ float:left; clear:both;width:720px;}
.i_two .i_one_t .scroller li{ padding-left:0; padding-right:4%;}
/*数字*/
.i_three{ height:400px;}
}
@media screen and (max-width:1100px) {
/*轮显*/
.lzpic2{display: block;}
.lzpic1{display: none;}
.banner .swiper-container{ position:static;}
.banner .swiper-pagination { bottom:25px;}
.banner .swiper-pagination .swiper-pagination-bullet {width: 20px; height:20px;margin: 0 5px;}
.banner_bnt .boxs{ height:50px;}
.banner_bnt .boxs .swiper-button-prev, .banner_bnt .boxs .swiper-button-next{ margin-top:-25px; height:50px;}
.banner .text .txtr{ margin-right:2%;}


}
@media screen and (max-width:960px) {
/*数字*/
.i_three{ height:390px;}
/*关于我们*/
.i_four .p{ font-size:15px; line-height:26px;}
}


@media screen and (max-width: 780px) {
/*轮显*/
.banner .swiper-pagination { bottom:20px;}
.banner .swiper-pagination .swiper-pagination-bullet {width: 16px; height:16px;margin: 0 3px;}

.banner_bnt .boxs{ height:40px;}
.banner_bnt .boxs .swiper-button-prev, .banner_bnt .boxs .swiper-button-next{ margin-top:-20px; height:40px;}
/*产品中心*/
.i_one .i_one_t .renzheng_tc{ width:90%; margin-right:10%; font-size:15px;}
/*成功案例*/
.i_two .i_one_t .renzheng_tc{ width:90%; margin-right:10%; font-size:15px;}
/*数字*/
.i_three .counter ul li{ width:50%;}
.i_three .counter ul li .txts2{ text-align:center;}
.i_three .counter ul li:nth-child(3){ clear:both;}
.i_three .counter ul li:nth-child(2):after{ width:0;}
/*关于我们*/
.i_four{ margin-top:-120px;}
}
@media screen and (max-width: 640px) {
/*轮显*/
.banner_bnt .boxs{ margin-left:130px;}
.banner .text .small{ font-size:13px;}
.banner .text .mores{ font-size:13px; width:70px; line-height:70px; height:70px; margin-left:0;}
.banner .text .txtr{ font-size:13px; padding-right:30px; background-size:20px 20px; margin-top:5%; margin-right:0;}
.banner_page .current{ padding-top:2%; margin-top:2%;}
/*数字*/
.i_three{ height:370px;}
.i_three .counter ul li{ overflow:hidden;}
.i_three .counter ul li .txts2{ margin-top:10px;}
.i_three .counter{ margin-top:7%;}
.i_three .counter label{ font-size:13px;}
.i_three .counter .h6{ font-size:13px;}
/*关于我们*/
.i_four{ margin-top:-110px;}

}

@media screen and (max-width: 480px) {
/*轮显*/
.banner .swiper-pagination { bottom:15px;}
.banner_page{  font-size:13px;}
.banner_bnt .boxs{ margin-left:110px;}
.banner .text .txtr{ margin-top:0;}
.banner .text .small{ font-size:12px;}
.banner .text .mores{ font-size:12px;}
.banner_page .current{ padding-top:3%; margin-top:3%;}
/*产品中心*/
.i_one .i_one_t .renzheng_tc{ font-size:14px;}
.i_one .i_one_t .scroller li{ padding-left:1%; padding-right:1%;}
/*数字*/
.i_three .counter label{ font-size:12px;}
.i_three .counter .h6{ font-size:12px; line-height:20px;}
/*关于我们*/
.i_four .p{ font-size:13px; line-height:22px; margin-top:4%;}
.i_four .a{ font-size:13px;}
.i_four{ margin-top:-90px;}
/*新闻中心*/
.i_five .a{ font-size:13px;}
}

@media screen and (max-width: 420px) {
/*产品中心*/
.i_one .i_one_t .renzheng_tc{ font-size:13px;}

}

@keyframes mymove6
{
	from {filter:alpha(opacity=0);opacity:0;  -webkit-transform: translateY(100px) translateX(0);
  -moz-transform: translateY(60px) translateX(0);
  transform: translateY(60px) translateX(0);
  -webkit-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;}
	to { filter:alpha(opacity=100);opacity:1; -webkit-transform: translateY(0px) translateX(0);
  -moz-transform: translateY(0px) translateX(0);
  transform: translateY(0px) translateX(0);}
}

@-webkit-keyframes mymove6
{
	/*from { filter:alpha(opacity=0);opacity:0; margin-bottom:-20%;}
	to {margin-bottom:3%;filter:alpha(opacity=1);opacity:1;}*/
	from {filter:alpha(opacity=0);opacity:0;  -webkit-transform: translateY(100px) translateX(0);
  -moz-transform: translateY(60px) translateX(0);
  transform: translateY(60px) translateX(0);
  -webkit-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;}
	to { filter:alpha(opacity=100);opacity:1; -webkit-transform: translateY(0px) translateX(0);
  -moz-transform: translateY(0px) translateX(0);
  transform: translateY(0px) translateX(0);}
}
@keyframes ani-svg{
	0%{
	  opacity: 0.4;
	  transform: translateY(-20px);
	}
	15%{
	  opacity: 0.65;
	  transform: translateY(-15px);
	}
    25%{
      opacity: 0.8;
	  transform: translateY(-10px);
	}
    50%{
      opacity: 1;
	  transform: translateY(0px);
	}
	65%{
	  opacity: 0.8;
	  transform: translateY(5px);
	}
	75%{
	  opacity: 0.65;
	  transform: translateY(10px);
	}
	100%{
	  opacity: 0.4;
	  transform: translateY(15px);
	}
}
@-webkit-keyframes ani-svg{
	0%{
	  opacity: 0.4;
	  -webkit-transform: translateY(-20px);
	}
	15%{
	  opacity: 0.65;
	  -webkit-transform: translateY(-15px);
	}
    25%{
      opacity: 0.8;
	  -webkit-transform: translateY(-10px);
	}
    50%{
      opacity: 1;
	  -webkit-transform: translateY(0px);
	}
	65%{
	  opacity: 0.8;
	  -webkit-transform: translateY(5px);
	}
	75%{
	  opacity: 0.65;
	  -webkit-transform: translateY(10px);
	}
	100%{
	  opacity: 0.4;
	  -webkit-transform: translateY(15px);
	}
}
@-moz-keyframes ani-svg{
	0%{
	  opacity: 0.4;
	  -moz-transform: translateY(-20px);
	}
	15%{
	  opacity: 0.65;
	  -moz-transform: translateY(-15px);
	}
    25%{
      opacity: 0.8;
	  -moz-transform: translateY(-10px);
	}
    50%{
      opacity: 1;
	  -moz-transform: translateY(0px);
	}
	65%{
	  opacity: 0.8;
	  -moz-transform: translateY(5px);
	}
	75%{
	  opacity: 0.65;
	  -moz-transform: translateY(10px);
	}
	100%{
	  opacity: 0.4;
	  -moz-transform: translateY(15px);
	}
}
