@charset "utf-8";
body,html{
  margin:0; padding:0; font-family:"Microsoft YaHei"; color:#565656; background:#000; font-size: 22px;
}
div,ul,li,p,img,embed,object{margin:0; padding:0; border:0;}
*{margin:0px;padding:0px;}
ul{margin:0;}
li{margin:0; list-style:none;}
input{ outline: none; }
a{ color:#ffffff; outline:none; text-decoration:none;  }
a:link,a:visited{ text-decoration:none;}
.clear,.clr{clear:both; margin:0; padding:0; height:0; line-height:0; display:block; font-size:0; background:none; overflow:hidden; }
.h05{height:5px;}
.h10{height:10px;}
.h30{height:30px;}
.h40{height:40px;}
.h50{height:50px;}
.h80{height:80px;}
.red{color:#f00;}
.fll{float:left; display:inline; }
.flr{float:right;}
.hide{display:none;}
.mau{margin:0 auto;}
.por{position:relative;}
.poa{position:absolute;}
.center{text-align:center;}
.in{width:1000px; position:relative; margin:0 auto;}

/*footer*/
.tk12{ position: absolute; top: 690px;  left: 550px; z-index: 53; }
.wrapbg{ width: 100%; max-width: 750px; position: relative; margin: 0 auto; overflow: hidden; }
.wrap{ width:750px; height: 100%; position:absolute; padding:1px 0 0; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); transform-origin: center 0; }
.header{
  position: fixed; width: 100%; height: 100px; left: 0; top: 0; z-index: 2; border-bottom: solid 2px #002e84; background-color: #000;
}
.header.on{ position:fixed; }
.navbtn{
  position: absolute; width: 34px; height: 30px; top: 34px; right: 50px; background:url(/images/v9/m/navbtn.png) no-repeat; background-size: contain;
}
.header .cov{
  position: absolute; width: 100%; height: 1rem; left: 0; top: 0; background:#000; opacity: 0.5;
}
.header .header_con{
  position: relative; width: 100%;
}
.header_nav{
  position: absolute; right: 0; top: 0; width: 100vw; height: 100vh; transition-duration:0.6s; transform: translateX(100%); padding-top: 180px;
}
.header_nav::before{
  content: ''; position: absolute; width: 100%; height: 100%; background: #000000; opacity: 0.9; left: 0; top: 0;
}
.header_nav.on{
  transform: translateX(0);
}
.header_nav a{
  display: block; width: 434px; height: 94px; color:#fff; font-size: 36px; text-align: center; position: relative; line-height: 94px; border-bottom: solid 2px #216dfa; margin: 30px auto 0;
}
.header_nav a::after{
  content: ''; position: absolute; width: 28px; height: 2px; background-color: #00fffc; left:0; bottom: 0;
}
.header_nav a::before{
  content: ''; position: absolute; width: 28px; height: 2px; background-color: #00fffc; right:0; bottom: 0;
}
.header_nav a.navClose{
  width: 42px; height: 42px; background:url(/images/v9/m/navClose.png) no-repeat; background-size: contain; border: 0;
}
.header_nav a.navClose::after,.header_nav a.navClose::before{
  display: none;
}

.header .header_nav span{
  text-transform:Uppercase; color:#c6a691; font-size: 0.12rem; display: none;
}
.header_nav a:hover,.header_nav a:hover span,.header_nav a.on,.header_nav a.on span{
  color:#fff; background: #333;
}
.header_nav a:hover::after,.header_nav a.on::after{
  left: -0.28rem; opacity: 1;
}
.header_nav a:hover::before,.header_nav a.on::before{
  right: -0.28rem; opacity: 1;
}

.logo{ position: absolute; left: 0; top: 5px; width: 188px; height: 146px; background:url(/images/v9/logo.png) no-repeat; background-size: 100% auto; z-index: 2; }


.wrap-pag{ display: none; }
.wrap-swiper {
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
}
.wrap-swiper .swiper-slide{
  height: 100%;
}

.page01{  background:url(/images/v9/m/b1.jpg) top/cover no-repeat; height: 869px; position: relative; z-index: 1; overflow: hidden; }
.page02{  background:url(/images/v9/m/b2.jpg) top/cover no-repeat; height: 1382px; position: relative;  overflow: hidden; }
.page03{  background:url(/images/v9/m/b3.jpg) top/cover no-repeat; height: 1350px; position: relative;  overflow: hidden; }
.page04{  background:url(/images/v9/m/b4.jpg) top/cover no-repeat; height: 721px; position: relative;  overflow: hidden; }

.arrow{ position: absolute; left: 50%; bottom: 0.1rem; width: 0.7rem; height: 0.42rem; margin-left: -0.43rem; z-index: 2; 
  animation: arrow 0.6s linear infinite alternate;
}
@keyframes arrow{
    0%{ transform:translateY(0); }
    100%{ transform:translateY(-0.15rem); }
}

.downbtns{
  position: absolute; width: 311px; height: 92px; display: flex; top: 696px; left: 50%; margin-left: -156px; background:url(/images/v9/m/regitDownLoad.png) no-repeat; z-index: 22; flex-wrap: wrap; overflow: hidden;
}
.downbtns a{
  display: block; width: 100%; height: 100%;
}
/* .page01 .wrap::before{
  content: '';
  position: absolute; width: 1764px; height: 1165px; left: -160px; top: 0; background:url(/images/v9/nan.png) no-repeat;
}
.page01 .wrap::after{
  content: '';
  position: absolute; width: 995px; height: 1136px; left: 680px; top: -45px; background:url(/images/v9/nv.png) no-repeat;
} */

.title{
  display: block; margin: 40px auto 0;  width: 573px; height: 90px; background:url(/images/v9/m/title.png) no-repeat; background-size: 573px 2806px;
}
.title1{ background-position: 0 0; }
.title2{ background-position: 0 -1386px; }
.title3{ background-position: 0 bottom; }


.left{
   width: 662px; margin: 220px auto 0; position: relative;
}
.right{
  width: 662px; margin: 0 auto; position: relative;
}
.more{
  display: block; margin: 50px auto 0; width: 181px; height: 40px; background:url(/images/v9/m/more.png) no-repeat; background-size: contain; overflow: hidden; text-indent: -999px;
}
.lunbo{
  position: relative; width: 662px; height: 348px; background:url(/images/v9/lunbo-bg.png) no-repeat; background-size: contain;
}
.lunbo img{ width: 610px; }
.lunbo .swiper-slide{ display: flex; align-content: center; align-items: center; justify-content: center; }
.swiper-pagination{ text-align: center; width: 100%; }
.swiper-pagination-bullet{
  width: 30px; height: 4px; background-color: #0154f9; margin:0 6px; border-radius: 0; opacity: 1; transform: skewX(-50deg); -webkit-transform: skewX(-50deg);
}
.swiper-pagination-bullet-active{
  background-color: #00f0ff;
}
.stn-prev,.stn-next{ display: none; }
.leftBottom{
  display: none;
}

.sever{
  width: 100%; height: 130px; position: absolute; color: #cccccc; top: -570px; font-size: 22px;
}
.sever a{ color: #cccccc; margin-right: 30px; }
.sever::before{
  content: ''; position: absolute; width: 100%; height: 100%; left:0; top: 0; background: #161a21; opacity: 0.7;
}
.sever::after{
  content: ''; position: absolute; width: 100%; height: 100%; left:0; top: 0; background:url(/images/v9/news-tt.png) no-repeat 46px center; background-size: auto 62px;
}
.sever_wrap{
  padding: 30px 0 0 133px; position: relative; z-index: 2;
}
.sever_wrap h2{
  display: block; margin-bottom: 10px; font-size: 24px; color: #5cf3fc;
}
.marqueeSever{ width: 400px; }
.sever a.xqbtn{
  position: absolute; width: 80px; height: 37px; overflow: hidden; text-indent: -999px; margin: 0; top: 63px; right: 34px; background:url(/images/v9/xqbtn.png) no-repeat; background-size: 80px auto; z-index: 2;
}

.index_news{
  margin: 60px auto 0;
}
.index_news .more{
  position: absolute; width: 32px; height: 32px; top: 0; right: 0; background:url(/images/v9/newTabMore.png) no-repeat; z-index: 2; display: none;
}
.index_tab{
  width: 100%; height: 54px; display: flex; justify-content: space-between;
}
.index_tab a{
  display: block; width: 118px; height: 54px; text-align: center; line-height: 54px; font-size: 24px; background-color: #000;
}
.index_tab a:hover,.index_tab a.on{
  background:url(/images/v9/newsTabHover.png) repeat-x; background-size: auto 100%; color: #ffffff; font-weight: bold;
}
.index_news_main{
  height: 352px; display: none; margin: 40px auto 0; font-size: 24px;
}
.index_news_main.on{ display: block; }
.index_news_main li{
  display: flex; margin: 30px 0 0; height: 44px; justify-content: space-between; color: #cccccc;
}
.index_news_main li a span{
  color: #cccccc;
}
.index_news_main li a:hover{
   color: #ff0000;
}

.threeMenus{
  display: flex; width: 100%; height: 980px; margin: 70px auto 0; flex-wrap: wrap; justify-content: center;
}
.threeMenus li{
  display: block; width: 325px; height:490px; background:url(/images/v9/m/threeMenus.png) no-repeat; background-size: 650px 980px; position: relative; cursor: pointer;
}
.threeMenus li a{
  position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 2;
}
.threeMenus li:hover::after,.threeMenus li.on::before{
  content: ''; position: absolute; width: 326px; height: 536px; left:-27px; top:-24px; background:url(/images/v9/hover.png) no-repeat;
}
.threeMenus li:hover::after,.threeMenus li.on::after{
  content: ''; position: absolute; width: 30px; height: 36px; left:200px; top:336px; background:url(/images/v9/zz.png) no-repeat;
  animation: zz 0.4s linear infinite alternate;
}
@keyframes zz{
    0%{ transform:translate(0,0); }
    100%{ transform:translate(-10px,-10px); }
}
.threeMenus li .cp{
  position: absolute; width: 194px; height: 194px; left: 52px;  top: 86px; display: flex; align-items: center; align-content: center; justify-content: center;
}
.threeMenus li:nth-child(1){
  background-position: 0 0;
}
.threeMenus li:nth-child(1) .cp::before{
  content: ''; position: absolute; width: 125px; height: 58px; left:50%; bottom:20px; margin-left: -63px; background:url(/images/v9/toukui-1.png) no-repeat;
  animation: threeMenus1 0.6s linear infinite alternate;
}
.threeMenus li:nth-child(1) .cp::after{
  content: ''; display: block; position: relative; width: 135px; height: 97px; background:url(/images/v9/toukui.png) no-repeat;
  animation: threeMenus 0.6s linear infinite alternate;
}
.threeMenus li:nth-child(2){
  background-position: right 0;
}
.threeMenus li:nth-child(2) .cp{
  left: 82px; top: 86px;
}
.threeMenus li:nth-child(2) .cp::before{
  content: ''; position: absolute; width: 141px; height: 62px; left:50%; bottom:10px; margin-left: -71px; background:url(/images/v9/feiji-1.png) no-repeat;
  animation: threeMenus1 0.6s linear infinite alternate;
  animation-delay: 0.2s;
}
.threeMenus li:nth-child(2) .cp::after{
  content: ''; display: block; position: relative; width: 186px; height: 106px; background:url(/images/v9/feiji.png) no-repeat;
  animation: threeMenus 0.6s linear infinite alternate;
  animation-delay: 0.2s;
}
.threeMenus li:nth-child(3){
  background-position: 0 bottom;
}
.threeMenus li:nth-child(3) .cp::before{
  content: ''; position: absolute; width: 140px; height: 65px; left:50%; bottom:0; margin-left: -70px; background:url(/images/v9/shoulei-1.png) no-repeat;
  animation: threeMenus1 0.6s linear infinite alternate;
  animation-delay: 0.35s;
}
.threeMenus li:nth-child(3) .cp::after{
  content: ''; display: block; position: relative; width: 127px; height: 156px; background:url(/images/v9/shoulei.png) no-repeat;
  animation: threeMenus 0.6s linear infinite alternate;
  animation-delay: 0.35s;
}
.threeMenus li:nth-child(4){
  background-position: right bottom;
}
.threeMenus li:nth-child(4) .cp::before{
  content: ''; position: absolute; width: 121px; height: 61px; left:50%; bottom:15px; margin-left: -61px; background:url(/images/v9/daodan-1.png) no-repeat;
  animation: threeMenus1 0.6s linear infinite alternate;
  animation-delay: 0.5s;
}
.threeMenus li:nth-child(4) .cp::after{
  content: ''; display: block; position: relative; width: 111px; height: 112px; background:url(/images/v9/daodan.png) no-repeat;
  animation: threeMenus 0.6s linear infinite alternate;
  animation-delay: 0.5s;
}
.threeMenus li:nth-child(4) .cp{
  left: 82px; top: 86px;
}

@keyframes threeMenus{
  0%{ transform:translate(0,0); }
  100%{ transform:translate(0,-20px); }
}
@keyframes threeMenus1{
  0%{ transform:scale(1); }
  100%{ transform:scale(0.8); }
}
.miaozhunqi{
  position: absolute; width: 67px; height: 67px; left:50%; top: 50%; margin: -34px 0 0 -34px; background:url(/images/v9/miaozhunqi.png) no-repeat; z-index: 2;
  animation: miaozhunqi 0.6s linear infinite;
}
@keyframes miaozhunqi{
  0%{ transform:scale(3); }
  100%{ transform:scale(1); }
}
.page03 .more{
  margin: 0 auto;
}

.fourBtn{
  position: relative; width: 630px; height: 211px; margin: 60px auto 0; display: flex; justify-content: space-between;  flex-wrap: wrap;
}
.fourBtn a{
  display: block; width: 294px; height: 51px; padding: 160px 0 0; background:url(/images/v9/fourBtn.png) no-repeat; background-size: 1296px 211px; font-size: 24px; color: #000000; text-align: center; font-weight: bold; margin-bottom: 20px;
}
.fourBtn a:nth-child(2){
  background-position: -12px 0;
}
.fourBtn a:nth-child(2){
  background-position: -344px 0;
}
.fourBtn a:nth-child(3){
  background-position: -676px 0;
}
.fourBtn a:nth-child(4){
  background-position: -1009px 0;
}