/**/
.box-btn{ position:fixed; top: 0; left: 0; z-index: 99; width: 120px; height: 26px; background: red; cursor: pointer;display: none;}
/**/
#world{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 16; /*! left: 50%; */ /*! top: 50%; */ /*! margin: -500px 0 0 -500px; */}
#world canvas{transform: scale(1);}
.animationHtml{ background:url(../images/animationBG1.jpg) center; height: 90vh; width: 100vw; position: absolute;transition: all .8s;-webkit-transition: all .8s;z-index: 15;}
.animationHtml:selection {background:rgba(0,0,0,0);color: #fff;}
.animationHtml:-moz-selection {background:rgba(0,0,0,0);color: #fff;}
.animationHtml.active{margin-top: -100%;}
.animationHtmlBG{background:url(../images/animationBG2.jpg) center; height: 100%; width: 100%; position: absolute; left: 0; top: 0;opacity: 0;transition: all 1.5s;-webkit-transition: all 1.5s;}
.animationHtmlBG2{ height: 100%; width: 100%; position: absolute; left: 0; top: 0;opacity: 0;transition: all 1.5s;-webkit-transition: all 1.5s;transition-delay: 1s;-webkit-transition-delay: 1s;}
.animationHtmlBG2 #canvas{ width: 100%; height: 100%;}
.animationHtmlBG.active{opacity: 1;}
.animationHtmlBG2.active{opacity: 1;}
.animationHtml .earth{ width: 306px; height: 306px; background: url(../images/yuan.png) no-repeat; position: absolute; left: 32%;top: 60%;margin: -153px 0 0 -153px;z-index: 1; background-size: 80%;opacity: 0;transition: all 1s;-webkit-transition: all 1s;}
.animationHtml .earth.active{opacity: 1;}

.animationHtml .earth.big{animation: big 2s forwards linear;}
@keyframes big{
	0%{transform: scale(1) translateY(0);opacity: 1;}
	50%{transform: scale(1.8) translateY(25%); opacity: 1;}
	100%{transform: scale(2.6) translateY(50%);opacity: 0;}
}

.animationHtml .text-title{position: absolute;width: 900px;left: 50%;margin-left: -450px;bottom: 10%; z-index: 27;}
.animationHtml .text-title ul{text-align: center;}
.animationHtml .text-title ul li{width: 25px;float: left;font-size: 14px;color: #494949;text-align: center;margin: 0 37px;position: relative;transform: translateY(40px);transition:cubic-bezier(.17,.84,.44,1) .4s;-webkit-transition:cubic-bezier(.17,.84,.44,1) .4s; opacity: 0;}
.animationHtml .text-title ul.active li{transform: translateY(0); opacity: 1;}
.animationHtml .text-title ul li:nth-child(1){transition-delay: 1s;}
.animationHtml .text-title ul li:nth-child(2){transition-delay: 1.15s;}
.animationHtml .text-title ul li:nth-child(3){transition-delay: 1.3s;}
.animationHtml .text-title ul li:nth-child(4){transition-delay: 1.45s;}
.animationHtml .text-title ul li:nth-child(5){transition-delay: 1.6s;}
.animationHtml .text-title ul li:nth-child(6){transition-delay: 1.75s;}
.animationHtml .text-title ul li:nth-child(7){transition-delay: 1.95s;}
.animationHtml .text-title ul li:nth-child(8){transition-delay: 2.1s;}
.animationHtml .text-title ul li:nth-child(9){transition-delay: 2.25s;}
.animationHtml .text-title ul li:nth-child(10){transition-delay: 2.4s;}

.animationHtml .text-title ul.activeTow li{transform: translateY(-30px); opacity: 0;}


.animationHtml .text-title ul li:after{ width: 18px; height: 34px; background: #fff; position: absolute; content: '';border-radius: 11px;top: -40px;left: 50%;margin-left: -9px;}

.animationHtml .sunLight{ width: 306px; height: 306px; position: absolute;left: 50%;top: 45%;margin: -153px 0 0 -153px;z-index: 25;opacity: .1;transition: all 1.5s;transition-delay: 1s;transform: scale(1.3);-webkit-transform: scale(1.3);}
.animationHtml .sunLight.active{opacity: 1;}
.animationHtml .sunLight span{display: block;width: 300px; height: 300px;position: absolute;}
.animationHtml .sunLight span:nth-child(1){ background: url(../images/sunLight1.png); animation: sunLightL 2.4s infinite;}
.animationHtml .sunLight span:nth-child(2){ background: url(../images/sunLight2.png);animation: sunLightL 2.6s infinite;}
.animationHtml .sunLight span:nth-child(3){ background: url(../images/sunLight3.png);animation: sunLightR 2.8s infinite;}
.animationHtml .sunLight span:nth-child(4){ background: url(../images/sunLight4.png);animation: sunLightR 2s infinite;}
.animationHtml .trajectory{position: absolute;width: 550px;height: 550px;left: 30%;top: 55%;margin: -275px 0 0 -275px;}
.animationHtml .trajectory .Halo{border: 1px solid #ffa458;border-radius: 50%;position: absolute;left: 0;top: 0;transition: all 1s;-webkit-transition: all 1s;opacity: 0;transition-delay: 1s;-webkit-}
.animationHtml .trajectory .Halo.show{ opacity: 1;}
.animationHtml .trajectory .Halo.active{border: 1px solid #699ae4;}
.animationHtml .trajectory .Halo.one{height: 550px;width: 550px;}
.animationHtml .trajectory .Halo.two{width: 370px;height: 370px;left: 50%;top: 50%;margin: -185px 0 0 -185px;}
.animationHtml .trajectory .Halo ul li.show{opacity: 1;}
.animationHtml .trajectory .Halo ul li{position: absolute;background: #fd7c4f;border-radius: 50%;opacity: 0;transition: all 2s;-webkit-transition: all 2s;}
.animationHtml .trajectory .Halo ul li.active{ background: #37cffc;}
.animationHtml .trajectory .Halo ul li.cur1{height: 16px;width: 16px;}
.animationHtml .trajectory .Halo ul li.cur2{width: 12px;height: 12px;}
.animationHtml .trajectory .Halo ul li.cur3{height: 8px;width: 8px;}
.animationHtml .trajectory .Halo ul li.cur4{height: 6px;width: 6px;}
.animationHtml .trajectory .Halo.one ul li.cur1{left: 30%;top: 6%; animation: UpDow1 2s linear infinite;}
.animationHtml .trajectory .Halo.one ul li.cur2{left: 103%;top: 23%;animation: UpDow1 3s linear infinite;}
.animationHtml .trajectory .Halo.one ul li.cur3{left: 81%;top: 91%;animation: UpDow2 2.5s linear infinite;}
.animationHtml .trajectory .Halo.one ul li.cur4{left: 5%;top: 72%;animation: UpDow2 1.9s linear infinite;}
.animationHtml .trajectory .Halo.two ul li.cur1{left: 154%;top: 66%;animation: UpDow3 2.3s linear infinite;}
.animationHtml .trajectory .Halo.two ul li.cur2{left: -33%;top: 42%;animation: UpDow3 3.5s linear infinite;}
.animationHtml .trajectory .Halo.two ul li.cur3{left: 13%;top: 101%;animation: UpDow1 3.1s linear infinite;}
.animationHtml .trajectory .Halo.two ul li.cur4{left: 78%;top: 15%;animation: UpDow2 2.8s linear infinite;}
@keyframes UpDow1{
    0%,100%{transform: translateY(0) scale(1);}
    50%{transform: translateY(-30px) scale(1.05);}
}
@keyframes UpDow2{
    0%,100%{transform: translateY(0) scale(1);}
    50%{transform: translateY(-40px) scale(.95);}
}
@keyframes UpDow3{
    0%,100%{transform: translateY(0);}
    50%{transform: translateY(-50px);}
}
.animationHtml .trajectory .item{position: absolute !important;width: 58px;height: 600px;left: 50% !important;margin: -300px 0 0-29px;top: 50% !important;}
.animationHtml .trajectory .item img{opacity: 0;transition: all .6s;}
.animationHtml .trajectory .item.item1 img{transition-delay: .4s;}
.animationHtml .trajectory .item.item2 img{transition-delay: .6s;}
.animationHtml .trajectory .item.item3 img{transition-delay: .8s;}
.animationHtml .trajectory .item.item4 img{transition-delay: 1s;}
.animationHtml .trajectory .item.item5 img{transition-delay: 1.2s;}

.animationHtml .trajectory .item.item1{animation:round 6s linear infinite;}
.animationHtml .trajectory .item.item2{animation:round 6.6s linear infinite;}
.animationHtml .trajectory .item.item3{animation:round 7s linear infinite;height: 440px;margin-top: -220px;}
.animationHtml .trajectory .item.item4{animation:round 6.3s linear infinite;}
.animationHtml .trajectory .item.item5{animation:round 6.6s linear infinite;height: 440px;margin-top: -220px;}
.animationHtml .trajectory .item span{display: none;}

.animationHtml .trajectory.active .item img{opacity: 1;}
@keyframes round{
    0%{transform: rotate(0);}
    100%{transform: rotate(360deg);}
}
.animationHtml .trajectory .item img:hover{animation: jiggle .5s ease-in forwards; }
@keyframes jiggle {
 0%,100% {transform: scale(1.0, 1.0)}
 20% { transform: scale(1.1, 0.9)}
 36% { transform: scale(0.9, 1.1) translate(0, -5px)}
 49% {transform: scale(1.0, 1.0) translate(0, -3px)}
}

.animationHtml .drag{position: absolute;width: 800px;left: 50%;margin-left: -400px;bottom: 15%;z-index: 35;display: none;}
.animationHtml .drag .drag-box{text-align: center;}
.animationHtml .drag .drag-box .item{ height: 58px; width: 58px;border-radius: 50%;transition:ease .7s;}
.animationHtml .drag .drag-box .item img{ width: 100%;}
.animationHtml .drag .drag-box .item img:hover{animation: jiggle .5s ease-in forwards; }
.animationHtml .drag .drag-box .item.item1{transition-delay:.2s;}
.animationHtml .drag .drag-box .item.item2{transition-delay:.6s;}
.animationHtml .drag .drag-box .item.item3{transition-delay:1s;}
.animationHtml .drag .drag-box .item.item4{transition-delay:1.4s;}
.animationHtml .drag .drag-box .item.item5{transition-delay:1.8s;}
.animationHtml .drag .drag-box.active .item{transform: translateY(-150px);-webkit-transform: translateY(-150px); opacity: 0;} 


.animationHtml .drag .drag-box .item span{font-size: 14px;font-weight: 600;width: 120px;left: 50%;display: block;position: relative;margin-left: -60px;margin-top: 5px;}
.animationHtml .drag-tips{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.7);z-index: 35;display: none; }
.animationHtml .drag-tips .drag-box{position: absolute;left: 50%;margin-left: -400px;bottom: 15%;z-index: 35;text-align: center;}
.animationHtml .drag-tips .drag-box .item{opacity: 0;position: relative;width: 58px;height: 58px;}
.animationHtml .drag-tips .drag-box .item span{font-size: 14px;font-weight: 600;width: 120px;left: 50%;display: block;position: relative;margin-left: -60px;opacity: 0;margin-top: 5px;}
.animationHtml .drag-tips .drag-box .item img{}
.animationHtml .drag-tips .drag-box .item.item1{}
.animationHtml .drag-tips .drag-box .item.item2{opacity: 1;}
.animationHtml .drag-tips .drag-box .item.item3{}
.animationHtml .drag-tips .drag-box .item.item4{}
.animationHtml .drag-tips .drag-box .item.item5{}
.animationHtml .drag-tips .drag-box .sign{position: absolute;left: 266px;top: -53px;}
.animationHtml .drag-tips .drag-box .sign span{display: block;font-size: 14px;}
.animationHtml .drag-tips .drag-box .sign .sign-hand{ background: url(../images/sign.png) no-repeat; opacity: 1;width: 62px;height: 62px;}
.animationHtml .drag-tips .drag-box .sign .sign-text{width: 280px;height: 40px;line-height: 40px;background: #fff;color: #005dab;border-radius: 20px;position: absolute;top: -60px;}
.animationHtml .drag-tips .drag-box .sign .sign-text:after{position: absolute;content: '';width: 0;height: 0;border-left: 8px solid transparent;border-right: 8px solid transparent;border-top: 14px solid white;top: 40px;left: 25px;}

.animationHtml-text{position: absolute;width: 800px;left: 50%;margin-left: -400px;bottom: 15%;z-index: 25; height: 36px;display: none; opacity: .5;}
/*.animationHtml-text:after{ width: 28px; height: 4px; position: absolute; content: ''; left: 50%; margin-left: -14px; bottom: -36px;background: #f97801;}*/
.animationHtml-text ul{}
.animationHtml-text  li{position: absolute;width: 100%;top: 0;left: 0;transform: translateY(45px);transition: all .5s;-webkit-transition: all .5s; opacity: 0;}
.animationHtml-text  li img{margin: 0 auto; display: block;}
.animationHtml-text  li.cur1{transition-delay: 1s;}
.animationHtml-text  li.cur2{top: 117%;transition-delay: 1.5s;}
.animationHtml-text  li.cur3{transition-delay: 1s;}
.animationHtml-text  li.cur4{top: 117%;transition-delay: 1.5s;}
.animationHtml-text  li.active{transform: translateY(0); opacity: 1;}
.animationHtml-text  li.activeTow{transform: translateY(-45px) !important; opacity: 0;}
.tiaoZ{ background: url(../images/tiaoZ.png) no-repeat; width: 75px; height: 75px; position: absolute;z-index: 30; left: 50%; bottom: 15px; margin-left: -37.5px; cursor: pointer;}
.tiaoZ:after{ width: 78px; height: 78px; border-radius: 50%; position: absolute; content: ''; background: url(../images/round-r1.png) no-repeat;left: 50%;top: 50%;margin: -39px 0 0 -39px;animation: round-tiaoZ 4s infinite ease;}
.tiaoZ:before{ width: 80px; height: 80px;border-radius: 50%; position: absolute; content: ''; background: url(../images/round-r1.png) no-repeat;left: 50%;top: 50%;margin: -37px 0 0 -37px;animation: round-tiaoZ 3s infinite cubic-bezier(.47,0,.74,.71);}
.tiaoZ a{display: block; height: 100%;}
@keyframes round-tiaoZ{
    0%{transform:rotate(0);}
    100%{transform:rotate(360deg);}
}

/*footer*/
.footer{width: 100%; position: relative; }
/*nav*/
.nav{ height: 75px; width: 100%; position: fixed; background: #fff;z-index:40;}
.nav h1{float: left;margin: 25px;}
.nav .h1 a{}
.nav .h1 a img{}
.nav ul{float: right;height: 100%;margin-right: 5%;}
.nav ul li{float: left;height: 34px;width: 98px;line-height: 34px;text-align: center;margin: 18px 10px 0;position: relative;}
.nav ul li a{display: block;position: relative;font-size: 14px;text-decoration: none;font-family: sansationregular;-webkit-font-smoothing: antialiased;-moz-font-smoothing: antialiased;font-smoothing: antialiased;text-transform: capitalize;overflow: visible;overflow: hidden;}
.nav ul li:after{ position: absolute; content: ''; height: 16px; width: 1px; background: #e5e5e5;left: 0;top: 50%;margin-top: -8px;}
.nav ul li.active a{ background:url(../images/nav-bg.jpg) center; background-size: 100% 100%;color: #fff;z-index: 2; font-size: 14px;}
.three-d{-webkit-perspective: 200px;-moz-perspective: 200px;-ms-perspective: 200px;-o-perspective: 200px;perspective: 200px;-webkit-transition: all .07s linear;-moz-transition: all .07s linear;-ms-transition: all .07s linear;-o-transition: all .07s linear;transition: all .7s linear;position: relative;height: 100%;}
.three-d-box{-webkit-transition: all .3s ease-out;transition: all .3s ease-out;-webkit-transform: translatez(-25px);transform: translatez(-25px);-webkit-transform-style: preserve-3d;transform-style: preserve-3d;-webkit-pointer-events: none;pointer-events: none;position: absolute;top: 0;left: 0;display: block;width: 100%;height: 100%;}
.front,.back {display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;-webkit-pointer-events: none;-moz-pointer-events: none;-ms-pointer-events: none;-o-pointer-events: none;pointer-events: none;-webkit-box-sizing: border-box;box-sizing: border-box;/*! background: red; */}
.front {-webkit-transform: rotatex(0deg) translatez(25px);transform: rotatex(0deg) translatez(25px);}
.back {-webkit-transform: rotatex(-90deg) translatez(25px);transform: rotatex(-90deg) translatez(25px);color: #fff;}
.nav ul li .back {background: url(../images/nav-bg.jpg) center;color: #fff;}
.three-d:hover:not(.active) .three-d-box, .three-d:focus:not(.active) .three-d-box {
    -wekbit-transform: translateZ(-25px) rotateX(90deg)!important;
    transform: translateZ(-25px) rotateX(90deg)!important;
}
.nav ul li.active{}

/*index*/
.indexHtml{ position: relative; height: 100%; width: 100% ;opacity: 0;transition: all .5s;-webkit-transition: all .5s;}
.indexHtml .swiper-cube-shadow{display: none;}
.indexHtml .box{ height: 100%; width: 100%; position: relative;}
.indexHtml .box1{ background: #24c1e7;}
.indexHtml .box2{ background:url(../images/index-bg2.jpg) center; background-size: 100% 100%;}
.indexHtml .box3{ }
.indexHtml .box3 .left{background:url(../images/index-bg3.jpg) center left no-repeat; background-size: 100% 100%;}

.indexHtml .box4{ background: #ecf9ff fixed;}
.indexHtml .box5{ background:url(../images/index-bg5.jpg) center left no-repeat; background-size: 100% 100%;}
.indexHtml .box6{ background: #fff;}
.indexHtml .box6 .Partner-Plate{ height:calc(100% - 390px); position: relative; width: 100%;}
.indexHtml .plate-title{position: absolute;width: 100%;top: 16%;}
.indexHtml .plate-title img{margin: 0 auto;}
.indexHtml.active{ opacity: 1;}
/*banner*/
.swiper-container-banner{height: 100%;}
.swiper-container-banner ul{height: 100%;}
.swiper-container-banner ul li{position: relative; background-size: 100% 100% !important; height: 100%;}
.swiper-container-banner ul li>img{ width: 100%;}
.swiper-container-banner ul li .eart-big{ background: url(../images/earth-big.png) no-repeat; width: 761px; height: 761px; background-size: 100% 100%;animation: eart-round 32s linear infinite;position: absolute;left: 50%;top: 44%;margin: 0 0 0 -380px;z-index: 5;}
.swiper-container-banner ul li .eart-big:hover{animation-play-state:paused;-webkit-animation-play-state:paused}
.swiper-container-banner ul li .eart-big a{display: block; height: 100%;}
.swiper-container-banner ul li .banner-track{ background: url(../images/banner-track.png); width: 974px; height: 962px;animation: Half 16s linear infinite;transform: rotate(-15deg);left: 50%;margin: 0 0 0 -481px;position: absolute;top: 29%;z-index: 1;}
.swiper-container-banner ul li .banner-text1{position: absolute;width: 525px;top: 18%;left: 50%;margin-left: -262.5px;}
.banner-track a{display: block; height: 100%;}
.swiper-container-banner ul li .banner-text1 img{}
.swiper-container-banner .banner-mask{ background: url(../images/banner-mask.png); width: 40%; position: absolute; height: 100%; z-index: 15; top: 0;transition: ease .6s;}
.swiper-container-banner .banner-mask img{transition: all .5s;-webkit-transition: all .5s;transform: translateY(45px);-webkit-transform: translateY(45px); opacity: 0;}
.swiper-container-banner .banner-mask.maskL{ left: 0;width: 0;}
.swiper-container-banner .banner-mask.maskR{ right: 0;width: 0;}
.swiper-container-banner .banner-mask.maskL .text{position: absolute;width: 150px;right: 20%;top: 30%;height: 66%;opacity: 0;transition: all .6s;transition-delay: .8s;-webkit-transition-delay: .8s;}
.swiper-container-banner .banner-mask.maskR .text{position: absolute;width: 150px;left: 20%;top: 30%;height: 66%;opacity: 0;transition: all .6s;transition-delay: .8s;-webkit-transition-delay: .8s;}

.swiper-container-banner .banner-mask .text .cur1{margin-top: 10%;transition-delay: 1.1s;}
.swiper-container-banner .banner-mask .text .cur2{margin-top: 15%;transition-delay: 1.25s;}
.swiper-container-banner .banner-mask .text .cur4{margin-top: 30%;transition-delay: 1.4s;}
.swiper-container-banner .banner-mask .text .cur3{margin-top: 15%;transition-delay: 1.55s;}
.swiper-container-banner .banner-mask .text .cur5{margin-top: 5%;transition-delay: 1.7s;}
.swiper-container-banner .banner-mask.maskL .text img{float: left;}
.swiper-container-banner .banner-mask.maskR .text img{float: right;margin-left: 20%;}

.banner-one.active{}
.banner-one.active .banner-mask.maskL{ width: 40%}
.banner-one.active .banner-mask.maskL .text{opacity: 1;}

.banner-tow.active{}
.banner-three.active{}
.banner-three.active .banner-mask.maskR{ width: 40%}
.banner-three.active .banner-mask.maskR .text{opacity: 1;}

.banner ul li.active img{transform: translateY(0); opacity: 1;}


@keyframes eart-round{
    0%{transform: rotate(0);}
    100%{transform:rotate(360deg);}
}
@keyframes Half{
    0%{transform: rotate(-15deg);}
    25%{transform: rotate(0deg);}
    50%{transform: rotate(15deg);}
    75%{transform: rotate(0deg);}
    100%{transform: rotate(-15deg);}
}

.banner .banner-btn{ height: 84px; width: 84px;position: absolute;top: 50%;z-index: 15; cursor: pointer;transition: all .2s;}
.banner .banner-btn.swiper-button-disabled{ opacity: 0;}
.banner .btn-next{ background: url(../images/btn-next.png);right: 2%;}
.banner .btn-prev{ background: url(../images/btn-prev.png);left: 2%;}
.banner .btn-next:after{ position: absolute; content: '';width: 1px;height: 100%;left: -35px;background: #fff;}
.banner .btn-prev:after{ position: absolute; content: '';width: 1px;height: 100%;right: -35px;background: #fff;}

/**/
.indexHtml .box{ opacity: 0;}
.indexHtml .box.swiper-slide-active{ opacity: 2;}
.indexHtml .box2 .plateTow{width: 92%;position: absolute;left: 4%;top: 31%;height: auto;border: 1px solid #fff;background: #fff6;padding: 45px 0 65px;}
.indexHtml .box2 .plateTow ul{width: 92%;margin: 5% auto 0;max-width: 1390px;height: 100%;overflow: hidden;}
.indexHtml .box2 .plateTow ul li{width: 19%;margin: 0% 3% 0;float: left;text-align: center;height: 270px;}
.indexHtml .box2 .plateTow img{margin: 0 auto;width: 86px;}
.indexHtml .box2 .plateTow .title {margin: 14px auto 20px;}
.indexHtml .box2 .plateTow .title span{display: block;text-transform: uppercase;}
.indexHtml .box2 .plateTow .title .cn{font-size: 22px;}
.indexHtml .box2 .plateTow .title .en{font-size: 14px;opacity: .5;margin-top: 5px;}
.indexHtml .box2 .plateTow .text{font-size: 14px;line-height: 28px;color: #373737;height: 90px;}
.indexHtml .box2 .plateTow li:nth-child(1) .title{color: #246aac;}
.indexHtml .box2 .plateTow li:nth-child(2) .title{color: #db0000;}
.indexHtml .box2 .plateTow li:nth-child(3) .title{color: #fba500;}
.indexHtml .box2 .plateTow li:nth-child(4) .title{color: #00a149;}
.indexHtml .box2 .title-Explain{ font-size: 16px; color: #373737;position: absolute;width: 100%;text-align: center;line-height: 32px;}
.indexHtml .box2 .more{ width: 230px; height: 36px;position: absolute;left: 50%;margin-left: -115px;bottom: -36px;}
.indexHtml .box2 .more a{display: block;height: 100%;}
.indexHtml .box2 .more a .three-d-box{-webkit-transform: translatez(-20px);transform: translatez(-18px);}
.indexHtml .box2 .more a .front{background: url(../images/plateTow-more.jpg) no-repeat;-webkit-transform: rotatex(0deg) translatez(25px);transform: rotatex(0deg) translatez(18px);}
.indexHtml .box2 .more a .back{-webkit-transform: rotatex(-90deg) translatez(25px);transform: rotatex(-90deg) translatez(18px);background: url(../images/plateTow-more.jpg) no-repeat;}
 

.indexHtml .box3 .plateThree{height: 100%;}
.indexHtml .box3 .left{height: 100%;padding: 0;}
.indexHtml .box3 .right{height: 100%;padding: 0;}
.indexHtml .box3 .tab-text{width: 50%;position: absolute;bottom: 5%;left: 22%;overflow: hidden;}
.indexHtml .box3 .tab-text ul{ position: relative; z-index: 1; }
.indexHtml .box3 .tab-text ul li{width: 100%;}
.indexHtml .box3 .tab-text ul li img{width: 100%;}
.indexHtml .box3 .tab-text .plateThree-next{width: 47px;height: 47px;top: 0%;margin: 0; position: absolute;border-radius: 50%;background: #fff;left: 55%;z-index: 15;cursor: pointer;}
.indexHtml .box3 .tab-text .plateThree-prev{height: 47px;width: 47px;top: 0%;margin: 0;left: 83%; position: absolute;border-radius: 50%;background: #fff;z-index: 15;cursor: pointer;}
.indexHtml .box3 .tab-text .plateThree-next span{display: block;width: 13px;height: 23px;background: url(../images/plateThree-arrow.png) 0 -23px;margin: 11px auto;}
.indexHtml .box3 .tab-text .plateThree-prev span{width: 13px;height: 23px;display: block;background: url(../images/plateThree-arrow.png) -13px -23px;margin: 11px auto;}
.indexHtml .box3 .tab-text .btn-tab.swiper-button-disabled {background: #fff6;} 
.indexHtml .box3 .tab-text .plateThree-next.swiper-button-disabled span{background: url(../images/plateThree-arrow.png) 0 0;}
.indexHtml .box3 .tab-text .plateThree-prev.swiper-button-disabled span{background: url(../images/plateThree-arrow.png) -13px  -0;} 

.indexHtml .box3 .pic{height: 100%;overflow: hidden;}
.indexHtml .box3 .pic ul{width: 100%;height: 100%;}
.indexHtml .box3 .pic ul li{ background-size: 100% 100% !important;height: 100%;width: 100%;}

.indexHtml .box5 .plateFive{position: absolute;width: 760px;left: 50%;margin-left: -380px;top: 50%;}
.indexHtml .box5 .plateFive ul{text-align: center;}
.indexHtml .box5 .plateFive ul li{width: 90px;height: 90px;display: inline-block;background: #fff;border-radius: 50%;margin: 0 6%;transition: all .5s;-webkit-transition: all .5s;}
.indexHtml .box5 .plateFive ul li.cur1 .pic{ }
.indexHtml .box5 .plateFive ul li.cur2 .pic{background-position: 0px -50px;}
.indexHtml .box5 .plateFive ul li.cur4 .pic{background-position: 0px -150px;}
.indexHtml .box5 .plateFive ul li.cur3 .pic{background-position: 0px -100px;}
.indexHtml .box5 .plateFive ul li span{display: block; height: 50px; width: 50px;}
.indexHtml .box5 .plateFive ul li .pic{margin: 20px auto;background: url(../images/plateFive-iconS.png) no-repeat;}
.indexHtml .box5 .plateFive ul li .text{display: block;width: 120px;position: relative;left: 50%;margin-left: -60px;font-size: 16px;color: #ffffff;margin-top: 30px;line-height: 28px;height: 28px;transition: all .5s;-webkit-transition: all .5s;}
.indexHtml .box5 .plateFive ul li:hover{ background: #ffa800;animation: jiggle .5s ease-in forwards; }
.indexHtml .box5 .plateFive ul li:hover .text{ color: #ffa800;}
.indexHtml .box5 .plateFive ul li.cur1:hover .pic{background-position: -50px 0;}
.indexHtml .box5 .plateFive ul li.cur2:hover .pic{background-position: -50px -50px;}
.indexHtml .box5 .plateFive ul li.cur3:hover .pic{background-position: -50px -100px;}
.indexHtml .box5 .plateFive ul li.cur4:hover .pic{background-position: -50px -150px;}


@keyframes jiggle {
 0%,100% {transform: scale(1.0, 1.0)}
 20% { transform: scale(1.2, 0.8)}
 36% { transform: scale(0.8, 1.2) translate(0, -10px)}
 49% {transform: scale(1.0, 1.0) translate(0, -6px)}
}

.indexHtml .box5  .plateFive-icon5{ position: absolute;left: 50%; margin-left:-30px; background: #ffa800; border-radius: 50%; cursor: pointer;bottom: 5%;height: 60px;width: 60px;}
.indexHtml .box5  .plateFive-icon5 .pic{ background: url(../images/plateFive-icon5.png) no-repeat; width: 34px; height: 34px;display: block;margin: 13px auto;}
.indexHtml .box5  .plateFive-icon5 .text{width: 60px;position: relative;left: 50%;margin-left: -30px;color: #ffa800;margin-top: 11px;}

.indexHtml .box3 .plate-title{width: 60%;left: 22%;}
.indexHtml .box3 .plate-title img{}

.indexHtml .box4{} 
.indexHtml .box4 .plateFore{ position: absolute;width: 100%;top: 27%;}
.indexHtml .box4 .product-title{}
.indexHtml .box4 .product-title ul{text-align: center;}
.indexHtml .box4 .product-title ul li{ width: 160px; height: 36px; text-align: center; line-height: 36px;display:inline-block; cursor: pointer;}
.indexHtml .box4 .product-title ul li.active{  }
.indexHtml .box4 .product-title .three-d{display: block;}
.indexHtml .box4 .product-title .three-d .three-d-box{webkit-transform: translatez(-25px);transform: translatez(-17px);}
.indexHtml .box4 .product-title .three-d .front{-webkit-transform: rotatex(0deg) translatez(25px);transform: rotatex(0deg) translatez(17px);background: #ECF9FF;}
.indexHtml .box4 .product-title .three-d .back{background: #206abc;color: #fff;-webkit-transform: rotatex(-90deg) translatez(25px);transform: rotatex(-90deg) translatez(17px);}
.indexHtml .box4 .product-title ul li.active .three-d .three-d-box{-wekbit-transform: translateZ(-25px) rotateX(90deg)!important;transform: translateZ(-25px) rotateX(90deg)!important;}

.indexHtml .box4 .product-pic{width: 1600px;position: absolute;left: 50%;margin-left: -800px; overflow:hidden;top: 75px;}
.indexHtml .box4 .product-pic ul{}
.indexHtml .box4 .product-pic ul li{z-index: 5; position: relative;pointer-events: auto;}
.indexHtml .box4 .product-pic ul li .pic{position: relative;height: 100%;background: #fff;}
.indexHtml .box4 .product-pic ul li .pic:after{background-image: radial-gradient(circle farthest-corner at center center , rgb(85, 161, 218) 18%, rgb(38, 110, 189) 90%); position:absolute;content: ''; width: 100%; height: 100%;top: 0; left: 0; opacity: 0;transition: all .5s;-webkit-transition: all .5s;}
.indexHtml .box4 .product-pic ul li:hover .pic:after{ opacity: 1;}
.indexHtml .box4 .product-pic ul li span{display: block; width: 100%; color: #5a5a5a; font-size: 14px;font-weight: bold; margin-top: 30px;text-align: center;}
.indexHtml .box4 .product-pic ul li img{margin: 0 auto; position: relative;z-index: 5;}
.indexHtml .box4 .product-pic .tab-btn{height: 44px;width: 580px;left: 50%;margin-left: -290px;position: relative;margin-top: 55px;}
.indexHtml .box4 .product-pic .tab-btn .btn-cut{height: 44px;width: 44px;border-radius: 50%;background: #999999;position: absolute;top: 0;z-index: 10; cursor: pointer;transition: all .5s;-webkit-transition: all .5s;}
.indexHtml .box4 .product-pic .tab-btn .btn-cut:hover{ background: #206abc;}
.indexHtml .box4 .product-pic .tab-btn .btn-cut:after{ background: url(../images/plateThree-arrow.png) no-repeat; position: absolute;content: '';width: 13px;height: 22px;}
.indexHtml .box4 .product-pic .tab-btn .btn-cut.plateThree-next-product{right: 0;}
.indexHtml .box4 .product-pic .tab-btn .btn-cut.plateThree-next-product:after{left: 50%;top: 50%;margin: -11px 0 0 -7px;background-position: -13px 0;}
.indexHtml .box4 .product-pic .tab-btn .btn-cut.plateThree-prev-product{left: 0;}
.indexHtml .box4 .product-pic .tab-btn .btn-cut.plateThree-prev-product:after{left: 50%;top: 50%;margin: -11px 0 0 -7px;}
.indexHtml .box4 .product-pic .swiper-pagination-product{width: 500px;position: absolute;left: 50%;margin-left: -250px;top: 19px;height: 7px;background: #bdd7ea;}
.indexHtml .box4 .product-pic .swiper-pagination-product span{background: #035096;}

/*.plateFive{width: 480px;position: absolute;left: 50%;margin-left: -240px;bottom: 7%;}
.plateFive img{width: 100%;}*/
.platenSix {max-width: 1500px;width: 74%;margin: 12% auto 0;}
.platenSix img{ width: 100%;}
/*2016-11-15*/
.topTips2016year{ background: url(../images/SloganBg_11-15.jpg) no-repeat center; height: 355px; position: relative;}
.topTips2016year img{display: block;position: absolute;width: 400px;left: 50%;margin-left: -200px;top: 10%;}
.product-list{ margin-top: 0;}
.titleIcon{ margin-top: 0;padding: 45px 0 100px;}
.titleIcon ul{ text-align: center;}
.titleIcon ul li{height: 86px;width: 86px;background: url(../images/titleIcon.png);display: inline-block;position: relative;margin: 0 40px;background-size: auto 100%;}
.titleIcon ul li.cur1{}
.titleIcon ul li.cur2{background-position: -86px 0;}
.titleIcon ul li.cur3{background-position: -172px 0;}
.titleIcon ul li.cur4{background-position: -258px 0;}
.titleIcon ul li.cur5{background-position: -344px 0;}
.titleIcon ul li span{display: block;position: absolute;bottom: -36px;width: 120px;left: 50%;margin-left: -60px;text-align: center; color: #fff;}
.VioletBg{ background:#106fa3;}


@keyframes sunLightR{
    0%,100%{transform: rotate(0) scale(1);}
    50%{transform: rotate(15deg) scale(.95);}
}
@keyframes sunLightL{
    0%,100%{transform: rotate(0) scale(1);}
    50%{transform: rotate(-15deg) scale(.95);}
}

/*置顶*/
.zhiding{ background: url(../images/zhiding.png); height: 32px; width: 32px; position:fixed; right: 15px; bottom: 35px; z-index: 25; cursor: pointer;transition:all .5s;-webkit-transition:all .5s;opacity:0;filter:alpha(opacity=0)}
.zhiding.cur{opacity:1;filter:alpha(opacity=100);}
/*media*/
@media screen and (max-width:1200px)  {
#navToggle{ display: block;}	
}
/*pc*/
@media screen and (min-width:1201px)and (max-width:1400px)  {
/*  animdet*/

.animationHtml .earth{top: 40%;transform: scale(0.8);}
.animationHtml .sun{top: 40%;transform: scale(.8);}
@keyframes roundSun{
    0%{transform: rotate(0) scale(.8);}
    100%{transform: rotate(360deg) scale(.8);}
}
.animationHtml .sunLight{top: 40%;transform: scale(.8);}
.animationHtml .text-title{bottom: 15%;}
.animationHtml .trajectory{top: 45%;transform: scale(.8);}
.animationHtml .drag{bottom: 15%;}
    .animationHtml .drag-tips .drag-box{bottom:15%;}
.animationHtml .drag-tips{}
.animationHtml .animationHtml-text{bottom:15%;transform: scale(.7);}
.tiaoZ{transform: scale(.7);}
/*	1	*/
.swiper-container-banner .banner-mask.maskR .text{ top: 22%;}
.swiper-container-banner .banner-mask.maskL .text{top: 22%;}
/*  2   */
    .indexHtml .box2 .plateTow{top: 27%;padding: 25px 0 15px;}
    .indexHtml .box2 .plateTow ul{margin: 7% auto 0;}
    .indexHtml .box2 .plateTow ul li{width: 21%;margin: 0% 2% 0;height: 240px;}
    .indexHtml .box2 .plateTow ul li img{width: 60px;}
    .indexHtml .box2 .plateTow .title{margin: 14px auto 10px;}
/*   6   */
.indexHtml .plate-title{top: 15%;}
.indexHtml .plate-title img{ width: 400px;}
}
/*pad*/

/*phone*/
@media screen and (max-width:1200px)  {
.animationHtml{display: none;}
}
@media only screen and (max-width:767px ) {
.topTips2016year{ height: 250px;}
.topTips2016year img{     width: 200px;margin-left: -100px;top: 26%;}
.titleIcon{ padding: 45px 0;}
.titleIcon ul li{ margin: 0 40px 50px;}
}

/*关于我们*/
.jianjie{ width:80%; margin:0 auto; overflow:hidden; padding:50px 0;}
.about-ban{ /*height:500px;*/ width:100%; position:relative; overflow:hidden; margin-top:100px;}
.about-ban img{ width:100%;/* width:1920px; height:500px; position:absolute; top:50%; left:50%; margin-top:-250px; margin-left:-960px;*/}
.jianjiel{ width:10%; font-size:18px;}
.jianjiel img{ width:100px;}
.jianjier{ width:85%;}
.jianjier img{ max-width:100%;}
.youshi li{ float:left; width:23%; margin:1%; padding:2%; text-align:center; border:1px #ddd dashed; box-sizing:border-box; min-height:350px; margin-top:20px;} 
.youshi li h1{ font-size:18px; margin:10px 0;}
.youshi li p{ font-size:12px;}
/**/
.fuwur{ padding-top:30px;}
.fuwur h1{ font-size:18px;}
/*新闻详情*/
.new-xq{ width:80%;margin:0 auto; padding:50px 0; padding-top:150px;}
.new-xqq{ padding-top:50px;}
.new-xq h1{ font-size:18px;}
.new-xq p.time{ font-size:12px;}
.new-xqn{ margin-top:10px; padding-top:10px; line-height:24px;}
.new-xqn img{ max-width:100%;}
.fenye{ margin-top:80px;}

.ny-ban{ margin-top:100px;}

/*2-27*/
.ewm{ position:fixed; right:20px; top:50%; height:230px; margin-top:-121px; width:150px; background:#4c4c4c; box-shadow:#000 1px 1px 5px; color:#fff; font-size:20px; text-align:center; z-index:999;}
.ewm p{ padding:10px 0;}
.ewm span{ font-size:16px;}
.ewm img{ width:100%;}
.pro-gobuy p{ text-align:right;}
.pro-gobuy p span{ display:inline-block; padding:10px; font-size:48px;}
.pro-gobuy p a{ background:#F00; color:#fff; padding:10px; border-radius:10px; margin-right:10px;}
/*支付界面*/
.ask{ position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.5); z-index:10000; display:none;}
.buy{ width:600px; height:400px; background:#fff; position:fixed; top:50%; left:50%; margin-top:-200px; margin-left:-250px; z-index:10001; text-align:center; display:none;}
.buy h1{ height:60px; line-height:60px; background:#333; color:#fff; padding:0 15px; font-size:18px;}
.buy ul{ overflow:hidden; padding:50px 20%;}
.buy ul li{ float:left; width:40%; padding:0 5%; text-align:center;}
.buy ul li img{ max-width:100%;}