﻿@charset "utf-8";
.banner{width: 100%; overflow: hidden; position: relative;}
.banner .swiper-pagination-bullet{background: #fff; opacity: 1;}
.banner .swiper-pagination-bullet-active{background: #DA251D;}
.banner2 .swiper-container-horizontal>.swiper-pagination{bottom: 20px;}
.banner .hd{position: absolute; bottom: 20px; left: 0; text-align: center; width: 100%;}
.banner .hd ul li{display: inline-block;background: #fff; *display: initial; *zoom: 1; margin: 0 auto; width: 10px; height: 10px; margin: 0 5px; font-size: 0; border-radius: 10px;}
.banner .hd ul li.on{background: #DA251D;}

.banner2{width: 100%; overflow: hidden; position: relative;}
.banner2 .swiper-pagination-bullet{background: #fff; opacity: 1;}
.banner2 .swiper-pagination-bullet-active{background: #DA251D;}
.banner2 .swiper-pagination{bottom: 20px;}

.product .tit{text-align: center; line-height: 2em; background: url(/dir/pages/vv/xian4.jpg) no-repeat bottom center; font-weight: bold;}
.titxiao{width: 80%; margin:0 auto; text-align: center; line-height: 1.6em; color: #888786; font-size: 16px;}
.product_{position: relative; overflow: hidden;}
.product_ ul li{float: left; width: 32.33%; margin-right: 2%;}
.product_ a{display: block; color: #fff; text-align: center;}
.product_ a .text{background: #595959;}
.product_ a .text h1{background: url(/dir/pages/vv/xian3.jpg) no-repeat center bottom;padding-bottom: 0.5em; margin-bottom: 10px;}
.product_ a .text p{height: 4.5em;overflow: hidden;font-size: 16px;}
.product_ a .img img{display: block;}
.product_ a:hover .text{background: #da251d;}
.more{display: block; background: url(/dir/pages/vv/more1.jpg) no-repeat; width: 110px; height: 40px; margin: 0 auto; line-height: 40px; text-align: left; padding-left: 20px; color: #fff;}
.more:hover{background: url(/dir/pages/vv/pxfz3.jpg) no-repeat right #DA251D; color: #fff;}
.product_ a .more{margin-top: 40px; opacity: 0;filter:alpha(opacity=0);}
.product_ a:hover .more{opacity: 1;filter:alpha(opacity=100);}
.product{position: relative;}
.product .next,.product .prev{width: 55px; height: 55px; margin-top: -27px; top: 50%; position: absolute; cursor: pointer;}
.product .next{right: 0; background: url(/dir/pages/vv/qh2.png);}
.product .prev{left: 0; background: url(/dir/pages/vv/qh1.png);}
.product .next:hover{right: 0; background: url(/dir/pages/vv/qh2_.png);}
.product .prev:hover{left: 0; background: url(/dir/pages/vv/qh1_.png);}
.product .more{margin-top: 40px;}

.tit span{display: block; color: #da251d;}


.service{background: #f2f2f2; padding-top: 40px;}
.service .tit{text-align: center; line-height: 2em; background: url(/dir/pages/vv/xian4.jpg) no-repeat bottom center; font-weight: bold;}
.service ul li{float: left; width: 33.33%;}
.service ul li a{display: block; position: relative; overflow: hidden;}
.service ul li a img{display: block;}
.service ul li a .text{position: absolute; right: 0; bottom: 100%; width:100%; height: 100%; background: url(/dir/pages/vv/bg6.png); color: #fff;transition: 0.4s;-ms-transition: 0.4s;-webkit-transition: 0.4s;-o-transition: 0.4s;-moz-transition: 0.4s;}
.service ul li a:hover .text{background:url(/dir/pages/vv/bg6.png); bottom: 0;}
.service ul li a .text .text_{padding: 0px 5% 0; line-height: 1.6em; position: absolute; left: 0; top: 50%; margin-top: -100px; width: 90%;}
.service ul li a .text .text_ h1{line-height: 1.5em; text-align: center; font-weight: bold; padding-bottom: 25px;}
.service ul li a .text .text_ p{font-size: 16px; line-height: 1.5em; height: 4.5em; overflow: hidden;}
.service ul li a .ljxq{/*position: absolute; bottom: 20px;*/ color: #da251d; width: 102px; height: 36px; line-height: 36px; padding-left: 8px; /*left: 50%; margin-left: -55px;*/ background: url(/dir/pages/vv/ljxq3.jpg) center; display: block; margin: 30px auto 0;}
.service ul li a .ljxq span{/*line-height: 2em; display: block;*/}
.service ul li a .ljxq font{display: none;}
.service ul li a h3{position: absolute;bottom: 0;left: 50%;width: 140px;margin-left: -70px;line-height: 46px;text-align: center;color: #fff;font-size: 20px;background: #da251d; display: block;}
.service ul li a:hover h3{display: none;}
.synopsis{}
.synopsis .tit{ color: #da251d; text-align: center; line-height: 2em; background: url(/dir/pages/vv/xian4.jpg) no-repeat bottom center; font-weight: bold;}
.synopsis .tit img{display: none; margin: 0 auto 8px;}
.synopsis .titxiao{color: #000000; font-family: simsun;}
.synopsis .text{color: #888786; text-align: center; width: 90%; margin: 0 auto; font-size: 16px; line-height: 1.8em;}
.synopsis .more{margin-top: 40px;}

.cpfl{overflow: hidden; position: relative; background:url(/dir/pages/vv/cpzxbj.jpg) no-repeat center; padding-top: 170px; padding-bottom: 20px;}
.cpfl ul{}
.cpfl ul li{float: left; width: 31%; margin-left: 3.5%; *margin-left: 3.4%; padding-bottom: 40px;}
.cpfl ul li.li{margin-left: 0;}
.cpfl ul li a,.cpfl ul li a img{display: block;}
.cpfl ul li a .text{text-align: center; color: #333; padding-top: 15px;}
.cpfl ul li a:hover .text{color: #DA251D;}

/*.cpfl .swiper-slide a{display: block; position: relative; color: #fff; overflow: hidden;}
.cpfl .swiper-slide a h1{position: absolute; bottom: 10%; left: 0; width: 100%; text-align: center;}
.cpfl .swiper-slide a .text{width: 100%; height: 100%; background: url(/dir/pages/vv/bg6.png);position: absolute; left: 0; top: 100%;transition: 0.9s;-ms-transition: 0.9s;-webkit-transition: 0.9s;-o-transition: 0.9s;-moz-transition: 0.9s;}
.cpfl .swiper-slide a .text .text_{padding: 40% 10% 0;}
.cpfl .swiper-slide a .text .text_ h2{width: 100%; text-align: center; background: url(/dir/pages/vv/xian3.jpg) no-repeat bottom center; padding-bottom: 0.3em; margin-bottom: 0.5em;}
.cpfl .swiper-slide a .text .text_ p{max-height: 7.5em; overflow: hidden;}
.cpfl .swiper-slide a .text .text_ span{border: 1px solid #fff; margin: 0 auto; display: block; text-align: center; width: 120px; height: 36px; line-height: 36px; margin-top: 40px;}
.cpfl .swiper-slide a .text .text_ span img{padding-left: 8px;}
.cpfl .swiper-slide a:hover .text{top: 0;}
.cpfl .swiper-slide a:hover h1{display: none;}
.cpfl .swiper-button-next,.cpfl .swiper-button-prev{width: 55px; height: 55px;}
.cpfl .swiper-button-next{right: 0; background: url(/dir/pages/vv/qh2.png);}
.cpfl .swiper-button-prev{left: 0; background: url(/dir/pages/vv/qh1.png);}*/

.cptj{position: relative;display: none;}
.cptj .tit{background: url(/dir/pages/vv/xian1.jpg) repeat-x center; text-align: center; line-height: 2em;}
.cptj .tit span{text-align: center; background: url(/dir/pages/vv/icon2.jpg) no-repeat 15px center #fff; display: inline-block; padding-left: 55px; padding-right: 15px; font-weight: bold; color: #595959;}

.cptj_{margin:30px; overflow: hidden;}
.cptj_  .swiper-slide a .pic{border: 1px solid #cccccc; margin: 0 1px;}
.cptj_  .swiper-slide a p{text-align: center; font-size: 16px; padding-top: 15px;}

.cptj .swiper-button-next1,.cptj .swiper-button-prev1{width: 15px; height: 25px; font-size: 0px; color: #000; line-height: 25px; position: absolute; top: 50%; margin-top: -12px; font-family: simsun; font-weight: bold; cursor: pointer;}
.cptj .swiper-button-next1{right: 0; background: url(/dir/pages/vv/zy2.png);}
.cptj .swiper-button-prev1{left: 0; background: url(/dir/pages/vv/zy1.png);}
.cptj .swiper-button-next1:hover{background: url(/dir/pages/vv/zy2_.png);}
.cptj .swiper-button-prev1:hover{background: url(/dir/pages/vv/zy1_.png);}

.dbdh{background: #da251d; color: #fff; text-align: center; height: 50px; line-height: 50px; cursor: pointer; display: none;}
.dbdh span{background: url(/dir/pages/vv/jt2.jpg) no-repeat right center; padding-right: 15px;}

.showH .tit span{
	animation: donhua1 1.5s normal;
	/* Firefox: */
	-moz-animation: donhua1 1.5s normal;
	/* Safari 和 Chrome: */
	-webkit-animation: donhua1 1.5s normal; 
	/* Opera: */
	-o-animation: donhua1 1.5s normal;
}
.synopsis.showH .tit{
	animation: donhua1 1.5s normal;
	/* Firefox: */
	-moz-animation: donhua1 1.5s normal;
	/* Safari 和 Chrome: */
	-webkit-animation: donhua1 1.5s normal; 
	/* Opera: */
	-o-animation: donhua1 1.5s normal;
}
.showH .titxiao{
	animation: donhua2 1.5s normal;
	/* Firefox: */
	-moz-animation: donhua2 1.5s normal;
	/* Safari 和 Chrome: */
	-webkit-animation: donhua2 1.5s normal; 
	/* Opera: */
	-o-animation: donhua2 1.5s normal;
}

.showH .bd ul li{
	animation: donhua2 1.5s normal;
	/* Firefox: */
	-moz-animation: donhua2 1.5s normal;
	/* Safari 和 Chrome: */
	-webkit-animation: donhua2 1.5s normal; 
	/* Opera: */
	-o-animation: donhua2 1.5s normal;
}
.service.showH ul li:nth-child(1){
	animation: donhua2 1.5s normal;
	/* Firefox: */
	-moz-animation: donhua2 1.5s normal;
	/* Safari 和 Chrome: */
	-webkit-animation: donhua2 1.5s normal; 
	/* Opera: */
	-o-animation: donhua2 1.5s normal;
}
.service.showH ul li:nth-child(2){
	animation: donhua2 2s normal;
	/* Firefox: */
	-moz-animation: donhua2 2s normal;
	/* Safari 和 Chrome: */
	-webkit-animation: donhua2 2s normal; 
	/* Opera: */
	-o-animation: donhua2 2s normal;
}
.service.showH ul li:nth-child(3){
	animation: donhua2 2.5s normal;
	/* Firefox: */
	-moz-animation: donhua2 2.5s normal;
	/* Safari 和 Chrome: */
	-webkit-animation: donhua2 2.5s normal; 
	/* Opera: */
	-o-animation: donhua2 2.5s normal;
}


@keyframes donhua1
{
from {transform: translate(-500px,0);opacity:0;}
to {transform: translate(0,0px);opacity:1;}
}
@-moz-keyframes donhua1 
{
from {-moz-transform: translate(-500px,0,0);opacity:0;}
to {-moz-transform: translate(0,0);opacity:1;}
}
@-webkit-keyframes donhua1 
{
from {-webkit-transform: translate(-500px,0,0);opacity:0;}
to {-webkit-transform: translate(0,0px);opacity:1;}
}
@-o-keyframes donhua1
{
from {-o-transform: translate(-500px,0,0);opacity:0;}
to {-o-transform: translate(0,0px);opacity:1;}
}

@keyframes donhua2
{
from {transform: translate(500px,0);opacity:0;}
to {transform: translate(0,0px);opacity:1;}
}
@-moz-keyframes donhua2 
{
from {-moz-transform: translate(500px,0,0);opacity:0;}
to {-moz-transform: translate(0,0);opacity:1;}
}
@-webkit-keyframes donhua2 
{
from {-webkit-transform: translate(500px,0,0);opacity:0;}
to {-webkit-transform: translate(0,0px);opacity:1;}
}
@-o-keyframes donhua2
{
from {-o-transform: translate(500px,0,0);opacity:0;}
to {-o-transform: translate(0,0px);opacity:1;}
}


@media screen and (max-width:1300px) {
	/*.service ul li a .text{width: 70%;}
	.service ul li a .ljxq{left: 30%;}*/
	.service ul li a .text .text_{margin-top: -92px;}
	.service ul li a .text .text_ h1{font-size: 20px; padding-bottom: 20px;}
	.service ul li a .text .text_ p{font-size: 15px;}
	.service ul li a .ljxq{margin-top: 20px;}
}
@media screen and (max-width:1100px) {
	.service ul li a .text{width: 100%;}
	.service ul li a .text .text_ p{font-size: 12px;height: 4.5em; overflow: hidden; line-height: 1.5em;}
	.service ul li a h3{font-size: 16px; width: 100px; line-height: 40px; margin-left: -50px;}
	/*.service ul li a .ljxq{left: 0%;}*/
}
@media screen and (max-width:960px) {
	.service ul li a .text p{}
	.service ul li a .text{width: 100%; font-size: 12px;}
	
	.service ul li a h3{font-size: 14px; width: 80px; line-height: 30px; margin-left: -40px;}
	
	.service ul li a .text .text_{margin-top: -75px;}
	.service ul li a .text .text_ h1{padding-bottom: 15px; line-height: 1.5em;}
	.service ul li a .ljxq{height: 30px; line-height: 30px;}
}
@media screen and (max-width:840px) {
	.service ul li a .text p{display: none;}
	.cpfl{padding-top: 150px;}
	.cpfl ul li{float: left; width: 48%; margin-left: 4%; padding-bottom: 20px;}
	.cpfl ul li.li{margin-left: 4%;}
	.cpfl ul li.li1{margin-left: 0%;}
	
	.service ul li a .ljxq{margin-top: 0;}
	.service ul li a .text .text_{margin-top: -37px;}
}
@media screen and (max-width:640px) {
	.service ul{width: 95%; margin: 0 auto;}
	.service ul li{width: 100%;}
	.service ul li a .text{}
	.service ul li a .text p{display: block; height:4.5em;}
	.service ul li a .ljxq{}
	.synopsis .tit img{width: 80%;}
	.synopsis .more,.product_ a .more{margin-top: 20px;}
	
	.service ul li a .text .text_{margin-top: -72px;}
	.cpfl ul li .text{font-size: 14px; padding-top: 10px;}
	.service ul li a .ljxq{margin-top: 15px;}
	/*.banner{display: none;}
	.banner2{display: block;}*/
}