
body{ background-image:url(../images/huojian.png); background-repeat:no-repeat; background-position:200px 1000px;}
.ad-banner{ height:401px; background:url(../images/banner4.jpg) center 0 no-repeat;}

.module{}
.module h2.title{ height:50px; font-size:40px; color:#ff0000; perspective:600px; -webkit-perspective:600px; transition-duration:.5s; -wbkit-transition-duration:.5s;}
.content{ perspective:600px; -webkit-perspective:600px; transition-duration:.5s; -wbkit-transition-duration:.5s;}

.dianshi{ padding:50px 0; overflow:hidden; }
.dianshi .title{ height:70px;}
.dianshi .title ul{ width:840px; margin:0 auto;}
.dianshi .title li{ float:left; width:381px; height:70px; background:url(../images/dianshititle.jpg) 0 -71px no-repeat; cursor:pointer;}
.dianshi .title li.current{ background-position:0 0;}
.dianshi .title li.last{ float:right; background-position:0 -213px;}
.dianshi .title li.last.current{ background-position:0 -142px;}

.dianshi .switch{ display:block; overflow:hidden;}
.dianshi .item{ float:left; width:570px; padding:30px 30px 0 0; overflow:hidden;}

.dianshi .item .pic{ float:left; width:275px; height:186px; background:url(../images/dianshi_pic.jpg);}
.dianshi .item .pic1{ background-position:-1px -1px;}
.dianshi .item .pic2{ width:274px; height:187px; background-position:-561px -1px;}
.dianshi .item .pic3{ background-position:-280px -1px;}
.dianshi .item .pic4{ background-position:-1px -188px;}
.dianshi .item .cnt{ float:right; width:255px; }
.dianshi .item .cnt .dian{ position:relative; z-index:1; width:126px; height:131px; padding:25px 15px 0; text-align:center; color:#666; }
.dianshi .item .cnt .dian .bg{ animation:dian 99s infinite linear; -webkit-animation:dian 99s infinite linear; position:absolute; left:0; top:0; width:156px; height:156px; background:url(../images/quan.png) no-repeat; }
.dianshi .item2 .cnt .dian .bg{animation:dian2 99s infinite linear; -webkit-animation:dian2 99s infinite linear;}
.dianshi .item3 .cnt .dian .bg{animation:dian3 99s infinite linear; -webkit-animation:dian3 99s infinite linear;}
.dianshi .item4 .cnt .dian .bg{animation:dian4 99s infinite linear; -webkit-animation:dian4 99s infinite linear;}
@keyframes dian{50%{ transform:rotate(3600deg)}}
@-webkit-keyframes dian2{50%{ -webkit-transform:rotate(3600deg)}}
@keyframes dian2{50%{ transform:rotate(4600deg)}}
@-webkit-keyframes dian3{50%{ -webkit-transform:rotate(4600deg)}}
@keyframes dian3{50%{ transform:rotate(3300deg)}}
@-webkit-keyframes dian4{50%{ -webkit-transform:rotate(3000deg)}}
@keyframes dian4{50%{ transform:rotate(3900deg)}}
@-webkit-keyframes dian{50%{ -webkit-transform:rotate(3900deg)}}
.dianshi .item .cnt .dian em{ display:block; font-size:18px; padding:5px 0 2px;}
.dianshi .item .cnt .dian p{ font-size:13px;}
.dianshi .item3 .cnt .dian p{ padding-top:10px; font-size:12px;}
.dianshi .item4 .cnt .dian p{ padding-top:20px; font-size:12px;}
.dianshi .item .cnt h2{ padding-top:10px; font-size:18px; font-weight:bold; }

.dianshi .txt-img{ float:left; width:600px; padding-top:30px; overflow:hidden;}
.dianshi .txt-img .pic{ float:left; width:281px; height:186px; background:url(../images/dianshi_pic.jpg) -280px -189px no-repeat; }
.dianshi .txt-img h2{ font-size:18px; padding-bottom:20px;}
.dianshi .txt-img .pic2{background-position:-562px -190px;}
.dianshi .txt-img .pic3{background-position:0 -380px;}
.dianshi .txt-img .pic4{background-position:-282px -380px;}
.dianshi .txt-img .text{ float:left; width:270px; padding-left:20px; color:#666666; line-height:22px;}

.dianshi .content{ overflow:hidden;}
.dianshi .demo{ float:left; width:99999em; overflow:hidden;}
.dianshi .demo .switch{ float:left; width:1200px; overflow:hidden;}

.brand{ clear:both; padding:50px 0; background:url(../images/dianshibg.jpg) center 0 no-repeat; overflow:hidden;}
.brand .title h2,.service .title h2{ font-size:40px; text-align:center; color:#ff0000;}
.brand .title p,.service .title p{ font-size:15px; color:#c4c4c4; text-align:center;}
.brand-logo li{ display:box; display:-webkit-box; box-align:center; box-pack:center; -webkit-box-align:center; -webkit-box-pack:center; width:158px; height:124px; margin:0 8px; background:#fff; overflow:hidden;}
.brand-logo li img:hover{ transform: scale(1.2) ;-ms-transform: scale(1.2) ;-webkit-transform: scale(1.2) ;-o-transform: scale(1.2) ;-moz-transform: scale(1.2) ; opacity:.7; }

.brand .box{ padding-top:50px; overflow:hidden;}
.brand .box .text{ float:left; width:1300px; padding-left:7px;}
.brand .box dl{ float:left; width:380px; height:130px; margin-right:27px; background:#f0f0ee; background:rgba(255,255,255,.8); }
.brand .box dl dt{ padding:15px 15px 10px; font-size:15px; color:#ff0900;}
.brand .box dl dd{ padding:0 15px; line-height:22px; color:#666666;}

.service{ padding:120px 0 100px; overflow:hidden;}
.service .content{ perspective:600px; -webkit-perspective:600px; padding-top:70px;}
.service li{float:left; width:155px; height:135px; margin:0 120px; text-align:center;}
.service li .pic{ animation:ser 9s infinite; -webkit-animation:ser 9s infinite; width:155px; height:135px; margin:0 auto; background:url(../images/dianshi_icon.png) 0 -270px no-repeat;}
@keyframes ser{
	30%{transform:rotateY(0deg)}
	50%{ transform:rotateY(360deg)}
	70%{ transform:rotateY(0deg)}
}
@-webkit-keyframes ser{
	30%{transform:rotateY(0deg)}
	50%{ transform:rotateY(360deg)}
	70%{ transform:rotateY(0deg)}
}

.service li .pic2{ background-position:0 0;}
.service li .pic3{ background-position:0 -135px;}
.service li p{ padding-top:10px;}


