﻿/*页面通用部分*/
.box_In{width: 1200px;margin: 0 auto;}
body{background: #010830;}
.clear{overflow: hidden;}
.left{float: left;}
.right{float: right;}
 .heade{width: 100%;height:50px;text-align:center;position: relative;}
 .heade .box_In{position: absolute;left: 50%;margin-left: -600px;top: 0;}
 .ban_In{width: 100%;position: absolute;top: 50px;left: 0;}
 .heade .mark{opacity: .6;background: #444;height:50px;width: 100%;overflow: hidden;}
 .heade .heade_l{width: 200px; float: left;}
 .heade .heade_l img{width: 120px;display: block;margin: 6px auto;}
 .heade .heade_r{width: 300px; float: right;}
 .heade .heade_r a{color: #bbb;font-size: 16px;display:inline-block;line-height: 50px;padding:0 20px; opacity: 1;}
 .heade .heade_r a:hover{color: #00F3FF;}
/*ban开始*/
.ban{height: 534px;overflow: hidden;}
.ban .box_In{position: relative;}
.ban .img2,.ban .img3,.ban .img5,.ban .img6,.ban .img7,.ban .img8,.logo{position: absolute;}
.ban .img1{float: right;margin-right:172px;margin-top: 0px;}
.ban .img2{top:57px;left:-38px;}
.ban .img3{top:132px;right:-257px;}
.ban .img4{margin:2px 0 0 189px;}
.ban .img5{top:340px;right:221px;}
.ban .img6{top:228px;left:364px;animation: mytop 2s infinite;-moz-animation: mytop 2s infinite;-webkit-animation: mytop 2s infinite;-o-animation: mytop 2s infinite;}
.ban .img7{top:209px;right:59px;animation: myfirst 3s infinite;-moz-animation: myfirst 3s infinite;-webkit-animation: myfirst 3s infinite;-o-animation: myfirst 3s infinite;}
.ban .img8{top:424px;left: 160px;animation: myfirst 2.5s infinite;-moz-animation: myfirst 2.5s infinite;-webkit-animation: myfirst 2.5s infinite;-o-animation: myfirst 2.5s infinite;}
.ban .logo{top:459px;left: 311px;}
.ban .img5:hover,.ban .logo:hover{transform: rotateX(-30deg);}
/*box1开始*/
.box1{margin-top:63px;overflow: hidden;}
.box1 .box_In{position: relative;}
.box1 .img1{position: absolute;top:0;left:-349px ;}
.box1 .main{overflow: hidden;}
.box1 .left{width: 570px;margin-left:38px;}
.box1 .left h2{font-size: 29px;color: #00E5BE;padding-left: 42px;padding-bottom: 10px;    margin-top:17px;border-bottom: 1px solid #00E5BE;}
.box1 .left .btm{width: 478px;margin: 25px auto 0;}
.box1 .left .btm .p1{font-size: 16px;color: #fff;line-height: 26px;}
.box1 .left .btm .wish{height:48px;width: 288px;background: #FF004A;margin-top: 36px;position: relative;}
.box1 .wish .wish_left{float: left;width: 144px;background: #FF004A;}
.box1 .wish .wish_left p{line-height: 45px;font-size: 20px;font-weight: bold;color: #010826;text-align: center;cursor: pointer;}
.box1 .wish .wish_right{float: right;width: 140px;height: 40px;margin:3px 2px ;background: #fff;overflow: hidden;}
.box1 .wish .wish_right img{margin:3px 12px 0 9px;float: left;}
.box1 .wish .wish_right span{display: block;float: left;font-size: 20px;font-weight: bold;color: #010826;margin-top:3px;}
.box1 .right{width: 575px;margin-right: 17px;}
.box1 .wish .img1{position: absolute;top: 12px;left: 56px;opacity: 0;cursor: pointer;}
.box1 .wish .animate{animation: myshow 2s ;-moz-animation: myshow 2s ;-webkit-animation: myshow 2s ;-o-animation: myshow 2s ;}
.box1 button{border: none;}
/*box2开始*/
.box2{overflow: hidden;margin-top: 100px;}
.box2 .box_In{position: relative;}
.box2 .box_In .img1{position: absolute;right:-360px;top: 165px;}
.box2 .box_In .left{width:675px;position: relative;}
.box2 .box_In .left img{width: 100%;}
.box2 .box_In .left ul{overflow: hidden;}
.box2 .box_In .left ul li{width:240px;margin:0  5px;float: left;background: url(../images/box3-img3.png) no-repeat 0;background-size: 100%;padding: 73px 5px 80px;}
.box2 .box_In .left ul .li1{width:180px;margin-top:40px ;}
.box2 .box_In .right{width:515px;overflow: hidden;padding-top: 50px;}
.box2 .right .r_top .p1{font-size:22px;color: #FFD901;}
.box2 .right .r_top .p2{font-size:34px;color: #00E5BE;}
.box2 .right .r_top .p3{font-size:16px;color: #fff;padding-right: 20px;margin-top: 15px;}
.box2 .right .r_btm{overflow: hidden;margin-top: 70px;}
.box2 .right .r_btm_l{float: left;width:178px;}
.box2 .right ul{float: left;width: 335px;border: 1px solid #DF4041;border-left: none;margin-top: 25px;padding:10px 0;}
.box2 .right ul li{margin-left:20px;}
.box2 .right ul .li1{font-size: 18px;font-weight: bold;color:#00E5BE;margin-bottom: 10px;}
.box2 .right ul .li2{font-size: 22px;color:#00E5BE;margin-bottom: 15px;}
.box2 .right ul .li2 span{font-size:28px;font-weight: bold;color:#1A1A1A;background: #00FFD4;padding: 4px 20px;margin: 0 8px;}
.box2 .right ul .li3{font-size: 22px;font-weight: bold;color:#FFD901;}
.box2 .right .ewm{width: 100%;}
/*box3开始*/
.box3 .box_In{position: relative;margin-top: 20px;}
.box3 .box_In .img1{position: absolute;left:-258px;top: 114px;}
.box3 .clear{width: 995px;margin-left: 132px;}
.box3 .left{width: 370px;margin-top: 208px;}
.box3 .right{width: 585px;margin-top:40px;}
.box3 .left .p1{font-size: 20px;color: #FFD901;}
.box3 .left .p2{font-size: 40px;color: #00E5BE;margin: 5px 0 20px;}
.box3 .left a{display: block;font-size: 20px;color: #050505;font-weight: bold;text-align: center;width: 232px;height: 44px;line-height: 44px;background: #00E5BE;margin-top:40px;margin-left: 10px;}
.box3 .left ul li{overflow: hidden;margin-bottom: 10px;}
.box3 .left ul img{float: left;margin-right: 15px;}
.box3 .left ul p{float: left;font-size: 18px;color: #fff;}
/*box4开始*/
.box4{margin:110px 0 100px;}
.box4 .top{margin-bottom: 30px;}
.box4 .top h2,.box5 h2,.box8  h2,.box5 h2{text-align: center;font-size: 40px;color: #00E5BE;margin-bottom:10px;}
.box4 .top .p1,.box5  .p1{text-align: center;font-size: 24px;color: #FFD901;}
.box4 .top .p2{padding:25px 65px;font-size: 16px;color: #fff;line-height: 28px;}
/*轮播图css */
.box4 .btm{background:url(../images/box4-city.jpg) no-repeat 25px 400px ;position: relative;}
.box4 .btm .btm_bor{width: 1100px;height: 348px;border: 1px solid #00E5BE;position: absolute;top: -1px;left: 50px;}
.box4 .btm .slideBox{width:1100px; height:500px; position:relative;padding:0 50px ; }
.box4 .btm .slideBox .hd{height:80px; overflow:hidden; position:absolute; left:78px; bottom:30px; z-index:1; }
.box4 .btm .slideBox .hd ul{overflow:hidden; zoom:1; float:left;}
.box4 .btm .slideBox .hd ul li{ float:left;margin-right:24px;width:40px;height:80px;cursor:pointer;opacity: 0;font-size: 0;}
.box4 .btm .slideBox .hd ul li.on{ background:url(../images/box4-qixing.png)  no-repeat top center;opacity: 1;}
.box4 .btm .slideBox .bd{ position:relative; height:100%; z-index:0;   }
.box4 .btm .slideBox .bd li{ zoom:1; vertical-align:middle;}
/* 下面是前/后按钮代码 */
.box4 .btm .slideBox .prevStop{ display:none;  }
.box4 .btm .slideBox .nextStop{ display:none;  }
.box4 .btm .slideBox .prev{display: block;  width: 24px;height: 39px;background: url(../images/box4_left.png) no-repeat center;position: absolute;left: 2px;top: 150px;}
.box4 .btm .slideBox .next{display: block;  width: 24px;height: 39px;background: url(../images/box4_right.png) no-repeat center;position: absolute;right: 2px;top:150px;}
.box4 .btm .bd ul li img{float: left; width:598px; height:348px;border-right: 1px solid #00E5BE;margin-left: 1px;}
.box4 .btm .bd ul li .right{width: 496px;}
.box4 .btm .bd ul li .right p{margin-left:20px;margin-right: 20px;}
.box4 .btm .bd ul li .right .p1{color: #00E5BE;font-size:28px ;font-weight: bold;margin-top: 55px;margin-bottom: 20px;}
.box4 .btm .bd ul li .right .p2{color: #fff;font-size:16px;line-height: 28px;}
.box4 .btm .bd ul li .right .p2 span{color: #00E5BE;}
/*box5开始*/
.box5{padding-bottom: 110px;}
.box5 .box_In{position: relative;}
.box5 .box_In .img1{position: absolute;top: 100px;left:-294px;}
.box5 .box5_main {width: 1200px;overflow: hidden;margin-top: 50px;}
.box5 .box5_main .left{width: 638px;height:359px;  border: 1px solid #016365;}
.box5 .box5_main .right{width: 480px;padding: 0 40px;}
.box5 .right .ul1{margin-top: 20px;}
.box5 .right .ul1 li{width: 100%;border-top: 2px solid #545454;margin-bottom: 2px;}
.box5 .right .ul2{padding: 25px 40px 15px;}
.box5 .right .ul2 li{overflow: hidden;margin-bottom: 5px;}
.box5 .right .ul2 li .span1{width: 80px;float: left;display: block;font-size: 16px;font-weight: bold;color: #00E5BE;}
.box5 .right .ul2 li .span2{width: 320px;float: right;display: block;font-size: 16px;color: #fff;}
.box5 .right .ul2 li .span3{line-height: 30px;}
.box5 .right .ul2 li a{color: #00E5BE;font-weight: bold;}
.box5 .right .ul2 li b{color: #00E5BE;margin-right: 18px;}
/*box6开始*/
.box6{overflow: hidden;height: 540px;}
.box6 .box_In,.box7 .box_In{position: relative;}
.box6 .box_In h2,.box7 .box_In h2{font-weight: bold;  text-align: center;font-size: 40px;color: #00E5BE;margin-bottom:10px;}
.box6 .box_In .img1{position: absolute;top:0 ;left:-360px ;}
.box6 .box_In .img2{position: absolute;top:30px ;right:-360px;}
.box6 .box6_main{width: 1006px;position: absolute;left:97px;top: 110px;z-index: 99;overflow: hidden;}
.box6 .box6_main .left{width: 490px;background: #00E5BE;height: 258px;border: 1px solid #00E5BE;}
.box6 .box6_main .right{width: 490px;background: #050505;height: 258px;border: 1px solid #FF004A;}
.box6 .box6_main ul li{text-align: center;}
.box6 .box6_main .li1{font-size: 40px;font-weight: bold;color: #050505;margin-top: 30px;}
.box6 .box6_main .li2{font-size: 30px;font-weight: bold;color: #050505;}
.box6 .box6_main .li3{margin: 36px 0 10px;}
.box6 .box6_main .li4{width: 265px;margin: 0 auto;background: #1A1A1A;color: #FFE65A;font-size: 26px;padding: 10px;}
.box6 .box6_main .right .li1{color: #00E5BE;}
.box6 .box6_main .right .li2{color: #fff;}
.box6 .box6_main .right .li4{background: #00E5BE;color: #050505;}
.box6 .btm{width: 935px;margin:400px auto;position: relative;}
.box6 .btm span{width:100%;display:block;border:1px solid #7D7D7D;margin-bottom:2px;}
.box6 .btm a{width:230px;height:45px;line-height:45px;display:block;background:#FF004A;color:#050505;font-size: 20px;font-weight:bold;text-align:center;position:absolute;left:50%;margin-left:-115px;top:-12px;}
.box6 .box6_main .jiantou{animation:  myscale 3s infinite;-moz-animation:  myscale 3s infinite;-webkit-animation:  myscale 3s infinite;-o-animation:  myscale 3s infinite;}
.box7{overflow: hidden;padding-bottom: 110px;}
.box7 .img1{position: absolute;left: -360px;top: 20px;}
.box7 .img2{position: absolute;right: -360px;top:500px;}
.box7 .img3{display: block;margin:20px auto;padding-top:32px;}

.box8{padding-bottom: 100px;overflow: hidden;}
.box8 .p2{text-align:left;font-size: 16px;color: #FFD901;line-height: 30px;padding: 0 80px;}
.box8 .center{overflow: hidden;margin-top:50px;}
.box8 .left{width: 560px;border-right: 1px dashed #00E5BE;overflow: hidden;padding: 0 20px 0 10px;}
.box8 .right{width: 580px;padding: 0  10px;}
.box8 .left .left_l{float: left;width: 212px;}
.box8 .left .left_r{float: right;width: 328px;}
.box8 .center p{color: #fff;font-size:16px ;line-height: 32px;text-align: left;}
.box8 .center .p1{color: #00E5BE;font-weight: bold;}
.box8 .left .left_r img{margin-top: 20px;}
.box8 .box_In{position: relative;}
.box8 .img3{position: absolute;right: -360px;top:370px;}

/*动画*/
@keyframes myfirst
{0% {opacity: 1;}50%{opacity: .3;}100%{opacity: 1;}}
@-moz-keyframes myfirst /* Firefox */
{0% {opacity: 1;}50%{opacity: .3;}100%{opacity: 1;}}
@-webkit-keyframes myfirst /* Safari 和 Chrome */
{0% {opacity: 1;}50%{opacity: .3;}100%{opacity: 1;}}
@-o-keyframes myfirst /* Opera */
{0% {opacity: 1;}50%{opacity: .3;}100%{opacity: 1;}}
@keyframes mytop
{0% {top: 228px;}50%{top:224px ;}   100%{top:228px;}}
@-moz-keyframes mytop /* Firefox */
{0% {top: 228px;}50%{top:224px ;}   100%{top:228px;}}
@-webkit-keyframes mytop /* Safari 和 Chrome */
{0% {top: 228px;}50%{top:224px ;}   100%{top:228px;}}
@-o-keyframes mytop /* Opera */
{0% {top: 228px;}50%{top:224px ;}   100%{top:228px;}}

@keyframes myshow
{0% {top: 12px;opacity: 0;left: 56px;}50%{top:-30px;opacity: 1;left:135px;}100%{top:12px;opacity: 0;left: 170px;}}
@-moz-keyframes myshow /* Firefox */
{0% {top: 12px;opacity: 0;left: 56px;}50%{top:-30px;opacity: 1;left:135px;}100%{top:12px;opacity: 0;left: 170px;}}
@-webkit-keyframes myshow /* Safari 和 Chrome */
{0% {top: 12px;opacity: 0;left: 56px;}50%{top:-30px;opacity: 1;left:135px;}100%{top:12px;opacity: 0;left: 170px;}}
@-o-keyframes mytop /* Opera */
{0% {top: 12px;opacity: 0;left: 56px;}50%{top:-30px;opacity: 1;left:135px;}100%{top:12px;opacity: 0;left: 170px;}}
@keyframes myscale
{0% {transform: scale(1);opacity: 1;}50%{transform: scale(.9);opacity: .5;}100%{transform: scale(1);opacity: 1;}
@-moz-keyframes myscale /* Firefox */
{0% {transform: scale(1);opacity: 1;}50%{transform: scale(.9);opacity: .5;}100%{transform: scale(1);opacity: 1;}
@-webkit-keyframes myscale /* Safari 和 Chrome */
{0% {transform: scale(1);opacity: 1;}50%{transform: scale(.9);opacity: .5;}100%{transform: scale(1);opacity: 1;}
@-o-keyframes mmyscale /* Opera */
{0% {transform: scale(1);opacity: 1;}50%{transform: scale(.9);opacity: .5;}100%{transform: scale(1);opacity: 1;}