html { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
a, button, input { -webkit-tap-highlight-color: rgba(255, 0, 0, 0); }
input[type="text"], 
input[type="password"], 
select, input[type="search"] { 
-webkit-appearance: none; appearance: none; outline: none;
 -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
 border-radius: 0; 
}
.db{display:block;overflow:hidden;text-indent:-9999em;}
.fl{float:left;}
.fr{float:right;}
.pa{position:absolute;}
.pr{position:relative;}

/*--loading---*/
.loading_bg{width: 100%;height:100%;overflow: hidden;background:#000;position: absolute;left:0;top: 0;}
.loading_box {width: 109px;position:absolute;left:50%;top:50%;transform: translate(-50%,-50%);}
.loading_box img{width: 100%;}
.loading_num{width:100px;height:50px;text-align: center;font-size:36px;font-weight: bold; color: #ffffff;  -webkit-animation: neon6 1.5s ease-in-out infinite alternate;
animation: neon6 1.5s ease-in-out infinite alternate;}


.container{width: 100%;font-family: '微软雅黑';overflow-x: hidden;display: none;position: relative;}
body {max-width: 750px;margin: 0;}
.header {width: 100%;height: 1200px;background: url(../img/flash/header/header-31.jpg) no-repeat center top;position: relative;}
.headSeq{width: 100%; left: 0; top: 0;}
.headSeq img{display: block; position: absolute; left: 0; top: 0; opacity: 0;width: 100%;height: 1200px;}
.headSeq img:first-of-type{opacity:1;}
.header .box {width: 100%;height: 166px;background: url(../img/box.png) no-repeat center bottom;background-size: 100%;position: absolute;bottom: 0;display: flex;align-items: center;}
.header .box .logo{position: relative;left: 58px;}
.header .box .logo img{width: 109px;height: 109px;}
.header .box .title{height: 67px;display: flex;flex-direction: column;position: relative;left: 78px;font-family: "Microsoft YaHei";}
.header .box .title span:first-child{font-size: 28px;font-weight: bold;letter-spacing: 3px;color: #2a1500;}
.header .box .title span:last-child{font-size: 24px;color: #472708;position: absolute;bottom: 0;}
.header .box .btn{position: absolute;right: 20px;width: 315px;height: 108px;background: url(../img/btn1.png) no-repeat center top;background-size: auto 100%;}
.header .box .btn:active{background: url(../img/btn1-h.png) no-repeat center top;background-size: auto 100%;}
.main{width:100%;}
.main .title{text-align: center;height: 107px;}
.logo_box{position: absolute; top: 1025px;left:50%;z-index: 10; margin-left:-135px;width: 270px;text-align: center;}
.title_box{width: 100%;height:177px;}
.title1{color: #340b03;font-size: 35px;display: block;margin-bottom: 5px;font-weight: 700;}
.title2{color: #340b03;font-size: 25px;}

.bg-1{width: 100%; height: 2380px;background: url(../img/bg-1-1.jpg) no-repeat center -16px;}
.bg-2{width: 100%; height: 3776px;background: url(../img/bg-2-1.jpg) no-repeat center top;}
.airplane{width: 121px; height: 87px;position: absolute;right: 0;bottom: 0;
    -webkit-animation: plane 3s ease-out infinite forwards;
    animation: plane 3s ease-out infinite forwards; 
    -webkit-transform: translate3d(-100vw, 0, 0) rotateY(90deg);
    transform: translate3d(-100vw, 0, 0) rotateY(90deg);
-webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;}
/* 游戏介绍，预约礼包 */
.game-info{height: 960px;}
.game-info .title{margin-top: 50px;}
.game-info .title img{width: 606px;height: 107px;}
.info-text{margin: 90px 0 0 160px; width: 490px; color: #945e29;font-size: 26px;line-height: 1.6;}
.appoint-gift{height: 1058px;padding-top: 362px;position: relative;overflow: hidden;width: 100%;}
.appoint-gift .gift-flash{width: 100%; left: 0; top: 0;}
.appoint-gift img{display: block; position: absolute; left: 0; top: 362px; opacity: 0;width: 750px;height: 600px;}
.appoint-gift img:first-of-type{opacity:1;}
/* 英雄 */
.role-cont{height: 1230px;overflow: hidden;position: relative;}
.role-cont .title{margin-top: 25px;}
.role-cont .title img{width: 587px;height: 106px;}
.swiper-role{height: 813px;margin-top: -138px;}
.swiper-role .swiper-wrapper{height: 813px;}
.swiper-role .swiper-slide{position: relative;height: 813px;}
.swiper-role .swiper-slide img{position: absolute;}
.swiper-role .swiper-slide .role-tit{left: 25px;top: 170px;z-index: 99;width: 209px;height: 462px;}
.swiper-role .swiper-slide .role-img{right: 10px;bottom: 0;}
.swiper-role .swiper-slide .role-gss{right: 0px;bottom: 0;width: 612px;height: 813px;}
.swiper-role .swiper-slide .role-sn{right: 108px;bottom: 0;width: 467px;height: 713px;}
.swiper-role .swiper-slide .role-lk{right: 35px;bottom: 12px;width: 576px;height: 644px;}
.swiper-role .swiper-slide .role-hr{right: 66px;bottom: 0;width: 548px;height: 714px;}
.swiper-role .swiper-slide .role-lzs{right: 30px;bottom: 8px;width: 627px;height: 714px;}
.swiper-role .swiper-slide .role-sj{right: 100px;bottom: 0;width: 495px;height: 738px;}
.swiper-role .swiper-slide .role-ws{right:  50px;bottom: 6px;width: 544px;height: 720px;}
.swiper-role .swiper-page{width: 77px;height: 77px;background: url(../img/page-icon2.png) no-repeat scroll 0 0;opacity:1;background-size: auto 100%;}
.swiper-role .swiper-button-prev{left: 10px;top: 436px;}
.swiper-role .swiper-button-next{right: 10px;top: 436px;background-position: right 0;}
.swiper-role .page-box{position: absolute;right:  58px;top: 150px;width:50px;height: 82px;font-size: 26px;color: #483838;font-weight: 600;}
.swiper-role .swiper-pagination{width:50px;height: 82px;bottom: 0;}
.swiper-role .swiper-pagination .ele{width: 70%;display: block;text-align: center;}
.swiper-role .swiper-pagination .line{width: 105%;display: block;text-align: center;font-size: 36px;margin-top: -20px;margin-bottom: -20px;transform:rotate(15deg);}
.swiper-role .swiper-pagination .den{width: 90%;display: block;text-align: right;}

.swiper-rolePic{width: 704px;height: 267px;background: url(../img/book-bg.png) no-repeat scroll center 0;opacity:1;background-size: auto 100%; margin: 0 auto;}
.swiper-rolePic img{margin-top: 10px; width: 612px; height: 238px;margin-left: 42px;}
.swiper-rolePic .swiper-page{width: 43px;height: 58px;background: url(../img/page-icon3.png) no-repeat scroll 0 0;opacity:1;background-size: auto 100%;}
.swiper-rolePic .swiper-button-prev{left: 30px;top: 110px;}
.swiper-rolePic .swiper-button-next{right: 34px;top: 110px;background-position: right 0;}
.zs{position: absolute;right: 0;bottom: 340px;z-index: 2;}

/* 游戏视频，截图 */
.video-cont{height: 1150px;overflow: hidden;}
.video-cont .title img{width: 606px;height: 107px;}
.video-cont .title{margin-top: 5px;}
.video-con{margin-top: 30px;height: 360px;}
.video-box{width: 100%;height: 360px;}
.play-btn{left: 50%;top: 50%;margin-top: -58px;margin-left: -58px; z-index: 4;width: 115px;height: 115px;background: url(../img/play-btn.png) no-repeat scroll center center; background-size: 100%;}


.picture-cont{height: 1396px;position: relative;overflow: hidden;}
.picture-cont .title{margin-top: 140px; height: 117px;}
.picture-cont .title img{width: 663px;height: 117px;}
.swiper-box{width: 100%;height: 670px; margin: 210px 0 0;}
.swiper-box .swiper-wrapper{height: 563px;}
.swiper-box .swiper-wrapper img{margin: 62px 0 0 20px;width: 653px;height: 398px;}
.swiper-box .page-box{text-align: center;position: absolute;bottom: 0; width: 100%;left: 0;z-index: 2;}
.swiper-box .page-box span{margin:0 8px; width: 24px;height: 24px;background: url(../img/icon-2.png) no-repeat center bottom;opacity:1;}
.swiper-box .page-box span.swiper-pagination-bullet-active{background-position: center -2px;}
.swiper-box .swiper-page{width: 51px;height: 51px;background: url(../img/page-icon2.png) no-repeat scroll 0 0;opacity:1;}
.swiper-box .swiper-button-prev{left: 25px;top: 275px;}
.swiper-box .swiper-button-next{right: 0;top: 275px;background-position: right 0;}
/*.swiper-box .pagefy{position: absolute; top: (-42px));left: (-14px));display: none;width: 640px;height: 600px;z-index: 9;}*/
.picture-cont .pagefy{position: absolute; top: 414px;left: -53px;display: none;width: 750px;height: 600px;}
.picture-cont .prev{position: absolute; top: 680px; left: 20px; width: 53px; height: 60px; background: url(../img/pre-next.png);}
.picture-cont .next{position: absolute; top: 680px; right: 20px; width: 53px; height: 60px; background: url(../img/pre-next.png) 0 -70px;}
.message-cont{overflow: hidden; position: relative;height: 1193px;background: url(../img/bg-4.jpg) no-repeat scroll center 0;}
.message-cont .tips{position: relative;margin-left: 0;margin-top: 430px;}
.message-cont .tip{margin-left: 275px;margin-bottom: 15px;width: 423px;height: 165px;background: url(../img/tip.png) no-repeat scroll center 0;background-size: 423px 165px;display: flex;align-items: center;}

.message-cont .tip p{margin: 0 36px 0 42px;font-size: 18px;color: #171717;}
.message-cont .b2{position: absolute;top: -62px;}

.pop{outline:none;display:none;}
.pop_bg{width:100%;height:100%;left:0;top:0;position:fixed;background:#000;opacity:.8;filter:alpha(opacity=80);z-index:99;}
.pop_close{width:35px;height:35px;background:url(../img/close.png) no-repeat center center;right:0;top:-43px;-webkit-transition:all .4s;transition:all .4s;}
.pop_close:hover{-webkit-transform:rotate(180deg);transform:rotate(180deg);}
.pop_vid,.pop_video{width:100%;height:360px;}
.pop_video>video{width:100%;height:360px;}
.popshow{-webkit-animation:fadeInDownBig .6s ease both;animation:fadeInDownBig .6s ease both;}
.pophide{-webkit-animation:fadeOutUpBig .6s ease both;animation:fadeOutUpBig .6s ease both;}

.birds{left: 0;z-index: 0;width: 100%; height: 590px;overflow: hidden;}
.birds img{position: absolute;left: 0;bottom: 0;}

.bg-hw{background-size: 100%;}
.bkTop{position: absolute;right: 36px;bottom: 140px;}
.bkTop img{width: 73px; height: 88px;}

@-webkit-keyframes plane {
    0% {
      -webkit-transform: translate3d(-120vw, -20px, -750px) rotateY(180deg) rotateX(360deg) rotateZ(45deg);
              transform: translate3d(-120vw, -20px, -750px) rotateY(180deg) rotateX(360deg) rotateZ(45deg);
    }
    100% {
      -webkit-transform: translate3d(100vw, -40vh, 750px) rotateY(180deg) rotateX(360deg) rotateZ(45deg);
              transform: translate3d(100vw, -40vh, 750px) rotateY(180deg) rotateX(360deg) rotateZ(45deg);
    }
  }
  @keyframes plane {
    0% {
      -webkit-transform: translate3d(-120vw, -20px, -750px) rotateY(180deg) rotateX(360deg) rotateZ(45deg);
              transform: translate3d(-120vw, -20px, -750px) rotateY(180deg) rotateX(360deg) rotateZ(45deg);
    }
    100% {
      -webkit-transform: translate3d(100vw, -40vh, 750px) rotateY(180deg) rotateX(360deg) rotateZ(45deg);
              transform: translate3d(100vw, -40vh, 750px) rotateY(180deg) rotateX(360deg) rotateZ(45deg);
    }
  }