#app{max-width:640px;margin:0 auto;z-index:2;min-height:100%;background:#2d1a0c}

#app .download_zone{position:relative}

#app .download_zone .buttons{position:absolute;width:100%;height:100%;display:flex;left:0;top:0}

#app .download_zone .buttons a{width:100%;overflow:hidden;text-indent:-999em;font-size:0;cursor:pointer}

#window{width:100vw;height:100vh;position:fixed;z-index:999;left:0;top:0;max-height:0;overflow:hidden}

#window .bg{width:100vw;height:100vh;position:relative;background:#000;opacity:0;transition:all .6s}

#window .box{position:absolute;width:100vw;height:100vh;left:0;top:40px;opacity:0;transition:all .6s}

#window .content{max-width:640px;height:100vh;margin:0 auto;display:flex;flex-direction:column;justify-content:center}

#window .img_box{margin:0 auto;position:relative}

#window .xr_button{height:30vw;position:absolute;left:0;bottom:0;display:block;width:100%}

#window.show{max-height:100vh}

#window.show .bg{opacity:.6}

#window.show .box{opacity:1;top:0}



#app #xr_back{display:block;width:20vw;height:100%;position:absolute;display:block;left:0;top:0}

#app .top{position:relative}

#trust{position:absolute;left:0;width:100vw;display:none;background:rgba(0,0,0,.6);z-index:11111}

#app .slider{position:relative}

#app #slider{position:absolute;left:0;top:0;z-index:999;width:100vw}

#certify{position:relative;width:100%;margin:0 auto}

#certify .swiper-slide{width:170px;text-align:center}

#certify .swiper-slide img{display:block;margin:0 auto}

#cs{position:fixed;right:10px;bottom:15%;display:block;cursor:pointer;width:24vw;z-index:999}

#app .slider.contentBanner{position:absolute;bottom:0vw;left:5%;width:91%}

#app .download_zone .bg{display: flex;padding: 10px 0}

#app .download_zone .bg a{padding: 10px;animation:toggleSize .4s infinite}

#app .download_zone .bg a:last-child {animation-delay: .2s}

#app .download_zone.and_show .bg a{width:20rem;margin: 0 auto;;padding-bottom: 0}

#app .download_zone.ios_show .bg a{width:20rem;margin: 0 auto;;padding-bottom: 0}



#app .cesu {padding-top: 10px;background: linear-gradient(to bottom,#2D1A0C,#1A100F);padding-bottom: 20px}

#app .cesu .list{margin:0 2vw;padding-top:10px}

#app .cesu .list dl{display:flex;justify-content:space-between;padding:6px 0}

#app .cesu .list dl dt{background:#a70503;color:#fff;font-size:14px;height:30px;line-height:30px;width:18vw;text-align:center;flex-shrink:0;border:red 1px solid;border-right:none}

#app .cesu .list dl dd{flex-grow:1}

#app .cesu .list dl dd.btns{flex-grow:0;flex-shrink:0;width:22vw;padding-left:14px}

#app .cesu .list dl dd.btns button{height:30px;line-height:30px;display:block;width:100%;background:red;border-radius:6px;color:#fff;border-bottom:#a70503 3px solid}

#app .cesu .list dl dt+dd{background:#e8e8e8;line-height:30px;position:relative}

#app .cesu .list dl dt+dd cite{position:absolute;left:0;top:0;font-size:10px;background:#d6d6d6;color:#666;height:14px;line-height:14px;font-style:normal;padding:0 4px}

#app .cesu .list dl dt+dd span{display:block;padding-left:40px;font-size:14px}

#app .cesu .list dl dt+dd span b{color:red;font-weight:400}

#xrBox{display: none;opacity:0;position:fixed;left:0;top:0;width:100%;height:100vh;overflow-y:auto;z-index:-9999;transition:none;touch-action:pan-y;}

#xrBox.show{z-index:9999999;visibility:visible;opacity:1;transition:all 1.3s;display: block;}

#xrBox .close{width:100%;height:14vw;left:0;top:0;cursor:pointer;position:absolute}

#xrBox .install{width:100%;height:24vw;left:0;bottom:0;cursor:pointer;position:fixed}

#open_safari{position: fixed;background: rgba(0,0,0,.7);color:#fff;width: 100%;height: 100%;left: 0;top: 0;z-index: 999;display: none}

#open_safari .w640{padding: 30px;}

#open_safari a#copyBtn{max-width: 30vw;display: block;margin: 10px auto}

#open_safari .safari_info{max-width: 70vw;margin: 20px auto;}

  

.ios_mask {

    width: 100%;

    height: 100%;

    position: fixed;

    background: rgba(0, 0, 0, 0.9);

    top: 0;

    left: 0;

    text-align: center;

    display: none;

    z-index: 1000;

}



.ios_mask img {

    position: absolute;

    top: 32rem;

    left: 3rem;

    width: 20rem;

    height: 5rem;

    transform-origin: center 0.9rem;

    animation: iosWobble 1s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;

    -moz-animation: iosWobble 1s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;

    -webkit-animation: iosWobble 1s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;

}



.ios_mask button {

    width: 16rem;

    height: 3.5rem;

    font-weight: bold;

    border: 1px #fff solid;

    border-radius: 2rem;

    text-align: center;

    background: #ffffff;

    line-height: 0.94rem;

    font-size: 1.2rem;

    color: #007aff;

    box-shadow: 0px 0px 7px 2px #007fff;

    position: absolute;

    bottom: 3rem;

    left: 50%;

    transform: translateX(-50%);

}



@media screen and (device-height: 736px) {

    .ios_mask img {

        top: 8rem;

    }

    .ios_mask button {

        bottom: 0.6rem;

    }

}



@media screen and (device-height: 667px) {

    .ios_mask img {

        top: 28rem

    }

    .ios_mask button {

        bottom: 1.6rem;

    }

}





@keyframes iosWobble {

    0% {

        transform: rotate(0deg);

    }

    10% {

        transform: rotate(5deg);

    }

    20% {

        transform: rotate(10deg);

    }

    30% {

        transform: rotate(5deg);

    }

    40% {

        transform: rotate(0deg);

    }

    50% {

        transform: rotate(0deg);

    }

    60% {

        transform: rotate(0deg);

    }

    70% {

        transform: rotate(-5deg);

    }

    80% {

        transform: rotate(-10deg);

    }

    90% {

        transform: rotate(-5deg);

    }

    100% {

        transform: rotate(0deg);

    }

}

/* .btn{

    display: none;

}

.btn1{

    display: none;

    text-align: center;

    padding: 3% 0;

}

.btn1 img{

    width: 46%;

} */