*{margin: 0;padding: 0;-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;}
@font-face {
    font-family: 'han';
    src: url('../font/han.otf') format('opentype');
}
@font-face {
    font-family: 'SourceHanSansCN-Bold';
    src: url('../font/SourceHanSansCN-Bold.ttf') format('truetype');
}
@font-face {
    font-family: 'SourceHanSansCN-Medium';
    src: url('../font/SourceHanSansCN-Medium.ttf') format('truetype');
}
@font-face {
    font-family: 'SourceHanSansCN-Regular';
    src: url('../font/SourceHanSansCN-Regular.ttf') format('truetype');
}





body{
    width: 10rem;
    margin: 0 auto;
}
.header{
    position: fixed;
    top: 0;
    display: flex;
    align-items: center;
    width: 10rem;
    height: 1.24rem;
    background: #161D27;
    border: .02rem solid #34404C;
    z-index: 10;
}
.icon{
    width: 1.08rem;
    height: 1.067rem;
    margin-left: .347rem;
}
.logo{
    width: 2.613rem;
    height: 1.227rem;
    margin-left: -0.2rem;
}
.viewRewards{
    width: 1.573rem;
    height: .427rem;
    margin-left: .2rem;
    background: url('../img/viewRewards.png') no-repeat center;
    background-size: 100% 100%;
}
.meida-icon{
    width: .6rem;
    height: .6rem;
    margin-left: .427rem;
}
.facebook{
    background: url('../img/css_sprites.png') -18.933rem -12.733rem;
    background-size: 22.16rem 18.053rem;
}
.youtube{
    background: url('../img/css_sprites.png') -19.8rem -12.733rem;
    background-size: 22.16rem 18.053rem; 
}
.line{
    background: url('../img/css_sprites.png') -20.76rem -11.787rem;
    background-size: 22.16rem 18.053rem; 
}
.bahamutSystem{
    background: url('../img/css_sprites.png') -19.88rem -11.787rem;
    background-size: 22.16rem 18.053rem;  
}
.main{
    width: 10rem;
    overflow: hidden;
}
.pc-bg{
    position: fixed;
    width: 100%;
    height: 100%;
    max-width: 1920px;
    top: 0;
    left: 0;
    background: url('../img/banner-bg.jpg')  no-repeat;
    background-position: center center;
    background-size: cover;
    z-index: -1;
}
.step1{
    width: 10rem;
    height: 17.987rem;
    background: url('../img/step1-banner.jpg') no-repeat center;
    background-size: 100% 100%;
    overflow: hidden;
}
.step1-text{
    width: 9.44rem;
    height: 2.44rem;
    margin-top: 12.147rem;
    margin-left: .147rem;
    background: url('../img/step1-text.png') no-repeat center;
    background-size: 100% 100%;
}
.step1-bookNow{
    display: block;
    width: 7.04rem;
    height: 2.92rem;
    margin-top: .02rem;
    margin-left: 1.52rem;
    background: url('../img/bookNow.png') no-repeat center;
    background-size: 100% 100%;
    animation:doubleScale 1s infinite alternate;
}
@keyframes doubleScale{
    80% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    90% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}
.step2{
    width: 10rem;
    height: 15.76rem;
    background: url('../img/step2-banner.jpg') no-repeat center;
    background-size: 100% 100%;
    margin-top: -0.613rem;
    overflow: hidden;
}
.step2-title{
    width: 8.6rem;
    height: 1.547rem;
    background: url('../img/step2-title.png') no-repeat center;
    background-size: 100% 100%;
    margin: .747rem auto 0;
}
.step2-main{
    width: 9.453rem;
    height: 10.64rem;
    background: url('../img/step2-main-bg.jpg') no-repeat center;
    background-size: 100% 100%;
    margin: .413rem auto 0;
    overflow: hidden;
}
.milestoneList{
    width: 9.453rem;
    height: 5.72rem;
    margin-top: .467rem;
}
.milestone-item{
    float: left;
    width: 3.093rem;
    height: 2.573rem;
}
.milestone-item:nth-child(1){
    background: url('../img/css_sprites.png') -13.573rem -15.347rem;
    background-size: 22.16rem 18.053rem;
    margin-left: .147rem;
}
.milestone-item:nth-child(2){
    background: url('../img/css_sprites.png') -3.493rem -15.347rem;
    background-size: 22.16rem 18.053rem;
    margin-left: -0.147rem
}
.milestone-item:nth-child(3){
    background: url('../img/css_sprites.png') -13.6rem -11.92rem;
    background-size: 22.16rem 18.053rem;
    margin-left: -0.147rem;
}
.milestone-item:nth-child(4){
    background: url('../img/css_sprites.png') -10.213rem -15.347rem;
    background-size: 22.16rem 18.053rem;
    margin-left: 1.427rem;
    margin-top: -0.027rem;
}
.milestone-item:nth-child(5){
    width: 3.467rem;
    height: 2.88rem;
    background: url('../img/css_sprites.png') -6.133rem -11.92rem;
    background-size: 22.16rem 18.053rem;
    margin-left: .04rem;
    margin-top: -0.027rem;
}
.milestone-item-avtive:nth-child(1){
    background: url('../img/css_sprites.png') -0.133rem -15.347rem;
    background-size: 22.16rem 18.053rem;
}
.milestone-item-avtive:nth-child(2){
    background: url('../img/css_sprites.png') -18.933rem -0.133rem;
    background-size: 22.16rem 18.053rem;
}
.milestone-item-avtive:nth-child(3){
    background: url('../img/css_sprites.png') -18.933rem -2.973rem;
    background-size: 22.16rem 18.053rem;
}
.milestone-item-avtive:nth-child(4){
    background: url('../img/css_sprites.png') -6.853rem -15.347rem;
    background-size: 22.16rem 18.053rem;
}
.milestone-item-avtive:nth-child(5){
    background: url('../img/css_sprites.png') -9.867rem -11.92rem;
    background-size: 22.16rem 18.053rem;
}
.step2-preOrder{
    display: flex;
    width: 100%;
    height: .8rem;
}
.preOrder-title{
    position: relative;
    width: 2.827rem;
    height: .8rem;
    background: #1AA0E8;
    margin-left: .627rem;
}
.preOrder-title-name{
    display: flex;
    width: 2.827rem;
    height: .8rem;
    align-items: center;
    justify-content: center;
    font-size: .413rem;
    color: #C5E2F6;
    font-family: 'SourceHanSansCN-Regular';
}
.preOrder-list{
    display: none;
    width: 2.827rem;
    height: 2.52rem;
    font-size: .427rem;
}
.preOrder-list span{
    display: flex;
    align-items: center;
    justify-content: center;
    background: #292C2E;
    width: 100%;
    height: .84rem;
    color: #BED2E0;
    border-top:.02rem solid #6d8490;
}
.preOrder-title i{
    position: absolute;
    right: .147rem;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-bottom: none;
    border-left: .147rem solid transparent;
    border-right: .147rem solid transparent;
    border-top: .147rem solid #10E9F7; /* 箭头颜色 */
}
.preOrder-title .active{
    position: absolute;
    right: .147rem;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-top: none;
    border-left: .147rem solid transparent;
    border-right: .147rem solid transparent;
    border-bottom: .147rem solid #10E9F7; /* 箭头颜色 */
}
.preOrder-input{
    display: flex;
    align-items: center;
    width: 5.107rem;
    height: .8rem;
    margin-left: .36rem;
    font-size: .413rem;
}
.preOrder-input input{
    width: 100%;
    height: 100%;
    border: none;
    color: #2c2e2f;
    font-family: 'SourceHanSansCN-Regular';
    padding-left: .213rem;
    background: #fff;
    outline: none;
}
.agreeDataUse{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: .347rem;
    font-size: .267rem;
}
.agreeDataUse img{
    width: .253rem;
    height: .253rem;
}
.agreeDataUse span{
    font-family: 'SourceHanSansCN-Regular';
    color: #E4F4FF;
    font-size: .267rem;
    margin-left: .173rem;
}
.reserveBtn{
    width: 7.013rem;
    height: 2.907rem;
    margin: .147rem auto 0;
    background: url('../img/bookNow.png') no-repeat;
    background-size: 100% 100%;
}
.step3{
    width: 10rem;
    height: 15.76rem;
    background: url('../img/step3-banner.jpg') no-repeat center;
    background-size: 100% 100%;
    margin-top: -1.2rem;
    overflow: hidden;
}
.step3-tilte{
    width: 8.173rem;
    height: 1.413rem;
    background: url('../img/step3-title.png') no-repeat center;
    background-size: 100% 100%;
    margin: .747rem auto 0;
}
.step3-main{
    width: 8.493rem;
    height: 8.573rem;
    background: url('../img/step3-main-bg.png') no-repeat center;
    background-size: 100% 100%;
    margin: .96rem auto 0;
    overflow: hidden;
}
.step3-shop-text{
    width: 2.827rem;
    height: .307rem;
    background: url('../img/step3-shop-text.png') no-repeat center;
    background-size: 100% 100%;
    margin: 4.947rem auto 0;
}
.step3-shop-gift{
    width: 7.693rem;
    height: .4rem;
    background: url('../img/shop-gift.png') no-repeat center;
    background-size: 100% 100%;
    margin: .133rem auto 0;
}
.step3-shop-gift2{
    width: 6.547rem;
    height: .413rem;
    background: url('../img/shop-gift2.png') no-repeat center;
    background-size: 100% 100%;
    margin: .147rem auto 0;
}
.shopBtn{
    width: 4.28rem;
    height: 1.307rem;
    margin: .253rem auto 0;
    background: url('../img/shopBtn.gif') no-repeat center;
    background-size: 100% 100%;
}
.step4{
    width: 10rem;
    height: 15.773rem;
    background: url('../img/step4-banner.jpg') no-repeat center;
    background-size: 100% 100%;
    margin-top: -2.4rem;
    overflow: hidden;
}
.step4-title{
    width: 8.6rem;
    height: 1.547rem;
    background: url('../img/step4-title.png') no-repeat center;
    background-size: 100% 100%;
    margin: .76rem auto 0;
}
.step4-main{
    position: relative;
    width: 9.453rem;
    height: 10.507rem;
    margin: .427rem auto 0;
    background: url('../img/step4-main-bg.png') no-repeat center;
    background-size: 100% 100%;
    overflow: hidden;
}
.ps5-pro{
    position: absolute;
    top: .24rem;
    left: 50%;
    transform: translateX(-50%);
    width: 9.347rem;
    height: 10.24rem;
    background: url('../img/ps5-pro.png') no-repeat center;
    background-size: 100% 100%;
}
.step4-main-title{
    width: 2.84rem;
    height: .307rem;
    margin: .613rem auto 0;
    background: url('../img/step4-main-title.png') no-repeat center;
    background-size: 100% 100%;
}
.like-gifttext{
    width: 6.773rem;
    height: .613rem;
    background: url('../img/facebook-like-text.png') no-repeat center;
    background-size: 100% 100%;
    margin: .213rem auto 0;
}
.facebook-btn{
    position: relative;
    width: 4.28rem;
    height: 1.307rem;
    margin: 6.733rem auto 0;
    background: url('../img/facebook-btn.gif') no-repeat;
    background-size: 100% 100%;
    z-index: 5;
}
.step5{
    width: 10rem;
    height: 16.733rem;
    background: url('../img/step5-bg.jpg') no-repeat center;
    background-size: 100% 100%;
    margin-top: -1.28rem;
    overflow: hidden;
}
.step5-title{
    width: 8.6rem;
    height: 1.547rem;
    margin: .747rem auto 0;
    background: url('../img/step5-title.png') no-repeat center;
    background-size: 100% 100%;
}
.rewardList{
    position: relative;
    width: 9.36rem;
    height: 11.627rem;
    margin: 0 auto;
}
.reward-item{
    position: absolute;
    width: 2.92rem;
    height: 1.907rem;
}
.rewardList .active::after{
    display: block;
    content: '';
    width: 2.92rem;
    height: 1.907rem;
    background: url('../img/winPrize-bg.png') no-repeat center;
    background-size: 100% 100%;
}
.reward-item:nth-child(1){
    top: .36rem;
    left: 0;
    background: url('../img/giftList.png') -0.133rem -0.133rem;
    background-size: 12.853rem 8.8rem;

}
.reward-item:nth-child(2){
    top: .36rem;
    left: 3.267rem;
    background: url('../img/giftList.png') -3.347rem -0.133rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(3){
    top: .36rem;
    right: 0;
    background: url('../img/giftList.png') -0.133rem -2.333rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(4){
    top: 2.56rem;
    left: 0;
    background: url('../img/giftList.png') -3.347rem -2.333rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(5){
    top: 2.56rem;
    left: 3.267rem;
    background: url('../img/giftList.png') -6.56rem -0.133rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(6){
    top: 2.56rem;
    right: 0;
    background: url('../img/giftList.png') -6.56rem -2.333rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(7){
    top: 4.773rem;
    left: 0;
    background: url('../img/giftList.png') -0.133rem -4.533rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(8){
    top: 4.773rem;
    right: 0;
    background: url('../img/giftList.png') -3.347rem -4.533rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(9){
    top: 6.987rem;
    left: 0;
    background: url('../img/giftList.png') -6.56rem -4.533rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(10){
    top: 6.987rem;
    left: 3.267rem;
    background: url('../img/giftList.png') -0.133rem -6.733rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(11){
    top: 6.987rem;
    right: 0;
    background: url('../img/giftList.png') -3.347rem -6.733rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(12){
    left: 0;
    top: 9.2rem;
    background: url('../img/giftList.png') -6.56rem -6.733rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(13){
    left: 3.267rem;
    top: 9.2rem;
    background: url('../img/giftList.png') -9.773rem -0.133rem;
    background-size: 12.853rem 8.8rem;
}
.reward-item:nth-child(14){
    top: 9.2rem;
    right: 0;
    background: url('../img/giftList.png') -9.773rem -2.333rem;
    background-size: 12.853rem 8.8rem;
}
.reward-btn{
    position: absolute;
    width: 3.12rem;
    height: 2.107rem;
    top: 4.68rem;
    left: 3.147rem;
    background: url('../img/reward-btn.gif') no-repeat center;
    background-size: 100% 100%;
}
.reward-numbox{
    position: absolute;
    text-align: right;
    bottom: .053rem;
    width: 100%;
    font-family: 'SourceHanSansCN-Bold';
    font-size: .267rem;
    color: #2c2e2f;
    font-weight: bold;
}
.reward-numbox em{
    font-weight: bold;
    font-family: 'SourceHanSansCN-Bold';
    font-style: normal;
    font-size: .32rem;
    color: #020f16;
}
.step5-btnlist{
    display: flex;
    justify-content: center;
    width: 100%;
    height: 1.693rem;
}
.notes{
    width: 4.56rem;
    height: 1.72rem;
    background: url('../img/notes-btn.png') no-repeat center;
    background-size: 100% 100%;
}
.luckyBonus{
    width: 4.56rem;
    height: 1.72rem;
    background: url('../img/luckyBonus-btn.png') no-repeat;
    background-size: 100% 100%;
}
.footer{
    width: 10rem;
    height: 2.36rem;
    background: url('../img/footer-bg.jpg') no-repeat center;
    background-size: 100% 100%;
    margin-top: -0.787rem;
}
.dialog{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.6);
    z-index: 20;
}
.dialog-content{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9.133rem;
    height: 9.307rem;
    transform: translate(-50%, -50%);
    background: url('../img/css_sprites.png') -9.533rem -0.133rem;
    background-size: 22.16rem 18.053rem;
}
.queryRewards{
    display: none;
}
.dialog-close{
    position: absolute;
    top: -0.333rem;
    right: -0.333rem;
    width: .68rem;
    height: .68rem;
    background: url('../img/css_sprites.png') -18.933rem -11.787rem;
    background-size: 22.16rem 18.053rem;
}
.queryRewards-title{
    width: 3.053rem;
    height: .987rem;
    background: url('../img/queryRewards-title.png') no-repeat center;
    background-size: 100% 100%;
    margin: .987rem auto 0;
}
.queryRewards-preOrder{
    display: flex;
    width: 100%;
    height: .84rem;
    margin-top: 2.107rem;
}
.queryRewards-preOrder-title{
    position: relative;
    width: 2.827rem;
    height: .8rem;
    font-size: .413rem;
    color: #C5E2F6;
    font-family: 'SourceHanSansCN-Regular';
    background: #1AA0E8;
    margin-left: .48rem;
}
.queryRewards-preOrder-name{
    display: flex;
    width: 2.827rem;
    height: .8rem;
    align-items: center;
    justify-content: center;
}
.queryRewards-preOrder-title i{
    position: absolute;
    right: .147rem;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-bottom: none;
    border-left: .147rem solid transparent;
    border-right: .147rem solid transparent;
    border-top: .147rem solid #10E9F7; /* 箭头颜色 */
}
.queryRewards-preOrder-title .active{
    position: absolute;
    right: .147rem;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-top: none;
    border-left: .147rem solid transparent;
    border-right: .147rem solid transparent;
    border-bottom: .147rem solid #10E9F7; /* 箭头颜色 */
}
.queryRewards-btn{
    width: 2.307rem;
    height: .84rem;
    background: url('../img/queryRewards-btn.png') no-repeat center;
    background-size: 100% 100%;
    margin: .36rem auto 0;
}
.queryRewards-preOrder-input{
    margin-left: .173rem;
}
.winPrize-title{
    width: 3.053rem;
    height: .987rem;
    background: url('../img/css_sprites.png') -18.933rem -9.573rem;
    background-size: 22.16rem 18.053rem;
    margin: .987rem auto 0;
}
.winPrize-main{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    width: 3.2rem;
    height: 2.187rem;
    margin: 1.68rem auto 0;
    background: url('../img/winPrize-bg.png') no-repeat;
    background-size: 100% 100%;
}
.winPrize-main img{
    width: 3rem;
    height: 2rem;
}
.winPrize_code{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.947rem;
    height:.427rem;
    font-size: .267rem;
    background: #C3D7DD;
    border-radius: .2rem;
    margin: .16rem auto 0;
    color: #87989d;
}
.winPrize-dialog{
    display: none;
}
.tips-dialog{
    z-index: 30;
    display: none;
}
.tips-content{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 5.4rem;
    overflow: hidden;
    text-align: center;
    font-family: 'SourceHanSansCN-Medium';
    color: #22252A;
    font-size: .4rem;
}
.other-dialog{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 9.133rem;
    height: 11.52rem;
    background: url('../img/css_sprites.png') -0.133rem -0.133rem;
    background-size: 22.16rem 18.053rem; 
}
.notes-title{
    width: 3.053rem;
    height: .987rem;
    background: url('../img/css_sprites.png') -18.933rem -7.067rem;
    background-size: 22.16rem 18.053rem;
    margin: .987rem auto 0;
}
.notes-content{
    width: 7.76rem;
    height: 7.827rem;
    overflow-y: auto;
    font-family: 'SourceHanSansCN-Medium';
    font-size: .267rem;
    color: #22252A;
    margin: .467rem auto;
    line-height:.587rem;
}
.notes-dialog{
    display: none;
}
.eventBoost-title{
    width: 3.053rem;
    height: .987rem;
    background: url('../img/css_sprites.png') -18.933rem -5.813rem;
    background-size: 22.16rem 18.053rem;
    margin: .987rem auto 0;
}
.eventBoost-list{
    width: 7.267rem;
    overflow: hidden;
    margin: 0 auto;
}
.eventBoost-item{
    display: flex;
    align-items: center;
    width: 7.267rem;
    height: .853rem;
    background: url('../img/css_sprites.png') -9.533rem -9.707rem;
    background-size: 22.16rem 18.053rem;
    margin-top: .267rem;
}
.eventBoost-item span{
    display: flex;
    align-items: center;
    width: 3.013rem;
    height: .547rem;
    margin-left: .573rem;
    font-size: .227rem;
    font-family: 'SourceHanSansCN-Bold';
}
.eventBoost-item i{
    font-family: 'SourceHanSansCN-Medium';
    font-size: .32rem;
    color: #FEFA4C;
    font-style: normal;
    margin-left: .227rem;
}
.eventBoost-item em{
    width: 1.373rem;
    height: .693rem;
    background: url('../img/css_sprites.png') -18.933rem -10.827rem !important;
    background-size: 22.16rem 18.053rem !important; 
    margin-left: .32rem;
}
.eventBoost-item .active{
    background: url('../img/css_sprites.png') -20.573rem -10.827rem !important;
    background-size: 22.16rem 18.053rem !important; 
}
.caution-box{
    display: flex;
    position: absolute;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    bottom: .507rem;
    align-items: center;
    justify-content: center;
    font-size: .24rem;
    color: #22252A;
}
.caution-box img{
    width: .24rem;
    height: .227rem;
    margin-right: .053rem;
}
.eventBoost-dialog{
    display: none;
}
.winList-dialog{
    display: none;
}
.win-tips{
    margin-top: 1.453rem;
    margin-left: .627rem;
    font-size: .4rem;
    color: #22252A;
    box-sizing: content-box;
}
.winList-box{
    display: flex;
    flex-wrap: wrap;
    width: 6.787rem;
    height: 6rem;
    margin:.307rem auto 0;
    overflow-y: auto;
}
.win-item{
    width: 2.947rem;
    height: 2.633rem;
    margin-top: .333rem;
    margin-left: .2rem;
}
.win-item img{
    display: flex;
    width: 2.947rem;
    height: 1.933rem;
}
.winTips-dialog{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.6);
    z-index: 50
}
.winTips-box{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 5.733rem;
    height: 3.16rem;
    background: url('../img/css_sprites.png') -0.133rem -11.92rem;
    background-size: 22.16rem 18.053rem;
}
.winTips-close{
    position: absolute;
    right: -0.44rem;
    top: -0.44rem;
    width: .52rem;
    height: .52rem;
    background: url('../img/css_sprites.png') -20.667rem -12.733rem;
    background-size: 22.16rem 18.053rem;
}
.winTips-box p{
    width: 5rem;
    margin: 1.16rem auto 0;
    color: #22252A;
    font-size: .4rem;
    text-align: center;
    font-family: 'SourceHanSansCN-Medium';
}