﻿/*公共样式*/
*{margin:0;padding:0;}
.flv{ position:absolute; z-index:2;}
body{ font-size:12px;font-family:'微软雅黑',Arial,Helvetica,sans-serif;min-width: 1200px;overflow: hidden;}
ul,li{ list-style-type: none;}
input,select,button,textarea{font-size:12px;font-family:SimSun,Arial,Helvetica,sans-serif; }
button{cursor: pointer;}
img{border:none;}

.header{background: url(../images/head-bg.jpg) no-repeat center top;width: 100%;height: 450px;}
.head{width: 1200px;height: 450px;margin: 0 auto;position: relative;overflow: hidden;}
.logo{position: absolute;top: 10px;left: 0px;}
.link1{width: 150px;height: 50px;}
.link1 a{display: block;width: 95px;height: 50px;background: url(../images/header-link1.png) no-repeat;line-height: 50px;padding-left: 55px;color: #fff;font-size: 18px;text-decoration: none;position: absolute;left: 125px;bottom: 80px;}
.link1 a:hover{background: url(../images/header-link1-h.png) no-repeat;}
.link2{width: 150px;height: 50px;}
.link2 a{display: block;width: 95px;height: 50px;background: url(../images/header-link2.png) no-repeat;line-height: 50px;padding-left: 55px;color: #fff;font-size: 18px;text-decoration: none;position: absolute;left: 305px;bottom: 80px;}
.link2 a:hover{background: url(../images/header-link2-h.png) no-repeat;}
.qrcode{width: 120px;height: 150px;position: absolute;left: 320px;bottom: 130px;display: none;background:url(../images/qrcode-bg.png) no-repeat;}
.qrcode img{width: 100px;height: 100px;margin: 10px;margin-bottom: 0px;float: left}
.qrcode span{display: block;width: 120px;height: 30px;float: left;line-height: 30px;text-align: center;font-size: 12px;color: #333333;float: left;}
.video{width: 535px;height: 295px;position: absolute;top: 90px;left: 670px;}
.computer{width: 647px;height: 519px;background: url(../images/computer.png) no-repeat;position: absolute;top: 0px;left: 0px;z-index: 1}
.computer a{display: block;width: 365px;height: 228px;background: url(../images/video-h.png) no-repeat;margin-left: 58px;margin-top: 17px;}
.computer a:hover{background: url(../images/video-h.png) no-repeat;}
.ipad{width: 177px;height: 227px;background: url(../images/ipad.png) no-repeat;position:absolute;top: 55px;left: 323px;z-index: 2}
.phone{width: 81px;height: 156px;background: url(../images/phone.png) no-repeat;position: absolute;top: 135px;left: 296px;z-index: 3}



#foot{width: 100%;height:350px;background: url(../images/foot-bg.jpg) no-repeat center top;}
.foot{width: 1200px;height: 350px;color: #fff;font-size: 16px;text-align: center;font-family: "\5FAE\8F6F\96C5\9ED1";margin: 0 auto;position: relative;}
.foot a{color: #fff;text-decoration: none;}
.foot a:hover{text-decoration: none;}
.foot .link1 a{left: 420px;top: 160px;text-align: left;}
.foot .link2 a{left: 630px;top: 160px;text-align: left;}
.foot .qrcode{left: 645px;top: 10px;}
.contact{color: #333333;font-size: 18px;text-align: center;position: absolute;bottom: ;line-height: 80px;left: 478px;bottom: 22px;}
.contact span{font-size: 24px;line-height: 80px;}

.zz{width: 100%;height: 100%;background: url(../images/zz.png);position: fixed;top: 0px;left: 0px;display: none;z-index: 999;}
.popup{width: 890px;height: 520px;position: fixed;left: 50%;margin-left: -425px;top: 130px;}
.popup .popup-video{width: 850px;height: 480px;background:#000;position: absolute;left: 0px;bottom: 0px;}
.close{width: 30px;height: 30px;position: absolute;top: 0px;right: 0px;z-index: 9999;background: url(../images/close.png) no-repeat;cursor:pointer;}



.container{width: 100%;}
.area1-bg{width: 100%;height: 510px;overflow: hidden;background: #fff;}
.area1{width: 1200px;height: 510px;margin: 0 auto;background: url(../images/area1-content-bg.png) no-repeat center 150px;overflow: hidden;position: relative;}
.area1-title{text-align: center;margin-top: 45px;}
.area1-title .title-cn{background: url(../images/area1-title-bg.png) no-repeat center center;font-size: 24px;line-height: 48px;font-weight: bold;color: #333;}
.area1-title .title-en{text-transform : uppercase;font-size: 12px;color: #999;line-height: 24px;}
.area1-content{}
.area1-content ul{}
.area1-content ul li{width: 170px;height: 250px;float: left;padding-top:65px;}
.area1-4{margin-left: 180px;}
.area1-content ul li img{float: left;margin-left: 42px;}
.area1-content ul li span{font-size: 18px;line-height: 48px;color: #666;display: block;width: 170px;height: 48px;text-align: center;float: left;}
.area1-more{font-size: 24px;color: #999999;position: absolute;left: 520px;bottom: 115px;line-height: 32px;}
.area1-btn{position: absolute;left: 470px;bottom: 50px;}
.area1-btn a{width: 140px;height: 50px;display: block;background: url(../images/btn.png) no-repeat;font-size: 18px;color: #fff;text-decoration: none;line-height: 50px;padding-left: 120px;}
.area1-btn a:hover{background: url(../images/btn-h.png) no-repeat;}

.area2-bg{width: 100%;height: 535px;overflow: hidden;background: #FAFAFA;}
.area2{width: 1200px;height: 535px;margin: 0 auto;overflow: hidden;position: relative;}
.area2-title{text-align: center;margin-top: 45px;overflow: hidden;}
.area2-title .title-cn{background: url(../images/area2-title-bg.png) no-repeat center center;font-size: 24px;line-height: 48px;font-weight: bold;color: #333;}
.area2-content{}
.area2-content ul{margin-left: -100px;}
.area2-content ul li{width: 160px;height: 250px;float: left;margin-left: 100px;padding-top: 40px;}
.area2-content ul li img{float: left}
.area2-content ul li span{font-size: 18px;line-height: 34px;color: #666;display: block;width: 160px;height: 34px;text-align: center;float: left;margin-top: 25px;}
.area2-title .title-en{text-transform : uppercase;font-size: 12px;color: #999;line-height: 24px;}
.area2-btn{position: absolute;left:470px;bottom: 60px;}
.area2-btn a{width: 140px;height: 50px;display: block;background: url(../images/btn.png) no-repeat;font-size: 18px;color: #fff;text-decoration: none;line-height: 50px;padding-left: 120px;}
.area2-btn a:hover{background: url(../images/btn-h.png) no-repeat;}

.area3-bg{width: 100%;height: 565px;overflow: hidden;background: #fff;}
.area3{width: 1200px;height: 565px;margin: 0 auto;overflow: hidden;position: relative;}

.swiper-pagination{width: 945px;height: 40px;position: absolute;top: 60px;left: 127px;}
.swiper-pagination ul li{width: 138px;height: 28px;margin-left: 15px;margin-top: 5px;float: left;border:1px solid #ECEBEB;line-height: 28px;text-align: center;font-size: 14px;color: #999999; box-shadow:   0px 0px 20px 0px #ECEBEB; }
.swiper-pagination li.click{background: #CB3C3C;border-color: #CB3C3C;color: #fff;}
.swiper-pagination ul li:hover{cursor:pointer;}

.swiper-slide{position: absolute;top: 120px;left: 140px;}
.slide-inner{width: 920px;height: 380px;overflow: hidden;position: absolute;}
.slide-inner .title{font-size: 36px;color: #333333;position: absolute;line-height:48px;left: 525px;top: 85px;}
.slide-inner .info{font-size: 18px;color: #999999;position: absolute;line-height:36px; left: 525px;top: 170px;}
.swiper-button-next{background: url(../images/ash-right.png) no-repeat; width: 32px;height: 64px;position: absolute;top: 50%;right: 0px;margin-top: -16px;}
.swiper-button-prev{background: url(../images/ash-left.png) no-repeat; width: 32px;height: 64px;position: absolute;top: 50%;left: 0px;margin-top: -16px;}
.swiper-button-next:hover{cursor:pointer;}
.swiper-button-prev:hover{cursor:pointer;}