a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline;
    outline:none;
    box-sizing:border-box
}
button,input,select,textarea{
    box-sizing:border-box
}
html{
    height:100%
}
body{
    font-size:62.5%;
    line-height:1;
    font-family:Arial,Tahoma,sans-serif
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
    display:block
}
ol,ul{
    list-style:none
}
blockquote,q{
    quotes:none
}
blockquote:after,blockquote:before,q:after,q:before{
    content:"";
    content:none
}
strong{
    font-weight:700
}
table{
    border-collapse:collapse;
    border-spacing:0
}
img{
    border:0;
    max-width:100%
}
.clearfix:after,.clearfix:before{
    content:"";
    display:table
}
.clearfix:after{
    clear:both
}
.clearfix{
    *zoom:1
}
body{
    font-size:14px;
    line-height:1.5;
    color:#646464;
    font-family:"微软雅黑","宋体",Arial,Verdana,Geneva,Helvetica,sans-serif
}
input,textarea{
    margin:0;
    padding:0
}
button,input:focus,textarea:focus{
    outline:none
}
button,input,select,table,tbody,td,textarea,th,tr{
    vertical-align:middle
}
a{
    color:#646464;
    outline:none
}
a,a:active,a:hover{
    text-decoration:none
}
a:active{
    star:expression(this.onFocus=this.blur())
}
a:hover{
    text-decoration:none
}
p{
    text-indent:0
}
h1,h2,h3,h4,h5,h6{
    font-weight:400
}
i{
    font-style:normal
}
input[type=button],input[type=reset],input[type=submit],input[type=text],textarea{
    -webkit-appearance:none
}
/*
a,a:active,a:focus,a:hover,a:link,a:visited{
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    -webkit-tap-highlight-color:transparent;
    outline:none;
    background:none;
    text-decoration:none
}
*/
body,html{
    height:100%;
    min-height:100vh;
    background-color:#fff
}
.root,.width{
    max-width:720px;
    margin-left:auto;
    margin-right:auto
}
@media (orientation:landscape){
    .root,.width{
        max-width:100%
    }
}
@media screen and (min-width:960px){
    .root,.width{
        max-width:720px;
        margin-left:auto;
        margin-right:auto
    }
}
.safeareatest{
    position:fixed;
    z-index:-1;
    top:0;
    bottom:0;
    left:0;
    padding-top:env(safe-area-inset-top);
    padding-bottom:env(safe-area-inset-bottom)
}
.dialog{
    z-index:10001;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all .25s
}
.dialog,.dialog-mask{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.dialog-mask{
    z-index:10002;
    background-color:#000;
    opacity:.5
}
.dialog-content{
    position:relative;
    z-index:10003
}
.dialog-toast{
    background-color:rgba(0,0,0,.75);
    padding:15px 20px;
    border-radius:4px;
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    -webkit-animation-name:fade-in;
    animation-name:fade-in;
    -webkit-animation-duration:.25s;
    animation-duration:.25s;
    -webkit-animation-fill-mode:forwards;
    animation-fill-mode:forwards
}
.dialog-toast .toast-icon{
    font-size:32px
}
.dialog-toast .toast-text{
    font-size:16px
}
.dialog-toast .toast-text:nth-child(2){
    margin-top:5px
}
.dialog-modal{
    border-radius:8px;
    min-width:70vw;
    max-width:80vw;
    display:flex;
    flex-direction:column;
    background-color:#fff;
    overflow:hidden;
    transition:all .25s
}
.dialog-modal .modal-body{
    margin-top:-20px;
    max-height:50vh;
    overflow-y:scroll;
    padding-top:20px;
    text-align:center;
    -webkit-overflow-scrolling:touch;
    padding-bottom:20px
}
.dialog-modal .modal-title{
    font-size:18px;
    color:#000;
    margin-top:20px;
    text-align:center
}
.dialog-modal .modal-content{
    margin-top:20px;
    color:#333;
    font-size:15px;
    padding:0 .3rem
}
.dialog-modal .modal-content .sign-record-desc,.dialog-modal .modal-content .voucher-pop-desc{
    text-align:left
}
.dialog-modal .modal-content .sign-record-desc span{
    color:#ffc000
}
.dialog-modal .modal-btns{
    border-top:1px solid #eee;
    display:flex
}
.dialog-modal .modal-btn{
    flex:1 1;
    padding:12.5px;
    display:flex;
    justify-content:center;
    font-size:18px;
    color:#000;
    border-left:1px solid #eee
}
.dialog-modal .modal-btn:first-child{
    border-left:none
}
.dialog-modal .modal-btn.success{
    color:#108ee9
}
.dialog-modal .modal-btns.column{
    flex-direction:column
}
.dialog-modal .modal-btns.column .modal-btn{
    flex:1 1;
    padding:10px;
    display:flex;
    justify-content:center;
    font-size:16px;
    color:#333;
    border-left:none;
    border-top:1px solid #eee
}
.dialog-modal .modal-btns.column .modal-btn:first-child{
    border-top:none
}
.dialog.enter{
    opacity:0
}
.dialog.enter .dialog-modal{
    -webkit-transform:scale(1.25);
    transform:scale(1.25)
}
.dialog.enter-active,.dialog.enter-done,.dialog.exit{
    opacity:1
}
.dialog.enter-active .dialog-modal,.dialog.enter-done .dialog-modal,.dialog.exit .dialog-modal{
    -webkit-transform:scale(1);
    transform:scale(1)
}
.dialog.exit-active{
    opacity:0
}
.dialog.exit-active .dialog-modal{
    -webkit-transform:scale(1.25);
    transform:scale(1.25)
}
.activity-tips{
    position:fixed;
    z-index:777;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background-color:rgba(0,0,0,.75);
    transition:all .25s
}
.activity-tips img{
    display:block;
    max-width:75vw;
    max-height:75vh
}
.desktop-tips{
    z-index:777;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-end;
    transition:all .25s;
    width:100%;
    max-width:720px;
    margin:0 auto
}
.desktop-tips,.desktop-tips:before{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.desktop-tips:before{
    content:"";
    display:block;
    z-index:888;
    background-color:rgba(0,0,0,.7)
}
.desktop-tips .container{
    z-index:999;
    color:#fff
}
.desktop-tips .container .entity{
    position:relative;
    z-index:666;
    background-color:#fff;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    display:flex;
    flex-direction:column;
    padding:20px 35px env(safe-area-inset-bottom);
    transition:all .25s;
    max-width:720px;
    margin:0 auto;
    width:100%;
    max-width:100vw;
    height:9.4rem
}
.desktop-tips .container .entity>img{
    display:block;
    width:100%
}
.desktop-tips .container .entity .top{
    display:flex;
    padding-bottom:10px
}
.desktop-tips .container .entity .top .icon{
    flex-shrink:0;
    width:1.1rem;
    height:1.1rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    margin-right:10px
}
.desktop-tips .container .entity .top .icon img{
    border-radius:8px
}
.desktop-tips .container .entity .top .text{
    display:flex;
    width:3.5rem;
    align-items:center
}
.desktop-tips .container .entity .body{
    width:100%;
    padding:10px 1.1rem;
    overflow:hidden;
    background-color:#fff;
    display:flex;
    align-items:center
}
.desktop-tips .container .entity .body .icon{
    width:40px;
    height:40px;
    overflow:hidden;
    border-radius:8px;
    margin-right:7.5px
}
.desktop-tips .container .entity .body .icon img{
    display:block;
    width:100%;
    height:100%
}
.desktop-tips .container .entity .body .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:center;
    color:#000
}
.desktop-tips .container .entity .body .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#333;
    font-size:.22rem
}
.desktop-tips .container .entity .body .url{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:13px;
    color:#666;
    margin-top:5px;
    font-size:.22rem
}
.desktop-tips .container .entity .end-new{
    display:flex;
    padding-bottom:10px;
    color:#282828
}
.desktop-tips .container .entity .end-new .icon{
    flex-shrink:0;
    width:.87rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    margin-right:10px
}
.desktop-tips .container .entity .end-new .text{
    padding-top:.3rem;
    font-size:.22rem
}
.desktop-tips .container .entity .end-new .text span{
    color:#54c5cd
}
@media screen and (min-height:668px){
    .desktop-tips .container .entity{
        width:100%
    }
    .desktop-tips .container .entity .body{
        padding:10px 1.1rem
    }
}
.desktop-tips .container .end{
    font-size:15px;
    margin-top:7.5px;
    font-weight:700
}
.desktop-tips .container .end span{
    color:#ffc000
}
.pull-to-refresh{
    padding:10px;
    color:#ccc;
    text-align:center;
    position:absolute;
    top:0;
    left:0;
    right:0;
    -webkit-transform:translateY(-200%);
    transform:translateY(-200%)
}
.pull-to-refresh:before{
    content:"释放刷新"
}
.pull-to-load{
    padding:10px;
    color:#ccc;
    text-align:center
}
.pull-to-load:before{
    content:"拉下加载更多"
}
.pull-to-load.nomore:before{
    content:"没有更多的数据了"
}
.screen-index{
    padding-bottom:env(safe-area-inset-bottom);
    background-color:#fff;
    transition:all .5s;
    display:none
}
.screen-index.active{
    display:block
}
.screen-index .screen-body{
    padding-bottom:55px;
    position:relative
}
.screen-index .screen-body-item{
    position:relative;
    display:none
}
.screen-index .screen-body-item.active{
    display:block
}
.screen-index .screen-menu{
    position:fixed;
    z-index:100;
    bottom:0;
    left:0;
    right:0;
    padding-bottom:env(safe-area-inset-bottom);
    background-color:#fff;
    border-top:1px solid #eee;
    padding-top:4px;
    transition:all .25s
}
.screen-index .screen-menu-container{
    height:50px;
    display:flex;
    flex-wrap:wrap;
    align-items:center
}
.screen-index .screen-menu-item{
    flex:1 1;
    flex-shrink:0;
    text-align:center;
    padding:5px;
    font-size:12px;
    display:flex;
    flex-direction:column;
    transition:all .25s
}
.screen-index .screen-menu-item .icon{
    margin-bottom:2.5px;
    display:none;
    height:19.5px;
    background:50% no-repeat;
    background-size:contain
}
.screen-index .screen-menu-item .icon-dark{
    display:block
}
.screen-index .screen-menu-item.active{
    color:#f5842d
}
.screen-index .screen-menu-item.active .icon-dark{
    display:none
}
.screen-index .screen-menu-item.active .icon-highlight{
    display:block
}
.theme-dark .screen-index,.theme-dark .screen-menu{
    background-color:#000
}
.theme-dark .screen-menu-item{
    color:#fff
}
.theme-dark .screen-menu-item .icon-dark{
    display:none
}
.theme-dark .screen-menu-item .icon-white{
    display:block
}
.theme-dark .screen-menu-item.active .icon-white{
    display:none
}
.theme-dark .screen-menu-item.active .icon-highlight{
    display:block
}
.nav-view{
    min-height:100vh;
    background-color:#fff;
    display:none
}
.nav-view.active{
    display:block
}
.nav-view-head{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:200;
    background-color:#fff;
    border-bottom:1px solid #eee;
    transition:all .1s;
    padding-top:env(safe-area-inset-top)
}
.nav-view-head .dark{
    color:#666
}
.nav-view-head .container{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-around;
    padding:0 12.5px;
    height:39px;
    overflow:hidden
}
.nav-view-head .back{
    font-size:18px
}
.nav-view-head .title{
    flex:1 1;
    width:0;
    text-align:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.36rem;
    color:#282828;
    padding:0 10px
}
.nav-view-head .operate{
    font-size:15px;
    display:flex;
    justify-content:flex-end
}
.nav-view-head .operate .anticon{
    font-size:18px
}
.nav-view-body{
    padding-top:calc(env(safe-area-inset-top) + 40px);
    position:relative;
    min-height:100vh
}
.nav-view.invasion .nav-view-head{
    background-color:transparent;
    color:#fff;
    border-bottom:none
}
.nav-view.invasion .nav-view-head.dark{
    color:#666
}
.nav-view.invasion .nav-view-head.bright,.nav-view.invasion .nav-view-head .operate,.nav-view.invasion .nav-view-head .operate a,.nav-view.invasion .nav-view-head .title{
    color:#fff
}
.nav-view.invasion .nav-view-head.darklogin{
    color:#666
}
.nav-view.invasion .nav-view-head.darklogin .title{
    color:#282828
}
.nav-view.invasion .nav-view-head.darklogin .operate,.nav-view.invasion .nav-view-head.darklogin .operate a{
    color:#666
}
.nav-view.invasion .nav-view-head.darkreagein{
    color:#666;
    border-bottom:1px solid #eee
}
.nav-view.invasion .nav-view-head.darkreagein .title{
    color:#282828
}
.nav-view.invasion .nav-view-head.darkreagein .operate,.nav-view.invasion .nav-view-head.darkreagein .operate a{
    color:#666
}
.nav-view.invasion .nav-view-body{
    padding-top:0
}
.nav-view-roam-screen{
    background-color:#000
}
.user-phone-verify{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    z-index:999;
    background-color:rgba(0,0,0,.75)
}
.user-phone-verify,.user-phone-verify .entity{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transition:all .25s;
    opacity:0
}
.user-phone-verify .entity{
    width:80%;
    -webkit-transform:scale(1.25);
    transform:scale(1.25)
}
.user-phone-verify.appear-active,.user-phone-verify.appear-done,.user-phone-verify.enter-done{
    opacity:1
}
.user-phone-verify.appear-active .entity,.user-phone-verify.appear-done .entity,.user-phone-verify.enter-done .entity{
    opacity:1;
    -webkit-transform:scale(1);
    transform:scale(1)
}
.user-phone-verify.exit-active{
    opacity:0
}
.user-phone-verify.exit-active .entity{
    opacity:0;
    -webkit-transform:scale(1.25);
    transform:scale(1.25)
}
.user-phone-verify .container{
    background-color:#fff;
    border-radius:8px
}
.user-phone-verify .body{
    padding:20px;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.user-phone-verify .icon{
    color:#6495ed;
    font-size:48px
}
.user-phone-verify .title{
    font-weight:700;
    color:#000;
    font-size:.32rem;
    text-align:center;
    padding:7.5px
}
.user-phone-verify .desc{
    font-size:13px;
    text-align:center;
    margin-top:10px
}
.user-phone-verify .input{
    margin-top:15px;
    display:flex;
    border:1px solid #ccc;
    padding:5px;
    border-radius:8px
}
.user-phone-verify .input input{
    flex:1 1;
    background:none;
    border:none
}
.user-phone-verify .input .btn{
    background-color:#ffc000;
    padding:2.5px 5px;
    color:#fff;
    border-radius:10px;
    font-size:13px
}
.user-phone-verify .input .btn.disable{
    background-color:#ccc
}
.user-phone-verify .submit{
    border-top:1px solid #ccc;
    color:#ffc000;
    font-size:.28rem;
    padding:7.5px
}
.user-phone-verify .close,.user-phone-verify .submit{
    display:flex;
    align-items:center;
    justify-content:center
}
.user-phone-verify .close{
    border:2px solid #ccc;
    border-radius:50%;
    width:25px;
    height:25px;
    color:#fff;
    flex-direction:column;
    margin-top:15px
}
.image-picker{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap
}
.image-picker .item{
    position:relative;
    width:30%;
    padding-top:25%;
    margin:10px 10px 0 0
}
.image-picker .item-file .img{
    position:absolute;
    z-index:11;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.image-picker .item-file .img img{
    display:block;
    width:100%;
    height:100%
}
.image-picker .item-file .icon{
    position:absolute;
    z-index:22;
    top:5px;
    right:5px;
    color:#fff;
    border:1px solid #fff;
    width:20px;
    height:20px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%
}
.image-picker .item-input{
    border:1px solid #ccc
}
.image-picker .item-input .icon{
    z-index:11;
    font-size:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#ccc
}
.image-picker .item-input .icon,.image-picker .item-input input{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%
}
.image-picker .item-input input{
    display:block;
    z-index:22;
    opacity:0
}
.game-trumpet-index{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.game-trumpet-index .trumpet-site{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.game-trumpet-index .trumpet-site .trumpet-main{
    background:#fff;
    width:75%;
    text-align:center;
    padding:20px;
    border-radius:8px
}
.game-trumpet-index .trumpet-site .trumpet-main .close{
    text-align:right
}
.game-trumpet-index .trumpet-site .trumpet-main .close img{
    width:20px
}
.game-trumpet-index .trumpet-site .trumpet-main .trumpet-title{
    padding-bottom:10px;
    font-size:22px
}
.game-trumpet-index .trumpet-site .trumpet-main .info{
    font-size:16px;
    color:#282828;
    padding-bottom:10px
}
.game-trumpet-index .trumpet-site .trumpet-main .trumpet-btn,.game-trumpet-index .trumpet-site .trumpet-main .trumpet-btn .item{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px
}
.game-trumpet-index .trumpet-site .trumpet-main .trumpet-btn .item{
    flex:1 1;
    flex-direction:column;
    color:#333;
    font-size:16px;
    transition:all .25s;
    border-radius:30px
}
.game-trumpet-index .trumpet-site .trumpet-main .trumpet-btn .btn-about{
    border:1px solid;
    margin-right:15px
}
.game-trumpet-index .trumpet-site .trumpet-main .trumpet-btn .btn-confirm{
    background-color:#ffc000;
    color:#fff
}
.index-index{
    position:relative;
    overflow:hidden
}
.index .index-head{
    position:fixed;
    z-index:100;
    top:0;
    left:0;
    right:0;
    padding-top:env(safe-area-inset-top)
}
.index .index-head .background{
    position:absolute;
    z-index:1;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#fff;
    transition:all .1s;
    border-bottom:1px solid #ededed
}
.index .index-head .container{
    position:relative;
    z-index:2;
    height:40px;
    display:flex;
    align-items:center
}
.index .index-head .container .menu-list{
    margin:auto 10px;
    padding:7px 0;
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex;
    align-items:center;
    width:75%
}
.index .index-head .container .menu-list::-webkit-scrollbar{
    display:none
}
.index .index-head .item{
    margin:0 10px;
    font-size:15px;
    color:#fff;
    transition:all .1s;
    position:relative;
    font-weight:700
}
.index .index-head .item .index-nav-pic{
    height:18px;
    display:flex;
    flex-direction:column;
    flex-wrap:nowrap;
    align-content:center;
    justify-content:center;
    align-items:center;
    width:unset;
    max-width:none
}
.index .index-head .item.active{
    font-weight:700;
    font-size:19px
}
.index .index-head .item.active .index-nav-pic{
    height:22px
}
.index .index-head .item.badge-new:before{
    content:"new";
    display:block;
    position:absolute;
    top:0;
    right:0;
    -webkit-transform:translate(50%,-65%);
    transform:translate(50%,-65%);
    color:#fff;
    font-size:10px;
    background-color:red;
    border-radius:2px;
    line-height:1.15;
    padding:0 2.5px
}
.index .index-head .item:first-child{
    margin-left:15px
}
.index .index-head .item.item-opacity{
    color:#282828
}
.index .index-head .operate{
    position:absolute;
    padding:10px;
    right:0;
    top:50%;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    color:#fff;
    font-size:20px;
    letter-spacing:3px;
    display:flex;
    align-items:center
}
.index .index-head .anticon{
    font-size:22px
}
.index .index-head .whiteSearch .anticon{
    color:#fff
}
.index .index-head .searchOperates .anticon{
    color:#282828
}
.index .index-head .index-header-custom{
    margin-right:10px
}
.index .index-head .index-header-custom img{
    width:20px
}
.index .index-head .whiteService .white{
    display:block
}
.index .index-head .serviceOperates .white,.index .index-head .whiteService .black{
    display:none
}
.index .index-head .serviceOperates .black{
    display:block
}
.index .index-head .index-header-search{
    display:flex;
    align-items:center
}
.index .index-head .index-header-search img{
    width:22px
}
.index .index-head .searchOperates .white{
    display:none
}
.index .index-head .searchOperates .black{
    display:block
}
.index .index-body{
    margin-top:40px;
    position:relative
}
.index .index-body-item{
    display:none
}
.index .index-body-item.active{
    display:block
}
.index .index-new{
    position:relative;
    background:#f5f6f8
}
.index .index-new .new-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    height:85px;
    background-color:#fff;
    display:flex;
    align-items:center;
    justify-content:center
}
.index .index-new .new-head .item{
    width:33.333%;
    position:relative;
    padding-bottom:5px
}
.index .index-new .new-head .item:before{
    content:"";
    display:block;
    width:25px;
    height:2.5px;
    border-radius:2.5px;
    background-color:#fff;
    position:absolute;
    bottom:0;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    transition:all .25s
}
.index .index-new .new-head .item.active:before{
    background-color:#ffc000
}
.index .index-new .new-head .item .icon{
    height:35px;
    background:50% no-repeat;
    background-size:contain;
    margin-bottom:2.5px
}
.index .index-new .new-head .item .text{
    text-align:center;
    font-size:15px;
    color:#282828
}
.index .index-new .new-body{
    margin-top:calc(env(safe-area-inset-top) + 125px);
    position:relative
}
.index .index-new .new-body-item{
    display:none
}
.index .index-new .new-body-item.active{
    display:block
}
.index .index-new .new-today{
    padding:.2rem
}
.index .index-new .new-today dl{
    margin-bottom:.28rem
}
.index .index-new .new-today dl dt{
    margin-bottom:.2rem;
    font-size:.3rem;
    font-weight:700;
    color:#000
}
.index .index-new .new-today-item{
    margin-bottom:.3rem;
    display:flex;
    align-items:center;
    background:#fff;
    border-radius:8px;
    padding:.2rem
}
.index .index-new .new-today-item .icon{
    position:relative;
    overflow:hidden;
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.index .index-new .new-today-item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.index .index-new .new-today-item .icon .discount{
    position:absolute;
    top:0;
    right:0;
    background-color:red;
    color:#fff;
    font-size:10px;
    padding:2.5px 5px;
    line-height:1.25;
    border-bottom-left-radius:8px
}
.index .index-new .new-today-item .subject{
    flex:1 1;
    width:0;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.index .index-new .new-today-item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column;
    position:relative
}
.index .index-new .new-today-item .name{
    font-weight:700;
    font-size:.3rem;
    color:#282828;
    display:flex;
    align-items:center
}
.index .index-new .new-today-item .name .named{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index .index-new .new-today-item .name .named span{
    padding:0 .1rem;
    color:#956528;
    background:#eebe75;
    font-size:.24rem;
    margin-right:2px;
    border-radius:3px;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd)
}
.index .index-new .new-today-item .name .time{
    padding:0 2.5px;
    display:flex;
    align-items:center;
    font-size:12px
}
.index .index-new .new-today-item .name .time span{
    color:#fff;
    background-color:#ff1493;
    border-radius:4px;
    padding:0 2.5px
}
.index .index-new .new-today-item .name .time i{
    color:#ff1493;
    padding:0 2.5px
}
.index .index-new .new-today-item .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index .index-new .new-today-item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#666;
    margin-bottom:.05rem
}
.index .index-new .new-today-item .info3{
    margin-top:.065rem;
    border-radius:3px
}
.index .index-new .new-today-item .info3 .first-text{
    padding:1px 3px;
    color:#fff;
    border-radius:3px
}
.index .index-new .new-today-item .info3 .second-text{
    border:1px solid;
    padding:0 .1rem;
    border-left:0;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px;
    margin-left:-1px
}
.index .index-new .new-today-item .tag{
    display:inline-block;
    padding-left:5px;
    color:#fab72b
}
.index .index-new .new-today-item .discount{
    position:absolute;
    top:0;
    right:-10px;
    color:#fff;
    font-size:10px;
    padding:5px;
    line-height:1.25;
    width:50px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.index .index-new .new-today-item .discount span{
    font-size:15px
}
.index .index-new .new-today-item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.index .index-new .new-today-item .tag:nth-child(2){
    color:#75d100
}
.index .index-new .new-today-item .tag:nth-child(3){
    color:#2893ff
}
.index .index-new .new-today-item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.index .index-new .new-week{
    padding:.3rem .3rem 0
}
.index .index-new .new-week-item{
    margin-bottom:.3rem;
    display:flex;
    align-items:center;
    position:relative;
    background:#fff;
    padding:.2rem;
    border-radius:8px
}
.index .index-new .new-week-item .index{
    width:25px;
    margin-right:5px;
    position:absolute;
    top:0;
    left:0
}
.index .index-new .new-week-item .icon,.index .index-new .new-week-item .index{
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.index .index-new .new-week-item .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem
}
.index .index-new .new-week-item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.index .index-new .new-week-item .subject{
    flex:1 1;
    width:0;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.index .index-new .new-week-item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column;
    position:relative
}
.index .index-new .new-week-item .text .discount{
    position:absolute;
    top:0;
    right:-10px;
    color:#fff;
    font-size:10px;
    padding:5px;
    line-height:1.25;
    width:50px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.index .index-new .new-week-item .text .discount span{
    font-size:15px
}
.index .index-new .new-week-item .name{
    font-weight:700;
    overflow:hidden;
    font-size:.3rem;
    color:#282828
}
.index .index-new .new-week-item .name span{
    padding:0 .1rem;
    color:#956528;
    background:#eebe75;
    font-size:.24rem;
    margin-right:2px;
    border-radius:3px;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd)
}
.index .index-new .new-week-item .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index .index-new .new-week-item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#ff5e00
}
.index .index-new .new-week-item .info3{
    border-radius:3px;
    font-size:.22rem
}
.index .index-new .new-week-item .info3 .first-text{
    padding:1px 3px;
    color:#fff;
    border-radius:3px
}
.index .index-new .new-week-item .info3 .second-text{
    border:1px solid;
    padding:0 .1rem;
    border-left:0;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px;
    margin-left:-1px
}
.index .index-new .new-week-item .tag{
    display:inline-block;
    padding-left:5px
}
.index .index-new .new-week-item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.index .index-new .new-week-item .tag:nth-child(2){
    color:#75d100
}
.index .index-new .new-week-item .tag:nth-child(3){
    color:#2893ff
}
.index .index-new .new-week-item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.index .index-new .new-reserve{
    padding:.2rem .3rem
}
.index .index-new .new-reserve-item{
    display:block;
    margin-bottom:.3rem;
    overflow:hidden;
    background:#fff;
    padding:.2rem;
    border-radius:8px
}
.index .index-new .new-reserve-item .subject{
    display:flex;
    align-items:center
}
.index .index-new .new-reserve-item .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.2rem;
    height:1.2rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.index .index-new .new-reserve-item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.index .index-new .new-reserve-item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column
}
.index .index-new .new-reserve-item .name{
    display:flex;
    align-items:center
}
.index .index-new .new-reserve-item .name .named{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-weight:700;
    font-size:.3rem;
    color:#282828
}
.index .index-new .new-reserve-item .name .date{
    margin:0 3.5px;
    padding:0 3.5px;
    color:#fff;
    background-color:#ff1493;
    border-radius:4px;
    font-size:12px;
    font-weight:400;
    white-space:nowrap
}
.index .index-new .new-reserve-item .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    display:flex;
    align-items:center
}
.index .index-new .new-reserve-item .reserve{
    margin:0 5px;
    color:red;
    font-weight:700
}
.index .index-new .new-reserve-item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#ff5e00
}
.index .index-new .new-reserve-item .tag{
    display:inline-block;
    padding-left:5px;
    color:#fab72b
}
.index .index-new .new-reserve-item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.index .index-new .new-reserve-item .tag:nth-child(2){
    color:#75d100
}
.index .index-new .new-reserve-item .tag:nth-child(3){
    color:#2893ff
}
.index .index-new .new-reserve-item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.index .index-new .new-reserve-item .medias{
    margin-top:.15rem;
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex;
    margin-left:-.2rem
}
.index .index-new .new-reserve-item .media{
    flex-shrink:0;
    width:25%;
    padding-left:.2rem;
    position:relative
}
.index .index-new .new-reserve-item .media:last-child{
    margin-right:0
}
.index .index-new .new-reserve-item .media .container{
    position:relative
}
.index .index-new .new-reserve-item .media img{
    width:100%;
    border-radius:8px
}
.index .index-new .new-reserve-item .media .play{
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    color:#fff;
    font-size:32px
}
.index .index-new .new-reserve-my-reserved{
    position:fixed;
    bottom:13%;
    right:0;
    padding:2px 10px;
    background:red;
    color:#fff;
    border-top-left-radius:15px;
    border-bottom-left-radius:15px
}
.index .index-indexrank{
    position:relative;
    background:#f5f6f8
}
.index .index-indexrank .indexrank-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    height:50px;
    background-color:#f5f6f8;
    display:flex;
    align-items:center;
    padding-left:5px
}
.index .index-indexrank .indexrank-head .item{
    position:relative;
    margin:0 10px
}
.index .index-indexrank .indexrank-head .item .bl{
    width:18px;
    position:absolute;
    left:30%;
    bottom:25%;
    display:none
}
.index .index-indexrank .indexrank-head .item.active .bl{
    display:block
}
.index .index-indexrank .indexrank-head .item .text{
    text-align:center;
    font-size:15px
}
.index .index-indexrank .indexrank-body{
    margin-top:calc(env(safe-area-inset-top) + 90px);
    position:relative
}
.index .index-indexrank .indexrank-body .indexrank-body-item{
    display:none
}
.index .index-indexrank .indexrank-body .indexrank-body-item.active{
    display:block
}
.index .index-indexrank .indexrank-body .indexrank-body-item .index-indexrank{
    position:relative;
    background:#f5f6f8
}
.index .index-indexrank .game-hot{
    padding:0 .3rem
}
.index .index-indexrank .game-hot-top{
    width:95%;
    margin-left:auto;
    margin-right:auto;
    margin-top:10px;
    padding-bottom:10px;
    background:top no-repeat;
    background-size:100% auto;
    display:flex
}
.index .index-indexrank .game-hot-top-item{
    padding:10px;
    flex:1 1;
    width:33.333%;
    display:flex;
    flex-direction:column;
    align-items:center
}
.index .index-indexrank .game-hot-top-item .icon{
    flex-shrink:0;
    width:80px;
    height:80px;
    margin-top:20px;
    padding:7.5px 20px 0;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    margin-bottom:2.5px;
    background:50% no-repeat;
    background-size:contain
}
.index .index-indexrank .game-hot-top-item .icon img{
    display:block;
    max-width:100%;
    max-height:100%;
    border-radius:50%
}
.index .index-indexrank .game-hot-top-item:nth-child(2) .icon{
    width:100px;
    height:100px;
    margin-top:0;
    padding:10px 25px 0
}
.index .index-indexrank .game-hot-top-item .name{
    width:100%;
    color:#000;
    font-size:14px;
    font-weight:700;
    text-align:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index .index-indexrank .game-hot-top-item .info{
    color:#ccc;
    text-align:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:14px;
    padding:2.5px 0
}
.index .index-indexrank .game-hot-top-item .btn{
    color:#fff;
    background-color:#fe8900;
    border-radius:4px;
    padding:3.5px 7.5px;
    font-size:12px
}
.index .index-indexrank .game-hot-list-item{
    margin-bottom:.3rem;
    display:flex;
    align-items:center;
    background:#fff;
    padding:.2rem;
    border-radius:8px
}
.index .index-indexrank .game-hot-list-item .index{
    width:25px;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    margin-right:5px
}
.index .index-indexrank .game-hot-list-item .icon{
    position:relative;
    overflow:hidden;
    border-radius:8px;
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.index .index-indexrank .game-hot-list-item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.index .index-indexrank .game-hot-list-item .icon .discount{
    position:absolute;
    top:0;
    right:0;
    background-color:red;
    color:#fff;
    font-size:10px;
    padding:2.5px 5px;
    line-height:1.25;
    border-bottom-left-radius:8px
}
.index .index-indexrank .game-hot-list-item .subject{
    flex:1 1;
    width:0;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    position:relative
}
.index .index-indexrank .game-hot-list-item .text{
    flex:1 1;
    width:0;
    font-size:.2rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column
}
.index .index-indexrank .game-hot-list-item .name{
    font-weight:700;
    overflow:hidden;
    font-size:.3rem;
    color:#282828
}
.index .index-indexrank .game-hot-list-item .name span{
    padding:0 .1rem;
    color:#956528;
    background:#eebe75;
    font-size:.24rem;
    margin-right:2px;
    border-radius:3px;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd)
}
.index .index-indexrank .game-hot-list-item .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index .index-indexrank .game-hot-list-item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.22rem;
    color:#666
}
.index .index-indexrank .game-hot-list-item .info3{
    border-radius:3px;
    font-size:.22rem
}
.index .index-indexrank .game-hot-list-item .info3 .first-text{
    padding:1px 3px;
    color:#fff;
    border-radius:3px
}
.index .index-indexrank .game-hot-list-item .info3 .second-text{
    border:1px solid;
    padding:0 .1rem;
    border-left:0;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px;
    margin-left:-1px
}
.index .index-indexrank .game-hot-list-item .tag{
    display:inline;
    padding-left:5px
}
.index .index-indexrank .game-hot-list-item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.index .index-indexrank .game-hot-list-item .tag:nth-child(2){
    color:#75d100
}
.index .index-indexrank .game-hot-list-item .tag:nth-child(3){
    color:#2893ff
}
.index .index-indexrank .game-hot-list-item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.index .index-indexrank .game-hot-list-item .discount{
    position:absolute;
    top:0;
    right:-10px;
    color:#fff;
    font-size:10px;
    padding:5px;
    line-height:1.25;
    width:50px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.index .index-indexrank .game-new{
    padding:0 .3rem;
    position:relative
}
.index .index-indexrank .game-new-item{
    margin-bottom:.3rem;
    display:flex;
    align-items:center;
    background:#fff;
    position:relative;
    padding:.2rem;
    border-radius:8px
}
.index .index-indexrank .game-new-item .index{
    width:25px;
    margin-right:5px
}
.index .index-indexrank .game-new-item .icon,.index .index-indexrank .game-new-item .index{
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.index .index-indexrank .game-new-item .icon{
    position:relative;
    overflow:hidden;
    border-radius:8px;
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem
}
.index .index-indexrank .game-new-item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.index .index-indexrank .game-new-item .icon .discount{
    position:absolute;
    top:0;
    right:0;
    background-color:red;
    color:#fff;
    font-size:10px;
    padding:2.5px 5px;
    line-height:1.25;
    border-bottom-left-radius:8px
}
.index .index-indexrank .game-new-item .subject{
    flex:1 1;
    width:0;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    position:relative
}
.index .index-indexrank .game-new-item .text{
    flex:1 1;
    width:0;
    font-size:.2rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column
}
.index .index-indexrank .game-new-item .name{
    font-weight:700;
    font-size:.3rem;
    color:#282828
}
.index .index-indexrank .game-new-item .name span{
    padding:0 .1rem;
    color:#956528;
    background:#eebe75;
    font-size:.24rem;
    margin-right:2px;
    border-radius:3px;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd)
}
.index .index-indexrank .game-new-item .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index .index-indexrank .game-new-item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.22rem;
    color:#666
}
.index .index-indexrank .game-new-item .info3{
    border-radius:3px
}
.index .index-indexrank .game-new-item .info3 .first-text{
    padding:1px 3px;
    color:#fff;
    border-radius:3px
}
.index .index-indexrank .game-new-item .info3 .second-text{
    border:1px solid;
    padding:0 .1rem;
    border-left:0;
    border-bottom-right-radius:3px;
    border-top-right-radius:3px;
    margin-left:-1px
}
.index .index-indexrank .game-new-item .tag{
    display:inline;
    padding-left:5px
}
.index .index-indexrank .game-new-item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.index .index-indexrank .game-new-item .tag:nth-child(2){
    color:#75d100
}
.index .index-indexrank .game-new-item .tag:nth-child(3){
    color:#2893ff
}
.index .index-indexrank .game-new-item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.index .index-indexrank .game-new-item .discount{
    position:absolute;
    top:0;
    right:-10px;
    color:#fff;
    font-size:10px;
    padding:5px;
    line-height:1.25;
    width:50px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.index .index-good .banners{
    overflow:hidden;
    position:relative
}
.index .index-good .banners .bg{
    background:#000 50% no-repeat;
    background-size:6666%;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:15%
}
.index .index-good .banners .swiper-container{
    margin-top:calc(env(safe-area-inset-top) + 45px);
    overflow:visible;
    width:90%;
    margin-left:auto;
    margin-right:auto
}
.index .index-good .banners .swiper-slide{
    -webkit-transform:scale(.95);
    transform:scale(.95);
    transition:all .25s
}
.index .index-good .banners .swiper-slide-active{
    -webkit-transform:scale(1);
    transform:scale(1)
}
.index .index-good .banner{
    width:100%;
    height:100%;
    display:block;
    position:relative;
    padding-top:100%;
    background:50% no-repeat;
    background-size:100% 100%;
    border-radius:20px
}
.index .index-good .banner .game{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    display:none
}
.index .index-video{
    position:fixed;
    z-index:999;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    bottom:calc(env(safe-area-inset-bottom) + 50px)
}
.index .index-video .video-operate{
    position:fixed;
    z-index:917917;
    top:calc(env(safe-area-inset-top) + 50px);
    right:calc(env(safe-area-inset-right) + 10px);
    background-color:#fff;
    border-radius:8px;
    padding:10px;
    max-width:0;
    max-height:0;
    overflow:hidden;
    opacity:0;
    transition:all .25s
}
.index .index-video .video-operate.active{
    max-width:222px;
    max-height:222px;
    opacity:1
}
.index .index-video .video-operate .item{
    padding:5px;
    margin:5px auto
}
.index .index-video .video-body{
    width:100%;
    height:100%;
    background-color:#000
}
.index .index-video .video-item{
    display:flex;
    flex-direction:column
}
.index .index-video .video-item .body{
    flex:1 1;
    height:0;
    overflow:hidden;
    position:relative
}
.index .index-video .video-item video{
    width:100%;
    height:100%
}
.index .index-video .video-item .play{
    position:absolute;
    z-index:2;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    font-size:64px;
    color:#fff;
    background:50% no-repeat;
    background-size:contain
}
.index .index-video .video-item .operate{
    position:absolute;
    z-index:3;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column
}
.index .index-video .video-item .operate .item{
    padding:10px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:16px
}
.index .index-video .video-item .operate .item .icon{
    font-size:24px;
    margin-bottom:5px
}
.index .index-video .video-item .operate .item .icon.active{
    color:red
}
.index .index-video .video-item .game{
    color:#fff;
    display:flex;
    align-items:center;
    padding:10px 10px 20px
}
.index .index-video .video-item .game>.icon{
    width:65px;
    height:65px;
    overflow:hidden;
    border-radius:8px;
    margin-right:10px
}
.index .index-video .video-item .game>.icon img{
    display:block;
    width:100%;
    height:100%
}
.index .index-video .video-item .game .info{
    flex:1 1;
    width:0;
    overflow:hidden
}
.index .index-video .video-item .game .info .name{
    font-size:15px;
    color:#fff
}
.index .index-video .video-item .game .info .desc{
    margin-top:2.5px;
    font-size:13px;
    color:#999
}
.index .index-video .video-item .game .info .tags{
    display:flex;
    align-items:center
}
.index .index-video .video-item .game .info .tag{
    font-size:12px;
    margin-right:5px
}
.index .index-video .video-item .game .info .tag:first-child{
    color:#ff4200
}
.index .index-video .video-item .game .info .tag:nth-child(2){
    color:#75d100
}
.index .index-video .video-item .game .info .tag:nth-child(3){
    color:#2893ff
}
.index .index-video .video-item .game .btn{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    font-size:12px;
    display:none
}
.index .index-video .video-item .game .btn .icon{
    width:35px;
    height:35px;
    background-color:#ffc000;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    font-size:20px;
    border-radius:50%;
    margin-bottom:2.5px
}
.index-float{
    position:fixed;
    z-index:444;
    bottom:calc(env(safe-area-inset-bottom) + 65px);
    right:0;
    display:flex;
    flex-direction:column;
    padding:5px;
    transition:all .25s
}
.index-float .item{
    padding:5px;
    display:flex;
    justify-content:center
}
.index-float .item img{
    display:block;
    width:55px;
    height:55px
}
.index-float .item.first img{
    width:50px;
    height:50px
}
.activity-first{
    z-index:555;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center
}
.activity-first,.activity-first:before{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.activity-first:before{
    content:"";
    display:block;
    z-index:666;
    background-color:rgba(0,0,0,.5)
}
.activity-first .container{
    position:relative;
    z-index:777;
    justify-content:center
}
.activity-first .container,.activity-first a{
    display:flex;
    flex-direction:column;
    align-items:center
}
.activity-first .img{
    display:flex;
    justify-content:center
}
.activity-first .img img{
    display:block;
    max-width:75%
}
.activity-first .btn{
    background-color:#ffc000;
    color:red;
    font-size:.3rem;
    padding:7.5px;
    border-radius:20px;
    width:75%;
    text-align:center
}
.activity-first .close{
    margin-top:25px;
    font-size:20px;
    color:#fff;
    border-radius:50%;
    width:35px;
    height:35px;
    display:flex;
    justify-content:center;
    align-items:center;
    border:1px solid #fff
}
.nav-view .index .index-new .new-body{
    margin-top:85px
}
.index-good{
    background:#f5f6f8
}
.index-good .index-banners{
    overflow:hidden;
    position:relative
}
.index-good .index-banners .bg{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:75%;
    transition:all .25s
}
.index-good .index-banners .bg2{
    top:0
}
.index-good .index-banners .bg2,.index-good .index-banners .bg3{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    transition:all .25s;
    z-index:11
}
.index-good .index-banners .bg3{
    top:50%
}
.index-good .index-banners .swiper-container{
    margin-top:calc(env(safe-area-inset-top) + 45px);
    overflow:visible;
    margin-left:auto;
    margin-right:auto;
    background-size:100%;
    z-index:12;
    background-repeat:no-repeat
}
.index-good .index-banners .swiper-slide{
    -webkit-transform:scale(.95);
    transform:scale(.95);
    transition:all .25s
}
.index-good .index-banners .swiper-slide-active{
    -webkit-transform:scale(1);
    transform:scale(1)
}
.index-good .index-banners .banner{
    width:100%;
    height:100%;
    display:block;
    position:relative;
    padding-top:100%;
    background:50% no-repeat;
    background-size:100% 100%;
    border-radius:0;
    overflow:hidden
}
.index-good .index-banners .banner .game{
    position:absolute;
    z-index:22;
    bottom:0;
    left:0;
    right:0;
    background-image:linear-gradient(rgba(240,235,235,.12156862745098039),rgba(3,3,3,.7607843137254902),#000);
    display:flex;
    align-items:center;
    padding:10px
}
.index-good .index-banners .banner .game .icon{
    width:65px;
    height:65px;
    overflow:hidden;
    border-radius:8px;
    margin-right:10px
}
.index-good .index-banners .banner .game .icon img{
    display:block;
    width:100%;
    height:100%
}
.index-good .index-banners .banner .game .text{
    color:#fff
}
.index-good .index-banners .banner .game .text .name{
    font-size:16px;
    font-weight:700
}
.index-good .index-banners .banner .game .text .info1{
    font-size:12px
}
.index-good .index-banners .banner .game .text .info2{
    display:flex;
    font-size:12px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index-good .index-banners .banner .game .text .info2 .tag{
    margin-right:5px
}
.index-good .index-banners .banner .game .text .info2 .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.index-good .index-banners .banner .game .text .info2 .tag:nth-child(2){
    color:#75d100
}
.index-good .index-banners .banner .game .text .info2 .tag:nth-child(3){
    color:#2893ff
}
.index-good .index-popularGame .swiper-container{
    width:95%;
    margin:.2rem auto
}
.index-good .index-menus{
    overflow:hidden;
    position:relative;
    z-index:12
}
.index-good .index-menus .container{
    margin:auto 10px;
    padding:10px 0;
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex
}
.index-good .index-menus .container::-webkit-scrollbar{
    display:none
}
.index-good .index-menus .container .scrollbar{
    position:absolute;
    bottom:3px;
    left:50%;
    height:2px;
    width:50px;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    background-color:#eee;
    overflow:hidden
}
.index-good .index-menus .container .scrollbar .thumb{
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    background-color:#ffc000;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%)
}
.index-good .index-menus .menu{
    width:20%;
    flex-shrink:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center
}
.index-good .index-menus .menu a{
    width:100%
}
.index-good .index-menus .menu .new-couple-img{
    width:85%
}
.index-good .index-menus .menu .icon{
    height:60px;
    position:relative
}
.index-good .index-menus .menu .icon img{
    display:block;
    height:100%;
    margin:0 auto;
    object-fit:cover
}
.index-good .index-menus .menu.badge .icon:before{
    content:"";
    display:block;
    position:absolute;
    top:0;
    right:0;
    width:8px;
    height:8px;
    -webkit-transform:translate(50%);
    transform:translate(50%);
    background-color:red;
    border-radius:50%
}
.index-good .index-menus .menu .name{
    font-size:.24rem;
    overflow:hidden;
    white-space:nowrap;
    text-align:center
}
.index-good .index-tips{
    color:#ccc;
    display:flex;
    align-items:center;
    align-content:center;
    justify-items:center;
    justify-content:center;
    padding:10px
}
.index-good .index-tips .text{
    font-size:13px;
    text-align:center
}
.index-good .index-tips:before{
    content:"";
    width:50px;
    height:1px;
    background-color:#ccc;
    margin-right:10px
}
.index-good .index-tips:after{
    content:"";
    width:50px;
    height:1px;
    background-color:#ccc;
    margin-left:10px
}
.index-good .index-fixdiv{
    position:fixed;
    z-index:98;
    bottom:12.5%;
    right:0;
    max-width:720px;
    padding:.13rem .3rem
}
.index-good .index-fixdiv .ssc{
    margin-top:5%;
    clear:both
}
.index-good .index-fixdiv .djj,.index-good .index-fixdiv .ssc{
    float:right;
    margin-right:2%;
    width:60px;
    height:60px
}
.index-good .index-wechat-img{
    position:absolute;
    top:0;
    left:0;
    z-index:10002;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,.5)
}
.index-good .index-wechat-img .prompt-copy-img{
    width:65%;
    margin:40% auto 0 17.5%;
    position:fixed
}
.index-good .index-wechat-img-bg{
    position:absolute;
    top:0;
    left:0;
    z-index:10002;
    width:100%;
    height:100%
}
.index-good .index-g-ad{
    position:fixed;
    bottom:55px;
    left:50%;
    width:100%;
    max-width:720px;
    z-index:99;
    background:rgba(0,0,0,.7);
    padding:7px .3rem 5px .5rem;
    display:flex;
    justify-content:space-between;
    align-items:center;
    transform:translateX(-50%);
    -webkit-transform:translateX(-50%);
    -moz-transform:translateX(-50%);
    -ms-transform:translateX(-50%);
    -o-transform:translateX(-50%)
}
.index-good .index-g-ad .close{
    position:absolute;
    left:.1rem;
    top:50%;
    z-index:2;
    margin-top:-.15rem;
    width:.3rem;
    height:.3rem;
    background-size:contain;
    cursor:pointer
}
.index-good .index-g-ad .left{
    flex:1 1;
    display:flex;
    align-items:center
}
.index-good .index-g-ad .icon{
    width:.9rem;
    overflow:hidden;
    margin-right:.19rem
}
.index-good .index-g-ad .icon img{
    width:100%;
    height:100%
}
.index-good .index-g-ad .txt{
    font-size:.2rem;
    color:#fff
}
.index-good .index-g-ad .name{
    font-size:.32rem;
    margin-bottom:2px
}
.index-good .index-g-ad .btn{
    display:block;
    height:.62rem;
    line-height:.62rem;
    background:#ffc000;
    border-radius:4px;
    padding:0 .18rem;
    font-size:.26rem;
    color:#fff
}
.index-good .index-first-charge{
    width:100%;
    height:100%;
    background:rgba(0,0,0,.8);
    position:fixed;
    top:0;
    left:50;
    z-index:101;
    max-width:720px
}
.index-good .index-first-charge img{
    width:75%;
    margin-left:12.5%;
    margin-top:50%
}
@media (min-width:1119px){
    .index-good .index-first-charge img{
        width:50%;
        margin-left:25%;
        margin-top:40%
    }
}
.index-good .index-first-charge .close001{
    width:12%;
    z-index:2000;
    margin:5% 44%
}
.index-good .index-tradesreject{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    z-index:555;
    background-color:rgba(0,0,0,.75);
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center
}
.index-good .index-tradesreject .container{
    background-color:#fff;
    width:75%;
    border-radius:8px;
    overflow:hidden
}
.index-good .index-tradesreject .container .body{
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:12.5px
}
.index-good .index-tradesreject .container .body .icon img{
    display:block;
    height:75px
}
.index-good .index-tradesreject .container .body .title{
    font-size:.32rem;
    color:#000
}
.index-good .index-tradesreject .container .info{
    padding:0 12.5px 12.5px;
    font-size:.26rem;
    color:#666
}
.index-good .index-tradesreject .container .btns{
    display:flex;
    flex:1 1;
    flex-direction:column;
    align-items:center;
    padding:10px;
    border-top:1px solid #eee;
    color:#ffc000
}
.index-good .index-tradesreject .close{
    width:8%;
    z-index:2000;
    margin:5% 44%
}
.index-good .index-datas{
    margin-top:-5px
}
.index-good .index-data{
    padding:10px;
    overflow:hidden;
    background:#fff;
    margin:10px;
    border-radius:8px
}
.index-good .imagejump,.index-good .startingGames,.index-good .youLikeGames{
    display:none
}
.index-good .data-head{
    display:flex;
    align-items:center;
    padding-top:5px
}
.index-good .data-head .text{
    font-size:18px;
    font-weight:700;
    color:#000;
    flex:1 1
}
.index-good .data-head .text img{
    height:17px
}
.index-good .data-head .more{
    color:#ccc;
    font-size:12px;
    padding:5px;
    display:flex;
    flex-wrap:nowrap;
    align-content:center;
    justify-content:center;
    align-items:center
}
.index-good .data-head .more .left-back{
    width:10px;
    height:10px
}
.index-good .tips{
    color:#999
}
.index-good .recommendGames .items{
    margin-left:-10px
}
.index-good .recommendGames .item{
    padding-left:10px;
    padding-top:10px;
    float:left;
    width:25%;
    text-align:center
}
.index-good .recommendGames .item .icon{
    padding:2.5px
}
.index-good .recommendGames .item .icon img{
    display:block;
    width:100%
}
@media (min-width:1119px){
    .index-good .recommendGames .item .icon{
        width:1.4rem;
        height:1.4rem;
        margin:0 auto
    }
}
.index-good .recommendGames .item .name{
    font-size:.26rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:2.5px;
    font-family:PingFang SC;
    font-weight:500;
    color:#282828;
    font-weight:700
}
.index-good .recommendGames .item .info{
    color:#999;
    font-size:12px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:1px
}
.index-good .hotGames .swiper-container{
    padding-bottom:20px;
    overflow:visible
}
.index-good .hotGames .swiper-pagination{
    bottom:0
}
.index-good .hotGames .swiper-pagination-bullet{
    border-radius:4px
}
.index-good .hotGames .swiper-pagination-bullet-active{
    width:20px;
    background-color:#fe8900
}
.index-good .hotGames .item{
    margin-top:12.5px;
    display:flex;
    align-items:center
}
.index-good .hotGames .item .index{
    width:25px;
    margin-right:5px
}
.index-good .hotGames .item .icon,.index-good .hotGames .item .index{
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.index-good .hotGames .item .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem
}
.index-good .hotGames .item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.index-good .hotGames .item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column;
    position:relative
}
.index-good .hotGames .item .name{
    font-weight:700;
    overflow:hidden;
    font-size:.3rem;
    color:#282828
}
.index-good .hotGames .item .name span{
    padding:0 .1rem;
    color:#956528;
    background:#eebe75;
    font-size:.24rem;
    margin-right:2px;
    border-radius:3px;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd);
    display:inline-block;
    height:18px;
    vertical-align:top;
    margin-top:3.3px
}
.index-good .hotGames .item .name .span{
    border-radius:3px;
    font-size:12px;
    margin-right:5px;
    display:inline;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd);
    color:#956528;
    padding-left:.1rem;
    padding-right:.1rem;
    height:17px;
    font-weight:unset;
    vertical-align:text-bottom
}
.index-good .hotGames .item .info1{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#999
}
.index-good .hotGames .item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#666
}
.index-good .hotGames .item .info3{
    margin-top:.065rem;
    border-radius:3px;
    font-size:.22rem
}
.index-good .hotGames .item .info3 .first-text{
    padding:1px 3px;
    color:#fff;
    border-radius:3px
}
.index-good .hotGames .item .info3 .second-text{
    border:1px solid;
    padding:0 .1rem;
    border-left:0;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px;
    margin-left:-2px
}
.index-good .hotGames .item .discount{
    position:absolute;
    top:0;
    right:0;
    color:#fff;
    font-size:10px;
    padding:5px;
    line-height:1.25;
    width:50px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.index-good .hotGames .item .discount span{
    font-size:15px
}
.index-good .hotGames .item .tag{
    display:inline-block;
    padding-left:5px
}
.index-good .hotGames .item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.index-good .hotGames .item .tag:nth-child(2){
    color:#75d100
}
.index-good .hotGames .item .tag:nth-child(3){
    color:#2893ff
}
.index-good .hotGames .item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.index-good .projectGames .items{
    margin-left:-10px
}
.index-good .projectGames .items .item{
    padding-left:10px;
    padding-top:10px;
    float:left;
    width:25%;
    text-align:center
}
.index-good .projectGames .items .item .icon{
    padding:2.5px
}
.index-good .projectGames .items .item .name{
    font-size:.26rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:2.5px;
    font-family:PingFang SC;
    font-weight:500;
    color:#282828;
    font-weight:700
}
.index-good .projectGames .items .item .info{
    color:#999;
    font-size:13px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:1px
}
.index-good .projectGames .project-item-third{
    display:block;
    margin-top:10px;
    background-color:#fff;
    border-radius:8px
}
.index-good .projectGames .project-item-third .item-base{
    display:flex;
    align-items:center
}
.index-good .projectGames .project-item-third .item-base .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.index-good .projectGames .project-item-third .item-base .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.5;
    display:flex;
    flex-direction:column
}
.index-good .projectGames .project-item-third .item-base .text .name{
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.3rem;
    color:#282828;
    margin-bottom:.05rem
}
.index-good .projectGames .project-item-third .item-base .text .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem
}
.index-good .projectGames .project-item-third .item-base .text .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#fab72b
}
.index-good .projectGames .project-item-third .item-base .text .info2 .tag{
    display:inline-block;
    padding-left:5px
}
.index-good .projectGames .project-item-third .item-base .text .info2 .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.index-good .projectGames .project-item-third .item-base .text .info2 .tag:nth-child(2){
    color:#75d100
}
.index-good .projectGames .project-item-third .item-base .text .info2 .tag:nth-child(3){
    color:#2893ff
}
.index-good .projectGames .project-item-third .item-img{
    margin-top:7.5px;
    margin-bottom:7.5px
}
.index-good .projectGames .project-item-third .item-desc{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#666;
    font-size:.28rem
}
.index-good .imagejump .items{
    display:flex;
    align-items:stretch
}
.index-good .imagejump .item:first-child{
    padding-right:7.5px
}
.index-good .imagejump .item:last-child{
    padding-left:7.5px
}
.index-good .imagejump .item img{
    display:block;
    width:100%
}
.index-good .projectGames img{
    display:block
}
.index-good .projectGames .project-img-four{
    margin-top:10px;
    border-radius:12px
}
.index-good .startingGames .items{
    margin-top:10px;
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex;
    margin-left:-10px
}
.index-good .startingGames .item{
    flex-shrink:0;
    width:33.333%;
    padding-left:10px;
    position:relative
}
.index-good .startingGames .item .container{
    position:relative;
    border-radius:8px;
    overflow:hidden
}
.index-good .startingGames .item .img{
    overflow:hidden;
    padding-top:135%
}
.index-good .startingGames .item .img img{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:block;
    width:100%;
    height:100%
}
.index-good .startingGames .item .time{
    position:absolute;
    top:0;
    left:0;
    right:0;
    text-align:right;
    color:#fff;
    font-size:13px;
    background-image:linear-gradient(rgba(0,0,0,.75),transparent);
    padding:5px 5px 20px
}
.index-good .startingGames .item .info{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    text-align:left;
    color:#fff;
    padding:20px 5px 5px;
    background-image:linear-gradient(transparent,rgba(0,0,0,.75))
}
.index-good .startingGames .item .desc,.index-good .startingGames .item .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index-good .startingGames .item .desc{
    font-size:13px
}
.index-good .specialBanner .items{
    margin-left:-15px
}
.index-good .specialBanner .item{
    display:block;
    width:50%;
    float:left;
    padding-left:15px
}
.index-good .specialBanner .item img{
    display:block;
    width:100%;
    border-radius:12px
}
.index-good .reserverGames .data-body{
    margin-top:10px;
    width:92.5%;
    margin-right:auto
}
.index-good .reserverGames .swiper-container{
    overflow:visible
}
.index-good .reserverGames .swiper-slide{
    padding-right:10px
}
.index-good .reserverGames .item{
    border-radius:8px;
    display:block
}
.index-good .reserverGames .item .img{
    padding-top:50%;
    background:50% no-repeat;
    background-size:contain;
    border-radius:12px
}
.index-good .reserverGames .item .container{
    display:flex;
    align-items:center;
    padding:10px 3px
}
.index-good .reserverGames .item .container .icon{
    width:50px;
    height:50px
}
.index-good .reserverGames .item .container .icon img{
    display:block;
    width:100%;
    height:100%
}
.index-good .reserverGames .item .container .text{
    flex:1 1;
    width:0;
    padding-left:10px;
    padding-right:10px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-items:center;
    align-content:center;
    justify-content:center
}
.index-good .reserverGames .item .container .name{
    color:#282828;
    font-size:.3rem;
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index-good .reserverGames .item .container .time{
    font-size:13px;
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#ff5e00
}
.index-good .reserverGames .item .container .btn{
    width:1.1rem;
    border-radius:.1rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.index-good .diycategory .item{
    padding:10px;
    float:left;
    width:33.333%;
    overflow:hidden;
    text-align:center;
    display:flex;
    flex-direction:column;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center
}
.index-good .diycategory .item .icon{
    position:relative;
    border-radius:8px;
    width:75%;
    padding-top:75%
}
.index-good .diycategory .item .icon img{
    display:block;
    width:100%;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    height:100%
}
.index-good .diycategory .item .icon .badge{
    position:absolute;
    z-index:22;
    background-color:red;
    top:0;
    right:0;
    line-height:1.15;
    font-size:10px;
    color:#fff;
    -webkit-transform:translate(12.5%,-25%);
    transform:translate(12.5%,-25%);
    border-radius:2px;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index-good .diycategory .item .icon .discount{
    position:absolute;
    top:0;
    right:0;
    color:#fff;
    font-size:10px;
    line-height:1.25;
    width:35px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
@media (min-width:1119px){
    .index-good .diycategory .item .icon{
        width:50%;
        padding-top:50%
    }
}
.index-good .diycategory .item .name{
    width:100%;
    font-size:.26rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:5px;
    color:#333;
    font-weight:700
}
.index-good .hotCategory{
    background:#f5f6f8
}
.index-good .hotCategory .items{
    margin-left:-10px
}
.index-good .hotCategory .item{
    padding-left:10px;
    padding-top:10px;
    float:left;
    width:33.33%
}
.index-good .hotCategory .item .container{
    background-color:#fff;
    color:#282828;
    font-size:.28rem;
    border-radius:4px;
    text-align:center;
    padding:9.5px 5.5px;
    border-radius:25px
}
.index-index.invasion .index-body{
    margin-top:0
}
.theme-dark .index-head .background{
    background-color:#000
}
.index-single .index-allban{
    background-repeat:no-repeat;
    background:50%;
    background-size:100% 100%
}
.index-single .index-allban .index-banners{
    overflow:hidden;
    position:relative
}
.index-single .index-allban .index-banners .bg{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:75%;
    transition:all .25s
}
.index-single .index-allban .index-banners .banner-container{
    position:relative;
    margin-top:calc(env(safe-area-inset-top) + 45px);
    overflow:visible;
    margin-left:auto;
    margin-right:auto;
    background-size:100%;
    z-index:12;
    background-repeat:no-repeat
}
.index-single .index-allban .index-banners .banner-container .banner{
    width:100%;
    height:100%;
    display:block;
    position:relative;
    padding-top:100%;
    background:50% no-repeat;
    background-size:100% 100%;
    border-radius:0;
    overflow:hidden
}
.index-single .single-menu{
    position:relative;
    z-index:12;
    margin:auto 10px;
    padding:16px 0 10px;
    white-space:nowrap;
    text-align:justify;
    display:flex;
    flex-direction:column;
    flex-wrap:nowrap;
    align-content:center;
    justify-content:center;
    align-items:center
}
.index-single .single-menu .experience{
    width:50%
}
.index-single .single-active{
    padding:0 15px
}
.index-single .single-active .bg{
    background-size:100% 100%
}
.index-single .single-active .desc-content{
    padding:0 25px;
    background-size:100% 100%;
    margin-top:-20px;
    margin-bottom:-20px;
    position:relative;
    z-index:1
}
.index-single .single-active .title{
    text-align:center;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    font-weight:700;
    font-size:.3rem;
    padding-bottom:15px
}
.index-single .single-active .title img{
    height:20px
}
.index-single .single-active .title span{
    padding:0 5px
}
.index-single .single-active .desc{
    position:relative;
    overflow:hidden;
    transition:all .25s;
    border-radius:8px
}
.index-single .single-active .desc .item-list{
    align-items:center;
    margin-bottom:10px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index-single .single-active .select-all{
    text-align:center;
    color:#ffc000
}
.index-single .single-active .select-all a{
    color:#ffc000
}
.index-single .single-video{
    padding:15px
}
.index-single .single-video .desc{
    background-color:#000;
    padding-top:60%;
    overflow:hidden;
    position:relative;
    border-radius:20px
}
.index-single .single-video .desc>*{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%
}
.index-single .single-video .desc .play{
    position:absolute;
    z-index:2;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    font-size:64px;
    color:#fff;
    background:50% no-repeat;
    background-size:contain
}
.index-single .single-five-pic{
    padding:0 15px 15px
}
.index-single .single-five-pic .game-imgs{
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex
}
.index-single .single-five-pic .game-imgs img{
    width:33.333%;
    border-radius:8px;
    margin-right:10px
}
.index-single .single-feature{
    padding:0 15px 15px
}
.index-single .single-feature .bg{
    background-size:100% 100%
}
.index-single .single-feature .desc-content{
    padding:0 25px;
    background-size:100% 100%;
    margin-top:-20px;
    margin-bottom:-20px;
    position:relative;
    z-index:1
}
.index-single .single-feature .title{
    text-align:center;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    font-weight:700;
    font-size:.3rem;
    padding-bottom:15px
}
.index-single .single-feature .title img{
    height:20px
}
.index-single .single-feature .title span{
    padding:0 5px
}
.index-single .single-feature .body .entity{
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-line-clamp:6;
    line-clamp:6;
    -webkit-box-orient:vertical
}
.index-single .single-feature .select-all{
    text-align:center;
    padding-top:5px
}
.index-single .single-feature .select-all a{
    color:#ffc000
}
.index-single .single-voucher{
    padding:0 15px 15px
}
.index-single .single-voucher .bg{
    background-size:100% 100%
}
.index-single .single-voucher .desc-content{
    padding:0 25px;
    background-size:100% 100%;
    margin-top:-20px;
    margin-bottom:-20px;
    position:relative;
    z-index:1
}
.index-single .single-voucher .title{
    text-align:center;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    font-weight:700;
    font-size:.3rem;
    padding-bottom:15px
}
.index-single .single-voucher .title img{
    height:20px
}
.index-single .single-voucher .title span{
    padding:0 5px
}
.index-single .single-voucher .voucher{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    align-content:space-around;
    align-items:center
}
.index-single .single-voucher .voucher .voucher-main{
    width:100%
}
.index-single .single-voucher .voucher .voucher-main .item{
    background-repeat:no-repeat;
    background-size:100% 100%;
    height:1rem;
    color:#fff;
    display:flex;
    align-content:center;
    flex-wrap:nowrap;
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
    float:left;
    width:31.33%;
    margin-right:7px
}
.index-single .single-voucher .voucher .voucher-main .item:last-child{
    margin-right:0
}
.index-single .single-voucher .voucher .voucher-main .amounts{
    display:flex;
    flex-direction:column;
    justify-items:center;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    width:90px;
    font-size:12px;
    flex:1 1
}
.index-single .single-voucher .voucher .voucher-main .operate{
    width:10px;
    font-size:12px;
    margin-right:8px;
    line-height:1.25;
    opacity:.75
}
.index-single .single-voucher .voucher .voucher-main .operate .btn-receive{
    color:#fff
}
.index-single .single-voucher .voucher .more img{
    height:10px
}
.index-single .single-voucher .gift-list .body{
    position:relative;
    overflow:hidden;
    transition:all .25s;
    border-radius:8px;
    margin-bottom:5px
}
.index-single .single-voucher .gift-list .body .item{
    display:flex;
    align-items:center;
    font-size:13px;
    margin-top:12.5px;
    background-color:#f5f6f8;
    padding:10px;
    border-radius:8px
}
.index-single .single-voucher .gift-list .body .item .info{
    flex:1 1;
    width:0
}
.index-single .single-voucher .gift-list .body .item .info .name{
    font-weight:700;
    font-size:15px;
    color:#000
}
.index-single .single-voucher .gift-list .body .item .info .name .exclusive{
    width:70px;
    margin-left:5px
}
.index-single .single-voucher .gift-list .body .item .info .desc{
    margin-top:2.5px;
    font-size:12px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index-single .single-voucher .gift-list .body .item .btn-copy,.index-single .single-voucher .gift-list .body .item .operate{
    text-align:center;
    margin-left:15px;
    background-color:#ffc000;
    border-radius:10px;
    padding:3.5px 10px;
    color:#fff
}
.index-single .single-voucher .gift-list .select-all{
    text-align:center;
    color:#ffc000
}
.index-single .single-voucher .gift-list .select-all a{
    color:#ffc000
}
.index-single .single-strategy{
    padding:0 15px 15px
}
.index-single .single-strategy .bg{
    background-size:100% 100%
}
.index-single .single-strategy .desc-content{
    padding:0 25px;
    background-size:100% 100%;
    margin-top:-20px;
    margin-bottom:-20px;
    position:relative;
    z-index:1
}
.index-single .single-strategy .title{
    text-align:center;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    font-weight:700;
    font-size:.3rem;
    padding-bottom:15px
}
.index-single .single-strategy .title img{
    height:20px
}
.index-single .single-strategy .title span{
    padding:0 5px
}
.index-single .single-strategy .body .entity{
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-line-clamp:6;
    line-clamp:6;
    -webkit-box-orient:vertical
}
.index-single .single-strategy .body .ctrl{
    position:absolute;
    right:25px;
    background:#fff;
    padding:0 7px;
    color:#ffc000;
    font-size:13px;
    margin-top:-20px
}
.index-single .single-strategy .body .strategy-img{
    padding:5px 0
}
.index-single .single-strategy .body .strategy-img img{
    border-radius:8px
}
.index-single .single-comment{
    padding:0 15px 15px
}
.index-single .single-comment .bg{
    background-size:100% 100%
}
.index-single .single-comment .desc-content{
    padding:0 25px;
    background-size:100% 100%;
    margin-top:-20px;
    margin-bottom:-20px;
    position:relative;
    z-index:1
}
.index-single .single-comment .title{
    text-align:center;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    font-weight:700;
    font-size:.3rem;
    padding-bottom:15px
}
.index-single .single-comment .title img{
    height:20px
}
.index-single .single-comment .title span{
    padding:0 5px
}
.index-single .single-comment .select-all{
    text-align:center;
    color:#ffc000;
    padding-top:10px
}
.index-single .single-comment .select-all a{
    color:#ffc000
}
.index-single .single-comment .comment-item{
    display:block;
    margin-top:10px;
    position:relative;
    border-radius:8px
}
.index-single .single-comment .comment-item .comment-reward{
    position:absolute;
    z-index:11;
    right:15px;
    top:5px;
    background:#fff 50% no-repeat;
    background-size:cover;
    width:67px;
    height:50px;
    display:flex;
    justify-content:center;
    align-items:center;
    align-content:center;
    justify-items:center;
    color:#5574ff
}
.index-single .single-comment .comment-item .comment-reward .text{
    -webkit-transform:rotate(-15deg);
    transform:rotate(-15deg);
    font-size:10px
}
.index-single .single-comment .comment-item .comment-user{
    display:flex;
    align-items:center
}
.index-single .single-comment .comment-item .comment-user .avatar{
    width:40px;
    height:40px;
    flex-shrink:0;
    margin-right:7.5px;
    overflow:hidden;
    border-radius:50%
}
.index-single .single-comment .comment-item .comment-user .avatar img{
    display:block;
    width:100%;
    height:100%
}
.index-single .single-comment .comment-item .comment-user .info{
    flex:1 1;
    width:0;
    overflow:hidden
}
.index-single .single-comment .comment-item .comment-user .info .name{
    font-size:.28rem;
    color:#000;
    display:flex;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.index-single .single-comment .comment-item .comment-user .info .name img{
    margin-left:5px;
    height:25px
}
.index-single .single-comment .comment-item .comment-user .info .count{
    font-size:.26rem;
    margin-top:2.5px
}
.index-single .single-comment .comment-item .comment-user .info .count .icon{
    margin-right:5px
}
.index-single .single-comment .comment-item .comment-content{
    margin-top:5px
}
.index-single .single-comment .comment-item .comment-content .content{
    max-height:100px;
    line-height:20px;
    overflow:hidden;
    transition:all .25s
}
.index-single .single-comment .comment-item .comment-content .ctrl:after{
    content:"更多";
    color:#ffc000;
    display:none;
    position:absolute;
    z-index:5;
    bottom:0;
    right:-10px;
    font-size:13px;
    background-color:#fff;
    padding:0 20px 42px 5px
}
.index-single .single-comment .comment-item .comment-content.switchable .ctrl:after{
    display:block
}
.index-single .single-comment .comment-item .comment-info{
    margin-top:5px;
    display:flex;
    align-items:center;
    padding-top:5px;
    position:relative;
    z-index:6;
    border-bottom:1px solid #ededed
}
.index-single .single-comment .comment-item .comment-info .device{
    flex:1 1;
    width:0;
    overflow:hidden
}
.index-single .single-comment .comment-item .comment-info .count{
    display:flex;
    align-items:center
}
.index-single .single-comment .comment-item .comment-info .count .item{
    padding:5px
}
.index-single .single-comment .comment-item .comment-info .count .icon{
    margin-right:5px
}
.game-index .game-title{
    position:fixed;
    z-index:100;
    top:0;
    left:0;
    right:0;
    padding-top:env(safe-area-inset-top);
    background-color:#ffc000;
    padding-bottom:5px
}
.game-index .game-title .container{
    display:flex;
    align-items:center;
    justify-content:center;
    height:40px;
    position:relative
}
.game-index .game-title .title{
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:.36rem;
    color:#fff;
    font-weight:700
}
.game-index .game-title .title .anticon{
    font-size:.3rem;
    color:#fff;
    margin-left:2.5px
}
.game-index .game-title .service-game{
    position:absolute;
    top:57%;
    right:30px;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    padding:10px
}
.game-index .game-title .service-game img{
    width:20px
}
.game-index .game-title .search{
    position:absolute;
    top:50%;
    right:0;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    padding:10px;
    font-size:20px;
    color:#fff;
    font-size:22px
}
.game-index .game-types .mask{
    content:"";
    display:block;
    z-index:199;
    bottom:0;
    background-color:rgba(0,0,0,.5)
}
.game-index .game-types .items,.game-index .game-types .mask{
    position:fixed;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    transition:all .25s;
    opacity:0
}
.game-index .game-types .items{
    z-index:200;
    background-color:#fff;
    display:flex;
    justify-content:center;
    -webkit-transform:scaleY(0);
    transform:scaleY(0);
    -webkit-transform-origin:top center;
    transform-origin:top center
}
.game-index .game-types.enter-active .mask,.game-index .game-types.enter-done .mask{
    opacity:1
}
.game-index .game-types.enter-active .items,.game-index .game-types.enter-done .items{
    opacity:1;
    -webkit-transform:scaleY(1);
    transform:scaleY(1)
}
.game-index .game-types.exit-active .mask{
    opacity:0
}
.game-index .game-types.exit-active .items{
    opacity:0;
    -webkit-transform:scaleY(0);
    transform:scaleY(0)
}
.game-index .game-types .item{
    width:33.333%;
    text-align:center;
    font-size:.26rem;
    color:#282828;
    padding-bottom:5px
}
.game-index .game-types .item.active{
    color:#ffc000
}
.game-index .game-types .item .icon{
    height:.8rem;
    margin:.25rem 0;
    background:50% no-repeat;
    background-size:contain
}
.game-index .game.active .mask,.game-index .game.active .types{
    visibility:visible
}
.game-index .game-menu{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 45px);
    left:0;
    right:0;
    background-color:#fff;
    height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-bottom:1px solid #eee
}
.game-index .game-menu-item{
    width:33.333%;
    position:relative;
    text-align:center;
    font-size:.28rem;
    padding-bottom:7.5px;
    transition:all .25s
}
.game-index .game-menu-item:before{
    content:"";
    display:block;
    width:25px;
    height:2px;
    background-color:#fff;
    position:absolute;
    bottom:5px;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    transition:all .25s
}
.game-index .game-menu-item.active{
    font-size:.34rem;
    color:#000;
    font-weight:700
}
.game-index .game-menu-item.active:before{
    background-color:#ffc000
}
.game-index .game-main{
    padding-top:calc(env(safe-area-inset-top) + 45px)
}
.game-index .game-main-item{
    display:none;
    background:#f5f6f8
}
.game-index .game-main-item.active{
    display:block
}
.game-index-type .types{
    position:fixed;
    top:calc(env(safe-area-inset-top) + 45px);
    bottom:calc(env(safe-area-inset-bottom) + 55px);
    width:1.48rem;
    background-color:#f5f6f8;
    overflow-y:scroll;
    -webkit-overflow-scrolling:touch;
    transition:all .5s
}
.game-index-type .types .type{
    height:1.04rem;
    line-height:1.04rem;
    overflow:hidden;
    text-align:center;
    padding:4px;
    position:relative;
    color:#999;
    background:#fff
}
.game-index-type .types .type:before{
    content:"";
    display:none;
    width:2px;
    height:20px;
    background-color:#ffc000;
    position:absolute;
    top:50%;
    left:0;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%)
}
.game-index-type .types .type.active{
    color:#ffc000;
    background-color:#f5f6f8
}
.game-index-type .types .type.active:before{
    display:block
}
.game-index-type .types .prevItem{
    border-bottom-right-radius:8px
}
.game-index-type .types .nextItem{
    border-top-right-radius:8px
}
.game-index-type .mains{
    padding-left:1.48rem;
    min-height:100vh
}
.game-index-type .mains .main{
    height:100%;
    position:relative;
    outline:hidden;
    display:none
}
.game-index-type .mains .main.active{
    display:block
}
.game-index .game-good{
    padding:15px;
    background-color:#f5f6f8
}
.game-index .game-good .banners .swiper-container{
    padding-bottom:35px
}
.game-index .game-good .banners .swiper-pagination-bullet{
    height:4px
}
.game-index .game-good .banners .swiper-pagination-bullet-active{
    background-color:#ffc000;
    width:13px;
    border-radius:2px
}
.game-index .game-good .banners .banner{
    display:block;
    background-color:#fff;
    border-radius:8px
}
.game-index .game-good .banners .banner .img{
    padding-top:56.22641509%;
    border-radius:.16rem;
    position:relative;
    overflow:hidden
}
.game-index .game-good .banners .banner .img img{
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.game-index .game-good .banners .banner .entity{
    padding:10px;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center
}
.game-index .game-good .banners .banner .icon{
    flex-shrink:0;
    width:1.08rem;
    height:1.08rem;
    border-radius:.2rem;
    overflow:hidden;
    margin-right:.19rem
}
.game-index .game-good .banners .banner .icon img{
    display:block;
    width:100%;
    height:100%
}
.game-index .game-good .banners .banner .text{
    flex:1 1;
    width:0
}
.game-index .game-good .banners .banner .name{
    font-size:.3rem;
    color:#000;
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-index .game-good .banners .banner .info1{
    font-size:.24rem;
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.065rem;
    margin-top:.065rem
}
.game-index .game-good .banners .banner .info2{
    color:#fe8900;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem
}
.game-index .game-good .banners .banner .tag{
    display:inline;
    padding-left:5px
}
.game-index .game-good .banners .banner .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.game-index .game-good .banners .banner .tag:nth-child(2){
    color:#75d100
}
.game-index .game-good .banners .banner .tag:nth-child(3){
    color:#2893ff
}
.game-index .game-good .groups{
    margin-bottom:.1rem
}
.game-index .game-good .groups .group{
    margin-bottom:.2rem
}
.game-index .game-good .groups .head{
    margin-bottom:.2rem;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center
}
.game-index .game-good .groups .head .name{
    flex:1 1;
    font-weight:700;
    font-size:.34rem;
    color:#282828
}
.game-index .game-good .groups .head .more{
    font-size:.24rem;
    color:#999
}
.game-index .game-good .groups .body{
    padding:5px 0;
    background:#fff;
    border-radius:8px
}
.game-index .game-good .groups .body .item{
    padding:5px 0;
    width:33.333%;
    float:left;
    display:flex;
    flex-direction:column;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center
}
.game-index .game-good .groups .body .item .icon{
    flex-shrink:0;
    width:1.34rem;
    height:1.34rem;
    border-radius:.28rem;
    margin-bottom:.14rem;
    position:relative
}
.game-index .game-good .groups .body .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.game-index .game-good .groups .body .item .icon .badge{
    position:absolute;
    z-index:22;
    background-color:red;
    top:0;
    right:0;
    padding:1.25px;
    line-height:1.15;
    font-size:10px;
    color:#fff;
    -webkit-transform:translate(25%,-25%);
    transform:translate(25%,-25%);
    border-radius:2px;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-index .game-good .groups .body .item .name{
    font-size:.24rem;
    width:90%;
    text-align:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-weight:700;
    color:#282828
}
.game-index .game-type{
    height:100%;
    display:flex;
    flex-direction:column;
    background-color:#f5f6f8
}
.game-index .game-type .option-head{
    position:fixed;
    background-color:#f5f6f8;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 45px);
    height:45px;
    max-width:650px;
    width:80%
}
.game-index .game-type .head{
    height:45px;
    display:flex;
    align-items:center
}
.game-index .game-type .head .item{
    width:33.333%;
    text-align:center;
    padding:.22rem;
    font-size:.26rem;
    color:#999
}
.game-index .game-type .head .item.active{
    color:#ffc000;
    font-weight:700
}
.game-index .game-type .body{
    margin-top:45px;
    padding:.2rem
}
.game-index .game-type .body .item{
    padding:.2rem;
    margin-bottom:.2rem;
    display:flex;
    align-items:center;
    background:#fff;
    border-radius:8px
}
.game-index .game-type .body .item .icon{
    position:relative;
    overflow:hidden;
    border-radius:8px;
    flex-shrink:0;
    margin-right:.2rem;
    width:1.2rem;
    height:1.2rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.game-index .game-type .body .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.game-index .game-type .body .item .icon .discount{
    position:absolute;
    top:0;
    right:0;
    background-color:red;
    color:#fff;
    font-size:10px;
    padding:2.5px 5px;
    line-height:1.25;
    border-bottom-left-radius:8px
}
.game-index .game-type .body .item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    position:relative;
    line-height:1.6
}
.game-index .game-type .body .item .name{
    font-weight:700;
    overflow:hidden;
    font-size:.3rem;
    color:#282828;
    width:80%
}
.game-index .game-type .body .item .name span{
    padding-left:.1rem;
    padding-right:.1rem;
    color:#956528;
    background:#eebe75;
    font-size:.24rem;
    margin-right:2px;
    border-radius:3px;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd)
}
.game-index .game-type .body .item .complate{
    width:100%
}
.game-index .game-type .body .item .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-index .game-type .body .item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#666
}
.game-index .game-type .body .item .info3{
    margin-top:.065rem;
    border-radius:3px
}
.game-index .game-type .body .item .info3 .first-text{
    padding:1px 3px;
    color:#fff;
    background:#ff8c50;
    border-radius:3px
}
.game-index .game-type .body .item .info3 .second-text{
    border:1px solid #ff8c50;
    color:#ff8c50;
    padding:0 .1rem;
    border-left:0;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px;
    margin-left:-1px
}
.game-index .game-type .body .item .discount{
    position:absolute;
    top:0;
    right:-10px;
    color:#fff;
    font-size:10px;
    padding:3px;
    line-height:1.25;
    width:50px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.game-index .game-type .body .item .discount span{
    font-size:15px
}
.game-index .game-type .body .item .tag{
    display:inline;
    padding-left:5px
}
.game-index .game-type .body .item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.game-index .game-type .body .item .tag:nth-child(2){
    color:#75d100
}
.game-index .game-type .body .item .tag:nth-child(3){
    color:#2893ff
}
.game-index .game-type.notag .head,.game-index .game-type.notag .option-head{
    display:none
}
.game-index .game-type.notag .body{
    margin-top:10px
}
.game-index .game-hot{
    padding:.3rem .3rem 0
}
.game-index .game-hot-top{
    width:95%;
    margin-left:auto;
    margin-right:auto;
    margin-top:10px;
    padding-bottom:10px;
    background:top no-repeat;
    background-size:100% auto;
    display:flex
}
.game-index .game-hot-top-item{
    padding:10px;
    flex:1 1;
    width:33.333%;
    display:flex;
    flex-direction:column;
    align-items:center
}
.game-index .game-hot-top-item .icon{
    flex-shrink:0;
    width:80px;
    height:80px;
    margin-top:20px;
    padding:7.5px 20px 0;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    margin-bottom:2.5px;
    background:50% no-repeat;
    background-size:contain
}
.game-index .game-hot-top-item .icon img{
    display:block;
    max-width:100%;
    max-height:100%;
    border-radius:50%
}
.game-index .game-hot-top-item:nth-child(2) .icon{
    width:100px;
    height:100px;
    margin-top:0;
    padding:10px 25px 0
}
.game-index .game-hot-top-item .name{
    width:100%;
    color:#000;
    font-weight:700
}
.game-index .game-hot-top-item .info,.game-index .game-hot-top-item .name{
    font-size:14px;
    text-align:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-index .game-hot-top-item .info{
    color:#ccc;
    padding:2.5px 0
}
.game-index .game-hot-top-item .btn{
    color:#fff;
    background-color:#fe8900;
    border-radius:4px;
    padding:3.5px 7.5px;
    font-size:12px
}
.game-index .game-hot-list-item{
    margin-bottom:.3rem;
    display:flex;
    align-items:center;
    background:#fff;
    padding:.2rem;
    border-radius:8px
}
.game-index .game-hot-list-item .index{
    width:25px;
    margin-right:5px
}
.game-index .game-hot-list-item .icon,.game-index .game-hot-list-item .index{
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.game-index .game-hot-list-item .icon{
    position:relative;
    overflow:hidden;
    border-radius:8px;
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem
}
.game-index .game-hot-list-item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.game-index .game-hot-list-item .icon .discount{
    position:absolute;
    top:0;
    right:0;
    background-color:red;
    color:#fff;
    font-size:10px;
    padding:2.5px 5px;
    line-height:1.25;
    border-bottom-left-radius:8px
}
.game-index .game-hot-list-item .subject{
    flex:1 1;
    width:0;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    position:relative
}
.game-index .game-hot-list-item .text{
    flex:1 1;
    width:0;
    font-size:.2rem;
    color:#999;
    line-height:1.7;
    display:flex;
    flex-direction:column
}
.game-index .game-hot-list-item .name{
    font-weight:700;
    font-size:.3rem;
    color:#282828
}
.game-index .game-hot-list-item .info1,.game-index .game-hot-list-item .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem
}
.game-index .game-hot-list-item .info1{
    color:#999
}
.game-index .game-hot-list-item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.22rem;
    color:#666;
    margin-bottom:.05rem
}
.game-index .game-hot-list-item .tag{
    display:inline;
    padding-left:5px
}
.game-index .game-hot-list-item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.game-index .game-hot-list-item .tag:nth-child(2){
    color:#75d100
}
.game-index .game-hot-list-item .tag:nth-child(3){
    color:#2893ff
}
.game-index .game-hot-list-item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.game-index .game-hot-list-item .discount{
    position:absolute;
    top:0;
    right:-10px;
    color:#fff;
    font-size:10px;
    padding:5px;
    line-height:1.25;
    width:50px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.game-index .game-new{
    padding:.3rem .3rem 0;
    position:relative
}
.game-index .game-new-item{
    margin-bottom:.3rem;
    display:flex;
    align-items:center;
    background:#fff;
    position:relative;
    padding:.2rem;
    border-radius:8px
}
.game-index .game-new-item .index{
    width:25px;
    margin-right:5px
}
.game-index .game-new-item .icon,.game-index .game-new-item .index{
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.game-index .game-new-item .icon{
    position:relative;
    overflow:hidden;
    border-radius:8px;
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem
}
.game-index .game-new-item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.game-index .game-new-item .icon .discount{
    position:absolute;
    top:0;
    right:0;
    background-color:red;
    color:#fff;
    font-size:10px;
    padding:2.5px 5px;
    line-height:1.25;
    border-bottom-left-radius:8px
}
.game-index .game-new-item .subject{
    flex:1 1;
    width:0;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    position:relative
}
.game-index .game-new-item .text{
    flex:1 1;
    width:0;
    font-size:.2rem;
    color:#999;
    line-height:1.7;
    display:flex;
    flex-direction:column
}
.game-index .game-new-item .name{
    font-weight:700;
    font-size:.3rem;
    color:#282828
}
.game-index .game-new-item .info1,.game-index .game-new-item .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem
}
.game-index .game-new-item .info1{
    color:#999
}
.game-index .game-new-item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.22rem;
    color:#666
}
.game-index .game-new-item .tag{
    display:inline;
    padding-left:5px
}
.game-index .game-new-item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.game-index .game-new-item .tag:nth-child(2){
    color:#75d100
}
.game-index .game-new-item .tag:nth-child(3){
    color:#2893ff
}
.game-index .game-new-item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.game-index .game-new-item .discount{
    position:absolute;
    top:0;
    right:-10px;
    color:#fff;
    font-size:10px;
    padding:5px;
    line-height:1.25;
    width:50px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.game-detail{
    position:relative
}
.game-detail .game-body{
    position:relative;
    background:#f5f6f8
}
.game-detail .game-video{
    background-color:#000;
    padding-top:60%;
    overflow:hidden;
    position:relative
}
.game-detail .game-video>*{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%
}
.game-detail .game-video .playfb{
    position:absolute;
    z-index:2;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    font-size:64px;
    color:#fff;
    background:50% no-repeat;
    background-size:contain
}
.game-detail .game-info{
    padding:10px;
    display:flex;
    align-items:center;
    background:#fff;
    position:relative
}
.game-detail .game-info .icon{
    flex-shrink:0;
    width:65px;
    height:65px;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    margin-right:10px;
    position:relative
}
.game-detail .game-info .icon .type_label{
    position:absolute;
    top:0;
    right:0;
    padding:0 .2rem;
    background:red;
    color:#fff;
    border-bottom-left-radius:8px;
    font-size:.2rem
}
.game-detail .game-info .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.game-detail .game-info .info{
    flex:1 1;
    width:0;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column;
    position:relative
}
.game-detail .game-info .roam{
    width:1.2rem
}
.game-detail .game-info .text{
    flex:1 1;
    width:0;
    margin-left:7.5px;
    margin-right:7.5px
}
.game-detail .game-info .name{
    color:#000;
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.3rem
}
.game-detail .game-info .name span{
    padding:0 .1rem;
    color:#956528;
    background:#eebe75;
    font-size:.24rem;
    margin-right:2px;
    border-radius:3px;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd);
    display:inline-block;
    height:18px;
    vertical-align:top;
    margin-top:3.3px
}
.game-detail .game-info .name .span{
    border-radius:3px;
    font-size:12px;
    margin-right:5px;
    display:inline;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd);
    color:#956528;
    padding-left:.1rem;
    padding-right:.1rem;
    height:17px;
    font-weight:unset;
    vertical-align:text-bottom
}
.game-detail .game-info .info1{
    color:#999
}
.game-detail .game-info .info1,.game-detail .game-info .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem
}
.game-detail .game-info .info2{
    color:#fe8900
}
.game-detail .game-info .info3{
    border-radius:3px;
    font-size:.22rem
}
.game-detail .game-info .info3 .first-text{
    padding:1px 3px;
    color:#fff;
    background:#ff8c50;
    border-radius:3px
}
.game-detail .game-info .info3 .second-text{
    border:1px solid #ff8c50;
    color:#ff8c50;
    padding:0 .1rem;
    border-left:0;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px;
    margin-left:-1px
}
.game-detail .game-info .tag{
    display:inline-block;
    padding-left:5px;
    color:#fab72b
}
.game-detail .game-info .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.game-detail .game-info .tag:nth-child(2){
    color:#75d100
}
.game-detail .game-info .tag:nth-child(3){
    color:#2893ff
}
.game-detail .game-info .discount{
    position:absolute;
    top:12px;
    right:0;
    color:#fff;
    font-size:10px;
    padding:3px;
    width:50px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.game-detail .game-menu{
    display:flex;
    background:#fff
}
.game-detail .game-menu .item{
    background-color:#eee;
    padding:10px;
    border-radius:8px;
    width:50%;
    margin:5px
}
.game-detail .game-menu .item .head{
    display:flex;
    align-items:center
}
.game-detail .game-menu .item .head .icon{
    margin-right:7.5px
}
.game-detail .game-menu .item .head .icon img{
    display:block;
    height:17.5px
}
.game-detail .game-menu .item .head .text{
    font-weight:700;
    font-size:.3rem;
    color:#000
}
.game-detail .game-menu .item .head .badge{
    background-color:red;
    padding:2px 5px 3px;
    font-size:10px;
    line-height:1.15;
    color:#fff;
    border-radius:4px;
    margin-left:5px
}
.game-detail .game-menu .item .body{
    margin-top:5px;
    color:#999
}
.game-detail .game-menu .item .body span{
    color:#ffc000;
    margin-right:7.5px
}
.game-detail .game-nav{
    padding-top:10px;
    border-bottom:1px solid #eee;
    padding-right:10px;
    background-color:#fff;
    margin-top:10px
}
.game-detail .game-nav.fixed{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#fff;
    margin-top:0
}
.game-detail .game-nav-item{
    float:left;
    width:20%;
    text-align:center;
    padding-bottom:10px;
    position:relative;
    transition:all .25s
}
.game-detail .game-nav-item:after{
    content:"";
    display:block;
    position:absolute;
    bottom:5px;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    height:2px;
    width:15px;
    background-color:#ffc000;
    opacity:0;
    transition:all .25s
}
.game-detail .game-nav-item.active{
    color:#000;
    font-size:.32rem;
    font-weight:700
}
.game-detail .game-nav-item.active:after{
    opacity:1
}
.game-detail .game-nav-item .count{
    position:absolute;
    top:0;
    right:0;
    -webkit-transform:translate(20%,-20%);
    transform:translate(20%,-20%);
    background:50% no-repeat;
    background-size:100% auto;
    width:30px;
    font-size:10px;
    color:#999;
    text-align:center
}
.game-detail .game-nav-item.active .count{
    color:#fff;
    font-weight:400
}
.game-detail .game-main{
    padding-bottom:calc(env(safe-area-inset-bottom) + 55px);
    min-height:50vh
}
.game-detail .game-main-item{
    min-height:222px;
    padding:12.5px;
    height:0;
    overflow:hidden
}
.game-detail .game-main-item.active{
    height:auto
}
.game-detail .game-index{
    height:auto;
    display:block
}
.game-detail .game-explain .item{
    border-bottom:1px solid #eee;
    margin-bottom:10px
}
.game-detail .game-explain .item .head{
    color:#ffc000;
    display:flex;
    align-items:center;
    padding-bottom:.1rem
}
.game-detail .game-explain .item .head .subject{
    flex:1 1;
    display:flex;
    align-items:center
}
.game-detail .game-explain .item .head .title{
    font-weight:700;
    font-size:.3rem;
    color:#000;
    margin-right:5px
}
.game-detail .game-explain .item .head .info{
    border:1px solid #ffc000;
    padding:2.5px 5px;
    margin-right:5px;
    font-size:12px;
    border-radius:5px
}
.game-detail .game-explain .item .head .operate,.game-detail .game-explain .item .head .tips{
    color:#ffc000
}
.game-detail .game-explain .item .body{
    position:relative;
    margin-top:10px;
    overflow:hidden;
    max-height:159px;
    transition:all .25s;
    background:#fff;
    border-radius:10px;
    padding:10px
}
.game-detail .game-explain .item .body.more{
    max-height:none
}
.game-detail .game-explain .item .body .more:after{
    content:"展开↓";
    display:block;
    position:absolute;
    z-index:22;
    bottom:-10px;
    right:-10px;
    font-size:13px;
    color:#ffa21c;
    background-color:#fff;
    padding:5px 20px 20px 5px
}
.game-detail .game-explain .item .body .more.ed:after{
    content:"收起↑"
}
.game-detail .game-explain .item .body .entity{
    line-height:24px
}
.game-detail .game-explain .item .body .more.ed{
    margin-top:.3rem
}
.game-detail .game-vip{
    display:flex;
    align-items:center;
    padding:10px;
    background:#fff;
    border-radius:10px
}
.game-detail .game-vip img{
    margin-right:10px;
    display:block;
    height:17.5px
}
.game-detail .game-vip .left-back{
    width:10px;
    height:auto
}
.game-detail .game-vip p{
    flex:1 1;
    width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem;
    padding-right:10px
}
.game-detail .game-vip span{
    color:#ccc
}
.game-detail .game-imgs-intro{
    background:#fff;
    padding:10px;
    border-radius:10px;
    margin-top:10px
}
.game-detail .game-imgs{
    margin-top:10px;
    margin-left:-10px;
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex
}
.game-detail .game-imgs img{
    width:33.333%;
    padding-left:10px
}
.game-detail .game-games,.game-detail .game-intro{
    margin-top:10px
}
.game-detail .game-games .head{
    display:flex;
    align-items:center;
    padding-bottom:.1rem
}
.game-detail .game-games .head .text{
    flex:1 1;
    font-weight:700;
    font-size:.3rem;
    color:#000
}
.game-detail .game-games .head .operate{
    display:flex;
    align-items:center;
    font-size:13px
}
.game-detail .game-games .head .operate .icon{
    font-size:14px;
    color:#ffc000;
    margin-right:5px
}
.game-detail .game-games .body{
    margin-top:5px;
    background:#fff;
    border-radius:10px
}
.game-detail .game-games .body .item{
    padding:10px;
    float:left;
    width:25%;
    text-align:center
}
.game-detail .game-games .body .item .icon{
    width:75px;
    height:75px;
    margin:0 auto
}
.game-detail .game-games .body .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.game-detail .game-games .body .item .name{
    margin-top:5px;
    font-size:.28rem;
    font-weight:700;
    color:#000;
    text-align:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-detail .game-games .body .item .info{
    color:#999;
    font-size:13px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:1px
}
.game-detail .game-help{
    display:block;
    text-align:center;
    margin-top:10px
}
.game-detail .game-help span{
    color:#ffc000
}
.game-detail .game-operate{
    position:fixed;
    z-index:200;
    bottom:0;
    left:0;
    right:0;
    background-color:#fff;
    padding:7.5px 15px env(safe-area-inset-bottom,7.5px)
}
.game-detail .game-operate .container{
    height:45px;
    display:flex;
    justify-content:center;
    align-items:flex-end
}
.game-detail .game-operate .favorite{
    display:flex;
    flex-direction:column;
    align-items:center;
    transition:all .1s;
    font-size:12px;
    color:#282828
}
.game-detail .game-operate .favorite .icon{
    font-size:19px
}
.game-detail .game-operate .favorite .favorite{
    display:block
}
.game-detail .game-operate .favorite.active .favorite,.game-detail .game-operate .favorite .favorited{
    display:none
}
.game-detail .game-operate .favorite.active .favorited{
    display:block
}
.game-detail .game-operate .btns{
    flex:1 1;
    width:0;
    display:flex;
    transition:all .1s
}
.game-detail .game-operate .btn{
    flex:1 1;
    background-color:#ffc000;
    font-size:16px;
    margin:0 5px;
    border-radius:20px;
    color:#fff;
    transition:all .1s;
    text-align:center;
    height:.8rem;
    padding:.04rem;
    display:flex;
    align-items:center;
    justify-content:center
}
.game-detail .game-operate .btn h2{
    font-size:13px
}
.game-detail .game-operate .btn .h2s{
    font-size:13px;
    line-height:2.5
}
.game-detail .game-operate .btn p{
    font-size:12px
}
.game-detail .game-operate .btn.disable{
    background-color:#ccc
}
.game-detail .game-operate .openCloud{
    justify-content:center
}
.game-detail .game-operate .onlyOneRoom{
    background:#67aaf8
}
.game-detail .game-operate .onlyOneRoom,.game-detail .game-operate .onlyOneRoom p{
    display:flex;
    align-items:center;
    justify-content:center
}
.game-detail .game-operate .onlyOneRoom p img{
    height:25px;
    margin-right:.2rem
}
.game-detail .game-operate .iosBox{
    height:.9rem;
    display:block;
    position:relative;
    border:none;
    background:transparent;
    padding:0 5px;
    height:.8rem
}
.game-detail .game-operate .iosBox img{
    width:100%;
    height:100%
}
.game-detail .game-operate .iosBox p{
    margin:0;
    width:100%;
    position:absolute;
    top:50%;
    left:0;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    font-size:.42667rem;
    color:#fff;
    padding-right:.48rem;
    box-sizing:border-box;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:16px
}
.game-detail .game-operate .iosBox p img{
    width:.42667rem;
    height:.42667rem;
    vertical-align:middle;
    margin-right:.1rem
}
.game-detail .game-operate .roam{
    border-radius:0;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-right:-.11333rem
}
.game-detail .game-operate .rightBut{
    font-size:16px;
    text-align:center;
    transition:all .1s;
    color:#fff;
    margin-left:-.27333rem
}
.game-detail .game-operate .rightBut p{
    left:15%
}
.game-detail .game-operate .btn-reserve{
    flex:1 1;
    background-color:#6495ed;
    color:#fff
}
.game-detail .game-operate .btn-reserve h1{
    font-size:15px;
    font-weight:700
}
.game-detail .game-operate .btn-reserve h2{
    font-size:13px
}
.game-detail .game-operate .btn-reserve p{
    font-size:12px
}
.game-detail .game-operate .subscribe{
    display:block
}
.game-detail .game-operate .btn-reserve-xq{
    display:flex;
    align-items:center;
    justify-content:center
}
.game-detail .game-operate .btn-yunstartPlay{
    padding:10px 5px
}
.game-detail .game-operate .appraise{
    display:flex;
    flex-direction:column;
    transition:all .1s;
    font-size:12px;
    color:#282828
}
.game-detail .game-operate .appraise .icon{
    font-size:17px
}
.game-detail .game-trumpet-index{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.game-detail .game-trumpet-index .trumpet-site{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.game-detail .game-trumpet-index .trumpet-site .trumpet-main{
    background:#fff;
    width:75%;
    text-align:center;
    padding:20px;
    border-radius:8px
}
.game-detail .game-trumpet-index .trumpet-site .trumpet-main .close{
    text-align:right
}
.game-detail .game-trumpet-index .trumpet-site .trumpet-main .close img{
    width:20px
}
.game-detail .game-trumpet-index .trumpet-site .trumpet-main .trumpet-title{
    padding-bottom:10px;
    font-size:22px
}
.game-detail .game-trumpet-index .trumpet-site .trumpet-main .info{
    font-size:16px;
    color:#282828;
    padding-bottom:10px
}
.game-detail .game-trumpet-index .trumpet-site .trumpet-main .trumpet-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px
}
.game-detail .game-trumpet-index .trumpet-site .trumpet-main .trumpet-btn .item{
    flex:1 1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:#333;
    font-size:16px;
    transition:all .25s;
    border-radius:30px;
    padding:10px
}
.game-detail .game-trumpet-index .trumpet-site .trumpet-main .trumpet-btn .btn-about{
    border:1px solid;
    margin-right:15px
}
.game-detail .game-trumpet-index .trumpet-site .trumpet-main .trumpet-btn .btn-confirm{
    background-color:#ffc000;
    color:#fff
}
.game-detail .game-wechat-img{
    position:absolute;
    top:0;
    left:0;
    z-index:10002;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,.5)
}
.game-detail .game-wechat-img .prompt-img{
    position:fixed
}
.game-detail .game-wechat-img .prompt-copy-img{
    width:65%;
    margin:40% auto 0 17.5%;
    position:fixed
}
.game-detail .game-main-server{
    background-color:#fff
}
.game-detail .game-server .tips{
    color:#999;
    text-align:center
}
.game-detail .game-server .item{
    display:flex;
    align-items:center;
    font-size:13px;
    margin-top:12.5px
}
.game-detail .game-server .item .icon{
    font-size:12px;
    width:25px;
    text-align:center;
    color:#ffc000
}
.game-detail .game-server .item .time{
    margin-right:15px
}
.game-detail .game-server .item .name{
    flex:1 1;
    color:#ffc000;
    text-align:center;
    border:1px solid #ffc000;
    border-radius:2px
}
.game-detail .game-server .item .operate{
    width:65px;
    text-align:center;
    margin-left:15px;
    background-color:#ffc000;
    border-radius:10px;
    padding:3.5px 0;
    color:#fff
}
.game-detail .game-server .item .operate.disable{
    background-color:#ccc
}
.game-detail .game-main-comment{
    padding:0
}
.game-detail .game-qa{
    background-color:#fff;
    margin:12.5px;
    padding:10px;
    border-radius:4px;
    display:flex;
    align-items:center
}
.game-detail .game-qa .text{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.game-detail .game-qa .info1{
    color:#000;
    font-size:.28rem
}
.game-detail .game-qa .info1,.game-detail .game-qa .info2{
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-detail .game-qa .info2{
    font-size:.26rem
}
.game-detail .game-qa .operate{
    font-size:.26rem;
    color:#ffc000
}
.game-detail .game-comment{
    margin:12.5px
}
.game-detail .game-comment .head .subject .title{
    font-weight:700;
    font-size:.3rem;
    color:#000;
    margin-right:5px
}
.game-detail .game-comment .comment-item{
    display:block;
    padding:10px;
    margin-top:10px;
    background-color:#fff;
    position:relative;
    border-radius:8px
}
.game-detail .game-comment .comment-item:first-child{
    margin-top:0
}
.game-detail .game-comment .comment-reward{
    position:absolute;
    z-index:11;
    right:15px;
    top:5px;
    background:#fff 50% no-repeat;
    background-size:cover;
    width:67px;
    height:50px;
    display:flex;
    justify-content:center;
    align-items:center;
    align-content:center;
    justify-items:center;
    color:#5574ff
}
.game-detail .game-comment .comment-reward .text{
    -webkit-transform:rotate(-15deg);
    transform:rotate(-15deg);
    font-size:10px
}
.game-detail .game-comment .comment-user{
    display:flex;
    align-items:center
}
.game-detail .game-comment .comment-user .avatar{
    width:40px;
    height:40px;
    flex-shrink:0;
    margin-right:7.5px;
    overflow:hidden;
    border-radius:50%
}
.game-detail .game-comment .comment-user .avatar img{
    display:block;
    width:100%;
    height:100%
}
.game-detail .game-comment .comment-user .info{
    flex:1 1;
    width:0;
    overflow:hidden
}
.game-detail .game-comment .comment-user .info .name{
    font-size:.28rem;
    color:#000;
    display:flex;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-detail .game-comment .comment-user .info .name img{
    margin-left:5px;
    height:25px
}
.game-detail .game-comment .comment-user .info .count{
    font-size:.26rem;
    margin-top:2.5px
}
.game-detail .game-comment .comment-user .info .count .icon{
    margin-right:5px
}
.game-detail .game-comment .comment-user .time{
    font-size:.24rem
}
.game-detail .game-comment .comment-content{
    margin-top:5px
}
.game-detail .game-comment .comment-content .content{
    max-height:100px;
    line-height:20px;
    overflow:hidden;
    transition:all .25s
}
.game-detail .game-comment .comment-content .ctrl:after{
    content:"全文";
    color:#ffc000;
    display:none
}
.game-detail .game-comment .comment-content.switchable .ctrl:after{
    display:block
}
.game-detail .game-comment .comment-content.open .content{
    max-height:999px
}
.game-detail .game-comment .comment-content.open .ctrl:after{
    content:"收起"
}
.game-detail .game-comment .comment-img{
    display:flex;
    overflow:hidden;
    margin-left:-10px;
    margin-top:10px
}
.game-detail .game-comment .comment-img .item{
    width:33.333%;
    margin-left:10px;
    position:relative;
    padding-top:22.5%
}
.game-detail .game-comment .comment-img .item img{
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%
}
.game-detail .game-comment .comment-img .item .more{
    position:absolute;
    z-index:22;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.5);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:16px
}
.game-detail .game-comment .comment-reply{
    margin-top:5px;
    border-top:1px solid #eee
}
.game-detail .game-comment .comment-reply .reply-item{
    display:flex;
    margin-top:5px
}
.game-detail .game-comment .comment-reply .reply-item .reply-user{
    color:#ffc000
}
.game-detail .game-comment .comment-reply .reply-item .reply-content{
    flex:1 1;
    width:0;
    word-break:break-all
}
.game-detail .game-comment .comment-reply .reply-more{
    margin-top:5px;
    color:#ffc000
}
.game-detail .game-comment .comment-info{
    margin-top:5px;
    display:flex;
    align-items:center;
    padding-top:5px
}
.game-detail .game-comment .comment-info .device{
    flex:1 1;
    width:0;
    overflow:hidden
}
.game-detail .game-comment .comment-info .count{
    display:flex;
    align-items:center
}
.game-detail .game-comment .comment-info .count .item{
    padding:5px
}
.game-detail .game-comment .comment-info .count .item.active .icon{
    color:#ffc000
}
.game-detail .game-comment .comment-info .count .icon{
    margin-right:5px
}
.game-detail .game-main-gift{
    background-color:#f5f6f8
}
.game-detail .game-gift .voucher{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    align-content:space-around;
    align-items:center
}
.game-detail .game-gift .voucher .voucher-main{
    width:100%
}
.game-detail .game-gift .voucher .item{
    background-repeat:no-repeat;
    background-size:100% 100%;
    height:1rem;
    color:#fff;
    display:flex;
    align-content:center;
    flex-wrap:nowrap;
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
    float:left;
    width:31.33%;
    margin-right:5px
}
.game-detail .game-gift .voucher .item .amounts{
    display:flex;
    flex-direction:column;
    justify-items:center;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    width:90px;
    font-size:12px;
    flex:1 1
}
.game-detail .game-gift .voucher .item .amounts span{
    opacity:.75
}
.game-detail .game-gift .voucher .item .amounts .num{
    font-size:18px;
    opacity:1
}
.game-detail .game-gift .voucher .item .amounts .amount-meet{
    opacity:.75
}
.game-detail .game-gift .voucher .item .vip-amounts{
    color:#111
}
.game-detail .game-gift .voucher .item .operate{
    width:10px;
    font-size:12px;
    margin-right:8px;
    line-height:1.25;
    opacity:.75
}
.game-detail .game-gift .voucher .item .vip-operate,.game-detail .game-gift .voucher .vip-item{
    color:#111
}
.game-detail .game-gift .voucher .more{
    font-size:12px;
    color:#999
}
.game-detail .game-gift .voucher .more .left-back{
    width:10px
}
.game-detail .game-gift .active-list .head .text{
    font-weight:700;
    color:#000;
    font-size:16px
}
.game-detail .game-gift .active-list .active-main{
    position:relative;
    overflow:hidden;
    transition:all .25s;
    border-radius:8px;
    margin-bottom:5px
}
.game-detail .game-gift .active-list .active-main .item{
    padding:10px;
    background-color:#fff;
    border-radius:8px;
    display:flex;
    align-items:center;
    margin-bottom:10px
}
.game-detail .game-gift .active-list .active-main .item .container{
    flex:1 1;
    width:0;
    padding-right:10px
}
.game-detail .game-gift .active-list .active-main .item .container .desc{
    display:flex;
    align-items:center
}
.game-detail .game-gift .active-list .active-main .item .container .desc .type{
    background-color:#ffa21c;
    color:#fff;
    font-size:12px;
    padding:2.5px;
    line-height:1;
    border-radius:2px;
    margin-right:5px
}
.game-detail .game-gift .active-list .active-main .item .container .desc .state{
    flex:1 1;
    color:#999;
    font-size:13px
}
.game-detail .game-gift .active-list .active-main .item .container .desc .time{
    font-size:12px;
    color:#ccc
}
.game-detail .game-gift .active-list .active-main .item .container .title{
    color:#000;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.27rem;
    padding-top:8px;
    font-weight:700
}
.game-detail .game-gift .active-list .active-main .item .more{
    color:#ccc;
    font-size:16px
}
.game-detail .game-gift .active-list .active-main .item .more .left-back{
    width:10px
}
.game-detail .game-gift .active-list .active-main .item-display{
    display:none
}
.game-detail .game-gift .select-all{
    text-align:center;
    color:#ffc000
}
.game-detail .game-gift .head{
    display:flex;
    align-items:center
}
.game-detail .game-gift .head .items{
    flex:1 1
}
.game-detail .game-gift .head .item{
    float:left;
    padding:10px;
    position:relative;
    transition:all .25s;
    font-size:14px
}
.game-detail .game-gift .head .item:after{
    content:"";
    display:block;
    height:2px;
    width:15px;
    background-color:#ffc000;
    position:absolute;
    bottom:5px;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    transition:all .25s;
    opacity:0
}
.game-detail .game-gift .head .item.active{
    font-weight:700;
    color:#000;
    font-size:16px
}
.game-detail .game-gift .head .item.active:after{
    opacity:1
}
.game-detail .game-gift .head .operate{
    font-size:12px;
    color:#999
}
.game-detail .game-gift .head .operate .left-back{
    width:10px
}
.game-detail .game-gift .active-list .head{
    margin:8px 0
}
.game-detail .game-gift .gift-list .body{
    position:relative;
    overflow:hidden;
    transition:all .25s;
    border-radius:8px;
    margin-bottom:5px
}
.game-detail .game-gift .gift-list .body .item{
    display:flex;
    align-items:center;
    font-size:13px;
    margin-top:12.5px;
    background-color:#fff;
    padding:10px;
    border-radius:8px
}
.game-detail .game-gift .gift-list .body .item .info{
    flex:1 1;
    width:0
}
.game-detail .game-gift .gift-list .body .item .name{
    font-weight:700;
    font-size:15px;
    color:#000;
    display:flex
}
.game-detail .game-gift .gift-list .body .item .name .exclusive{
    width:70px;
    margin-left:5px
}
.game-detail .game-gift .gift-list .body .item .name .exclusive-new{
    background-size:100% 100%;
    background-repeat:no-repeat;
    width:90px;
    font-size:12px;
    padding-left:.66rem;
    margin-left:.1rem;
    color:#c67934
}
.game-detail .game-gift .gift-list .body .item .desc{
    margin-top:2.5px;
    font-size:12px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-detail .game-gift .gift-list .body .item .operate{
    text-align:center;
    margin-left:15px;
    background-color:#ffc000;
    border-radius:5px;
    padding:3.5px 10px;
    color:#fff
}
.game-detail .game-gift .gift-list .body .item-display{
    display:none
}
.game-detail .game-gift .gift-list .body .empty{
    display:flex;
    flex-direction:column;
    align-items:center;
    padding-bottom:15px
}
.game-detail .game-gift .gift-list .body .empty img{
    display:block;
    width:50%
}
.game-detail .game-gift .gift-list .body.data-more{
    max-height:-webkit-min-content;
    max-height:min-content
}
.game-detail .game-gift .gift-rebate{
    margin-top:10px
}
.game-detail .game-main-trade{
    background-color:#f5f6f8
}
.game-detail .game-trade .item{
    display:block;
    margin-bottom:10px;
    background-color:#fff;
    padding:10px 12.5px;
    border-radius:8px
}
.game-detail .game-trade .info{
    display:flex;
    align-items:center
}
.game-detail .game-trade .info .icon{
    width:75px;
    height:55px;
    margin-right:10px
}
.game-detail .game-trade .info .icon img{
    display:block;
    width:100%;
    height:100%
}
.game-detail .game-trade .info .text{
    flex:1 1;
    display:flex;
    flex-direction:column;
    justify-items:center
}
.game-detail .game-trade .info .text .name{
    font-size:.3rem;
    color:#000
}
.game-detail .game-trade .info .text .desc{
    margin-top:5px
}
.game-detail .game-trade .info .text .desc .android{
    color:#75d100
}
.game-detail .game-trade .data{
    display:flex;
    align-items:center
}
.game-detail .game-trade .data .time{
    flex:1 1;
    width:0;
    color:#ccc;
    font-size:12px;
    padding-top:5px
}
.game-detail .game-trade .data .price{
    display:flex;
    align-items:center
}
.game-detail .game-trade .data .price .amount{
    text-decoration:line-through;
    color:#ccc;
    font-size:12px;
    margin-right:10px
}
.game-detail .game-trade .data .price .price{
    color:#ffa21c;
    font-size:.3rem
}
.game-detail .game-voucher{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    transition:all .25s;
    z-index:200;
    flex-direction:column;
    padding-top:40vh;
    display:flex
}
.game-detail .game-voucher .mask{
    content:"";
    display:block;
    position:absolute;
    z-index:1;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.25);
    transition:all .25s;
    opacity:0
}
.game-detail .game-voucher .container{
    flex:1 1;
    height:0;
    position:relative;
    z-index:2;
    display:flex;
    flex-direction:column;
    background-color:#eee;
    padding:10px 10px 0;
    border-top-left-radius:16px;
    border-top-right-radius:16px;
    transition:all .25s;
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.game-detail .game-voucher.enter-active .mask,.game-detail .game-voucher.enter-done .mask{
    opacity:1
}
.game-detail .game-voucher.enter-active .container,.game-detail .game-voucher.enter-done .container{
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0)
}
.game-detail .game-voucher.exit-active .mask{
    opacity:0
}
.game-detail .game-voucher.exit-active .container{
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.game-detail .game-voucher.exit-done{
    display:none
}
.game-detail .game-voucher .head{
    position:relative;
    margin-top:-10px
}
.game-detail .game-voucher .head .close{
    position:absolute;
    top:50%;
    left:0;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    padding:10px
}
.game-detail .game-voucher .head .text{
    font-size:.32rem;
    font-weight:700;
    color:#000;
    padding:10px;
    text-align:center
}
.game-detail .game-voucher .tips{
    background-color:#ffc000;
    padding:7.5px 10px;
    border-radius:4px;
    display:flex;
    align-items:center;
    color:#fff
}
.game-detail .game-voucher .tips .icon{
    height:25px
}
.game-detail .game-voucher .tips .icon img{
    display:block;
    height:100%
}
.game-detail .game-voucher .tips .name{
    font-weight:700;
    padding-left:10px
}
.game-detail .game-voucher .tips .info{
    flex:1 1;
    text-align:center;
    font-size:13px
}
.game-detail .game-voucher .body{
    flex:1 1;
    height:0;
    overflow:hidden;
    position:relative;
    margin-top:10px;
    overflow-y:scroll;
    -webkit-overflow-scrolling:touch
}
.game-detail .game-voucher .body .item{
    margin-bottom:10px;
    display:flex;
    background-color:#fff;
    overflow:hidden;
    border-radius:8px;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.game-detail .game-voucher .body .item:last-child{
    margin-bottom:env(safe-area-inset-bottom)
}
.game-detail .game-voucher .body .item .amounts{
    color:#fff;
    display:flex;
    flex-direction:column;
    justify-items:center;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    position:relative;
    width:26.811%
}
.game-detail .game-voucher .body .item .amounts .vip-label{
    position:absolute;
    top:0;
    left:0
}
.game-detail .game-voucher .body .item .amounts .vip-label img{
    width:90%
}
.game-detail .game-voucher .body .item .amounts .vip-label .text{
    font-size:12px;
    position:absolute;
    top:0;
    left:38%;
    color:#ffecc9
}
.game-detail .game-voucher .body .item .amounts .amount{
    font-size:.32rem
}
.game-detail .game-voucher .body .item .amounts .amount-meet{
    margin-top:5px;
    font-size:12px
}
.game-detail .game-voucher .body .item .vip-amounts{
    color:#111
}
.game-detail .game-voucher .body .item .info{
    flex:1 1;
    padding:10px
}
.game-detail .game-voucher .body .item .info .name{
    color:#000;
    font-size:.28rem
}
.game-detail .game-voucher .body .item .info .game,.game-detail .game-voucher .body .item .info .time{
    color:#999
}
.game-detail .game-voucher .body .item .info .use{
    color:#f5842d
}
.game-detail .game-voucher .body .item .info .vip-use{
    color:#8f5a0c
}
.game-detail .game-voucher .body .item .operate{
    display:flex;
    align-items:center;
    width:35px;
    text-align:center;
    line-height:1.25;
    color:#f5842d;
    padding:15px;
    width:14.492%;
    line-height:1.35
}
.game-detail .game-voucher .body .item .operate.disable{
    color:#999
}
.game-detail .game-voucher .body .item .operate.vip-operate{
    color:#8f5b0c
}
.game-vip{
    padding:15px
}
.game-vip table{
    width:100%;
    border-collapse:collapse;
    border-spacing:0
}
.game-vip table,.game-vip tr{
    margin:0;
    padding:0
}
.game-vip td{
    padding:.5em;
    font-size:12px;
    text-align:center;
    line-height:1.35;
    border:1px solid #ccc
}
.game-vip .empty{
    font-size:16px;
    position:absolute;
    top:50%;
    left:0;
    right:0;
    text-align:center;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%)
}
.game-article{
    min-height:100vh;
    background-color:#fff;
    padding:15px
}
.game-article .article-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#fff;
    max-width:720px;
    margin:0 auto
}
.game-article .article-head .head-items{
    height:45px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-bottom:1px solid #eee
}
.game-article .article-head .head-item{
    width:49.99%;
    position:relative;
    text-align:center;
    font-size:15px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transition:all .25s
}
.game-article .article-head .head-item:after{
    content:"";
    display:none;
    width:25px;
    height:2px;
    margin-top:2.5px;
    background-color:#ffc000
}
.game-article .article-head .head-item.active{
    font-size:16px;
    color:#000;
    font-weight:700
}
.game-article .article-head .head-item.active:after{
    display:none
}
.game-article .main-ac-items{
    padding-top:40px
}
.game-article .type-item{
    display:none
}
.game-article .type-item.active{
    display:block
}
.game-article .item{
    padding:10px;
    background-color:#fff;
    border-radius:4px;
    display:flex;
    align-items:center
}
.game-article .item .container{
    flex:1 1;
    width:0;
    padding-right:10px
}
.game-article .item .desc{
    display:flex;
    align-items:center
}
.game-article .item .desc .type{
    background-color:#ffa21c;
    color:#fff;
    font-size:12px;
    padding:2.5px;
    line-height:1;
    border-radius:2px;
    margin-right:5px
}
.game-article .item .desc .type-1{
    background-color:#ff5e00
}
.game-article .item .desc .type-2{
    background-color:#5ba5fe
}
.game-article .item .desc .type-3{
    background-color:#51c76c
}
.game-article .item .desc .type-4{
    background-color:#6b6ff0
}
.game-article .item .desc .type-5{
    background-color:#ff8c50
}
.game-article .item .desc .type-6{
    background-color:#ffc100
}
.game-article .item .desc .state{
    flex:1 1;
    color:#999;
    font-size:13px
}
.game-article .item .desc .time{
    font-size:12px;
    color:#ccc
}
.game-article .item .title{
    color:#000;
    font-size:.28rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-article .item .more{
    color:#ccc;
    font-size:16px
}
.game-article .item .more .left-back{
    width:10px
}
.comment-submit{
    padding:10px
}
.comment-submit .content textarea{
    width:100%;
    border-radius:4px;
    border:1px solid #ccc;
    padding:5px;
    resize:none
}
.comment-submit .imgs{
    margin-top:10px
}
.comment-submit-btn{
    color:#ff5e00
}
.comment-submit-btn.disable{
    color:#ccc
}
.game-project .project-img img{
    display:block;
    width:100%
}
.game-project .project-info{
    padding:10px;
    font-size:.28rem;
    color:#000
}
.game-project .project-vouch-img{
    padding:0 10px
}
.game-project .project-items{
    padding:10px
}
.game-project .project-item{
    display:block;
    margin-top:10px;
    background-color:#fff;
    padding:10px;
    border-radius:8px
}
.game-project .project-item:first-child{
    margin-top:0
}
.game-project .project-item .item-base{
    display:flex;
    align-items:center;
    position:relative
}
.game-project .project-item .item-base .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.game-project .project-item .item-base .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.game-project .project-item .item-base .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column
}
.game-project .project-item .item-base .discount{
    position:absolute;
    top:0;
    right:-10px;
    color:#fff;
    font-size:10px;
    padding:5px;
    line-height:1.25;
    width:50px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.game-project .project-item .item-base .discount span{
    font-size:15px
}
.game-project .project-item .item-base .name{
    font-weight:700;
    font-size:.3rem;
    color:#282828
}
.game-project .project-item .item-base .name span{
    padding:0 .1rem;
    color:#956528;
    background:#eebe75;
    font-size:.24rem;
    margin-right:2px;
    border-radius:3px;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd)
}
.game-project .project-item .item-base .name .span{
    border-radius:3px;
    font-size:12px;
    margin-right:5px;
    display:inline;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd);
    color:#956528;
    padding-left:.1rem;
    padding-right:.1rem;
    height:17px;
    font-weight:unset;
    vertical-align:text-bottom
}
.game-project .project-item .item-base .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-project .project-item .item-base .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#ff5e00
}
.game-project .project-item .item-base .info3{
    margin-top:.065rem;
    border-radius:3px;
    font-size:.22rem
}
.game-project .project-item .item-base .info3 .first-text{
    padding:1px 3px;
    color:#fff;
    background:#ff8c50;
    border-radius:3px
}
.game-project .project-item .item-base .info3 .second-text{
    border:1px solid #ff8c50;
    color:#ff8c50;
    padding:0 .1rem;
    border-left:0;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px;
    margin-left:-1px
}
.game-project .project-item .item-base .tag{
    display:inline-block;
    margin-right:5px
}
.game-project .project-item .item-base .tag:first-child{
    color:#ff4200
}
.game-project .project-item .item-base .tag:nth-child(2){
    color:#75d100
}
.game-project .project-item .item-base .tag:nth-child(3){
    color:#2893ff
}
.game-project .project-item .item-base .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.game-project .project-item .item-img{
    margin-top:7.5px
}
.game-project .project-item .item-img img{
    display:block;
    width:100%;
    border-radius:8px
}
.game-project .project-item .item-text{
    margin-top:7.5px
}
.game-project .item-gift-text .text-title{
    background:50% no-repeat;
    background-size:100% 100%;
    padding:5px 10px;
    width:40%;
    color:#fff;
    margin-top:10px
}
.game-project .item-gift-text .text-info{
    background:#f5f6f8;
    display:flex;
    align-items:stretch;
    padding:15px;
    border-bottom-left-radius:8px;
    border-bottom-right-radius:8px;
    border-top-right-radius:8px
}
.game-project .item-gift-text .text-info .info-content{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:space-around
}
.game-project .item-gift-text .text-info .info-btn{
    display:flex;
    align-items:center
}
.game-project .item-gift-text .text-info .info-btn .btn-receive{
    background-color:#ffc000;
    border-radius:25px;
    padding:5px 20px;
    font-size:16px;
    color:#fff
}
.game-project .item-gift-text .text-info .info-btn .btn-copy{
    background-color:#80c5fe;
    border-radius:25px;
    padding:5px 20px;
    font-size:16px;
    color:#fff
}
.game-project .item-gift-desc .desc-title{
    background:50% no-repeat;
    background-size:100% 100%;
    padding:5px 10px;
    width:40%;
    color:#282828;
    margin-top:10px;
    display:flex
}
.game-project .item-gift-desc .desc-title .instru-icon{
    width:20px;
    padding-right:5px;
    display:flex;
    align-items:center;
    justify-content:center;
    align-content:center;
    flex-wrap:wrap;
    flex-direction:row
}
.game-project .item-gift-desc .desc-info{
    background:#f5f6f8;
    display:flex;
    align-items:stretch;
    padding:15px;
    border-bottom-left-radius:8px;
    border-bottom-right-radius:8px;
    border-top-right-radius:8px
}
.game-project .item-gift-desc .desc-info .desc-content{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:space-around
}
.game-project .item-five-gift{
    display:flex;
    flex-wrap:nowrap;
    align-content:center;
    justify-content:space-between;
    align-items:baseline;
    padding:12px 0 2px;
    border-top:1px dashed #ededed;
    margin-top:15px;
    font-size:.28rem
}
.game-project .item-five-gift .five-amount{
    color:#ff5e00
}
.game-project .item-five-gift .five-amount span{
    font-size:.4rem
}
.game-project .item-five-gift .five-relave-but{
    background-color:#ffc000;
    border-radius:25px;
    padding:5px 20px;
    font-size:.26rem;
    color:#fff;
    width:1.4rem;
    text-align:center
}
.game-project .item-five-gift .alreadly-operate-btn{
    background-color:#ccc;
    padding:5px 15px;
    color:#fff;
    border-radius:25px;
    font-size:.26rem;
    width:1.4rem;
    text-align:center
}
.game-project.style-1 .item-img,.game-project.style-1 .item-text{
    display:none
}
.game-project.style-2 .project-info{
    margin:10px;
    border-radius:4px
}
.game-project.style-2 .item-base .text{
    border-bottom:none
}
.game-project.style-2 .item-base .info1{
    color:#999
}
.game-project.style-2 .item-img,.game-project.style-2 .item-text{
    display:block
}
.game-project.style-3 .project-info{
    margin:10px;
    border-radius:4px
}
.game-project.style-3 .item-img,.game-project.style-3 .item-text{
    display:none
}
.game-project.style-3 .project-item.special .item-base .text{
    border-bottom:none
}
.game-project.style-3 .project-item.special .item-img,.game-project.style-3 .project-item.special .item-text{
    display:block
}
.game-vipdownload{
    position:fixed;
    z-index:999;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.75);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transition:all .25s;
    opacity:0
}
.game-vipdownload .container{
    background-color:#fff;
    padding:12.5px;
    border-radius:12px;
    box-shadow:0 0 3px #ccc;
    min-width:75%;
    transition:all .25s;
    opacity:0;
    -webkit-transform:scale(1.1);
    transform:scale(1.1)
}
.game-vipdownload .container .item{
    display:flex;
    align-items:center;
    font-size:15px;
    padding:5px
}
.game-vipdownload .container .item:before{
    content:"";
    display:block;
    flex:1 1
}
.game-vipdownload .container .item:first-child:before{
    content:"打包"
}
.game-vipdownload .container .item:nth-child(2):before{
    content:"签名"
}
.game-vipdownload .container .item:nth-child(3):before{
    content:"下载"
}
.game-vipdownload .container .item.ing:first-child:before{
    content:"打包中"
}
.game-vipdownload .container .item.ing:nth-child(2):before{
    content:"签名中"
}
.game-vipdownload .container .item.ing:nth-child(3):before{
    content:"下载中"
}
.game-vipdownload .container .item.ed:first-child:before{
    content:"打包完成"
}
.game-vipdownload .container .item.ed:nth-child(2):before{
    content:"签名完成"
}
.game-vipdownload .container .item.ed:nth-child(3):before{
    content:"下载完成"
}
.game-vipdownload .container .item .icon.normal{
    display:block
}
.game-vipdownload .container .item .icon.ed,.game-vipdownload .container .item .icon.ing,.game-vipdownload .container .item.ing .icon.normal{
    display:none
}
.game-vipdownload .container .item.ing .icon.ing{
    display:block
}
.game-vipdownload .container .item.ed .icon.ing,.game-vipdownload .container .item.ed .icon.normal,.game-vipdownload .container .item.ing .icon.ed{
    display:none
}
.game-vipdownload .container .item.ed .icon.ed{
    display:block
}
.game-vipdownload .container .tips{
    color:#ff4500;
    opacity:.75;
    margin-top:10px;
    text-align:center
}
.game-vipdownload.enter-done{
    opacity:1
}
.game-vipdownload.enter-done .container{
    opacity:1;
    -webkit-transform:scale(1);
    transform:scale(1)
}
.game-udid{
    position:fixed;
    z-index:917;
    top:0;
    bottom:0;
    left:0;
    right:0;
    background-color:rgba(0,0,0,.65);
    justify-content:flex-end
}
.game-udid,.game-udid .container{
    display:flex;
    flex-direction:column;
    transition:all .25s;
    opacity:0
}
.game-udid .container{
    background-color:#fff;
    padding:10px 10px env(safe-area-inset-bottom);
    border-top-left-radius:12px;
    border-top-right-radius:12px;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.game-udid .head{
    text-align:right;
    color:#666;
    padding:10px 10px 0
}
.game-udid .info{
    color:#333;
    padding:25px 10px;
    font-size:17px
}
.game-udid .info .free{
    color:green
}
.game-udid .info .warn{
    color:red
}
.game-udid .btn{
    display:block;
    background-color:#ffc000;
    width:50%;
    padding:10px;
    color:#fff;
    font-size:17px;
    border-radius:20px;
    text-align:center;
    margin:auto auto 15px
}
.game-udid.enter-done{
    opacity:1
}
.game-udid.enter-done .container{
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0)
}
.game-vipcard{
    z-index:555;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center
}
.game-vipcard,.game-vipcard .mask{
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    right:0
}
.game-vipcard .mask{
    z-index:666;
    background-color:rgba(0,0,0,.65);
    transition:all .25s;
    opacity:0
}
.game-vipcard .container{
    position:relative;
    z-index:777;
    width:70%;
    display:flex;
    flex-direction:column;
    align-items:center;
    transition:all .25s;
    opacity:0;
    -webkit-transform:scale(1.1);
    transform:scale(1.1)
}
.game-vipcard .container .entity{
    width:100%;
    position:relative
}
.game-vipcard .container .entity img{
    display:block;
    width:100%
}
.game-vipcard .container .entity .btn{
    position:absolute;
    bottom:8%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    background-color:red;
    color:#fff;
    text-align:center;
    width:50%;
    padding:10px;
    font-size:16px;
    border-radius:8px
}
.game-vipcard .container .close{
    margin-top:5vh;
    font-size:36px;
    color:#fff
}
.game-vipcard.enter-done .mask{
    opacity:1
}
.game-vipcard.enter-done .container{
    opacity:1;
    -webkit-transform:scale(1);
    transform:scale(1)
}
.game-vipcard-detail{
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
.game-vipcard-detail,.game-vipcard-detail .vipcard-mask{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.game-vipcard-detail .vipcard-mask{
    background-color:rgba(0,0,0,.5);
    transition:all .25s;
    opacity:1
}
.game-vipcard-detail .vipcard-container{
    position:relative;
    z-index:666;
    background-color:#fff;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    display:flex;
    flex-direction:column;
    transition:all .25s;
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0);
    padding:15px 15px 25px
}
.game-vipcard-detail .vipcard-top{
    display:flex;
    padding-bottom:15px
}
.game-vipcard-detail .vipcard-top .icon{
    flex-shrink:0;
    width:1.3rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    margin-right:10px
}
.game-vipcard-detail .vipcard-top .icon img{
    display:block;
    max-width:100%;
    max-height:100%;
    border-radius:8px
}
.game-vipcard-detail .vipcard-top .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.5;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.game-vipcard-detail .vipcard-top .name{
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.32rem;
    color:#282828;
    margin-bottom:.05rem;
    display:flex;
    align-items:center
}
.game-vipcard-detail .vipcard-top .name img{
    width:15px;
    height:15px;
    margin-left:.1rem
}
.game-vipcard-detail .vipcard-top .desc{
    color:#666;
    font-size:.24rem;
    margin-bottom:.05rem
}
.game-vipcard-detail .vipcard-top .time{
    color:#dc2d2d;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem;
    font-size:.26rem
}
.game-vipcard-detail .vipcard-top .time span.cancel{
    text-decoration:line-through;
    color:#999
}
.game-vipcard-detail .vipcard-top .time span.useful{
    color:#999;
    font-size:.22rem;
    padding-left:.1rem
}
.game-vipcard-detail .vipcard-top .close img{
    height:15px
}
.game-vipcard-detail .vipcard-tips{
    color:#999
}
.game-vipcard-detail .vipcard-main{
    margin-top:18px;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex;
    padding-bottom:25px;
    align-items:stretch
}
.game-vipcard-detail .vipcard-main .item{
    width:41%;
    flex-shrink:0;
    margin-left:10px;
    position:relative;
    overflow:hidden;
    border:1px solid #ccc;
    background-color:#fff;
    border-radius:4px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    text-align:center;
    transition:all .25s;
    padding:20px 0 10px
}
.game-vipcard-detail .vipcard-main .item .good{
    color:#fff;
    position:absolute;
    top:0;
    right:0;
    font-size:.2rem;
    padding:0 5px;
    border-bottom-left-radius:5px
}
.game-vipcard-detail .vipcard-main .item .price{
    font-size:13px;
    color:#282828
}
.game-vipcard-detail .vipcard-main .item .price span{
    font-size:30px;
    font-weight:700
}
.game-vipcard-detail .vipcard-main .item .tag{
    color:#999;
    font-size:.22rem;
    padding-bottom:.15rem
}
.game-vipcard-detail .vipcard-main .item .tip2{
    font-size:.24rem;
    background-color:#fcf2e6;
    width:93%;
    margin:0 auto;
    border-radius:5px
}
.game-vipcard-detail .vipcard-main .item .tip2 .intro{
    color:#f7513c
}
.game-vipcard-detail .vipcard-main .item:first-child{
    margin-left:0
}
.game-vipcard-detail .vipcard-main .item.active{
    border:1px solid #e33923
}
.game-vipcard-detail .renewal{
    justify-content:center
}
.game-vipcard-detail .vipcard-tips2{
    color:#f9434f;
    font-size:.26rem;
    padding-bottom:18px
}
.game-vipcard-detail .vipcard-bottom{
    background-image:linear-gradient(#3d69ff,#549aff);
    padding:10px;
    text-align:center;
    font-size:.3rem;
    color:#fff;
    border-radius:20px
}
.game-roam-detail{
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
.game-roam-detail,.game-roam-detail .roam-mask{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.game-roam-detail .roam-mask{
    background-color:rgba(0,0,0,.5);
    transition:all .25s;
    opacity:1
}
.game-roam-detail .roam-container{
    position:relative;
    z-index:666;
    background-color:#fff;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    display:flex;
    flex-direction:column;
    transition:all .25s;
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0);
    padding:15px 15px 25px
}
.game-roam-detail .roam-top{
    display:flex;
    justify-content:flex-end
}
.game-roam-detail .roam-top .close img{
    height:15px
}
.game-roam-detail .roam-tips{
    text-align:center;
    color:#282828;
    font-size:.38rem;
    font-weight:700;
    padding-bottom:15px
}
.game-roam-detail .roam-tips2{
    color:#666;
    font-size:.28rem;
    padding:0 25px 18px
}
.game-roam-detail .roam-tips3{
    text-align:center;
    color:#282828;
    font-size:.34rem
}
.game-roam-detail .roam-tips4{
    text-align:center;
    color:#666;
    font-size:.28rem;
    padding:15px 25px 18px
}
.game-roam-detail .roam-bottom{
    background-color:#67aaf8
}
.game-roam-detail .roam-bottom,.game-roam-detail .roam-bottom-download{
    font-size:16px;
    margin:0 5px;
    border-radius:20px;
    color:#fff;
    transition:all .1s;
    text-align:center;
    padding:8px
}
.game-roam-detail .roam-bottom-download{
    background-color:#ffc000
}
.game-roam-detail .roam-waiting{
    text-align:center;
    padding:15px
}
.game-progress-bar{
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
.game-progress-bar,.game-progress-bar .bar-mask{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.game-progress-bar .bar-mask{
    background-color:rgba(0,0,0,.5);
    transition:all .25s;
    opacity:1
}
.game-progress-bar .bar-container{
    position:relative;
    z-index:666;
    background-color:#fff;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    display:flex;
    flex-direction:column;
    transition:all .25s;
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0);
    padding:15px 15px 25px
}
.game-progress-bar .bar-container .bar-top{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:flex-end
}
.game-progress-bar .bar-container .bar-top .icon{
    width:20px;
    height:20px;
    margin-right:.1rem
}
.game-progress-bar .bar-container .bar-top .name{
    color:#67aaf8;
    font-size:.28rem
}
.game-progress-bar .bar-container .bar-game-info{
    padding:10px;
    display:flex;
    align-items:center;
    background:#f1f1f1;
    position:relative;
    margin:15px 0 25px
}
.game-progress-bar .bar-container .bar-game-info .icon{
    flex-shrink:0;
    width:35px;
    height:35px;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    margin-right:10px;
    position:relative
}
.game-progress-bar .bar-container .bar-game-info .name{
    color:#282828;
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.3rem
}
.game-progress-bar .bar-container .bar-gray{
    background-color:#ddd;
    font-size:16px;
    margin:0 40px;
    border-radius:20px;
    color:#fff;
    transition:all .1s;
    text-align:center;
    height:.7rem;
    position:relative;
    overflow:hidden
}
.game-progress-bar .bar-container .bar-gray .bar-progress{
    background-color:#67aaf8;
    font-size:16px;
    border-radius:20px;
    color:#fff;
    transition:all .1s;
    text-align:center;
    height:.7rem
}
.game-progress-bar .bar-container .bar-gray span{
    position:absolute;
    top:5px;
    text-align:center;
    left:24%
}
.game-progress-bar .bar-container .bar-tips{
    display:flex;
    align-items:center;
    justify-content:center;
    align-content:center;
    margin-top:.2rem
}
.game-progress-bar .bar-container .bar-tips .icon{
    margin-right:.05rem;
    flex-shrink:0;
    width:14px;
    height:14px;
    display:flex
}
.game-progress-bar .bar-container .bar-tips .name{
    color:#282828;
    font-size:.24rem
}
.game-progress-bar .bar-container .bar-udid{
    display:flex;
    align-items:center;
    justify-content:center;
    width:90%;
    margin:.2rem auto 0
}
.game-progress-bar .bar-container .bar-udid span{
    margin-right:10px;
    width:80%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-progress-bar .bar-container .bar-udid .copy-udid{
    color:#67aaf8
}
.game-exit-index{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.game-exit-index .exit-site{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.game-exit-index .exit-site .exit-main{
    background:#fff;
    width:75%;
    text-align:center;
    padding:20px;
    border-radius:8px
}
.game-exit-index .exit-site .exit-main .exit-title{
    padding-bottom:10px;
    font-size:.36rem;
    color:#282828
}
.game-exit-index .exit-site .exit-main .info{
    font-size:.32rem;
    color:#282828;
    padding-bottom:10px
}
.game-exit-index .exit-site .exit-main .exit-btn,.game-exit-index .exit-site .exit-main .exit-btn .item{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px
}
.game-exit-index .exit-site .exit-main .exit-btn .item{
    flex:1 1;
    flex-direction:column;
    color:#333;
    font-size:16px;
    transition:all .25s;
    border-radius:30px
}
.game-exit-index .exit-site .exit-main .exit-btn .btn-about{
    border:1px solid #67aaf8;
    color:#67aaf8;
    margin-right:15px
}
.game-exit-index .exit-site .exit-main .exit-btn .btn-confirm{
    background-color:#67aaf8;
    color:#fff
}
.game-select-head{
    position:fixed;
    z-index:333;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    display:flex;
    align-items:center;
    border-bottom:1px solid #eee;
    padding:0 10px;
    height:40px;
    background-color:#fff
}
.game-select-head input{
    flex:1 1;
    width:0;
    overflow:hidden;
    background:none;
    border:none
}
.game-select-head .buttton{
    border-left:1px solid #ccc;
    padding-left:10px;
    display:flex;
    align-items:center
}
.game-select-head .buttton .icon{
    font-size:18px;
    margin-right:5px
}
.game-select-body{
    margin-top:40px;
    padding:7.5px
}
.game-select-body .item{
    margin-top:7.5px;
    border-bottom:1px solid #eee;
    padding-bottom:7.5px;
    display:flex;
    align-items:center
}
.game-select-body .item:first-child{
    margin-top:0
}
.game-select-body .item .type{
    background-color:#ffc000;
    padding:2.5px 7.5px;
    font-size:.26rem;
    margin-right:7.5px;
    color:#fff
}
.game-select-body .item .type-1:before{
    content:"BT"
}
.game-select-body .item .type-2:before{
    content:"折扣"
}
.game-select-body .item .type-3:before{
    content:"H5"
}
.game-select-body .item .type-4:before{
    content:"GM"
}
.game-select-body .item .name{
    font-size:.28rem;
    color:#000;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem
}
.root-nosafearea{
    background-color:#000
}
.root-nosafearea .game-detail .game-operate{
    padding-bottom:7.5px
}
.root-nosafearea .trade-detail .trade-operate{
    padding-bottom:10px
}
.m-down-type{
    position:fixed;
    left:0;
    top:0;
    right:0;
    bottom:0;
    z-index:999;
    overflow:hidden;
    max-width:750px;
    margin:0 auto;
    background-color:rgba(0,0,0,.75);
    transition:all .25s
}
.m-down-type .inner{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    z-index:1;
    background:#fff;
    border-radius:0;
    overflow-x:hidden;
    overflow-y:auto;
    max-height:85vh;
    transition:.3s
}
.m-down-type .inner .down-top{
    color:#282828;
    border-bottom:1px solid #eee
}
.m-down-type .inner .down-top .t-left-jt-close{
    width:.3rem;
    height:.3rem;
    border-bottom:2px solid #fff;
    border-left:2px solid #fff;
    position:absolute;
    margin-top:.115rem;
    right:0;
    margin-right:.5rem
}
.m-down-type .inner .down-top .t-left-jt-close img{
    width:100%
}
.m-down-type .inner .down-top .g-t1{
    padding:.2rem 0
}
.m-down-type .inner .down-top .g-t1 .tit{
    text-align:center;
    font-size:.36rem;
    font-weight:500
}
.m-down-type .inner .down-game-pic{
    width:1rem;
    height:1rem;
    border-radius:.28rem;
    margin-bottom:.14rem
}
.m-down-type .inner .down-game-pic img{
    width:100%
}
.m-down-type .inner .down-game-pic2{
    position:absolute;
    top:0
}
.m-down-type .inner .down-game-pic2 img{
    width:1rem;
    height:1rem
}
.m-down-type .inner .down-game-pic3{
    width:.6rem;
    position:absolute;
    margin-top:.2rem;
    margin-left:1.225rem;
    z-index:999
}
.m-down-type .inner .p-down-v1{
    margin-top:.28rem
}
.m-down-type .inner .p-down-v1 li{
    float:left;
    width:15%;
    overflow:hidden;
    margin-bottom:.2rem;
    position:relative;
    z-index:1;
    margin-right:.945rem
}
.m-down-type .inner .p-down-v1 li:last-child{
    margin-right:0
}
.m-down-type .inner .p-down-v1 .pic{
    float:left;
    margin-right:.2rem;
    width:1.9rem;
    height:1.9rem;
    position:relative;
    z-index:1;
    color:#fff;
    text-align:center
}
.m-down-type .inner .p-down-v1 .pic p{
    color:#fff;
    line-height:.55rem
}
.m-down-type .inner .p-down-v1 .pic .pic-p-p{
    padding-top:.34rem;
    font-size:.4rem
}
.m-down-type .inner .p-down-v1 .txt{
    overflow:hidden;
    font-size:.24rem;
    color:#999;
    line-height:1.5;
    padding-right:1.7rem;
    padding-bottom:.2rem;
    padding-top:.1rem
}
.m-down-type .inner .p-down-v1 .tit{
    font-size:.34rem;
    color:#282828;
    font-weight:700
}
.m-down-type .inner .p-down-v1 .det1,.m-down-type .inner .p-down-v1 .tit{
    overflow:hidden;
    -ms-text-overflow:ellipsis;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem
}
.m-down-type .inner .p-down-v1 .det2{
    font-size:.26rem;
    overflow:hidden;
    -ms-text-overflow:ellipsis;
    text-overflow:ellipsis;
    white-space:nowrap
}
.m-down-type .inner .p-down-v1 .det3{
    color:#ea4624;
    margin-top:.05rem
}
.m-down-type .inner .p-down-v1 .v-btn-download{
    position:absolute;
    right:0;
    top:0;
    width:.2rem;
    margin-right:.42rem;
    margin-top:.35rem;
    color:#f05724
}
.m-down-type .inner .m-down-wp{
    margin:0 auto;
    padding:0 .2rem
}
.m-down-type .inner p{
    clear:both;
    font-family:PingFang SC;
    font-weight:500;
    color:#282828;
    font-size:.3rem;
    margin-bottom:.2rem
}
.m-down-type .inner p:first-child{
    margin-top:.2rem
}
.m-down-type .inner p:last-child{
    margin-bottom:0
}
.m-down-type .inner .trust{
    width:100%;
    background:#ffc000;
    border-radius:.5rem;
    color:#fff;
    padding:.2rem;
    font-size:.36rem;
    margin:.2rem 0;
    border:0
}
.game-save-pay{
    z-index:999;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    align-items:stretch
}
.game-save-pay,.game-save-pay .mask{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    transition:all .25s;
    opacity:1
}
.game-save-pay .mask{
    background-color:rgba(0,0,0,.75)
}
.game-save-pay .container{
    position:relative;
    z-index:777;
    background-color:#fff;
    border-top-left-radius:8px;
    border-top-right-radius:8px;
    padding:10px 10px env(safe-area-inset-bottom);
    transition:all .25s;
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0)
}
.game-save-pay .container .title{
    text-align:center;
    font-weight:700;
    font-size:16px;
    color:#000
}
.game-save-pay .container iframe{
    width:100%;
    min-height:200px;
    overflow:hidden
}
.had-roam-screen-body{
    padding-top:0;
    background-color:#000
}
.had-roam-screen{
    display:none;
    background-color:#000
}
.system-upgrade-notice{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
.system-upgrade-notice .upgrade-mask{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.5);
    transition:all .25s;
    opacity:1
}
.system-upgrade-notice .upgrade-container{
    position:relative;
    z-index:666;
    background-color:#fff;
    border-top-left-radius:15px;
    border-top-right-radius:15px;
    display:flex;
    flex-direction:column;
    transition:all .25s;
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0);
    padding-bottom:25px
}
.system-upgrade-notice .upgrade-top{
    text-align:center
}
.system-upgrade-notice .upgrade-main{
    padding:15px
}
.system-upgrade-notice .tips{
    color:#282828;
    font-size:.34rem;
    padding:10px 0 5px;
    font-weight:700
}
.system-upgrade-notice .upgrade-bottom-download{
    background-color:#4d77f7;
    font-size:16px;
    margin:20px 20px 10px;
    border-radius:20px;
    color:#fff;
    transition:all .1s;
    text-align:center;
    padding:8px
}
.task-index{
    overflow:hidden;
    min-height:100vh;
    padding:env(safe-area-inset-top) 12.5px 12.5px;
    background:#eee top no-repeat;
    background-size:contain
}
.task-index .task-title{
    font-size:.3rem;
    padding-bottom:10px;
    text-align:center;
    color:#fff;
    font-weight:700;
    margin-top:20px
}
.task-index .task-money{
    display:flex;
    align-items:center
}
.task-index .task-money .money{
    flex:1 1;
    width:0;
    color:#fff
}
.task-index .task-money .money .value{
    font-size:.6rem;
    font-weight:700
}
.task-index .task-money .btn{
    display:flex;
    align-items:center;
    background-color:#fff;
    color:#ffc000;
    padding:5px;
    border-radius:8px
}
.task-index .task-money .btn img{
    height:20px;
    margin-right:5px
}
.task-index .task-sign{
    display:block;
    margin-top:20px;
    background-color:#fff;
    border-radius:8px;
    padding:15px
}
.task-index .task-sign .title img{
    display:block;
    margin:0 auto;
    height:30px
}
.task-index .task-sign .info{
    margin-top:10px
}
.task-index .task-sign .info span{
    color:#ffc000
}
.task-index .task-sign .progress{
    margin-top:10px;
    padding:15px 0 35px;
    margin-left:10px;
    margin-right:20px;
    position:relative
}
.task-index .task-sign .progress>div{
    background-color:#eee;
    width:100%;
    height:2px;
    overflow:hidden
}
.task-index .task-sign .progress>div>span{
    display:block;
    height:100%;
    background-color:#ffc000
}
.task-index .task-sign .progress li{
    position:absolute;
    top:0;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    width:50px;
    font-size:12px
}
.task-index .task-sign .progress li .value{
    background-color:#eee;
    border-radius:50%;
    width:30px;
    height:30px;
    display:flex;
    align-items:center;
    justify-content:center
}
.task-index .task-sign .progress li .value img{
    display:block;
    height:20px
}
.task-index .task-sign .progress li .label{
    margin-top:2.5px
}
.task-index .task-sign .progress li.active .value{
    background-color:#ffc000;
    color:#fff
}
.task-index .task-sign .progress li.active .label{
    color:#ffc000
}
.task-index .task-sign .btn{
    width:100px;
    background-color:#ffc000;
    border-radius:50px;
    color:#fff;
    padding:5px 7.5px;
    text-align:center;
    margin:.3rem auto 0
}
.task-index .task-sign .btn.disable{
    background-color:#ccc
}
.task-index .task-groups{
    margin-top:10px;
    overflow:hidden
}
.task-index .task-groups>.container{
    margin-left:-10px
}
.task-index .task-group{
    float:left;
    width:50%;
    padding-left:10px;
    margin-top:10px
}
.task-index .task-group .container{
    background-color:#fff;
    border-radius:8px;
    padding:10px;
    position:relative
}
.task-index .task-group .icon img{
    display:block;
    height:40px
}
.task-index .task-group .title{
    font-weight:700;
    font-size:.3rem
}
.task-index .task-group .info{
    color:#ccc;
    font-size:13px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.task-index .task-group .state{
    position:absolute;
    z-index:22;
    top:15px;
    right:15px
}
.task-index .task-group .state.progress{
    color:red
}
.task-index .task-group .state.completed{
    top:5px;
    right:5px
}
.task-index .task-group .state.completed img{
    display:block;
    width:50px
}
.task-index .cdk{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    align-content:center;
    justify-items:center;
    justify-content:center
}
.task-index .cdk .mask{
    display:block;
    position:absolute;
    z-index:666;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.5)
}
.task-index .cdk .entity{
    position:relative;
    z-index:777;
    background:top no-repeat;
    background-size:100% 100%;
    width:325px;
    padding:100px 40px 20px;
    overflow:hidden
}
.task-index .cdk .title{
    font-size:.32rem;
    color:#000;
    text-align:center
}
.task-index .cdk .info{
    color:#ccc;
    font-size:13px;
    padding:10px 0
}
.task-index .cdk .desc{
    color:#000
}
.task-index .cdk .desc h1{
    font-size:.3rem
}
.task-index .cdk .desc p{
    font-size:13px
}
.task-index .cdk .input{
    margin-top:10px;
    display:flex;
    align-items:center
}
.task-index .cdk .input input{
    border:1px solid #ccc;
    border-radius:20px;
    flex:1 1;
    width:0;
    padding:5px 10px;
    font-size:.28rem
}
.task-index .cdk .input .btn{
    background-color:#ffc000;
    color:#fff;
    padding:5px 10px;
    border-radius:20px;
    text-align:center;
    margin:0 auto 0 10px
}
.task-index .cdk .close{
    position:relative;
    z-index:777;
    margin-top:20px;
    color:#fff;
    width:30px;
    height:30px;
    display:flex;
    text-align:center;
    align-content:center;
    align-items:center;
    justify-items:center;
    justify-content:center;
    border:1px solid #fff;
    border-radius:50%;
    font-size:.3rem
}
.sign-index{
    overflow:hidden;
    min-height:100vh;
    padding:calc(env(safe-area-inset-top) + 40px) 12.5px 12.5px;
    background:#eee top no-repeat;
    background-size:contain
}
.sign-index .task-title{
    font-size:.3rem;
    padding-bottom:10px;
    text-align:center;
    color:#fff;
    font-weight:700;
    margin-top:20px
}
.sign-index .task-money{
    display:flex;
    align-items:center
}
.sign-index .task-money .money{
    flex:1 1;
    width:0;
    color:#fff
}
.sign-index .task-money .money .value{
    font-size:.6rem;
    font-weight:700
}
.sign-index .task-money .btn{
    display:flex;
    align-items:center;
    background-color:#fff;
    color:#ffc000;
    padding:5px;
    border-radius:8px
}
.sign-index .task-money .btn img{
    height:20px;
    margin-right:5px
}
.sign-index .task-sign{
    display:block;
    margin-top:20px;
    background-color:#fff;
    border-radius:8px;
    padding:15px;
    margin-bottom:20px
}
.sign-index .task-sign .title img{
    display:block;
    margin:0 auto;
    height:30px
}
.sign-index .task-sign .info{
    margin-top:10px
}
.sign-index .task-sign .info span{
    color:#ffc000
}
.sign-index .task-sign .progress{
    margin-top:10px;
    padding:15px 0 35px;
    margin-left:10px;
    margin-right:20px;
    position:relative
}
.sign-index .task-sign .progress>div{
    background-color:#eee;
    width:100%;
    height:2px;
    overflow:hidden
}
.sign-index .task-sign .progress>div>span{
    display:block;
    height:100%;
    background-color:#ffc000
}
.sign-index .task-sign .progress .tips{
    width:auto;
    position:absolute;
    height:24px;
    top:-28px;
    font-size:12px;
    right:-25px;
    color:#fff;
    padding:0 2px;
    background-color:unset;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.sign-index .task-sign .progress li{
    position:absolute;
    top:0;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    width:50px;
    font-size:12px
}
.sign-index .task-sign .progress li .value{
    background-color:#eee;
    border-radius:50%;
    width:30px;
    height:30px;
    display:flex;
    align-items:center;
    justify-content:center
}
.sign-index .task-sign .progress li .value img{
    display:block;
    height:20px
}
.sign-index .task-sign .progress li .label{
    margin-top:2.5px
}
.sign-index .task-sign .progress li.active .value{
    background-color:#ffc000;
    color:#fff
}
.sign-index .task-sign .progress li.active .label{
    color:#ffc000
}
.sign-index .task-sign .btn{
    width:100px;
    background-color:#ffc000;
    border-radius:50px;
    color:#fff;
    padding:5px 7.5px;
    text-align:center;
    margin:.3rem auto 0
}
.sign-index .task-sign .btn.disable{
    background-color:#ccc
}
.sign-index .sign-title{
    padding-top:20%;
    padding-bottom:20%;
    padding-right:30%;
    font-size:12px;
    color:#fff
}
.sign-index .sign-title img{
    display:block;
    margin-bottom:10px
}
.sign-index .sign-calendar{
    background-color:#fff;
    border-radius:8px;
    padding:12.5px
}
.sign-index .sign-calendar .title{
    font-size:.28rem;
    color:#000;
    text-align:center;
    font-weight:700
}
.sign-index .sign-calendar .main{
    margin-top:10px
}
.sign-index .sign-calendar .item{
    float:left;
    width:14.285%;
    overflow:hidden;
    text-align:center;
    height:40px;
    display:flex;
    align-content:center;
    align-items:center;
    justify-items:center;
    justify-content:center;
    background:50% no-repeat;
    background-size:contain
}
.sign-index .sign-calendar .item.disable{
    color:#ccc
}
.sign-index .sign-calendar .item.active{
    color:#fff
}
.sign-index .sign-operate{
    margin-top:30px;
    text-align:center
}
.sign-index .sign-operate .vip{
    display:block;
    background-color:#ffc000;
    width:200px;
    margin:10px auto;
    font-size:.3rem;
    color:#fff;
    border-radius:20px;
    padding:7.5px 10px
}
.sign-index .sign-operate .role{
    display:block;
    padding:10px;
    color:#ffc000;
    font-size:.28rem
}
.sign-index .sign-alert{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    align-content:center;
    justify-items:center;
    justify-content:center
}
.sign-index .sign-alert .mask{
    display:block;
    position:absolute;
    z-index:666;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.5)
}
.sign-index .sign-alert .entity{
    position:relative;
    z-index:777;
    background:top no-repeat;
    background-size:100% 100%;
    width:300px;
    padding:100px 35px 20px;
    color:#fff;
    overflow:hidden;
    text-align:center
}
.sign-index .sign-alert .info{
    font-size:.3rem
}
.sign-index .sign-alert .desc{
    width:185px;
    display:flex;
    align-items:center;
    margin:15px auto 0;
    font-size:12px;
    text-align:center
}
.sign-index .sign-alert .desc:before{
    content:"";
    width:30px;
    height:1px;
    background-color:#fff;
    margin-right:10px
}
.sign-index .sign-alert .desc:after{
    content:"";
    width:30px;
    height:1px;
    background-color:#fff;
    margin-left:10px
}
.sign-index .sign-alert .btn{
    background-color:#ffc000;
    padding:5px 10px;
    width:200px;
    border-radius:20px;
    text-align:center;
    margin:25px auto 0
}
.task-novice{
    min-height:calc(100vh + env(safe-area-inset-bottom));
    overflow:hidden;
    background:top no-repeat;
    background-size:contain;
    display:flex;
    flex-direction:column
}
.task-novice .novice-head img{
    display:block;
    width:100%
}
.task-novice .novice-body{
    flex:1 1;
    height:0;
    background:#ffc000 top no-repeat;
    background-size:contain;
    padding-bottom:15px;
    position:relative
}
.task-novice .novice-body>img{
    display:block;
    position:absolute;
    top:0;
    left:50%;
    z-index:22;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    width:75%
}
.task-novice .novice-body .container{
    border:4px solid hsla(0,0%,93.3%,.8);
    background-color:#fff;
    border-radius:10px;
    width:90%;
    margin:0 auto;
    padding:10px
}
.task-novice .novice-body .container>.title{
    text-align:center;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    font-weight:700;
    color:#ffc000;
    font-size:.3rem
}
.task-novice .novice-body .container>.title img{
    height:10px;
    margin:0 10px
}
.task-novice .novice-body .tasks{
    margin-top:25px
}
.task-novice .novice-body .task{
    margin-top:15px;
    border-bottom:1px solid #eee;
    padding-bottom:15px;
    display:flex;
    align-items:center;
    padding-left:7.5px;
    padding-right:7.5px
}
.task-novice .novice-body .task .icon{
    width:50px;
    height:50px
}
.task-novice .novice-body .task .icon img{
    display:block;
    width:100%;
    height:100%
}
.task-novice .novice-body .task .info{
    flex:1 1;
    width:0;
    padding-left:7.5px;
    padding-right:7.5px
}
.task-novice .novice-body .task .info .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#000;
    font-size:.28rem;
    display:flex;
    align-items:center
}
.task-novice .novice-body .task .info .name .progress{
    color:#ccc;
    font-size:13px;
    margin-left:5px
}
.task-novice .novice-body .task .info .name .reward{
    color:#ffc000;
    font-size:13px;
    margin-left:5px
}
.task-novice .novice-body .task .info .desc{
    color:#ccc;
    font-size:13px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:5px
}
.task-novice .novice-body .task .operate{
    color:#ffc000;
    width:1.1rem;
    text-align:center
}
.task-novice .novice-body .task .operate.completed{
    font-size:13px;
    color:#fff;
    background-color:#ccc;
    border-radius:20px;
    padding:3.5px 4.5px
}
.task-novice .novice-body .task .operate.complete{
    font-size:13px;
    background-color:#ffc000;
    padding:3.5px 4.5px;
    color:#fff;
    border-radius:20px
}
.task-novice .cdk{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    align-content:center;
    justify-items:center;
    justify-content:center
}
.task-novice .cdk .mask{
    display:block;
    position:absolute;
    z-index:666;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.5)
}
.task-novice .cdk .entity{
    position:relative;
    z-index:777;
    background:top no-repeat;
    background-size:100% 100%;
    width:300px;
    padding:100px 35px 15px;
    overflow:hidden
}
.task-novice .cdk .head img{
    display:block;
    margin:0 auto;
    width:75%
}
.task-novice .cdk .info{
    color:#fff;
    margin-top:10px
}
.task-novice .cdk .input{
    margin-top:10px;
    display:flex;
    align-items:center
}
.task-novice .cdk .input input{
    background-color:#fff;
    border-radius:20px;
    border:none;
    flex:1 1;
    width:0;
    padding:5px 10px;
    font-size:.28rem
}
.task-novice .cdk .input .btn{
    padding:5px 10px;
    margin:0 auto 0 10px
}
.task-novice .cdk .input .btn,.task-novice .cdk .operate{
    background-color:#ffc000;
    color:#fff;
    border-radius:20px;
    text-align:center
}
.task-novice .cdk .operate{
    display:block;
    width:100px;
    padding:5px;
    margin:10px auto 0
}
.task-novice .cdk .close{
    position:relative;
    z-index:777;
    margin-top:20px;
    color:#fff;
    width:30px;
    height:30px;
    display:flex;
    text-align:center;
    align-content:center;
    align-items:center;
    justify-items:center;
    justify-content:center;
    border:1px solid #fff;
    border-radius:50%;
    font-size:.3rem
}
.task-day{
    min-height:calc(100vh + env(safe-area-inset-bottom));
    background:#ffc000 top no-repeat;
    background-size:100% auto;
    padding-top:50px
}
.task-day .day-head{
    padding-top:env(safe-area-inset-top)
}
.task-day .day-head img{
    display:block;
    width:85%;
    margin:0 auto
}
.task-day .day-body{
    padding-bottom:15px;
    margin-top:250px
}
.task-day .day-body .info img{
    display:block;
    width:200px;
    margin:0 auto
}
.task-day .day-body .tasks{
    padding:15px
}
.task-day .day-body .task{
    margin-top:12.5px;
    background-color:#fff;
    padding:10px;
    border-radius:8px;
    display:flex;
    align-items:center
}
.task-day .day-body .task .icon{
    width:50px;
    height:50px
}
.task-day .day-body .task .icon img{
    display:block;
    width:100%;
    height:100%
}
.task-day .day-body .task .info{
    flex:1 1;
    width:0;
    padding-left:7.5px;
    padding-right:7.5px
}
.task-day .day-body .task .info .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#000;
    font-size:.28rem;
    display:flex;
    align-items:center
}
.task-day .day-body .task .info .name .progress{
    color:#ccc;
    font-size:13px;
    margin-left:5px
}
.task-day .day-body .task .info .name .reward{
    color:#ffc000;
    font-size:13px;
    margin-left:5px
}
.task-day .day-body .task .info .desc{
    color:#ccc;
    font-size:13px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:5px
}
.task-day .day-body .task .operate{
    color:#ffc000;
    width:1.1rem;
    text-align:center
}
.task-day .day-body .task .operate.completed{
    font-size:13px;
    color:#fff;
    background-color:#ccc;
    border-radius:20px;
    padding:3.5px 4.5px
}
.task-day .day-body .task .operate.complete{
    font-size:13px;
    background-color:#ffc000;
    padding:3.5px 4.5px;
    color:#fff;
    border-radius:20px
}
.task-success .bg-center{
    background:50% repeat-y;
    background-size:100% auto
}
.task-success .bg-top{
    background:top no-repeat;
    background-size:100% auto
}
.task-success .bg-bottom{
    background:bottom no-repeat;
    background-size:100% auto;
    min-height:calc(100vh + env(safe-area-inset-bottom))
}
.task-success .success-head{
    padding-top:calc(env(safe-area-inset-top) + 50px)
}
.task-success .success-head img{
    display:block;
    margin:0 auto;
    max-width:70%
}
.task-success .success-body{
    background-color:#fff;
    border-radius:8px;
    padding:10px;
    width:95%;
    margin:25px auto 0
}
.task-success .success-body .title{
    display:flex;
    align-items:center;
    align-content:center;
    justify-items:center;
    justify-content:center;
    font-size:.32rem;
    color:#000
}
.task-success .success-body .title img{
    display:block;
    height:10px;
    margin-left:5px;
    margin-right:5px
}
.task-success .success-body .tasks{
    margin-top:15px
}
.task-success .success-body .task{
    margin-top:15px;
    border-bottom:1px solid #eee;
    padding-bottom:15px;
    display:flex;
    align-items:center;
    padding-left:7.5px;
    padding-right:7.5px
}
.task-success .success-body .task .icon{
    width:50px;
    height:50px
}
.task-success .success-body .task .icon img{
    display:block;
    width:100%;
    height:100%
}
.task-success .success-body .task .info{
    flex:1 1;
    width:0;
    padding-left:7.5px;
    padding-right:7.5px
}
.task-success .success-body .task .info .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#000;
    font-size:.27rem;
    display:flex;
    align-items:center
}
.task-success .success-body .task .info .name .progress{
    color:#ccc;
    font-size:12px;
    margin-left:5px
}
.task-success .success-body .task .info .name .reward{
    color:#ffc000;
    font-size:12px;
    margin-left:5px
}
.task-success .success-body .task .info .desc{
    color:#ccc;
    font-size:12px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:5px
}
.task-success .success-body .task .operate{
    color:#ffc000;
    width:1.1rem;
    text-align:center
}
.task-success .success-body .task .operate.completed{
    font-size:13px;
    color:#fff;
    background-color:#ccc;
    border-radius:20px;
    padding:3.5px 4.5px
}
.task-success .success-body .task .operate.complete{
    font-size:13px;
    background-color:#ffc000;
    padding:3.5px 4.5px;
    color:#fff;
    border-radius:20px
}
.task-tryplay{
    background:#f5f6f8
}
.task-tryplay .tryplay-head{
    color:#fff;
    background:#fff top no-repeat;
    background-size:100% 100%;
    padding:calc(env(safe-area-inset-top) + 40px) 15px 50px
}
.task-tryplay .tryplay-head h1{
    font-size:15px;
    margin-bottom:5px
}
.task-tryplay .tryplay-head p{
    font-size:13px;
    margin-top:2.5px;
    width:60%
}
.task-tryplay .tryplay-body{
    padding:10px;
    margin-top:-60px;
    min-height:100vh
}
.task-tryplay .tryplay-body .item{
    padding:12.5px;
    border-radius:8px;
    margin-top:12.5px;
    display:flex;
    align-items:stretch;
    background-color:#fff
}
.task-tryplay .tryplay-body .item .icon{
    width:75px;
    height:75px;
    border-radius:4px;
    overflow:hidden
}
.task-tryplay .tryplay-body .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.task-tryplay .tryplay-body .item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    padding:0 10px;
    display:flex;
    flex-direction:column;
    justify-content:space-around
}
.task-tryplay .tryplay-body .item .info .name{
    font-size:15px;
    font-weight:700;
    color:#000;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.task-tryplay .tryplay-body .item .info .time{
    color:#666;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.task-tryplay .tryplay-body .item .info .reward{
    color:#ffa21c
}
.task-tryplay .tryplay-body .item .info .desc{
    display:flex;
    flex-direction:row
}
.task-tryplay .tryplay-body .item .info .desc .require{
    color:#00a7ff;
    margin-right:5px
}
.task-tryplay .tryplay-body .item .info .desc .reward{
    color:#fe8900
}
.task-tryplay .tryplay-body .item .operate,.task-tryplay .tryplay-body .item .operate .count{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center
}
.task-tryplay .tryplay-body .item .operate .count{
    position:relative;
    width:50px;
    height:50px
}
.task-tryplay .tryplay-body .item .operate .count svg{
    width:50px;
    height:50px;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.task-tryplay .tryplay-body .item .operate .count .value{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:center;
    line-height:1.15;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.task-tryplay .tryplay-body .item .operate .count .text{
    position:relative;
    z-index:2;
    font-size:12px;
    margin-top:.25px;
    line-height:1.15
}
.task-tryplay .tryplay-body .item .operate .btn{
    background-color:#ffc000;
    padding:2.5px 7.5px;
    color:#fff;
    border-radius:5px;
    font-size:13px;
    margin-top:5px
}
.task-tryplay .tryplay-body .item .operate .btn.disable,.task-tryplay .tryplay-body .item .operate .btn.success{
    background-color:#ccc
}
.task-tryplay-explain{
    padding:10px
}
.task-tryplay-explain dl{
    margin-bottom:10px
}
.task-tryplay-explain dt{
    font-size:16px;
    font-weight:700;
    color:#8a2be2;
    text-align:center
}
.task-tryplay-explain dd{
    font-size:15px;
    margin-top:2.5px
}
.service-index{
    overflow:hidden;
    background:top no-repeat;
    background-size:100% 200px;
    background:#f5f6f8;
    min-height:100vh
}
.service-index .service-title{
    padding-top:env(safe-area-inset-top);
    text-align:center;
    font-size:.36rem;
    line-height:1.8;
    color:#fff
}
.service-index .service-container{
    padding:12.5px;
    position:relative
}
.service-index .service-info{
    color:#fff;
    display:flex;
    align-items:flex-end
}
.service-index .service-info .info{
    font-size:.34rem;
    flex:1 1
}
.service-index .service-info .time{
    font-size:14px
}
.service-index .service-contact{
    display:flex;
    margin-top:15px
}
.service-index .service-contact .item{
    border:1px solid #eee;
    flex:1 1;
    width:50%;
    background-color:#fff;
    border-radius:8px;
    padding:12.5px
}
.service-index .service-contact .item:first-child{
    margin-right:10px
}
.service-index .service-contact .item:last-child{
    margin-left:10px
}
.service-index .service-contact .icon{
    height:35px;
    background:0 no-repeat;
    background-size:auto 100%
}
.service-index .service-contact .name{
    font-size:.32rem;
    font-weight:700;
    color:#282828
}
.service-index .service-contact .value{
    color:#999
}
.service-index .service-bt{
    font-weight:700;
    color:#000;
    font-size:15px;
    margin:10px auto
}
.service-index .service-bt span{
    font-size:12px;
    color:#666;
    padding-left:5px
}
.service-index .service-faq dl{
    border-radius:4px;
    margin-bottom:10px;
    background:#fff
}
.service-index .service-faq dt{
    padding:10px;
    display:flex;
    align-items:center;
    transition:all .25s
}
.service-index .service-faq dt .full{
    flex:1 1;
    display:flex;
    align-items:center
}
.service-index .service-faq dt .down{
    width:12px;
    height:12px;
    margin-top:-.2rem
}
.service-index .service-faq dt .icon{
    width:35px;
    height:25px;
    background:50% no-repeat;
    background-size:contain;
    margin-right:5px
}
.service-index .service-faq dt .text{
    font-size:.3rem;
    color:#282828;
    font-weight:700;
    width:24%
}
.service-index .service-faq dt .tel-info{
    padding-left:5px;
    font-size:12px;
    color:#666;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.service-index .service-faq dt .tel-btn{
    border-radius:14rem;
    padding:2.5px 7.5px;
    color:#fff;
    background-color:#ffc000;
    font-size:.28rem
}
.service-index .service-faq dd{
    max-height:0;
    overflow:hidden;
    transition:all .25s
}
.service-index .service-faq dl.active dt{
    border-bottom:1px solid #eee
}
.service-index .service-faq dl.active dd{
    max-height:333px
}
.service-index .service-faq a{
    display:block;
    color:#333;
    font-size:13px;
    padding:.1rem .3rem
}
.service-index .service-faq a:first-child{
    margin-top:5px
}
.service-index .service-faq a:last-child{
    margin-bottom:5px
}
.service-index .service-customer dl{
    border-radius:4px;
    margin-bottom:10px;
    background:#fff
}
.service-index .service-customer dt{
    padding:10px;
    display:flex;
    align-items:center;
    transition:all .25s
}
.service-index .service-customer dt .full{
    flex:1 1;
    display:flex;
    align-items:center;
    position:relative
}
.service-index .service-customer dt .down{
    width:12px;
    height:12px;
    margin-top:-.2rem
}
.service-index .service-customer dt .icon{
    width:35px;
    height:25px;
    background:50% no-repeat;
    background-size:contain;
    margin-right:5px;
    position:relative
}
.service-index .service-customer dt .icon .recommend{
    position:absolute;
    top:0;
    right:0;
    -webkit-transform:translate(50%,-53%);
    transform:translate(50%,-53%);
    line-height:1.15;
    padding:0 6.5px
}
.service-index .service-customer dt .text{
    font-size:.3rem;
    color:#282828;
    font-weight:700;
    width:40%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.service-index .service-customer dt .c-info{
    padding-left:5px;
    font-size:12px;
    color:#666;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.service-index .service-customer dt .tips{
    display:block;
    position:absolute;
    left:5%;
    width:35px;
    top:-8px;
    -webkit-transform:translateY(-60%);
    transform:translateY(-60%);
    text-align:center;
    font-size:10px;
    color:#fff;
    background:red;
    border-radius:15px
}
.service-index .service-customer dt .c-btn{
    border-radius:14rem;
    padding:2.5px 20.5px;
    color:#fff;
    background-color:#4171ff;
    font-size:.28rem;
    width:103px;
    text-align:center
}
.service-index .service-account{
    text-align:center;
    line-height:25px;
    padding:12.5px;
    background:#fff
}
.service-index .service-account .title{
    font-size:.38rem;
    font-weight:700
}
.service-index .service-account .copy-number{
    padding-top:15px
}
.service-index .service-account .copy-number img{
    width:170px
}
.service-index .service-account .des1{
    font-size:.26rem;
    color:#666;
    padding-top:5px
}
.service-index .service-account .des2{
    font-size:.22rem;
    color:#666
}
.service-index .service-vip-tips{
    margin-top:15px;
    background-repeat:no-repeat;
    background-size:100% 100%;
    padding:15px
}
.service-index .service-vip-tips,.service-index .service-vip-tips .tip-av{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    align-content:space-around;
    justify-content:space-around;
    align-items:center
}
.service-index .service-vip-tips .tip-av img{
    width:65%
}
.service-index .service-vip-tips .tip-des{
    color:#fff
}
.service-index .wechat-pic-index{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:650px;
    margin:0 auto
}
.service-index .wechat-pic-index .wechat-pic-site{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.service-index .wechat-pic-index .wechat-pic-site .wechat-pic-main{
    background:#fff;
    width:75%;
    text-align:center;
    padding:20px;
    border-radius:8px
}
.service-index .wechat-pic-index .wechat-pic-site .wechat-pic-main .close{
    text-align:right
}
.service-index .wechat-pic-index .wechat-pic-site .wechat-pic-main .close img{
    width:15px
}
.service-index .wechat-pic-index .wechat-pic-site .wechat-pic-main .wechat-pic-title{
    padding-bottom:10px;
    font-size:22px;
    font-weight:700;
    color:#282828
}
.service-index .wechat-pic-index .wechat-pic-site .wechat-pic-main .qrcode{
    padding-bottom:5px
}
.service-index .wechat-pic-index .wechat-pic-site .wechat-pic-main .qrcode img{
    width:150px
}
.service-index .wechat-pic-index .wechat-pic-site .wechat-pic-main .desc{
    color:#282828
}
.service-index .wechat-pic-index .wechat-pic-site .wechat-pic-main .btn{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px
}
.service-index .wechat-pic-index .wechat-pic-site .wechat-pic-main .btn .vip-b{
    border-radius:14rem;
    padding:7px 20.5px;
    color:#fff;
    background-color:#4171ff;
    font-size:.28rem
}
.service-index .wechat-pic-index .wechat-pic-site .wechat-pic-main .btn img{
    width:65%
}
.nav-view-body .service-index .service-title{
    display:none
}
.faq-index{
    padding:.2rem
}
.faq-index dl{
    padding:5px
}
.faq-index dt{
    background-size:.237rem auto;
    font-size:.32rem;
    color:#282828;
    font-weight:700;
    display:flex;
    align-items:center
}
.faq-index dt .icon{
    margin-right:5px;
    color:#fe8900
}
.faq-index dd{
    line-height:1.25;
    font-size:.28rem;
    color:#666;
    white-space:pre-line
}
.search-index{
    height:100%;
    position:relative;
    overflow:hidden;
    background:#f5f6f8
}
.search-index-input{
    border:none;
    background-color:#f5f6f8;
    border-radius:10px;
    display:flex;
    align-items:center
}
.search-index-input .icon{
    padding:5px
}
.search-index-input input{
    width:0;
    flex:1 1;
    border:none;
    background:none;
    margin-right:5px
}
.search-index-input .close{
    padding:5px
}
.search-index-btn{
    border:none;
    color:#f5842d
}
.search-index .search-cover{
    height:100%;
    position:relative;
    overflow:hidden;
    display:none;
    padding:10px
}
.search-index .search-cover.active{
    display:block
}
.search-index .search-cover .title{
    font-size:.3rem;
    font-weight:700
}
.search-index .search-cover .kws{
    margin-top:10px
}
.search-index .search-cover .kws .kw{
    background-color:#eee;
    padding:3.5px 6.5px;
    border-radius:8px;
    float:left;
    margin-right:10px;
    font-size:12px;
    display:flex;
    align-items:center
}
.search-index .search-cover .kws .kw .icon{
    margin-right:5px
}
.search-index .search-cover .kws .kw:first-child .icon{
    color:red
}
.search-index .search-cover .kws .kw:nth-child(2) .icon{
    color:green
}
.search-index .search-cover .groups{
    margin-top:10px
}
.search-index .search-cover .groups .group{
    float:left;
    width:50%
}
.search-index .search-cover .groups .group:first-child{
    border-right:1px solid #eee;
    padding-right:5px
}
.search-index .search-cover .groups .group:last-child .title{
    padding-left:10px
}
.search-index .search-cover .games{
    margin-top:10px
}
.search-index .search-cover .games .game{
    display:flex;
    align-items:center;
    overflow:hidden;
    margin-bottom:10px
}
.search-index .search-cover .games .game .index{
    width:25px;
    text-align:center;
    font-size:.28rem;
    font-weight:700
}
.search-index .search-cover .games .game:first-child .index,.search-index .search-cover .games .game:nth-child(2) .index,.search-index .search-cover .games .game:nth-child(3) .index{
    color:red
}
.search-index .search-cover .games .game .icon{
    flex-shrink:0;
    width:.88rem;
    height:.88rem;
    border-radius:.2rem;
    overflow:hidden;
    margin-right:.12rem
}
.search-index .search-cover .games .game .icon img{
    display:block;
    width:100%;
    height:100%
}
.search-index .search-cover .games .game .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.search-index .search-cover .games .game .name{
    font-size:.26rem;
    color:#282828;
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.search-index .search-cover .games .game .desc{
    font-size:.24rem;
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:5px
}
.search-index .search-result{
    height:100%;
    position:relative;
    overflow:hidden;
    padding:10px;
    display:none
}
.search-index .search-result.active{
    display:block
}
.search-index .search-result .item{
    margin-bottom:.3rem;
    display:flex;
    align-items:center;
    background:#fff;
    padding:10px;
    border-radius:8px
}
.search-index .search-result .item .icon{
    position:relative;
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.search-index .search-result .item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.search-index .search-result .item .icon .discount{
    position:absolute;
    top:0;
    right:0;
    background-color:red;
    color:#fff;
    font-size:10px;
    padding:2.5px 5px;
    line-height:1.25;
    border-bottom-left-radius:8px
}
.search-index .search-result .item .subject{
    flex:1 1;
    width:0;
    border-bottom:1px solid #dedede;
    padding-bottom:.2rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.search-index .search-result .item .text{
    flex:1 1;
    width:0;
    font-size:.2rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column;
    position:relative
}
.search-index .search-result .item .name{
    display:flex;
    align-items:center
}
.search-index .search-result .item .name .named{
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.3rem;
    color:#282828
}
.search-index .search-result .item .name .named span{
    padding:0 .1rem;
    color:#956528;
    background:#eebe75;
    font-size:.24rem;
    margin-right:2px;
    border-radius:3px
}
.search-index .search-result .item .name .authpic{
    margin:0 3.5px;
    padding:0 3.5px;
    color:#fff;
    border-radius:4px;
    font-size:12px;
    font-weight:400;
    white-space:nowrap
}
.search-index .search-result .item .name img{
    width:55px
}
.search-index .search-result .item .info1{
    color:#666;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.search-index .search-result .item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.2rem;
    color:#ff5e00
}
.search-index .search-result .item .info3{
    margin-top:.065rem;
    border-radius:3px
}
.search-index .search-result .item .info3 .first-text{
    padding:1px 3px;
    color:#fff;
    border-radius:3px
}
.search-index .search-result .item .info3 .second-text{
    border:1px solid;
    padding:0 .1rem;
    border-left:0;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px;
    margin-left:-1px
}
.search-index .search-result .item .discount{
    position:absolute;
    top:0;
    right:-10px;
    color:#fff;
    font-size:10px;
    padding:5px;
    line-height:1.25;
    width:50px;
    text-align:center;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.search-index .search-result .item .tag{
    display:inline-block;
    padding-left:5px
}
.search-index .search-result .item .tag:first-child{
    color:#ff5e00;
    padding-left:0
}
.search-index .search-result .item .tag:nth-child(2){
    color:#ffa21c
}
.search-index .search-result .item .tag:nth-child(3){
    color:#00a7ff
}
.search-index .search-result .item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.search-empty{
    display:flex;
    flex-direction:column;
    align-items:center;
    font-size:13px;
    color:#999
}
.search-empty img{
    display:block;
    width:50%
}
.trade-confirm{
    position:fixed;
    z-index:900;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all 3s
}
.trade-confirm:before{
    content:"";
    display:block;
    position:absolute;
    z-index:901;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.75);
    transition:all .25s;
    opacity:0
}
.trade-confirm .container{
    position:relative;
    z-index:902;
    width:90%;
    height:80%;
    display:flex;
    flex-direction:column;
    border-radius:10px;
    background:#fff top no-repeat;
    background-size:contain;
    transition:all .25s;
    opacity:0;
    -webkit-transform:scale(.75);
    transform:scale(.75)
}
.trade-confirm.appear-active:before,.trade-confirm.appear-done:before,.trade-confirm.enter-active:before,.trade-confirm.enter-done:before{
    opacity:1
}
.trade-confirm.appear-active .container,.trade-confirm.appear-done .container,.trade-confirm.enter-active .container,.trade-confirm.enter-done .container{
    opacity:1;
    -webkit-transform:scale(1);
    transform:scale(1)
}
.trade-confirm.exit-active:before{
    opacity:0
}
.trade-confirm.exit-active .container{
    opacity:0;
    -webkit-transform:scale(.75);
    transform:scale(.75)
}
.trade-confirm .head{
    color:#fff;
    padding:15px;
    text-align:center
}
.trade-confirm .head .title{
    font-weight:700;
    font-size:.3rem
}
.trade-confirm .head .info{
    font-size:.26rem;
    margin-top:5px
}
.trade-confirm .main{
    flex:1 1;
    height:0;
    padding:10px;
    display:flex;
    flex-direction:column
}
.trade-confirm .main .title{
    display:flex;
    align-items:center;
    color:#000;
    font-size:.28rem
}
.trade-confirm .main .title img{
    height:20px;
    margin-right:5px
}
.trade-confirm .process{
    padding:10px 0
}
.trade-confirm .process img{
    display:block;
    width:85%;
    margin:0 auto
}
.trade-confirm .process ul{
    margin-top:10px
}
.trade-confirm .process ul li{
    float:left;
    width:25%;
    text-align:center
}
.trade-confirm .body{
    flex:1 1;
    height:0;
    padding:10px;
    overflow:hidden;
    overflow-y:scroll;
    position:relative;
    -webkit-overflow-scrolling:touch
}
.trade-confirm .body p{
    padding-left:15px;
    position:relative;
    margin-bottom:5px;
    font-size:12px
}
.trade-confirm .body p:before{
    content:"";
    display:inline-block;
    width:6px;
    height:6px;
    background-color:#ffc000;
    border-radius:50%;
    position:absolute;
    top:10px;
    left:0
}
.trade-confirm .operate .input{
    display:flex;
    align-items:center;
    padding-left:10px;
    padding-right:10px;
    padding-bottom:10px
}
.trade-confirm .operate .input input{
    margin-right:10px
}
.trade-confirm .operate .buy{
    display:block;
    background-color:#ffc000;
    margin-left:10px;
    margin-right:10px;
    border-radius:20px;
    padding:10px;
    font-size:.28rem;
    color:#fff;
    text-align:center;
    margin-bottom:7.5px;
    transition:all .25s
}
.trade-confirm .operate .buy.disable{
    background-color:#eee
}
.trade-detail{
    background:#f5f5f8;
    padding:10px
}
.trade-detail .trade-game{
    padding:10px;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    border-radius:8px;
    background:#fff
}
.trade-detail .trade-game .icon{
    flex-shrink:0;
    width:1.08rem;
    height:1.08rem;
    border-radius:.2rem;
    overflow:hidden;
    margin-right:.19rem
}
.trade-detail .trade-game .icon img{
    display:block;
    width:100%;
    height:100%
}
.trade-detail .trade-game .text{
    flex:1 1;
    width:0
}
.trade-detail .trade-game .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.trade-detail .trade-game .name{
    font-size:.3rem;
    color:#000;
    font-weight:700
}
.trade-detail .trade-game .info,.trade-detail .trade-game .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem
}
.trade-detail .trade-game .info{
    font-size:.26rem;
    color:#999
}
.trade-detail .trade-game .info span{
    padding-right:5px
}
.trade-detail .trade-game .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#666
}
.trade-detail .trade-game .info2 .tag{
    display:inline-block;
    padding-right:5px;
    color:#fab72b
}
.trade-detail .trade-game .info2 .tag:first-child{
    color:#ff4200
}
.trade-detail .trade-game .info2 .tag:nth-child(2){
    color:#75d100
}
.trade-detail .trade-game .info2 .tag:last-child{
    color:#2893ff
}
.trade-detail .trade-item{
    padding:12.5px 0
}
.trade-detail .trade-item:last-child{
    padding-bottom:65px
}
.trade-detail .trade-item .head{
    color:#282828;
    font-size:.32rem;
    font-weight:700
}
.trade-detail .trade-item .head span{
    color:red;
    font-size:.28rem
}
.trade-detail .trade-item .body{
    margin-top:10px
}
.trade-detail .trade-item .body.base{
    display:flex;
    align-items:center;
    background:#fff;
    padding:12.5px;
    border-radius:8px
}
.trade-detail .trade-item .body.base .info{
    flex:1 1;
    position:relative
}
.trade-detail .trade-item .body.base .info .item{
    margin:5px auto
}
.trade-detail .trade-item .body.base .price{
    color:#fa3932;
    font-size:.3rem
}
.trade-detail .trade-item .body.desc{
    background:#fff;
    padding:12.5px;
    border-radius:8px
}
.trade-detail .trade-item .body.imgs .img{
    display:block;
    float:left;
    width:33.333%;
    padding-right:12.5px;
    padding-top:12.5px
}
.trade-detail .trade-item .body.imgs .img .img{
    display:block;
    width:100%
}
.trade-detail .trade-item .body.imgs .img img{
    height:95px;
    object-fit:cover;
    width:100%;
    margin:0 auto;
    border-radius:8px
}
.trade-detail .trade-item:last-child .body{
    margin-top:0
}
.trade-detail .trade-desc{
    background-color:pink;
    color:#cd5c5c;
    padding:5px 15px;
    position:relative
}
.trade-detail .trade-state{
    position:absolute;
    right:10px;
    top:50%;
    -webkit-transform:translateY(-60%);
    transform:translateY(-60%)
}
.trade-detail .trade-state img{
    display:block;
    width:75px
}
.trade-detail .trade-operate{
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    padding:10px 5px env(safe-area-inset-bottom);
    background-color:#fff;
    display:flex
}
.trade-detail .trade-operate .favorite{
    display:flex;
    flex-direction:column;
    align-items:center;
    margin-right:5px;
    transition:all .1s;
    justify-content:center;
    font-size:.2rem
}
.trade-detail .trade-operate .favorite .favorite{
    display:block
}
.trade-detail .trade-operate .favorite.active .favorite,.trade-detail .trade-operate .favorite .favorited{
    display:none
}
.trade-detail .trade-operate .favorite.active .favorited{
    display:block
}
.trade-detail .trade-operate .favorite img{
    width:19px;
    margin:0 auto
}
.trade-detail .trade-operate .btn{
    flex:1 1;
    margin:0 5px;
    background-color:#ffc000;
    color:#fff;
    text-align:center;
    padding:10px;
    font-size:.28rem;
    border-radius:20px
}
.nav-view-head .operate .trade-operates .anticon{
    font-size:22px;
    margin-left:10px
}
.trade-index{
    background-color:#f5f6f8
}
.trade-index .trade-head{
    position:fixed;
    z-index:100;
    top:0;
    left:0;
    right:0;
    padding-top:env(safe-area-inset-top);
    background-color:#ffc000;
    color:#fff
}
.trade-index .trade-head .background{
    opacity:0;
    position:absolute;
    z-index:1;
    inset:0;
    background-color:#ffc000;
    transition:all .1s ease 0s
}
.trade-index .trade-head .container{
    position:relative;
    z-index:560;
    height:40px;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:18px;
    transition:all .1s
}
.trade-index .trade-menu{
    display:flex;
    padding:5px
}
.trade-index .trade-menu .item{
    flex:1 1;
    margin:5px;
    background-color:#fff;
    border-radius:8px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:10px;
    color:#282828;
    font-size:.26rem;
    height:1.635rem
}
.trade-index .trade-menu .item img{
    display:block;
    height:30px;
    margin-bottom:2.5px
}
.trade-index .trade-screen-menu{
    padding-top:calc(env(safe-area-inset-top) + 50px)
}
.trade-index .trade-body{
    padding:10px
}
.trade-index-notice{
    padding:5px
}
.trade-index-good .title,.trade-index-good .title .text{
    display:flex;
    align-items:center
}
.trade-index-good .title .text{
    flex:1 1;
    font-size:.34rem;
    color:#000;
    font-weight:700
}
.trade-index-good .title .text img{
    height:15px;
    margin:0 5px
}
.trade-index-good .title .more{
    font-size:13px
}
.trade-index-good .items{
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex;
    margin:0 -5px
}
.trade-index-good .items .item{
    width:60%;
    flex-shrink:0;
    background-color:#fff;
    border-radius:8px;
    padding:10px;
    margin:5px;
    display:flex;
    align-items:center
}
.trade-index-good .items .item .icon{
    width:60px;
    height:60px;
    border-radius:8px;
    overflow:hidden;
    margin-right:7.5px
}
.trade-index-good .items .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.trade-index-good .items .item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    line-height:1.7
}
.trade-index-good .items .item .title{
    font-size:.28rem;
    color:#282828;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    display:block;
    font-weight:700
}
.trade-index-good .items .item .name{
    color:#ff5e00;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.22rem
}
.trade-index-good .items .item .price{
    color:#ff5e00;
    font-size:.28rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.trade-index-good .items .item .price span{
    font-size:.22rem
}
.trade-list{
    min-height:100vh
}
.trade-list .list-head-place{
    height:0
}
.trade-list .list-head-place.active{
    height:50px
}
.trade-list .list-head{
    display:flex;
    align-items:center;
    position:relative;
    height:50px
}
.trade-list .list-head.fixed{
    position:fixed;
    z-index:555;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    padding:0 10px;
    background-color:#fff
}
.trade-list .list-head .sort{
    font-size:.3rem;
    color:#000;
    font-weight:700;
    font-size:.2rem;
    display:flex;
    align-items:center
}
.trade-list .list-head .sort .title{
    font-size:.34rem
}
.trade-list .list-head .sort .icon{
    margin:0 5px
}
.trade-list .list-head .sorts{
    background-color:#fff;
    padding:5px 10px;
    border-radius:4px;
    position:absolute;
    top:100%;
    left:0;
    box-shadow:0 0 3px #eee;
    transition:all .25s;
    opacity:0;
    -webkit-transform:scaleY(0);
    transform:scaleY(0);
    -webkit-transform-origin:top center;
    transform-origin:top center
}
.trade-list .list-head .sorts.enter-active,.trade-list .list-head .sorts.enter-done{
    opacity:1;
    -webkit-transform:scaleY(1);
    transform:scaleY(1);
    z-index:1
}
.trade-list .list-head .sorts.exit-active{
    opacity:0;
    -webkit-transform:scaleY(0);
    transform:scaleY(0)
}
.trade-list .list-head .sorts .item{
    padding:5px;
    font-size:.28rem;
    color:#000
}
.trade-list .list-head .sorts .item.active{
    color:#ffc000
}
.trade-list .list-head .filter{
    color:#000;
    font-size:.34rem;
    margin-right:10px;
    width:26px
}
.trade-list .list-head .input{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    align-items:center;
    background-color:#eee;
    border-radius:20px;
    padding:7.5px 12.5px;
    font-size:.24rem
}
.trade-list .list-head .input input{
    flex:1 1;
    background:none;
    border:none
}
.trade-list .list-head .input .icon{
    width:16px
}
.trade-list .list-head .switch-img{
    margin-left:10px;
    display:flex;
    flex-wrap:nowrap;
    align-content:center;
    justify-content:center;
    align-items:center;
    flex-direction:column
}
.trade-list .list-head .switch-img img{
    width:18px
}
.trade-list .list-select{
    padding-bottom:.12rem
}
.trade-list .list-select.fixed{
    position:fixed;
    z-index:555;
    top:calc(env(safe-area-inset-top) + 90px);
    left:0;
    right:0;
    padding:0 10px;
    background-color:#fff;
    height:50px
}
.trade-list .list-select .items{
    align-items:center;
    overflow:hidden;
    text-align:justify;
    display:flex
}
.trade-list .list-select .items .item{
    width:22.92%;
    background:#fff;
    flex-shrink:0;
    margin-left:10px;
    position:relative;
    overflow:hidden;
    text-align:center;
    padding:5px;
    background-size:100% 100%;
    border-radius:50px;
    color:#282828;
    border:1px solid #ccc;
    font-size:.26rem
}
.trade-list .list-select .items .item.active{
    background:#ffc000;
    color:#fff;
    border:0
}
.trade-list .list-select .items .item:first-child{
    margin-left:0
}
.trade-list .list-body{
    margin-top:5px;
    background:#f5f6f8
}
.trade-list .list-body .item{
    background-color:#fff;
    padding:10px;
    display:block;
    margin-top:10px;
    border-radius:8px
}
.trade-list .list-body .item:first-child{
    margin-top:0
}
.trade-list .list-body .main .icon{
    width:130px;
    height:75px;
    margin-right:10px;
    float:left
}
.trade-list .list-body .main .icon img{
    display:block;
    width:100%;
    height:100%;
    border-radius:8px;
    object-fit:cover
}
.trade-list .list-body .main .info{
    flex:1 1;
    display:flex;
    flex-direction:column;
    justify-items:center
}
.trade-list .list-body .main .info .name{
    font-size:.28rem;
    font-weight:700;
    color:#000;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.trade-list .list-body .main .info .name .type{
    background-color:#ffc000;
    border-radius:2px;
    padding:0 3px;
    color:#fff;
    font-size:12px;
    margin-right:5px;
    display:inline
}
.trade-list .list-body .main .info .name .type-1:after{
    content:"BT版"
}
.trade-list .list-body .main .info .name .type-2:after{
    content:"折扣版"
}
.trade-list .list-body .main .info .name .type-3:after{
    content:"H5版"
}
.trade-list .list-body .main .info .name .type-4:after{
    content:"GM版"
}
.trade-list .list-body .main .info .title{
    margin-top:10px;
    font-size:.24rem;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.trade-list .list-body .main .info .title .ios{
    font-size:16px;
    color:#666;
    margin-right:2.5px;
    display:inline
}
.trade-list .list-body .main .info .title .android{
    font-size:16px;
    color:green;
    margin-right:2.5px;
    display:inline
}
.trade-list .list-body .data{
    display:flex;
    align-items:center;
    position:relative;
    clear:both
}
.trade-list .list-body .data .time{
    flex:1 1;
    width:0;
    color:#999;
    font-size:12px;
    padding-top:10px
}
.trade-list .list-body .data .prices{
    align-items:center;
    position:absolute;
    right:0;
    bottom:0
}
.trade-list .list-body .data .prices .amount{
    text-decoration:line-through;
    color:#ccc;
    font-size:12px;
    text-align:end
}
.trade-list .list-body .data .prices .price{
    color:#ff5e00;
    font-size:.28rem
}
.trade-list .list-body .item-multiple{
    padding:0 0 5px;
    width:48%;
    float:left;
    margin-right:4%;
    background:#fff;
    margin-bottom:.2rem;
    border-radius:8px
}
.trade-list .list-body .item-multiple .main{
    display:block;
    margin-bottom:-3px
}
.trade-list .list-body .item-multiple .main .icon{
    width:100%;
    height:95px;
    background:#282828;
    border-top-left-radius:8px;
    border-top-right-radius:8px
}
.trade-list .list-body .item-multiple .main .icon img{
    width:100%;
    margin:0 auto;
    border-top-left-radius:8px;
    border-top-right-radius:8px;
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
    object-fit:cover
}
.trade-list .list-body .item-multiple .main .info{
    padding:8px;
    line-height:1.7
}
.trade-list .list-body .item-multiple .main .info .name{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.trade-list .list-body .item-multiple .main .info .name .type{
    display:inline
}
.trade-list .list-body .item-multiple .main .info .title{
    display:block;
    margin-top:5px
}
.trade-list .list-body .item-multiple .data{
    padding:0 8px
}
.trade-list .list-body .item-multiple .data .prices{
    display:flex;
    position:unset;
    margin-bottom:0
}
.trade-list .list-body .item-multiple .data .prices .price{
    margin-right:.2rem
}
.trade-list .list-body .item-multiple:nth-child(2n){
    margin-right:0
}
.trade-list .list-filter{
    position:fixed;
    z-index:777;
    top:0;
    bottom:0;
    left:0;
    right:0;
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
.trade-list .list-filter .mask{
    position:fixed;
    z-index:888;
    top:0;
    bottom:0;
    left:0;
    right:0;
    background-color:rgba(0,0,0,.75);
    transition:all .25s;
    opacity:0
}
.trade-list .list-filter .container{
    position:relative;
    z-index:999;
    background-color:#fff;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    padding:10px 10px env(safe-area-inset-bottom);
    transition:all .25s;
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.trade-list .list-filter.enter-active .mask,.trade-list .list-filter.enter-done .mask{
    opacity:1
}
.trade-list .list-filter.enter-active .container,.trade-list .list-filter.enter-done .container{
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0)
}
.trade-list .list-filter.exit-active .mask{
    opacity:0
}
.trade-list .list-filter.exit-active .container{
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.trade-list .list-filter .title{
    font-size:.3rem;
    color:#000;
    font-weight:700;
    margin:10px auto
}
.trade-list .list-filter .type{
    display:flex;
    align-items:center
}
.trade-list .list-filter .type .item{
    width:65px;
    margin-right:10px;
    text-align:center;
    padding:5px 0;
    background-color:#ccc;
    color:#000;
    font-size:.28rem;
    border-radius:4px
}
.trade-list .list-filter .type .item.active{
    background-color:#ffc000;
    color:#fff
}
.trade-list .list-filter .prices{
    display:flex;
    align-items:center;
    justify-content:space-between
}
.trade-list .list-filter .prices input{
    border:1px solid #eee;
    padding:5px 0;
    color:#000;
    border-radius:4px;
    text-align:center
}
.trade-list .list-filter .tag{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    margin-left:-10px;
    margin-top:-10px
}
.trade-list .list-filter .tag .item{
    flex:0 0 25%
}
.trade-list .list-filter .tag .item span{
    display:block;
    margin-left:10px;
    margin-top:10px;
    text-align:center;
    padding:5px 0;
    background-color:#ccc;
    color:#000;
    font-size:.28rem;
    border-radius:4px
}
.trade-list .list-filter .tag .item.active span{
    background-color:#ffc000;
    color:#fff
}
.trade-list .list-filter .operate{
    margin-top:15px;
    display:flex;
    align-items:center;
    margin-bottom:15px
}
.trade-list .list-filter .operate .btn{
    flex:1 1;
    background-color:#ffc000;
    border:1px solid #ffc000;
    color:#fff;
    border-radius:20px;
    padding:7.5px 0;
    text-align:center
}
.trade-list .list-filter .operate .btn:first-child{
    margin-right:10px;
    background-color:#fff;
    color:#ffc000
}
.trade-notice .notice-info{
    background-color:#ffc000;
    color:#fff;
    font-size:.26rem;
    padding:calc(env(safe-area-inset-top) + 50px) 10px 10px
}
.trade-notice .notice-process{
    padding-top:10px;
    border-bottom:10px solid #f5f6f8
}
.trade-notice .notice-process:last-child{
    border-bottom:0
}
.trade-notice .notice-process .title{
    display:flex;
    align-items:center;
    color:#000;
    font-size:.28rem;
    padding:0 10px
}
.trade-notice .notice-process .title img{
    height:20px;
    margin-right:5px
}
.trade-notice .notice-process .process{
    padding:10px 0
}
.trade-notice .notice-process .process img{
    display:block;
    width:85%;
    margin:0 auto
}
.trade-notice .notice-process .process ul{
    margin-top:10px
}
.trade-notice .notice-process .process ul li{
    float:left;
    width:25%;
    text-align:center
}
.trade-notice .notice-process .body{
    padding:10px;
    overflow:hidden
}
.trade-notice .notice-process .body p{
    padding-left:15px;
    position:relative;
    margin-bottom:5px;
    font-size:12px
}
.trade-notice .notice-process .body p:before{
    content:"";
    display:inline-block;
    width:6px;
    height:6px;
    background-color:#ffc000;
    border-radius:50%;
    position:absolute;
    top:10px;
    left:0
}
.trade-good{
    background-color:#f8f8f8;
    padding:10px
}
.trade-good .good-img{
    padding:0 10px
}
.trade-good .good-img img{
    display:block;
    margin:0 auto
}
.trade-submit .trade-body{
    padding:10px
}
.trade-submit .trade-input{
    display:flex;
    align-items:center;
    border-bottom:1px solid #eee;
    padding:10px 0
}
.trade-submit .trade-input.develop{
    flex-direction:column;
    align-items:flex-start
}
.trade-submit .trade-input .name{
    flex:1 1;
    width:0;
    font-size:.28rem;
    color:#333
}
.trade-submit .trade-input .value{
    overflow:hidden;
    position:relative
}
.trade-submit .trade-input.develop .name{
    width:100%
}
.trade-submit .trade-input.develop .value{
    width:100%;
    margin-top:5px
}
.trade-submit .trade-input select{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%;
    opacity:0
}
.trade-submit .trade-input input{
    text-align:right
}
.trade-submit .trade-input input,.trade-submit .trade-input textarea{
    width:100%;
    background:none;
    border:none;
    padding:5px
}
.trade-submit .trade-input.develop input{
    text-align:left
}
.trade-submit .trade-tips{
    font-size:13px;
    margin-bottom:50px
}
.trade-submit .trade-tips p{
    margin-top:10px
}
.trade-submit .trade-tips span{
    color:#ffc000
}
.trade-submit .trade-operate{
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    background-color:#fff;
    padding:7.5px 10px env(safe-area-inset-bottom);
    display:flex;
    align-items:center;
    z-index:99
}
.trade-submit .trade-operate .btn{
    flex:1 1;
    background-color:#ffc000;
    border-radius:20px;
    padding:7.5px;
    font-size:.28rem;
    color:#fff;
    text-align:center;
    margin-bottom:7.5px
}
.trade-record .record-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#fff;
    height:45px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-bottom:1px solid #eee
}
.trade-record .record-head .item{
    flex:1 1;
    text-align:center;
    font-size:15px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transition:all .25s;
    color:#333
}
.trade-record .record-head .item:after{
    content:"";
    display:none;
    width:25px;
    height:2px;
    margin-top:2.5px;
    background-color:#ffc000
}
.trade-record .record-head .item.active{
    font-size:16px;
    color:#000;
    font-weight:700
}
.trade-record .record-head .item.active:after{
    display:block
}
.trade-record .record-body{
    margin-top:45px;
    padding:12.5px;
    position:relative;
    background-color:#f8f8f8;
    min-height:100vh
}
.trade-record .record-body .type-item{
    display:none
}
.trade-record .record-body .type-item.active{
    display:block
}
.trade-record .record-body .type-item-submit{
    padding-top:30px
}
.trade-record .record-body .type-item .am-swipe-btn{
    color:#fff;
    background-color:red
}
.trade-record .record-body .type-item .items .item{
    background-color:#fff;
    border-radius:4px;
    margin-bottom:10px;
    overflow:hidden;
    position:relative;
    display:flex
}
.trade-record .record-body .type-item .items .body{
    background-color:#fff;
    padding:10px;
    flex:1 1;
    transition:.1s
}
.trade-record .record-body .type-item .items .operate{
    background-color:red;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:.1s;
    max-width:0;
    padding:0;
    opacity:0
}
.trade-record .record-body .type-item .items .operable .operate{
    padding:15px;
    opacity:1
}
.trade-record .record-body .type-item .items .main{
    display:flex;
    align-items:center
}
.trade-record .record-body .type-item .items .main .icon{
    width:75px;
    height:55px;
    margin-right:10px
}
.trade-record .record-body .type-item .items .main .icon img{
    display:block;
    width:100%;
    height:100%
}
.trade-record .record-body .type-item .items .main .info{
    flex:1 1;
    display:flex;
    flex-direction:column;
    justify-items:center
}
.trade-record .record-body .type-item .items .main .info .name{
    font-size:.3rem;
    color:#000;
    display:flex;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.trade-record .record-body .type-item .items .main .info .name .type{
    background-color:#ffc000;
    border-radius:2px;
    padding:2px 3px;
    color:#fff;
    font-size:12px;
    margin-right:5px
}
.trade-record .record-body .type-item .items .main .info .name .type-1:after{
    content:"BT版"
}
.trade-record .record-body .type-item .items .main .info .name .type-2:after{
    content:"折扣版"
}
.trade-record .record-body .type-item .items .main .info .name .type-3:after{
    content:"H5版"
}
.trade-record .record-body .type-item .items .main .info .name .type-4:after{
    content:"GM版"
}
.trade-record .record-body .type-item .items .main .info .title{
    margin-top:5px;
    font-size:13px;
    display:flex;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.trade-record .record-body .type-item .items .main .info .title .ios{
    font-size:16px;
    color:#666;
    margin-right:2.5px
}
.trade-record .record-body .type-item .items .main .info .title .android{
    font-size:16px;
    color:green;
    margin-right:2.5px
}
.trade-record .record-body .type-item .items .data{
    display:flex;
    align-items:center
}
.trade-record .record-body .type-item .items .data .time{
    flex:1 1;
    width:0;
    color:#ccc;
    font-size:12px;
    padding-top:5px
}
.trade-record .record-body .type-item .items .data .prices{
    display:flex;
    align-items:center
}
.trade-record .record-body .type-item .items .data .prices .amount{
    text-decoration:line-through;
    color:#ccc;
    font-size:12px;
    margin-right:10px
}
.trade-record .record-body .type-item .items .data .prices .price{
    color:#ffa21c;
    font-size:.3rem
}
.trade-record .record-tips{
    position:fixed;
    z-index:333;
    top:calc(env(safe-area-inset-top) + 85px);
    left:0;
    right:0;
    background-color:#fff;
    padding:0 5px;
    text-align:center;
    color:red;
    display:flex;
    align-items:center;
    justify-content:center;
    height:30px
}
.article-detail{
    padding:10px;
    background:#f5f6f8
}
.article-detail .article{
    padding:10px;
    font-size:.28rem;
    line-height:1.75;
    background:#fff;
    border-radius:8px
}
.article-detail .act-tit{
    font-weight:700;
    color:#000;
    font-size:15px;
    margin:10px auto
}
.article-detail .game{
    bottom:0;
    left:0;
    right:0;
    background-color:#eee;
    padding:10px;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    background:#fff;
    margin-bottom:10px;
    border-radius:8px
}
.article-detail .game .icon{
    flex-shrink:0;
    width:1.4rem;
    height:1.4rem;
    border-radius:.2rem;
    overflow:hidden;
    margin-right:.19rem
}
.article-detail .game .icon img{
    display:block;
    width:100%;
    height:100%
}
.article-detail .game .text{
    flex:1 1;
    width:0
}
.article-detail .game .name{
    font-size:.3rem;
    color:#000;
    font-weight:700
}
.article-detail .game .info,.article-detail .game .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem
}
.article-detail .game .info{
    font-size:.26rem;
    color:#999
}
.article-detail .game .info span{
    padding-right:5px
}
.article-detail .game .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#666;
    margin-bottom:.05rem
}
.article-detail .game .info2 .tag{
    display:inline-block;
    padding-left:5px
}
.article-detail .game .info2 .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.article-detail .game .info2 .tag:nth-child(2){
    color:#75d100
}
.article-detail .game .info2 .tag:nth-child(3){
    color:#2893ff
}
.article-detail .game .btn{
    color:#fff;
    font-size:12px;
    background-color:#ffc000;
    border-radius:15px;
    padding:5.5px 16.5px
}
.article-index .article-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#fff;
    height:45px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-bottom:1px solid #eee
}
.article-index .article-head .item{
    flex:1 1;
    position:relative;
    text-align:center;
    font-size:15px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transition:all .25s
}
.article-index .article-head .item:after{
    content:"";
    display:none;
    width:25px;
    height:2px;
    margin-top:2.5px;
    background-color:#ffc000
}
.article-index .article-head .item.active{
    font-size:16px;
    color:#000;
    font-weight:700
}
.article-index .article-head .item.active:after{
    display:block
}
.article-index .article-body{
    margin-top:45px;
    padding:12.5px;
    position:relative
}
.article-index .article-body .type-item{
    display:none
}
.article-index .article-body .type-item.active{
    display:block
}
.article-index .article-body .type-item .item{
    display:flex;
    align-items:center;
    border-radius:8px;
    background:50% no-repeat;
    background-size:100% 100%;
    border-top:1px solid #eee;
    padding:10px 0
}
.article-index .article-body .type-item .item:first-child{
    border-top:none;
    padding-top:0
}
.article-index .article-body .type-item .item:after{
    content:">";
    font-size:.3rem
}
.article-index .article-body .type-item .item .icon{
    width:60px;
    height:60px;
    margin-right:10px
}
.article-index .article-body .type-item .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.article-index .article-body .type-item .item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.article-index .article-body .type-item .item .title{
    font-size:.28rem;
    color:#333;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.article-index .article-body .type-item .item .time{
    font-size:13px;
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.server-index .server-type{
    position:fixed;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    border-bottom:1px solid #eee;
    background-color:#fff
}
.server-index .server-type .item{
    width:33.333%;
    float:left;
    text-align:center;
    font-size:.28rem;
    position:relative;
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center
}
.server-index .server-type .item:after{
    content:"";
    display:block;
    position:absolute;
    bottom:5px;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    width:20px;
    height:2px;
    background-color:#ffc000;
    opacity:0
}
.server-index .server-type .item.active{
    font-size:.3rem;
    color:#000
}
.server-index .server-type .item.active:after{
    opacity:1
}
.server-index .server-body{
    margin-top:40px
}
.server-index .server-body-item{
    overflow:hidden;
    display:none;
    background:#f5f6f8
}
.server-index .server-body-item.active{
    display:block
}
.server-index .server-time{
    position:fixed;
    top:calc(env(safe-area-inset-top) + 80px);
    left:0;
    right:0;
    height:40px;
    padding:0 10px;
    background-color:#f5f6f8;
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex;
    align-items:center;
    justify-items:center
}
.server-index .server-time .item{
    flex-shrink:0;
    margin-left:10px;
    background-color:#eee;
    padding:3.5px 6.5px;
    border-radius:12px
}
.server-index .server-time .item.active{
    background-color:#ffc000;
    color:#fff
}
.server-index .server-time .item:first-child{
    margin-left:0
}
.server-index .server-groups{
    padding:0 10px 10px
}
.server-index .server-group{
    margin-top:10px
}
.server-index .server-group .group-title{
    display:flex;
    align-items:center;
    font-size:.3rem
}
.server-index .server-group .group-title .icon{
    font-size:18px;
    margin-right:5px;
    color:#ffc000
}
.server-index .server-item{
    margin-top:.3rem;
    display:flex;
    align-items:center;
    background:#fff;
    padding:10px;
    border-radius:8px
}
.server-index .server-item .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.server-index .server-item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.server-index .server-item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.7;
    display:flex;
    flex-direction:column
}
.server-index .server-item .name{
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.3rem;
    color:#282828
}
.server-index .server-item .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.065rem;
    margin-top:.065rem
}
.server-index .server-item .info2{
    display:flex;
    align-items:center;
    color:#ff5e00
}
.server-index .server-item .info2 .server{
    color:#ff5e00;
    margin-right:10px
}
.server-index .server-item .info2 .time{
    color:#fff;
    margin-right:10px;
    background:#ff446a;
    border-radius:6px;
    padding:0 5px
}
.server-index .server-item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.server-index .server-item-div{
    background:#fff;
    border-radius:8px;
    margin-top:.3rem
}
.server-index .server-item-div .server-item{
    margin-top:0
}
.server-index .server-tag{
    position:fixed;
    z-index:555;
    top:0;
    bottom:0;
    left:0;
    right:0
}
.server-index .server-tag .mask{
    position:fixed;
    z-index:666;
    top:0;
    bottom:0;
    left:0;
    right:0;
    background-color:rgba(0,0,0,.5);
    transition:all .25s;
    opacity:0
}
.server-index .server-tag .container{
    position:fixed;
    z-index:777;
    bottom:0;
    left:0;
    right:0;
    background-color:#fff;
    border-top-left-radius:8px;
    border-top-right-radius:8px;
    padding:10px 10px env(safe-area-inset-bottom);
    transition:all .25s;
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.server-index .server-tag.enter-active .mask,.server-index .server-tag.enter-done .mask{
    opacity:1
}
.server-index .server-tag.enter-active .container,.server-index .server-tag.enter-done .container{
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0)
}
.server-index .server-tag.exit-active .mask{
    opacity:0
}
.server-index .server-tag.exit-active .container{
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.server-index .server-tag .title{
    font-size:.28rem;
    color:#000
}
.server-index .server-tag .tags{
    margin-left:-5px;
    margin-right:-5px
}
.server-index .server-tag .tag{
    margin-top:0;
    float:left;
    width:25%;
    padding:10px;
    color:#000
}
.server-index .server-tag .tag div{
    background-color:#eee;
    padding:5px;
    text-align:center
}
.server-index .server-tag .tag.active{
    color:#fff
}
.server-index .server-tag .tag.active div{
    background-color:#ffc000
}
.server-index .server-today{
    margin-top:40px
}
.user-index{
    background:#f5f6f8;
    padding-bottom:65px
}
.user-index .user-halo{
    position:fixed;
    z-index:100;
    top:0;
    left:0;
    right:0;
    padding-top:env(safe-area-inset-top);
    background-color:#ffc000;
    color:#fff
}
.user-index .user-halo .background{
    position:absolute;
    z-index:1;
    inset:0;
    background-color:#ffc000;
    transition:all .1s ease 0s
}
.user-index .user-halo .container{
    position:relative;
    z-index:560;
    height:40px;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:18px;
    transition:all .1s
}
.user-index .user-head{
    padding-top:env(safe-area-inset-top);
    background:50% no-repeat;
    background-size:cover
}
.user-index .user-head .container{
    position:relative;
    padding:25px 12.5px 0
}
.user-index .user-head .operate{
    position:absolute;
    right:0;
    top:0;
    padding:5px 7.5px
}
.user-index .user-head .operate .item{
    color:#fff;
    font-size:22px;
    padding:2.5px;
    position:relative
}
.user-index .user-head .operate .item .tip{
    display:block;
    background:red;
    border-radius:50%;
    width:8px;
    height:8px;
    top:0;
    right:0;
    position:absolute
}
.user-index .user-head .user{
    display:flex;
    align-items:center
}
.user-index .user-head .user .icon{
    width:65px;
    height:65px;
    border-radius:50%;
    overflow:hidden;
    margin-right:10px
}
.user-index .user-head .user .icon img{
    display:block;
    width:100%;
    height:100%
}
.user-index .user-head .user .vipcrown{
    width:25px;
    margin-top:-1rem;
    margin-left:-.5rem;
    margin-right:.15rem
}
.user-index .user-head .user .info{
    flex:1 1;
    width:0;
    color:#fff
}
.user-index .user-head .user .name{
    font-size:.3rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-index .user-head .user .account,.user-index .user-head .user .phone,.user-index .user-head .user .usefultime{
    font-size:12px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-index .user-head .user .empty{
    font-size:.32rem;
    font-weight:700
}
.user-index .user-head .vip{
    margin-top:15px;
    border-top-left-radius:8px;
    border-top-right-radius:8px;
    display:flex;
    align-items:center;
    padding:7.5px;
    background-size:100% 100%;
    background-repeat:no-repeat
}
.user-index .user-head .vip .icon{
    margin-right:5px
}
.user-index .user-head .vip .icon img{
    display:block;
    height:25px
}
.user-index .user-head .vip .title{
    color:#fff;
    font-weight:700;
    font-size:.3rem
}
.user-index .user-head .vip .info{
    flex:1 1;
    width:0;
    text-align:center;
    color:#fff;
    font-size:10px;
    padding-left:10px;
    padding-right:10px
}
.user-index .user-head .vip .btn{
    color:rgba(0,0,0,.7);
    background-color:#fff;
    border-radius:20px;
    padding:5px 7.5px;
    font-size:12px;
    background-size:100% 100%;
    background-repeat:no-repeat;
    color:#333
}
.user-index .user-no-dis{
    display:none
}
.user-index .user-body{
    padding:15px
}
.user-index .user-body .economy{
    display:flex;
    align-items:stretch;
    background:#fff;
    border-radius:8px
}
.user-index .user-body .economy .item{
    flex:1 1;
    width:50%;
    padding:10px;
    display:flex;
    align-items:center;
    border-radius:8px;
    text-align:center
}
.user-index .user-body .economy .item:first-child{
    margin-right:5px
}
.user-index .user-body .economy .item:last-child{
    margin-left:5px
}
.user-index .user-body .economy .info{
    flex:1 1;
    width:0;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.user-index .user-body .economy .icon img{
    display:block;
    height:35px
}
.user-index .user-body .economy .name{
    color:#282828;
    font-size:.24rem
}
.user-index .user-body .economy .value{
    color:#282828;
    font-size:12px
}
.user-index .user-body .economy .value span{
    font-size:.38rem;
    font-weight:600
}
.user-index .user-body .economy .ec-link-text{
    color:#999;
    font-size:.24rem
}
.user-index .user-body .general-title{
    margin-top:12.5px
}
.user-index .user-body .general-title,.user-index .user-body .more-title{
    font-size:.3rem;
    font-weight:700;
    color:#282828
}
.user-index .user-body .general-func{
    margin-top:12.5px;
    background:#fff;
    border-radius:8px;
    margin-bottom:12.5px
}
.user-index .user-body .general-func .title{
    color:#000;
    font-size:.32rem
}
.user-index .user-body .general-func .item{
    float:left;
    width:25%;
    padding:10px;
    flex-direction:column;
    position:relative
}
.user-index .user-body .general-func .item,.user-index .user-body .general-func .item .icon{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center
}
.user-index .user-body .general-func .item .icon{
    width:30px;
    height:30px
}
.user-index .user-body .general-func .item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.user-index .user-body .general-func .item .text{
    margin-top:5px;
    font-size:.28rem;
    color:#000;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-index .user-body .general-func .item .angle{
    position:absolute;
    top:5px;
    right:20px;
    background-color:red;
    font-size:10px;
    color:#fff;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    border-radius:50%;
    width:20px;
    height:20px;
    display:flex;
    flex-direction:column;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center
}
.user-index .user-body .card img{
    width:100%
}
.user-index .user-body .more-func{
    margin-top:10px;
    background:#fff;
    border-radius:8px;
    margin-bottom:10px
}
.user-index .user-body .more-func .title{
    color:#000;
    font-size:.32rem
}
.user-index .user-body .more-func .item{
    float:left;
    width:25%;
    padding:10px;
    flex-direction:column
}
.user-index .user-body .more-func .item,.user-index .user-body .more-func .item .icon{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center
}
.user-index .user-body .more-func .item .icon{
    width:25px;
    height:25px
}
.user-index .user-body .more-func .item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.user-index .user-body .more-func .item-favorite .icon img{
    max-width:75%;
    max-height:75%
}
.user-index .user-body .more-func .item .text{
    margin-top:5px;
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-index .user-coin-pop-index{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.user-index .user-coin-pop-index .coin-pop-site{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.user-index .user-coin-pop-index .coin-pop-site .content{
    width:80%;
    background:#fff;
    border-radius:8px;
    padding:15px
}
.user-index .user-coin-pop-index .coin-pop-site .content .head{
    text-align:right
}
.user-index .user-coin-pop-index .coin-pop-site .content .head a{
    color:#ffc000
}
.user-index .user-coin-pop-index .coin-pop-site .content .title{
    text-align:center;
    padding:10px 0
}
.user-index .user-coin-pop-index .coin-pop-site .content .title img{
    width:45%;
    margin:0 auto;
    display:block
}
.user-index .user-coin-pop-index .coin-pop-site .content .title p{
    font-size:.36rem;
    color:#282828;
    font-weight:500
}
.user-index .user-coin-pop-index .coin-pop-site .content .text .desc .name{
    font-size:.32rem;
    color:#282828
}
.user-index .user-coin-pop-index .coin-pop-site .content .text .desc .info{
    font-size:.28rem;
    color:#666;
    padding:5px 0
}
.user-index .user-coin-pop-index .coin-pop-site .content .operate{
    background-color:#ffc000;
    font-size:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:20px;
    color:#fff;
    padding:10px 5px;
    transition:all .1s;
    flex-direction:column;
    line-height:1.25;
    width:65%;
    margin:.3rem auto
}
.user-index .user-coin-pop-index .coin-pop-site .close{
    background-size:100% 100%;
    width:25px;
    height:25px;
    z-index:500;
    margin:10% auto
}
.user-voucher-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#fff;
    max-width:720px;
    margin:0 auto
}
.user-voucher-head .items{
    height:45px;
    border-bottom:1px solid #eee
}
.user-voucher-head .item,.user-voucher-head .items{
    display:flex;
    align-items:center;
    justify-content:center
}
.user-voucher-head .item{
    width:33.333%;
    position:relative;
    text-align:center;
    font-size:15px;
    flex-direction:column;
    transition:all .25s
}
.user-voucher-head .item:after{
    content:"";
    display:none;
    width:25px;
    height:2px;
    margin-top:2.5px;
    background-color:#ffc000
}
.user-voucher-head .item.active{
    font-size:16px;
    color:#000;
    font-weight:700
}
.user-voucher-head .item.active:after{
    display:block
}
.user-voucher-head .tips{
    font-size:13px;
    text-align:center;
    color:#ccc;
    height:35px;
    display:flex;
    align-items:center;
    justify-content:center
}
.user-voucher-body{
    background-color:#f8f8f8;
    min-height:calc(100vh - 120px - env(safe-area-inset-top));
    margin-top:80px;
    padding:12.5px;
    position:relative
}
.user-voucher-body .type-item{
    display:none
}
.user-voucher-body .type-item.active{
    display:block
}
.user-voucher-body .type-item .empty{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#000;
    background:50% no-repeat
}
.user-voucher-body .voucher-item{
    margin-top:10px;
    display:flex;
    border-radius:8px;
    background:50% no-repeat;
    background-size:100% 100%
}
.user-voucher-body .voucher-item:first-child{
    margin-top:0
}
.user-voucher-body .voucher-item .amounts{
    width:26.811%;
    flex-shrink:0;
    color:#fff;
    display:flex;
    flex-direction:column;
    justify-items:center;
    align-items:center;
    justify-content:center;
    position:relative
}
.user-voucher-body .voucher-item .amounts .vip-label{
    position:absolute;
    top:0;
    left:0
}
.user-voucher-body .voucher-item .amounts .vip-label img{
    width:90%
}
.user-voucher-body .voucher-item .amounts .vip-label .text{
    font-size:12px;
    position:absolute;
    top:0;
    left:38%;
    color:#ffecc9
}
.user-voucher-body .voucher-item .amounts .amount{
    font-size:.32rem
}
.user-voucher-body .voucher-item .amounts .amount-meet{
    margin-top:5px;
    font-size:12px
}
.user-voucher-body .voucher-item .vip-amounts{
    color:#111
}
.user-voucher-body .voucher-item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    padding:10px 15px;
    font-size:.24rem;
    line-height:1.7
}
.user-voucher-body .voucher-item .info .name{
    color:#292929;
    font-weight:700;
    font-size:.3rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-voucher-body .voucher-item .info .time{
    color:#999
}
.user-voucher-body .voucher-item .info .game{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-voucher-body .voucher-item .info .use{
    color:#f5842d
}
.user-voucher-body .voucher-item .info .vip-use{
    color:#8f5a0c
}
.user-voucher-body .voucher-item .operate{
    width:14.492%;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    line-height:1.35;
    color:#f5842d
}
.user-voucher-body .voucher-item .operate:before{
    content:"立即使用";
    display:block;
    width:20px;
    text-align:center
}
.user-voucher-body .voucher-item .vip-operate{
    color:#8f5b0c
}
.user-voucher-body .voucher-item.usable .operate:before{
    content:"立即使用"
}
.user-voucher-body .voucher-item.used .operate:before{
    content:"已使用"
}
.user-voucher-body .voucher-item.expire .operate:before{
    content:"已过期"
}
.user-voucher-body .voucher-item.invalid .operate{
    color:#999
}
.user-game-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#fff;
    height:45px;
    flex-wrap:wrap;
    border-bottom:1px solid #eee;
    max-width:720px;
    margin:0 auto
}
.user-game-head,.user-game-head .item{
    display:flex;
    align-items:center;
    justify-content:center
}
.user-game-head .item{
    flex:1 1;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:15px;
    flex-direction:column;
    transition:all .25s
}
.user-game-head .item:after{
    content:"";
    display:none;
    width:25px;
    height:2px;
    margin-top:2.5px;
    background-color:#ffc000
}
.user-game-head .item.active{
    font-size:16px;
    color:#000;
    font-weight:700
}
.user-game-head .item.active:after{
    display:block
}
.user-game-body{
    background-color:#f5f6f8;
    min-height:calc(100vh - 85px - env(safe-area-inset-top));
    margin-top:45px;
    position:relative
}
.user-game-body .type-item{
    padding:10px;
    display:none
}
.user-game-body .type-item.active{
    display:block
}
.user-game-body .type-item .empty{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#000;
    background:50% no-repeat
}
.user-game-body .voucher-item{
    margin-top:10px;
    display:flex;
    border-radius:8px;
    background:50% no-repeat;
    background-size:100% 100%
}
.user-game-body .voucher-item:first-child{
    margin-top:0
}
.user-game-body .voucher-item .amounts{
    width:26.811%;
    flex-shrink:0;
    color:#fff;
    display:flex;
    flex-direction:column;
    justify-items:center;
    align-items:center;
    justify-content:center
}
.user-game-body .voucher-item .amounts .amount{
    font-size:.32rem
}
.user-game-body .voucher-item .amounts .amount-meet{
    margin-top:5px;
    font-size:12px
}
.user-game-body .voucher-item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    padding:10px 15px
}
.user-game-body .voucher-item .info .name{
    color:#000;
    font-size:.28rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-game-body .voucher-item .info .time{
    color:#999
}
.user-game-body .voucher-item .info .game{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-game-body .voucher-item .info .use{
    color:#f5842d
}
.user-game-body .voucher-item .operate{
    width:14.492%;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    line-height:1.35;
    color:#f5842d
}
.user-game-body .voucher-item .operate:before{
    content:"立即使用";
    display:block;
    width:20px;
    text-align:center
}
.user-game-body .voucher-item.usable .operate:before{
    content:"立即使用"
}
.user-game-body .voucher-item.used .operate:before{
    content:"已使用"
}
.user-game-body .voucher-item.expire .operate:before{
    content:"已过期"
}
.user-game-body .voucher-item.invalid .operate{
    color:#999
}
.user-game .play-game .item{
    padding:12.5px;
    display:flex;
    align-items:center;
    background-color:#fff;
    margin-top:12.5px;
    border-radius:8px
}
.user-game .play-game .item .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.user-game .play-game .item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.user-game .play-game .item .subject{
    flex:1 1;
    width:0;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.user-game .play-game .item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column
}
.user-game .play-game .item .name{
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.3rem;
    color:#282828
}
.user-game .play-game .item .name span{
    padding:0 .1rem;
    color:#956528;
    background:#eebe75;
    font-size:.24rem;
    margin-right:2px;
    border-radius:3px;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd)
}
.user-game .play-game .item .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-game .play-game .item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#666
}
.user-game .play-game .item .info3{
    border-radius:3px;
    font-size:.22rem
}
.user-game .play-game .item .info3 .first-text{
    padding:1px 3px;
    color:#fff;
    border-radius:3px
}
.user-game .play-game .item .info3 .second-text{
    border:1px solid;
    padding:0 .1rem;
    border-left:0;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px
}
.user-game .play-game .item .tag{
    display:inline-block;
    padding-left:5px
}
.user-game .play-game .item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.user-game .play-game .item .tag:nth-child(2){
    color:#75d100
}
.user-game .play-game .item .tag:nth-child(3){
    color:#2893ff
}
.user-game .play-game .item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.user-game .play-game .item:first-child{
    margin-top:0
}
.user-game .favorite-game .item{
    padding:12.5px;
    display:flex;
    align-items:center;
    background-color:#fff;
    border-radius:8px;
    margin-top:12.5px
}
.user-game .favorite-game .item .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.user-game .favorite-game .item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.user-game .favorite-game .item .subject{
    flex:1 1;
    width:0;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.user-game .favorite-game .item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column
}
.user-game .favorite-game .item .name{
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.3rem;
    color:#282828
}
.user-game .favorite-game .item .name span{
    padding:0 .1rem;
    color:#956528;
    background:#eebe75;
    font-size:.24rem;
    margin-right:2px;
    border-radius:3px;
    background-image:linear-gradient(90deg,#eebe75,#ffe7bd)
}
.user-game .favorite-game .item .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-game .favorite-game .item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#ff5e00
}
.user-game .favorite-game .item .info3{
    border-radius:3px;
    font-size:.22rem
}
.user-game .favorite-game .item .info3 .first-text{
    padding:1px 3px;
    color:#fff;
    border-radius:3px
}
.user-game .favorite-game .item .info3 .second-text{
    border:1px solid;
    padding:0 .1rem;
    border-left:0;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px
}
.user-game .favorite-game .item .tag{
    display:inline-block;
    padding-left:5px
}
.user-game .favorite-game .item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.user-game .favorite-game .item .tag:nth-child(2){
    color:#75d100
}
.user-game .favorite-game .item .tag:nth-child(3){
    color:#2893ff
}
.user-game .favorite-game .item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.user-game .favorite-game .item:first-child{
    margin-top:0
}
.user-game .favorite-trade{
    padding:5px
}
.user-game .favorite-trade .item{
    display:block;
    margin-top:10px;
    background-color:#fff;
    padding:10px 12.5px;
    border-radius:8px
}
.user-game .favorite-trade .item:first-child{
    margin-top:0
}
.user-game .favorite-trade .item .info{
    display:flex;
    align-items:center
}
.user-game .favorite-trade .item .info .icon{
    width:75px;
    height:55px;
    margin-right:10px
}
.user-game .favorite-trade .item .info .icon img{
    display:block;
    width:100%;
    height:100%
}
.user-game .favorite-trade .item .info .text{
    flex:1 1;
    display:flex;
    flex-direction:column;
    justify-items:center
}
.user-game .favorite-trade .item .info .text .name{
    font-size:.3rem;
    color:#000
}
.user-game .favorite-trade .item .info .text .desc{
    margin-top:5px
}
.user-game .favorite-trade .item .data{
    display:flex;
    align-items:center
}
.user-game .favorite-trade .item .data .time{
    flex:1 1;
    width:0;
    color:#ccc;
    font-size:12px;
    padding-top:5px
}
.user-game .favorite-trade .item .data .price{
    display:flex;
    align-items:center
}
.user-game .favorite-trade .item .data .price .amount{
    text-decoration:line-through;
    color:#ccc;
    font-size:12px;
    margin-right:10px
}
.user-game .favorite-trade .item .data .price .price{
    color:#ffa21c;
    font-size:.3rem
}
.user-gift{
    background:#f5f6f8
}
.user-gift-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#f5f6f8;
    padding:12.5px;
    max-width:720px;
    margin:0 auto
}
.user-gift-head,.user-gift-head .input{
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.user-gift-head .input{
    flex:1 1;
    background-color:#fff;
    border-radius:10px
}
.user-gift-head .input input{
    flex:1 1;
    background:none;
    border:none;
    padding:7.5px;
    font-size:.26rem;
    color:#999
}
.user-gift-head .input .icon{
    padding-left:7.5px;
    width:22px
}
.user-gift-head .input .close{
    padding-right:7.5px
}
.user-gift-body{
    min-height:calc(100vh - 90px - env(safe-area-inset-top));
    margin-top:40px;
    padding:12.5px
}
.user-gift-body .item{
    display:flex;
    align-items:center;
    background-color:#fff;
    border-top:1px solid #eee;
    padding:10px;
    margin-top:10px;
    border-radius:15px
}
.user-gift-body .item:first-child{
    border:none;
    margin-top:0
}
.user-gift-body .item .icon{
    flex-shrink:0;
    width:1.4rem;
    height:1.4rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.user-gift-body .item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.user-gift-body .item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.5;
    display:flex;
    flex-direction:column;
    padding-left:10px;
    padding-right:10px
}
.user-gift-body .item .name{
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.3rem;
    color:#282828;
    margin-bottom:.05rem
}
.user-gift-body .item .desc,.user-gift-body .item .gift-name{
    margin-bottom:.05rem
}
.user-gift-body .item .code,.user-gift-body .item .desc,.user-gift-body .item .gift-name{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-gift-body .item .btn{
    width:1.1rem;
    border-radius:.25rem;
    font-size:.28rem;
    line-height:.5rem;
    text-align:center;
    color:#fff;
    border:1px solid #ffc000;
    background:#ffc000
}
.user-bill-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#fff;
    max-width:720px;
    margin:0 auto
}
.user-bill-head .items{
    height:45px;
    border-bottom:1px solid #eee
}
.user-bill-head .item,.user-bill-head .items{
    display:flex;
    align-items:center;
    justify-content:center
}
.user-bill-head .item{
    width:33.333%;
    position:relative;
    text-align:center;
    font-size:15px;
    flex-direction:column;
    transition:all .25s
}
.user-bill-head .item:after{
    content:"";
    display:none;
    width:25px;
    height:2px;
    margin-top:2.5px;
    background-color:#ffc000
}
.user-bill-head .item.active{
    font-size:16px;
    color:#000;
    font-weight:700
}
.user-bill-head .item.active:after{
    display:block
}
.user-bill-head .thead{
    height:30px;
    display:flex;
    align-items:center;
    justify-content:center;
    background-color:#eee
}
.user-bill-head .thead .th{
    width:33.333%;
    font-size:13px;
    text-align:center
}
.user-bill-body{
    min-height:calc(100vh - 115px - env(safe-area-inset-top));
    margin-top:75px;
    padding:12.5px;
    position:relative
}
.user-bill-body .type-item{
    display:none
}
.user-bill-body .type-item.active{
    display:block
}
.user-bill-body .bill-item{
    display:flex;
    border-radius:8px;
    background:50% no-repeat;
    background-size:100% 100%;
    border-top:1px solid #eee;
    padding:10px 0
}
.user-bill-body .bill-item:first-child{
    border-top:none;
    padding-top:0
}
.user-bill-body .bill-item .td{
    width:33.333%;
    font-size:13px;
    text-align:center
}
.user-bill-body .bill-item .time{
    font-size:12px
}
.user-bill-body .bill-item .amount{
    color:red
}
.user-bill-body .bill-item .amount-block{
    color:unset
}
.user-credit-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#fff
}
.user-credit-head .items{
    height:45px;
    border-bottom:1px solid #eee
}
.user-credit-head .item,.user-credit-head .items{
    display:flex;
    align-items:center;
    justify-content:center
}
.user-credit-head .item{
    width:50%;
    position:relative;
    text-align:center;
    font-size:15px;
    flex-direction:column;
    transition:all .25s
}
.user-credit-head .item:after{
    content:"";
    display:none;
    width:25px;
    height:2px;
    margin-top:2.5px;
    background-color:#ffc000
}
.user-credit-head .item.active{
    font-size:16px;
    color:#000;
    font-weight:700
}
.user-credit-head .item.active:after{
    display:block
}
.user-credit-head .thead{
    height:30px;
    display:flex;
    align-items:center;
    justify-content:center;
    background-color:#eee
}
.user-credit-head .thead .th{
    width:33.333%;
    font-size:13px;
    text-align:center
}
.user-credit-body{
    min-height:calc(100vh - 115px - env(safe-area-inset-top));
    margin-top:75px;
    padding:12.5px;
    position:relative
}
.user-credit-body .type-item{
    display:none
}
.user-credit-body .type-item.active{
    display:block
}
.user-credit-body .credit-item{
    display:flex;
    border-radius:8px;
    background:50% no-repeat;
    background-size:100% 100%;
    border-top:1px solid #eee;
    padding:10px 0
}
.user-credit-body .credit-item:first-child{
    border-top:none;
    padding-top:0
}
.user-credit-body .credit-item .td{
    width:33.333%;
    font-size:13px;
    text-align:center
}
.user-credit-body .credit-item .time{
    font-size:12px
}
.user-credit-body .credit-item .amount{
    color:red
}
.user-profile{
    background-color:#f8f8f8;
    min-height:calc(100vh - 40px - env(safe-area-inset-top))
}
.user-profile .group{
    margin-top:15px
}
.user-profile .group:first-child{
    margin-top:0
}
.user-profile .item{
    background-color:#fff;
    border-top:1px solid #eee;
    display:flex;
    padding:15px;
    align-items:center;
    position:relative
}
.user-profile .item:first-child{
    border-top:none
}
.user-profile .item .name{
    color:#000;
    flex:1 1;
    width:0
}
.user-profile .item .name span{
    color:red;
    padding-left:5px
}
.user-profile .item .operate{
    text-align:right;
    display:flex;
    align-items:center;
    margin-left:auto
}
.user-profile .item .operate .icon{
    display:block;
    margin-left:7.5px
}
.user-profile .item .avatar{
    border-radius:50%;
    width:35px;
    height:35px
}
.user-profile .item input[type=file]{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%;
    opacity:0
}
.user-btn{
    margin:25px;
    border-radius:20px;
    padding:10px;
    background:#ffc000;
    font-size:16px;
    color:#fff;
    text-align:center
}
.user-input{
    border-bottom:1px solid #eee;
    padding:7.5px 0;
    display:flex;
    align-items:center
}
.user-input .name{
    width:75px;
    flex-shrink:0;
    color:#000;
    font-size:.3rem
}
.user-input .name .area-num-text{
    display:flex;
    flex-wrap:wrap;
    flex-direction:row;
    align-content:center;
    align-items:center
}
.user-input .name .area-num-text a{
    padding-right:.05rem
}
.user-input .name .area-num-text img{
    width:8px;
    height:8px
}
.user-input input{
    flex:1 1;
    border:none;
    background:none;
    padding:7.5px 0;
    font-size:16px
}
.user-input .close,.user-input .password{
    padding:5px
}
.user-input .btn{
    background-color:#ffc000;
    border-radius:10px;
    padding:5px 7.5px;
    color:#fff;
    font-size:12px
}
.user-input .btn.disable{
    background-color:#ccc
}
.user-nickname,.user-phoneremove,.user-qq,.user-realname{
    padding:12.5px
}
.user-phoneremove-tips{
    color:#ffc000;
    text-align:center;
    padding-bottom:10px
}
.user-phonereplace{
    padding:12.5px
}
.user-phonereplace-tips{
    color:#ffc000;
    text-align:center;
    padding-bottom:10px
}
.user-record .record-head{
    position:fixed;
    z-index:55;
    top:0;
    left:0;
    right:0;
    background-color:#ffc000;
    background-image:linear-gradient(90deg,#ffc000,#fff);
    padding:calc(env(safe-area-inset-top) + 40px) 0 0;
    max-width:720px;
    margin:0 auto;
    background-size:100% 100%
}
.user-record .record-user{
    height:150px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    position:relative
}
.user-record .record-user .icon{
    width:75px;
    height:75px;
    overflow:hidden;
    border-radius:50%
}
.user-record .record-user .icon img{
    display:block;
    width:100%;
    height:100%
}
.user-record .record-user .vip-user-icon{
    position:absolute;
    margin-top:40px;
    width:50px
}
.user-record .record-user .name{
    font-size:18px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#fff;
    margin-top:5px
}
.user-record .record-type{
    height:45px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-bottom:1px solid #eee;
    background-color:#fff
}
.user-record .record-type .item{
    width:33.333%;
    position:relative;
    text-align:center;
    font-size:15px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transition:all .25s
}
.user-record .record-type .item:after{
    content:"";
    display:none;
    width:25px;
    height:2px;
    margin-top:2.5px;
    background-color:#ffc000
}
.user-record .record-type .item.active{
    font-size:16px;
    color:#000;
    font-weight:700
}
.user-record .record-type .item.active:after{
    display:block
}
.user-record .record-body{
    padding-top:calc(env(safe-area-inset-top) + 235px)
}
.user-record .record-body-item{
    display:none
}
.user-record .record-body-item.active{
    display:block
}
.user-record .user-comment .comment-item{
    display:block;
    padding:10px;
    margin-top:5px;
    background-color:#fff;
    position:relative
}
.user-record .user-comment .comment-item:first-child{
    margin-top:0
}
.user-record .user-comment .comment-reward{
    position:absolute;
    z-index:11;
    right:15px;
    top:5px;
    background:#fff 50% no-repeat;
    background-size:cover;
    width:67px;
    height:50px;
    display:flex;
    justify-content:center;
    align-items:center;
    align-content:center;
    justify-items:center;
    color:#5574ff
}
.user-record .user-comment .comment-reward .text{
    -webkit-transform:rotate(-15deg);
    transform:rotate(-15deg);
    font-size:10px
}
.user-record .user-comment .comment-game{
    display:flex;
    align-items:stretch
}
.user-record .user-comment .comment-game .icon{
    width:45px;
    height:45px;
    flex-shrink:0;
    margin-right:7.5px;
    overflow:hidden;
    border-radius:8px
}
.user-record .user-comment .comment-game .icon img{
    display:block;
    width:100%;
    height:100%
}
.user-record .user-comment .comment-game .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:space-around
}
.user-record .user-comment .comment-game .info .name{
    font-size:.28rem;
    color:#000;
    display:flex;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-record .user-comment .comment-game .info .name img{
    margin-left:5px;
    height:25px
}
.user-record .user-comment .comment-game .info .desc{
    color:#666
}
.user-record .user-comment .comment-game .time{
    font-size:.24rem
}
.user-record .user-comment .comment-content{
    margin-top:5px
}
.user-record .user-comment .comment-content .content{
    max-height:100px;
    line-height:20px;
    overflow:hidden;
    transition:all .25s
}
.user-record .user-comment .comment-content .ctrl:after{
    content:"全文";
    color:#ffc000;
    display:none
}
.user-record .user-comment .comment-content.switchable .ctrl:after{
    display:block
}
.user-record .user-comment .comment-content.open .content{
    max-height:999px
}
.user-record .user-comment .comment-content.open .ctrl:after{
    content:"收起"
}
.user-record .user-comment .comment-img{
    display:flex;
    overflow:hidden;
    margin-left:-10px;
    margin-top:10px;
    object-fit:cover
}
.user-record .user-comment .comment-img .item{
    width:33.333%;
    margin-left:10px;
    position:relative;
    padding-top:22.5%
}
.user-record .user-comment .comment-img .item img{
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%
}
.user-record .user-comment .comment-img .item .more{
    position:absolute;
    z-index:22;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.5);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:16px
}
.user-record .user-comment .comment-reply{
    margin-top:5px;
    border-top:1px solid #eee
}
.user-record .user-comment .comment-reply .reply-item{
    display:flex;
    margin-top:5px
}
.user-record .user-comment .comment-reply .reply-item .reply-user{
    color:#ffc000
}
.user-record .user-comment .comment-reply .reply-item .reply-content{
    flex:1 1;
    width:0;
    word-break:break-all
}
.user-record .user-comment .comment-reply .reply-more{
    margin-top:5px;
    color:#ffc000
}
.user-record .user-comment .comment-info{
    margin-top:5px;
    display:flex;
    align-items:center;
    border-top:1px solid #eee;
    padding-top:5px
}
.user-record .user-comment .comment-info .device{
    flex:1 1;
    width:0;
    overflow:hidden
}
.user-record .user-comment .comment-info .count{
    display:flex;
    align-items:center
}
.user-record .user-comment .comment-info .count .item{
    padding:5px
}
.user-record .user-comment .comment-info .count .item.active .icon{
    color:#ffc000
}
.user-record .user-comment .comment-info .count .icon{
    margin-right:5px
}
.user-record .user-reply .reply-item{
    display:block;
    padding:10px;
    margin-top:5px;
    background-color:#fff;
    position:relative
}
.user-record .user-reply .reply-item:first-child{
    margin-top:0
}
.user-record .user-reply .reply-game{
    display:flex;
    align-items:stretch
}
.user-record .user-reply .reply-game .icon{
    width:45px;
    height:45px;
    flex-shrink:0;
    margin-right:7.5px;
    overflow:hidden;
    border-radius:8px
}
.user-record .user-reply .reply-game .icon img{
    display:block;
    width:100%;
    height:100%
}
.user-record .user-reply .reply-game .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:space-around
}
.user-record .user-reply .reply-game .info .name{
    font-size:.28rem;
    color:#000;
    display:flex;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-record .user-reply .reply-game .info .name img{
    margin-left:5px;
    height:25px
}
.user-record .user-reply .reply-game .info .desc{
    color:#666
}
.user-record .user-reply .reply-game .time{
    font-size:.24rem
}
.user-record .user-reply .reply-content{
    margin-top:5px;
    padding-left:52.5px
}
.user-record .user-reply .reply-content .user{
    padding-left:5px;
    padding-right:5px;
    color:#ffc000
}
.user-record .user-qa .qa-item{
    padding:10px;
    margin-top:5px;
    background-color:#fff;
    position:relative;
    display:flex
}
.user-record .user-qa .qa-item:first-child{
    margin-top:0
}
.user-record .user-qa .game-icon{
    width:45px;
    height:45px;
    flex-shrink:0;
    margin-right:10px;
    overflow:hidden;
    border-radius:8px
}
.user-record .user-qa .game-icon img{
    display:block;
    width:100%;
    height:100%
}
.user-record .user-qa .qa-body{
    flex:1 1;
    width:0;
    overflow:hidden
}
.user-record .user-qa .game-info .name{
    font-size:.28rem;
    color:#000;
    display:flex;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.user-record .user-qa .game-info .desc{
    color:#666
}
.user-record .user-qa .qa-main{
    margin-top:5px
}
.user-record .user-qa .qa-main .question{
    display:flex
}
.user-record .user-qa .qa-main .question .icon{
    color:#00f
}
.user-record .user-qa .qa-main .question .text{
    flex:1 1;
    width:0;
    overflow:hidden;
    padding:0 5px;
    font-size:15px;
    font-weight:700
}
.user-record .user-qa .qa-main .question .time{
    font-size:12px;
    color:#999
}
.user-record .user-qa .qa-main .answer{
    display:flex;
    margin-top:2.5px
}
.user-record .user-qa .qa-main .answer .icon{
    color:#ffc000
}
.user-record .user-qa .qa-main .answer .text{
    flex:1 1;
    width:0;
    overflow:hidden;
    padding:0 5px
}
.user-record .user-qa .qa-main .answer .time{
    font-size:12px;
    color:#999
}
.user-record .user-qa .qa-main .empty{
    margin-top:5px;
    color:#666
}
.user-record .user-qa .qa-main .more{
    margin-top:5px;
    color:#ffc000
}
.user-set .set-list dt{
    padding:10px;
    display:flex;
    align-items:center;
    transition:all .25s;
    border-bottom:1px solid #ededed
}
.user-set .set-list dt .full{
    flex:1 1;
    display:flex;
    align-items:center
}
.user-set .set-list dt .icon{
    width:35px;
    height:25px;
    background:50% no-repeat;
    background-size:contain;
    margin-right:5px
}
.user-set .set-list dt .text{
    font-size:.3rem;
    color:#282828;
    width:24%
}
.user-set .set-list dt .down{
    width:12px;
    height:12px;
    margin-top:-.2rem
}
.user-cancelaccount .group{
    padding:15px
}
.user-cancelaccount .group .title{
    font-size:.28rem;
    color:#282828
}
.user-cancelaccount .group .desc{
    padding-top:.3rem
}
.user-cancelaccount .group h2{
    font-size:.3rem;
    font-weight:700;
    color:#282828;
    padding-bottom:.1rem
}
.user-cancelaccount .group p{
    font-size:.28rem;
    color:#282828
}
.user-cancelaccount .check-account{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.user-cancelaccount .check-account .auth-index{
    width:80%;
    margin-left:10%;
    background:#fff;
    margin-top:40%;
    overflow:auto;
    padding:20px;
    border-radius:10px;
    line-height:180%;
    text-align:center
}
.user-cancelaccount .check-account .auth-index .close{
    position:absolute;
    width:4%;
    margin-left:65%
}
.user-cancelaccount .check-account .auth-index .title{
    padding-top:.5rem;
    font-size:.4rem;
    font-weight:700;
    color:#282828
}
.user-cancelaccount .check-account .auth-index .account-info{
    color:#666;
    font-size:.3rem;
    padding:.2rem 0
}
.user-cancelaccount .check-account .auth-index .check-input input{
    flex:1 1;
    background:none;
    padding:7.5px 0;
    font-size:16px;
    border:none;
    border-bottom:1px solid #ededed;
    text-align:center;
    color:#999
}
.user-assetaccount .group{
    padding:15px
}
.user-assetaccount .group .title{
    font-size:.3rem;
    color:#282828;
    font-weight:700
}
.user-assetaccount .group .desc{
    padding:.2rem 0 .3rem
}
.user-assetaccount .group .desc p{
    color:#282828;
    font-size:.28rem
}
.user-assetaccount .group .desc p span{
    color:#ff5e00
}
.user-assetaccount .writeoff-account{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.user-assetaccount .writeoff-account .auth-index{
    width:80%;
    margin-left:10%;
    background:#fff;
    margin-top:40%;
    overflow:auto;
    padding:20px;
    border-radius:10px
}
.user-assetaccount .writeoff-account .auth-index .title{
    font-size:.4rem;
    font-weight:700;
    color:#282828;
    text-align:center;
    padding-bottom:15px
}
.user-assetaccount .writeoff-account .auth-index .content{
    height:300px;
    overflow-y:auto
}
.user-assetaccount .writeoff-account .auth-index .tag1{
    color:#000;
    font-size:.28rem
}
.user-assetaccount .writeoff-account .auth-index .tag2{
    font-size:.26rem;
    color:#666;
    padding:10px 0
}
.user-assetaccount .writeoff-account .auth-index .tag3{
    font-size:.26rem;
    color:#282828
}
.user-assetaccount .writeoff-account .auth-index .account-info{
    color:#666;
    font-size:.3rem;
    padding:.2rem 0
}
.user-assetaccount .writeoff-account .auth-index .check-input input{
    flex:1 1;
    background:none;
    padding:7.5px 0;
    font-size:16px;
    border:none;
    border-bottom:1px solid #ededed;
    text-align:center;
    color:#999
}
.user-assetaccount .writeoff-account .auth-index .user-btn-writeoff{
    margin-top:15px;
    border-radius:20px;
    padding:10px;
    background:#ffc000;
    font-size:16px;
    color:#fff;
    text-align:center
}
.feedback-index .feedback-head{
    display:flex;
    align-items:center;
    border-bottom:1px solid #eee
}
.feedback-index .feedback-head-item{
    text-align:center;
    width:50%;
    padding:10px;
    position:relative;
    transition:all .25s;
    font-size:.28rem
}
.feedback-index .feedback-head-item:after{
    content:"";
    display:block;
    height:2px;
    width:15px;
    background-color:#ffc000;
    position:absolute;
    bottom:5px;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    transition:all .25s;
    opacity:0
}
.feedback-index .feedback-head-item.active{
    font-weight:700;
    color:#000;
    font-size:15px
}
.feedback-index .feedback-head-item.active:after{
    opacity:1
}
.feedback-index .feedback-body{
    background-color:#eee
}
.feedback-index .feedback-body-item,.feedback-index .feedback-body .swiper-container{
    height:100%
}
.feedback-index .feedback-block{
    background-color:#fff;
    margin-bottom:10px;
    padding:10px
}
.feedback-index .feedback-block:last-child{
    margin-bottom:0
}
.feedback-index .feedback-operate{
    background-color:#fff;
    padding:15px 15px calc(env(safe-area-inset-bottom) + 15px)
}
.feedback-index .feedback-operate .btn{
    background-color:#ffc000;
    border-radius:20px;
    padding:7.5px;
    font-size:.28rem;
    color:#fff;
    text-align:center
}
.feedback-index .feedback-operate .btn.disable{
    background-color:#ccc
}
.feedback-index .input-item{
    margin-top:10px;
    display:flex;
    align-items:center
}
.feedback-index .input-item .name{
    color:#000;
    font-size:.28rem;
    width:150px
}
.feedback-index .input-item .value{
    flex:1 1;
    width:0;
    overflow:hidden;
    padding-left:10px;
    padding-right:10px
}
.feedback-index .input-item .value>input{
    width:100%;
    border-radius:4px;
    border:1px solid #ccc;
    padding:5px
}
.feedback-index .input-device .value{
    text-align:right
}
.feedback-index .input-game .value{
    text-align:right;
    color:red
}
.feedback-index .input-type{
    display:block
}
.feedback-index .input-type .name{
    width:auto
}
.feedback-index .input-type .value{
    width:auto;
    margin-top:5px
}
.feedback-index .input-type .value label{
    float:left;
    width:50%
}
.feedback-index .input-type .value label input{
    margin-right:5px
}
.feedback-index .input-content{
    margin-top:10px
}
.feedback-index .input-content textarea{
    width:100%;
    border-radius:4px;
    border:1px solid #ccc;
    padding:5px;
    resize:none
}
.account-login{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    padding-bottom:env(safe-area-inset-bottom);
    z-index:0;
    position:relative
}
.account-login .body{
    flex:1 1;
    height:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:15px
}
.account-login .body .logo{
    padding-bottom:15px
}
.account-login .body .logo img{
    display:block;
    width:50%;
    margin:0 auto
}
.account-login .body .input-item{
    margin-top:10px;
    display:flex;
    align-items:center;
    border-bottom:1px solid #ededed;
    padding:10px 0
}
.account-login .body .input-item .label{
    width:50px;
    margin-right:10px;
    font-size:15px;
    color:#666
}
.account-login .body .input-item .input{
    flex:1 1;
    width:0;
    border-radius:4px;
    display:flex;
    align-items:center
}
.account-login .body .input-item .input input{
    border:none;
    flex:1 1;
    font-size:16px;
    padding:5px;
    color:#999
}
.account-login .body .input-item .input .assist{
    padding:5px
}
.account-login .body .input-item .input .select{
    margin-left:5px;
    padding:5px;
    position:relative
}
.account-login .body .input-item .input .select select{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    opacity:0
}
.account-login .body .operate{
    width:100%
}
.account-login .body .operate .item{
    float:left;
    padding:15px 0 30px
}
.account-login .body .operate .item:first-child{
    color:#ffc000
}
.account-login .body .operate .item:last-child{
    float:right;
    color:#999
}
.account-login .body .btn{
    background-color:#ffc000;
    border-radius:20px;
    padding:10px;
    font-size:16px;
    color:#fff;
    text-align:center;
    margin-top:10px
}
.account-login .body .btn.disable{
    background-color:#ccc
}
.account-login .body .btn-phone{
    color:#000;
    text-align:center;
    margin-top:12.5px;
    font-size:.28rem
}
.account-phonelogin{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    padding-bottom:env(safe-area-inset-bottom)
}
.account-phonelogin .phonelogin-body{
    flex:1 1;
    height:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:15px
}
.account-phonelogin .phonelogin-body .logo{
    padding-bottom:15px
}
.account-phonelogin .phonelogin-body .logo img{
    display:block;
    width:50%;
    margin:0 auto
}
.account-phonelogin .phonelogin-body .body{
    margin:50px 0
}
.account-phonelogin .phonelogin-body .input{
    padding:5px;
    border:1px solid #ffc000;
    border-radius:8px;
    display:flex
}
.account-phonelogin .phonelogin-body .input input{
    flex:1 1;
    width:0;
    text-align:center;
    padding:7.5px;
    border:none;
    font-size:.32rem;
    color:#ffc000
}
.account-phonelogin .phonelogin-body .code{
    display:flex;
    align-items:center;
    margin-top:15px
}
.account-phonelogin .phonelogin-body .code input{
    flex:1 1;
    padding:7.5px 10px;
    border:1px solid #ffc000;
    border-radius:8px;
    font-size:.28rem
}
.account-phonelogin .phonelogin-body .code-btn{
    background-color:#ffc000;
    border-radius:8px;
    padding:7.5px;
    font-size:.26rem;
    color:#fff;
    margin-left:12.5px
}
.account-phonelogin .phonelogin-body .code-btn.disable{
    background-color:#ccc
}
.account-phonelogin .phonelogin-body .btn{
    background-color:#ffc000;
    border-radius:20px;
    padding:10px;
    font-size:16px;
    color:#fff;
    text-align:center;
    margin-top:10px
}
.account-phonelogin .phonelogin-body .btn.disable{
    background-color:#ccc
}
.account-phonelogin .phonelogin-body .btn-phone{
    color:#ffc000;
    text-align:center;
    margin-top:12.5px;
    font-size:.28rem
}
.account-phonelogin .phonelogin-users{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
.account-phonelogin .phonelogin-users .mask{
    position:fixed;
    z-index:666;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.5)
}
.account-phonelogin .phonelogin-users .body{
    position:relative;
    z-index:666;
    background-color:#fff;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    display:flex;
    flex-direction:column;
    padding:10px 10px env(safe-area-inset-bottom)
}
.account-phonelogin .phonelogin-users .title{
    font-size:.3rem;
    color:#000;
    text-align:center;
    font-weight:700;
    padding:0 10px 10px
}
.account-phonelogin .phonelogin-users .users{
    flex:1 1;
    overflow-y:scroll;
    position:relative;
    -webkit-overflow-scrolling:touch;
    max-height:33vh
}
.account-phonelogin .phonelogin-users .users .user{
    padding:10px;
    text-align:center;
    border-top:1px solid #eee;
    font-size:.28rem
}
.account-register{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    padding-bottom:env(safe-area-inset-bottom);
    z-index:0;
    position:relative
}
.account-register-btn{
    color:#f5842d
}
.account-register .body{
    flex:1 1;
    height:0;
    display:flex;
    flex-direction:column;
    padding:calc(env(safe-area-inset-top) + 40px) 15px 15px
}
.account-register .body .logo{
    padding-bottom:15px
}
.account-register .body .logo img{
    display:block;
    width:50%
}
.account-register .body .input-item{
    position:relative;
    margin-top:10px;
    display:flex;
    align-items:center;
    border-bottom:1px solid #ededed;
    padding:10px 0;
    height:49px
}
.account-register .body .input-item .label{
    width:50px;
    margin-right:10px;
    font-size:15px;
    color:#666
}
.account-register .body .input-item .input{
    flex:1 1;
    width:0;
    border-radius:4px;
    display:flex;
    align-items:center
}
.account-register .body .input-item .input input{
    border:none;
    flex:1 1;
    font-size:16px;
    padding:5px;
    color:#999
}
.account-register .body .input-item .input .assist{
    padding:5px
}
.account-register .body .input-item .input .select{
    margin-left:5px;
    padding:5px;
    position:relative
}
.account-register .body .input-item .input .select select{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    opacity:0
}
.account-register .body .btn{
    background-color:#ffc000;
    border-radius:20px;
    padding:10px;
    font-size:16px;
    color:#fff;
    text-align:center;
    margin-top:2rem
}
.account-register .body .btn.disable{
    background-color:#ccc
}
.account-agreement{
    padding:10px;
    text-align:center;
    vertical-align:middle
}
.account-agreement .agreement{
    margin-right:5px;
    border:2px solid #ccc;
    width:15px;
    height:15px;
    border-radius:50%;
    display:inline-block;
    vertical-align:middle;
    margin-bottom:2.5px;
    position:relative
}
.account-agreement .agreement.checked{
    border:2px solid #ffc000
}
.account-agreement .agreement.checked:after{
    content:"";
    display:block;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    background-color:#ffc000;
    width:5px;
    height:5px;
    border-radius:50%
}
.account-agreement a{
    color:#ffc000;
    text-align:center
}
.account-phone{
    padding:10px
}
.account-phone .input-item{
    margin-top:10px;
    display:flex;
    align-items:center;
    border-bottom:1px solid #eee;
    padding-bottom:10px
}
.account-phone .input-item .label{
    width:50px;
    margin-right:10px;
    color:#333;
    font-size:15px
}
.account-phone .input-item .input{
    flex:1 1;
    width:0;
    border:1px solid #eee;
    border-radius:4px;
    display:flex;
    align-items:center
}
.account-phone .input-item .input input{
    width:100%;
    padding:7.5px;
    border:none;
    font-size:16px;
    color:#333
}
.account-phone .input-item .input .assist{
    padding:5px
}
.account-phone .input-item .btn{
    margin-left:10px;
    background-color:#ffc000;
    border-radius:8px;
    padding:5px 7.5px;
    font-size:12px;
    color:#fff;
    text-align:center
}
.account-phone .input-item .btn.disable{
    background-color:#ccc
}
.account-phone .operate{
    background-color:#ffc000;
    border-radius:20px;
    padding:7.5px;
    font-size:.28rem;
    color:#fff;
    text-align:center;
    margin-top:10px
}
.account-phone .operate.disable{
    background-color:#ccc
}
.account-forget{
    padding:10px
}
.account-forget .input-item{
    margin-top:10px;
    display:flex;
    align-items:center;
    border-bottom:1px solid #eee;
    padding-bottom:10px
}
.account-forget .input-item .label{
    width:50px;
    margin-right:10px;
    font-size:15px;
    color:#333
}
.account-forget .input-item .label .area-num-text{
    display:flex;
    flex-wrap:wrap;
    flex-direction:row;
    align-content:center;
    align-items:center
}
.account-forget .input-item .label .area-num-text a{
    padding-right:.05rem
}
.account-forget .input-item .label .area-num-text img{
    width:8px;
    height:8px
}
.account-forget .input-item .input{
    flex:1 1;
    width:0;
    border-radius:4px;
    display:flex;
    align-items:center
}
.account-forget .input-item .input input{
    width:100%;
    padding:7.5px;
    border:none;
    font-size:16px;
    color:#333
}
.account-forget .input-item .input .assist{
    padding:5px
}
.account-forget .input-item .btn{
    margin-left:10px;
    background-color:#ffc000;
    border-radius:8px;
    padding:5px 7.5px;
    font-size:12px;
    color:#fff;
    text-align:center
}
.account-forget .input-item .btn.disable{
    background-color:#ccc
}
.account-forget .operate{
    background-color:#ffc000;
    border-radius:20px;
    padding:10px;
    font-size:16px;
    color:#fff;
    text-align:center;
    margin-top:50px
}
.account-forget .operate.disable{
    background-color:#ccc
}
.account-verificode-login{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    padding-bottom:env(safe-area-inset-bottom)
}
.account-verificode-login .verificode-body{
    flex:1 1;
    height:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:15px
}
.account-verificode-login .verificode-body .logo{
    padding-bottom:15px
}
.account-verificode-login .verificode-body .logo img{
    display:block;
    width:50%;
    margin:0 auto
}
.account-verificode-login .verificode-body .input-item{
    margin-top:10px;
    display:flex;
    align-items:center;
    border-bottom:1px solid #ededed;
    padding:10px 0
}
.account-verificode-login .verificode-body .input-item .label{
    width:50px;
    margin-right:10px;
    font-size:15px;
    color:#666
}
.account-verificode-login .verificode-body .input-item .label .area-num-text{
    display:flex;
    flex-wrap:wrap;
    flex-direction:row;
    align-content:center;
    align-items:center
}
.account-verificode-login .verificode-body .input-item .label .area-num-text a{
    padding-right:.05rem
}
.account-verificode-login .verificode-body .input-item .label .area-num-text img{
    width:8px;
    height:8px
}
.account-verificode-login .verificode-body .input-item .input{
    flex:1 1;
    width:0;
    border-radius:4px;
    display:flex;
    align-items:center
}
.account-verificode-login .verificode-body .input-item .input input{
    width:100%;
    padding:7.5px;
    border:none;
    font-size:16px;
    color:#999
}
.account-verificode-login .verificode-body .input-item .input input::-webkit-inner-spin-button,.account-verificode-login .verificode-body .input-item .input input::-webkit-outer-spin-button{
    -webkit-appearance:none
}
.account-verificode-login .verificode-body .input-item .code-btn{
    margin-left:10px;
    border-radius:8px;
    padding:5px 7.5px;
    font-size:12px;
    color:#ffc000;
    text-align:center
}
.account-verificode-login .verificode-body p{
    text-align:center;
    color:#999;
    padding:15px 30px 30px
}
.account-verificode-login .verificode-body .operate{
    background-color:#ffc000;
    border-radius:20px;
    padding:10px;
    font-size:16px;
    color:#fff;
    text-align:center;
    margin-top:10px
}
.account-verificode-login .verificodelogin-users{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
.account-verificode-login .verificodelogin-users .mask{
    position:fixed;
    z-index:666;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.5)
}
.account-verificode-login .verificodelogin-users .body{
    position:relative;
    z-index:666;
    background-color:#fff;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    display:flex;
    flex-direction:column;
    padding:10px 10px env(safe-area-inset-bottom)
}
.account-verificode-login .verificodelogin-users .title{
    font-size:.3rem;
    color:#000;
    text-align:center;
    font-weight:700;
    padding:0 10px 10px
}
.account-verificode-login .verificodelogin-users .users{
    flex:1 1;
    overflow-y:scroll;
    position:relative;
    -webkit-overflow-scrolling:touch;
    max-height:33vh
}
.account-verificode-login .verificodelogin-users .users .user{
    padding:10px;
    text-align:center;
    border-top:1px solid #eee;
    font-size:.28rem
}
.voucher-index{
    padding-top:50px
}
.voucher-index .voucher-head{
    position:fixed;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    display:flex;
    align-items:center;
    height:50px;
    background-color:#fff;
    padding:5px 0 5px 10px
}
.voucher-index .voucher-head .input{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    align-items:center;
    background-color:#f8f8f8;
    border-radius:4px;
    padding:5px
}
.voucher-index .voucher-head .input .icon{
    padding:5px;
    font-size:18px
}
.voucher-index .voucher-head .input input{
    flex:1 1;
    width:0;
    overflow:hidden;
    padding:5px;
    font-size:15px;
    border:none;
    background:none
}
.voucher-index .voucher-head .input .empty{
    padding:5px;
    font-size:18px
}
.voucher-index .voucher-head .btn{
    padding:7.5px 10px;
    color:#ffc000;
    font-size:15px
}
.voucher-index .voucher-body{
    padding:10px
}
.voucher-index .voucher-title{
    display:flex;
    align-items:center;
    font-size:15px;
    color:#000;
    margin-bottom:7.5px
}
.voucher-index .voucher-title .more{
    font-size:13px;
    flex:1 1;
    text-align:right
}
.voucher-index .voucher-main{
    margin-top:10px
}
.voucher-index .lateplay-main{
    margin-bottom:10px
}
.voucher-index .lateplay-main .items{
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex;
    margin:0 -5px
}
.voucher-index .lateplay-main .items .item{
    width:60%;
    flex-shrink:0;
    background-color:#fff;
    border-radius:8px;
    padding:10px;
    margin:5px;
    display:flex;
    align-items:center
}
.voucher-index .lateplay-main .items .item .icon{
    width:60px;
    height:60px;
    border-radius:8px;
    overflow:hidden;
    margin-right:7.5px
}
.voucher-index .lateplay-main .items .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.voucher-index .lateplay-main .items .item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    line-height:1.7
}
.voucher-index .lateplay-main .items .item .name{
    font-size:15px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#282828;
    font-weight:700
}
.voucher-index .lateplay-main .items .item .desc,.voucher-index .lateplay-main .items .item .voucher{
    color:#999;
    font-size:12px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.voucher-index .lateplay-main .items .item .voucher span{
    color:#ff4200;
    font-size:15px;
    padding-right:5px
}
.voucher-index .lateplay-main .items .item .voucher span:first-child{
    font-size:12px;
    padding-right:0
}
.voucher-list .item{
    margin-top:10px;
    background-color:#fff;
    border-radius:8px;
    padding:10px;
    display:flex;
    align-items:center
}
.voucher-list .item:first-child{
    margin-top:0
}
.voucher-list .item .icon{
    width:60px;
    height:60px;
    border-radius:8px;
    overflow:hidden
}
.voucher-list .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.voucher-list .item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    padding:0 7.5px;
    line-height:1.7
}
.voucher-list .item .info .name{
    font-size:15px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-weight:700;
    color:#282828
}
.voucher-list .item .info .desc{
    color:#999;
    font-size:.2rem
}
.voucher-list .item .info .desc,.voucher-list .item .info .tags{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:2.5px
}
.voucher-list .item .info .tags{
    align-items:center;
    font-size:.22rem
}
.voucher-list .item .info .tag{
    margin-right:5px;
    display:inline-block
}
.voucher-list .item .info .tag:first-child{
    color:#ff4200
}
.voucher-list .item .info .tag:nth-child(2){
    color:#75d100
}
.voucher-list .item .info .tag:nth-child(3){
    color:#2893ff
}
.voucher-list .item .operate{
    display:flex;
    flex-direction:column;
    justify-content:stretch;
    text-align:center;
    width:1.33rem
}
.voucher-list .item .operate .count{
    font-size:18px;
    color:#fe8900
}
.voucher-list .item .operate .amount{
    font-size:13px;
    margin-top:2.5px
}
.voucher-list .item .operate .btn{
    padding:2.5px;
    background-color:#ffc000;
    color:#fff;
    border-radius:12px;
    margin-top:2.5px;
    font-size:13px
}
.voucher-lateplay{
    padding:10px
}
.gift-detail{
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
.gift-detail,.gift-detail .gift-mask{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.gift-detail .gift-mask{
    background-color:rgba(0,0,0,.5);
    transition:all .25s;
    opacity:0
}
.gift-detail .gift-container{
    position:relative;
    z-index:666;
    background-color:#fff;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    height:50vh;
    display:flex;
    flex-direction:column;
    padding:15px 15px env(safe-area-inset-bottom);
    transition:all .25s;
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.gift-detail.appear-active .gift-mask,.gift-detail.appear-done .gift-mask,.gift-detail.enter-active .gift-mask,.gift-detail.enter-done .gift-mask{
    opacity:1
}
.gift-detail.appear-active .gift-container,.gift-detail.appear-done .gift-container,.gift-detail.enter-active .gift-container,.gift-detail.enter-done .gift-container{
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0)
}
.gift-detail.exit-active .gift-mask{
    opacity:0
}
.gift-detail.exit-active .gift-container{
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.gift-detail.exit-done{
    display:none
}
.gift-detail .gift-top{
    display:flex;
    border-bottom:1px solid #eee;
    padding-bottom:10px
}
.gift-detail .gift-top .icon{
    flex-shrink:0;
    width:1.2rem;
    height:1.2rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center;
    margin-right:10px
}
.gift-detail .gift-top .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.gift-detail .gift-top .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.5;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.gift-detail .gift-top .name{
    font-weight:700;
    font-size:.3rem;
    color:#282828
}
.gift-detail .gift-top .name,.gift-detail .gift-top .time{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem
}
.gift-detail .gift-top .time{
    color:#666
}
.gift-detail .gift-main{
    flex:1 1;
    height:0;
    margin-top:10px;
    overflow-y:scroll;
    position:relative;
    -webkit-overflow-scrolling:touch
}
.gift-detail .gift-main .gift-desc{
    border-bottom:1px solid #ededed;
    padding:10px 0
}
.gift-detail .gift-desc .title{
    font-size:.3rem;
    color:#000
}
.gift-detail .gift-desc .main{
    margin-top:7.5px
}
.gift-detail .gift-bottom{
    background-color:#ffc000;
    padding:7.5px;
    text-align:center;
    font-size:.3rem;
    color:#fff;
    border-radius:20px
}
.comment-detail{
    padding-bottom:calc(env(safe-area-inset-bottom) + 45px);
    background:#f5f6f8
}
.comment-detail,.comment-detail .comment{
    position:relative
}
.comment-detail .comment-reward{
    position:absolute;
    z-index:11;
    right:15px;
    top:5px;
    background:#fff 50% no-repeat;
    background-size:cover;
    width:67px;
    height:50px;
    display:flex;
    justify-content:center;
    align-items:center;
    align-content:center;
    justify-items:center;
    color:#5574ff
}
.comment-detail .comment-reward .text{
    -webkit-transform:rotate(-15deg);
    transform:rotate(-15deg);
    font-size:10px
}
.comment-detail .comment-user{
    padding:10px;
    display:flex;
    align-items:center;
    background:#fff
}
.comment-detail .comment-user .avatar{
    width:40px;
    height:40px;
    flex-shrink:0;
    margin-right:7.5px;
    overflow:hidden;
    border-radius:50%
}
.comment-detail .comment-user .avatar img{
    display:block;
    width:100%;
    height:100%
}
.comment-detail .comment-user .info{
    flex:1 1;
    width:0;
    overflow:hidden
}
.comment-detail .comment-user .info .name{
    font-size:.28rem;
    color:#000;
    display:flex;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.comment-detail .comment-user .info .name img{
    margin-left:5px;
    height:25px
}
.comment-detail .comment-user .info .time{
    margin-top:2.5px;
    font-size:.26rem
}
.comment-detail .comment-body{
    padding:10px;
    background:#fff;
    border-bottom-left-radius:8px;
    border-bottom-right-radius:8px
}
.comment-detail .comment-content{
    font-size:13px
}
.comment-detail .comment-img{
    display:flex;
    overflow:hidden;
    flex-direction:row;
    flex-wrap:wrap;
    margin-left:-10px
}
.comment-detail .comment-img .item{
    width:33.333%;
    margin-top:10px;
    position:relative;
    padding-top:22.5%;
    padding-left:10px;
    overflow:hidden
}
.comment-detail .comment-img .item img{
    display:block;
    position:absolute;
    top:0;
    left:10px;
    right:0;
    bottom:0;
    width:100%;
    height:100%
}
.comment-detail .comment-info{
    padding:10px;
    display:flex;
    align-items:center
}
.comment-detail .comment-info .title{
    color:#000;
    font-size:.3rem
}
.comment-detail .comment-info .count{
    font-size:.26rem
}
.comment-detail .comment-reply .reply-item{
    padding:10px;
    background-color:#fff;
    position:relative;
    display:flex;
    align-items:flex-start;
    margin:10px;
    border-radius:8px
}
.comment-detail .comment-reply .reply-item:first-child{
    margin-top:0
}
.comment-detail .comment-reply .reply-item .avatar{
    width:40px;
    height:40px;
    flex-shrink:0;
    margin-right:7.5px;
    overflow:hidden;
    border-radius:50%
}
.comment-detail .comment-reply .reply-item .avatar img{
    display:block;
    width:100%;
    height:100%
}
.comment-detail .comment-reply .reply-item .main{
    flex:1 1;
    width:0;
    overflow:hidden
}
.comment-detail .comment-reply .reply-item .comment-reward{
    right:50px
}
.comment-detail .comment-reply .reply-item .name{
    font-size:.28rem;
    color:#000;
    display:flex;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.comment-detail .comment-reply .reply-item .name img{
    margin-left:5px;
    height:25px
}
.comment-detail .comment-reply .reply-item .time{
    margin-top:2.5px;
    font-size:.26rem
}
.comment-detail .comment-reply .reply-item .content{
    margin-top:5px
}
.comment-detail .comment-reply .reply-item .like{
    display:flex;
    align-items:center
}
.comment-detail .comment-reply .reply-item .like .icon{
    margin-right:5px
}
.comment-detail .comment-reply .reply-item .like.active .icon{
    color:#ffc000
}
.comment-detail .comment-operate{
    position:fixed;
    z-index:999;
    bottom:0;
    background-color:#fff;
    left:0;
    right:0;
    padding-bottom:env(safe-area-inset-bottom)
}
.comment-detail .comment-operate.inputing{
    padding-bottom:0
}
.comment-detail .comment-operate .container{
    height:45px;
    display:flex;
    align-items:center;
    padding:0 10px
}
.comment-detail .comment-operate .input{
    flex:1 1;
    width:0;
    overflow:hidden;
    background-color:#f8f8f8;
    border-radius:4px;
    display:flex;
    align-items:center
}
.comment-detail .comment-operate .input input{
    flex:1 1;
    width:0;
    padding:5px;
    background:none;
    border:none;
    font-size:16px
}
.comment-detail .comment-operate .input .btn,.comment-detail .comment-operate .input .icon{
    padding:5px 10px;
    font-size:16px
}
.comment-detail .comment-operate .input .btn:before{
    content:"发布"
}
.comment-detail .comment-operate .input .btn.active{
    color:#ffc000
}
.comment-detail .comment-operate .count{
    margin-left:10px;
    display:flex;
    align-items:center
}
.comment-detail .comment-operate .count .item{
    padding:5px;
    font-size:.28rem;
    color:#000
}
.comment-detail .comment-operate .count .item .icon{
    margin-right:5px
}
.comment-detail .comment-operate .count .item.active .icon{
    color:#ffc000
}
.qa-operate{
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    background-color:#fff;
    padding:10px 15px env(safe-area-inset-bottom,15px)
}
.qa-operate .btn{
    padding:10px;
    background-color:#ffc000;
    color:#fff;
    text-align:center;
    font-size:16px;
    border-radius:4px
}
.qa-operate .disable{
    color:#666;
    background-color:#f8f8f8;
    border-radius:20px;
    padding:10px 15px
}
.qa-operate .disable .icon{
    margin-right:5px;
    font-size:16px
}
.qa-form{
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
.qa-form,.qa-form .mask{
    position:fixed;
    z-index:666;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.qa-form .mask{
    background-color:rgba(0,0,0,.5);
    transition:all .25s;
    opacity:0
}
.qa-form .form{
    position:relative;
    z-index:666;
    background-color:#fff;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    padding:15px;
    display:flex;
    flex-direction:column;
    transition:all .25s;
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.qa-form .form .head{
    display:flex;
    align-items:center
}
.qa-form .form .head .title{
    flex:1 1;
    font-size:.28rem;
    color:#333
}
.qa-form .form .head .btn{
    padding:5px 10px;
    background-color:#ffc000;
    color:#fff;
    text-align:center;
    font-size:.28rem;
    border-radius:4px
}
.qa-form .form .head .btn.disable{
    background-color:#eee;
    color:#999
}
.qa-form .form .input{
    margin-top:10px;
    overflow:hidden
}
.qa-form .form .input textarea{
    resize:none;
    width:100%;
    border-radius:4px;
    padding:7.5px;
    border:1px solid #ccc;
    font-size:.28rem;
    margin-bottom:env(safe-area-inset-bottom)
}
.qa-form .form .input textarea:focus{
    margin-bottom:0
}
.qa-form.enter-active .mask,.qa-form.enter-done .mask{
    opacity:1
}
.qa-form.enter-active .form,.qa-form.enter-done .form{
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0)
}
.qa-form.exit-active .mask{
    opacity:0
}
.qa-form.exit-active .form{
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.qa-index{
    padding-bottom:calc(env(safe-area-inset-bottom) + 45px)
}
.qa-index .qa-game{
    background-color:#fff;
    position:fixed;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    height:80px;
    display:flex;
    align-items:center;
    border-bottom:1px solid #eee;
    padding:0 10px
}
.qa-index .qa-game .icon{
    width:60px;
    height:60px;
    margin-right:10px
}
.qa-index .qa-game .icon img{
    display:block;
    width:100%;
    height:100%
}
.qa-index .qa-game .info{
    flex:1 1;
    overflow:hidden
}
.qa-index .qa-game .name{
    font-size:.28rem;
    color:#000
}
.qa-index .qa-game .desc,.qa-index .qa-game .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.qa-index .qa-game .desc{
    margin-top:2.5px
}
.qa-index .qa-items{
    margin-top:80px;
    padding:10px
}
.qa-index .qa-item{
    display:block;
    margin-top:10px
}
.qa-index .qa-item:first-child{
    margin-top:0
}
.qa-index .qa-q{
    display:flex;
    align-items:center
}
.qa-index .qa-q .icon{
    color:#6495ed;
    font-weight:700;
    margin-right:7.5px
}
.qa-index .qa-q .text{
    flex:1 1;
    width:0;
    overflow:hidden;
    font-size:.28rem
}
.qa-index .qa-as{
    background-color:#f8f8f8;
    padding:7.5px;
    margin-left:20px;
    margin-top:5px
}
.qa-index .qa-a{
    display:flex
}
.qa-index .qa-a .icon{
    color:#ffc000;
    font-weight:700;
    margin-right:7.5px
}
.qa-index .qa-a .text{
    flex:1 1;
    width:0;
    overflow:hidden;
    font-size:.26rem
}
.qa-index .qa-more{
    margin-top:5px
}
.qa-index .qa-more span{
    color:#ffc000
}
.qa-detail .qa{
    padding-bottom:calc(env(safe-area-inset-bottom) + 45px)
}
.qa-detail .qa-q{
    padding:10px 10px 10px 20px;
    border-bottom:10px solid #f5f6f8;
    display:flex
}
.qa-detail .qa-q .avatar{
    width:45px;
    height:45px;
    overflow:hidden;
    flex-shrink:0;
    border-radius:50%;
    margin-right:15px
}
.qa-detail .qa-q .avatar img{
    display:block;
    width:100%;
    height:100%
}
.qa-detail .qa-q .main{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column
}
.qa-detail .qa-q .info{
    display:flex;
    align-items:center
}
.qa-detail .qa-q .name{
    font-size:.28rem;
    flex:1 1;
    width:0;
    color:#000;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    display:flex
}
.qa-detail .qa-q .name .nick-name{
    margin-right:.15rem
}
.qa-detail .qa-q .name .level-img{
    width:40px
}
.qa-detail .qa-q .desc{
    display:flex;
    align-items:center
}
.qa-detail .qa-q .desc .icon{
    color:#6495ed;
    font-weight:700;
    margin-right:7.5px;
    width:20px;
    margin-top:.14rem
}
.qa-detail .qa-q .desc .text{
    flex:1 1;
    width:0;
    overflow:hidden;
    font-size:.28rem
}
.qa-detail .qa-info{
    border-bottom:1px solid #dedede;
    padding:10px;
    display:flex
}
.qa-detail .qa-info .icon{
    color:#ffc000;
    font-weight:700;
    margin-right:7.5px;
    width:20px
}
.qa-detail .qa-info .text{
    flex:1 1;
    width:0;
    overflow:hidden;
    font-size:.26rem
}
.qa-detail .qa-info span{
    color:#ffc000
}
.qa-detail .qa-a{
    padding:10px 10px 10px 20px;
    border-bottom:1px solid #ededed;
    display:flex;
    position:relative
}
.qa-detail .qa-a .avatar{
    width:35px;
    height:35px;
    overflow:hidden;
    flex-shrink:0;
    border-radius:50%;
    margin-right:10px
}
.qa-detail .qa-a .avatar img{
    display:block;
    width:100%;
    height:100%
}
.qa-detail .qa-a .main{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column
}
.qa-detail .qa-a .info{
    display:flex;
    align-items:center
}
.qa-detail .qa-a .name{
    font-size:.28rem;
    flex:1 1;
    width:0;
    color:#000;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    display:flex
}
.qa-detail .qa-a .name .official-tit{
    background:#fdd20a;
    color:#fff;
    padding:0 .05rem;
    margin-right:.1rem
}
.qa-detail .qa-a .name .nick-name{
    margin-right:.15rem
}
.qa-detail .qa-a .name .level-img{
    width:40px
}
.qa-detail .qa-a .desc{
    display:flex;
    align-items:center
}
.qa-detail .qa-a .desc .icon{
    color:#6495ed;
    font-weight:700;
    margin-right:7.5px
}
.qa-detail .qa-a .desc .text{
    flex:1 1;
    width:0;
    overflow:hidden;
    font-size:.28rem;
    margin-top:5px
}
.qa-detail .qa-a .authority,.qa-detail .qa-a .authority .nick-name{
    color:red
}
.qa-detail .qa-a .qa-reward{
    position:absolute;
    z-index:11;
    right:15px;
    top:5px;
    background-size:cover;
    width:67px;
    height:50px;
    display:flex;
    justify-content:center;
    align-items:center;
    align-content:center;
    justify-items:center;
    color:#5574ff
}
.recovery-record{
    padding:5px;
    color:#000
}
.recovery-index{
    padding:10px;
    background:#f5f6f8
}
.recovery-index .recovery-step{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 10px;
    background-color:#fff;
    border-radius:8px
}
.recovery-index .recovery-step .item{
    flex:1 1;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:5px;
    padding:5px;
    color:#282828;
    font-size:.26rem;
    flex-direction:column;
    position:relative
}
.recovery-index .recovery-step .item .icon{
    width:35px;
    height:35px
}
.recovery-index .recovery-step .icon-step{
    display:flex;
    align-items:center;
    justify-content:center;
    width:35px;
    height:35px
}
.recovery-index .recovery-explain,.recovery-index .recovery-tips{
    margin-top:5px
}
.recovery-index .recovery-explain .title,.recovery-index .recovery-tips .title{
    font-weight:700;
    font-size:.34rem;
    color:#000;
    margin-bottom:5px
}
.recovery-index .recovery-explain .desc,.recovery-index .recovery-tips .desc{
    background:#fff;
    padding:10px;
    border-radius:8px
}
.recovery-index .recovery-explain .item,.recovery-index .recovery-tips .item{
    position:relative;
    margin-top:5px;
    font-size:13px
}
.recovery-index .recovery-explain .item:first-child,.recovery-index .recovery-tips .item:first-child{
    margin-top:0
}
.recovery-index .recovery-title{
    margin-top:5px;
    font-size:.34rem;
    display:flex;
    align-items:center;
    color:#000;
    font-weight:700
}
.recovery-index .recovery-title .icon{
    color:#ffc000;
    font-size:.3rem;
    margin-right:5px
}
.recovery-index .recovery-items .item{
    margin-top:7.5px;
    display:flex;
    align-items:center;
    background:#fff;
    padding:10px;
    border-radius:8px
}
.recovery-index .recovery-items .item .icon{
    width:65px;
    height:65px;
    border-radius:8px;
    overflow:hidden;
    margin-right:7.5px
}
.recovery-index .recovery-items .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.recovery-index .recovery-items .item .info{
    flex:1 1;
    width:0;
    overflow:hidden
}
.recovery-index .recovery-items .item .info .name{
    color:#282828;
    font-size:.34rem;
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem
}
.recovery-index .recovery-items .item .info .desc{
    margin-top:2.5px;
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem
}
.recovery-index .recovery-items .item .info .desc span{
    color:#ff5e00
}
.recovery-index .recovery-items .item .price{
    padding-left:5px;
    font-size:12px;
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem;
    float:right
}
.recovery-index .recovery-items .item .price span{
    color:#ff5e00;
    font-size:.28rem
}
.recovery-record .record-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#fff;
    height:45px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-bottom:1px solid #eee
}
.recovery-record .record-head .item{
    flex:1 1;
    text-align:center;
    font-size:15px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transition:all .25s;
    color:#333
}
.recovery-record .record-head .item:after{
    content:"";
    display:none;
    width:25px;
    height:2px;
    margin-top:2.5px;
    background-color:#ffc000
}
.recovery-record .record-head .item.active{
    font-size:16px;
    color:#000;
    font-weight:700
}
.recovery-record .record-head .item.active:after{
    display:block
}
.recovery-record .record-body{
    margin-top:45px;
    padding:12.5px;
    position:relative
}
.recovery-record .record-body .type-item{
    display:none
}
.recovery-record .record-body .type-item.active{
    display:block
}
.recovery-record .record-body .record-item{
    margin-top:10px;
    overflow:hidden;
    display:flex;
    align-items:center;
    border-top:1px solid #eee;
    position:relative;
    padding-top:7.5px
}
.recovery-record .record-body .record-item:first-child{
    margin-top:0
}
.recovery-record .record-body .record-item .icon{
    width:65px;
    height:65px;
    border-radius:8px;
    overflow:hidden;
    margin-right:7.5px
}
.recovery-record .record-body .record-item .icon img{
    display:block;
    width:100%;
    height:100%
}
.recovery-record .record-body .record-item .subject{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    align-items:flex-end
}
.recovery-record .record-body .record-item .info{
    flex:1 1;
    width:0;
    overflow:hidden
}
.recovery-record .record-body .record-item .info .name{
    color:#000;
    font-size:.28rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.recovery-record .record-body .record-item .info .desc{
    margin-top:2.5px;
    color:#666;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.recovery-record .record-body .record-item .info .desc span{
    color:red
}
.recovery-record .record-body .record-item .operate{
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    justify-content:flex-end;
    padding-left:5px;
    color:#666;
    font-size:13px
}
.recovery-record .record-body .record-item .price{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.recovery-record .record-body .record-item .price span{
    color:red;
    font-size:.28rem
}
.recovery-record .record-body .record-item .time{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.recovery-record .record-body .record-item:after{
    content:"";
    display:block;
    position:absolute;
    bottom:auto;
    right:-15px;
    top:7.5px;
    color:#fff;
    background-color:#ccc;
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg);
    width:65px;
    text-align:center;
    font-size:10px
}
.recovery-record .record-body .record-item.can:after{
    content:"待赎回";
    background-color:brown
}
.recovery-record .record-body .record-item.ed:after{
    content:"已赎回"
}
.recovery-record .record-body .record-item.expire:after{
    content:"已过期"
}
.recovery-confirm{
    position:fixed;
    z-index:900;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.75);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center
}
.recovery-confirm .confirm-container{
    width:90%;
    margin:0 auto;
    border-radius:10px;
    background:#fff top no-repeat;
    background-size:contain;
    display:inline-flex;
    flex-direction:column;
    padding:10px;
    max-height:75vh
}
.recovery-confirm .confirm-head{
    color:#fff;
    padding:30px 10px;
    text-align:center
}
.recovery-confirm .confirm-head .title{
    font-weight:700;
    font-size:.3rem
}
.recovery-confirm .confirm-head .info{
    font-size:.26rem;
    margin-top:5px
}
.recovery-confirm .confirm-body{
    flex:1 1;
    padding:10px;
    overflow:hidden;
    margin-top:20px;
    display:flex;
    flex-direction:column
}
.recovery-confirm .confirm-body .title{
    display:flex;
    align-items:center;
    font-size:.28rem;
    color:#000;
    font-weight:700
}
.recovery-confirm .confirm-body .title img{
    display:block;
    height:20px;
    margin-right:7.5px
}
.recovery-confirm .confirm-body .content{
    flex:1 1;
    margin-top:10px;
    min-height:30vh;
    overflow-y:scroll;
    position:relative;
    -webkit-overflow-scrolling:touch
}
.recovery-confirm .confirm-body .content p{
    padding-left:15px;
    position:relative;
    margin-bottom:5px;
    font-size:13px;
    color:#333
}
.recovery-confirm .confirm-body .content p:before{
    content:"";
    display:inline-block;
    width:6px;
    height:6px;
    background-color:#ffc000;
    border-radius:50%;
    position:absolute;
    top:10px;
    left:0
}
.recovery-confirm .confirm-foot{
    display:flex;
    flex-direction:column
}
.recovery-confirm .confirm-foot .input{
    display:flex;
    align-items:center;
    padding-left:10px;
    padding-right:10px;
    padding-bottom:10px
}
.recovery-confirm .confirm-foot .input input{
    margin-right:10px
}
.recovery-confirm .confirm-foot .input .agreement{
    margin-right:5px;
    border:2px solid #ccc;
    width:15px;
    height:15px;
    border-radius:50%;
    display:inline-block;
    vertical-align:middle;
    position:relative
}
.recovery-confirm .confirm-foot .input .agreement.checked:after{
    content:"";
    display:block;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    background-color:#0075ff;
    width:8px;
    height:8px;
    border-radius:50%
}
.recovery-confirm .confirm-foot .btns{
    display:flex;
    padding:0 7.5px;
    margin-top:5px
}
.recovery-confirm .confirm-foot .btns .btn{
    flex:1 1;
    background-color:#ffc000;
    border-radius:20px;
    padding:10px;
    font-size:.28rem;
    color:#fff;
    text-align:center;
    margin:0 7.5px 7.5px
}
.recovery-confirm .confirm-foot .btns .btn:last-child{
    background-color:#eee
}
.recovery-confirm .confirm-foot .btns .btn:last-child.confirm{
    background-color:#ffc000
}
.recovery-detail{
    padding-bottom:55px;
    padding-top:125px
}
.recovery-detail .recovery-info{
    position:fixed;
    z-index:22;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#fff;
    height:85px;
    padding:0 10px;
    border-bottom:1px solid #ccc;
    display:flex;
    align-items:center
}
.recovery-detail .recovery-info .icon{
    width:65px;
    height:65px;
    margin-right:7.5px
}
.recovery-detail .recovery-info .icon img{
    display:block;
    width:100%;
    height:100%
}
.recovery-detail .recovery-info .info .name{
    color:#000;
    font-size:.28rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.recovery-detail .recovery-info .info .desc{
    font-size:.26rem;
    color:#666;
    margin-top:5px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.recovery-detail .recovery-info .info .desc span{
    color:red
}
.recovery-detail .recovery-thead{
    position:fixed;
    z-index:22;
    top:calc(env(safe-area-inset-top) + 125px);
    left:0;
    right:0;
    background-color:#fff;
    display:flex;
    align-items:center;
    height:40px;
    padding:0 10px;
    border-bottom:1px solid #eee
}
.recovery-detail .recovery-thead .th{
    flex:1 1;
    text-align:center
}
.recovery-detail .recovery-tbody .tr{
    border-bottom:1px solid #ccc;
    padding:10px;
    display:flex;
    align-items:center
}
.recovery-detail .recovery-tbody .td{
    flex:1 1;
    text-align:center
}
.recovery-detail .recovery-operate{
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    background-color:#f8f8f8;
    height:55px;
    padding:0 15px env(safe-area-inset-bottom);
    display:flex;
    flex-direction:column;
    justify-content:center
}
.recovery-detail .recovery-operate .btn{
    background-color:#eee;
    border-radius:20px;
    padding:8.5px;
    font-size:.26rem;
    color:#fff;
    text-align:center
}
.recovery-detail .recovery-operate .btn.active{
    background-color:#ffc000
}
.recovery-empty{
    display:flex;
    flex-direction:column;
    align-items:center;
    font-size:13px;
    color:#999;
    margin-top:50%
}
.recovery-empty img{
    display:block;
    width:50%
}
.recovery-buyread{
    position:fixed;
    z-index:900;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all 3s
}
.recovery-buyread:before{
    content:"";
    display:block;
    position:absolute;
    z-index:901;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.75);
    transition:all .25s;
    opacity:1
}
.recovery-buyread .container{
    position:relative;
    z-index:902;
    width:90%;
    height:80%;
    display:flex;
    flex-direction:column;
    border-radius:10px;
    background:#fff top no-repeat;
    background-size:contain;
    transition:all .25s;
    opacity:1;
    -webkit-transform:scale(1);
    transform:scale(1)
}
.recovery-buyread .head{
    color:#fff;
    padding:35px;
    text-align:center
}
.recovery-buyread .head .title{
    font-weight:700;
    font-size:.3rem
}
.recovery-buyread .head .info{
    font-size:.26rem;
    margin-top:5px
}
.recovery-buyread .main{
    flex:1 1;
    height:0;
    padding:10px;
    display:flex;
    flex-direction:column
}
.recovery-buyread .main .title{
    display:flex;
    align-items:center;
    color:#000;
    font-size:.28rem
}
.recovery-buyread .main .title img{
    height:20px;
    margin-right:5px
}
.recovery-buyread .main .body{
    flex:1 1;
    height:0;
    padding:10px;
    overflow:hidden;
    overflow-y:scroll;
    position:relative;
    -webkit-overflow-scrolling:touch
}
.recovery-buyread .main .body p{
    padding-left:15px;
    position:relative;
    margin-bottom:5px;
    font-size:12px
}
.recovery-buyread .main .body p:before{
    content:"";
    display:inline-block;
    width:6px;
    height:6px;
    background-color:#ffc000;
    border-radius:50%;
    position:absolute;
    top:7px;
    left:0
}
.recovery-buyread .operate .input{
    padding-left:10px;
    padding-right:10px;
    padding-bottom:10px
}
.recovery-buyread .operate .input input{
    margin-right:10px
}
.recovery-buyread .operate .input .agreement{
    margin-right:5px;
    border:2px solid #ccc;
    width:15px;
    height:15px;
    border-radius:50%;
    display:inline-block;
    vertical-align:middle;
    margin-bottom:1.5px;
    position:relative
}
.recovery-buyread .operate .input .agreement.checked{
    border:2px solid #ffc000
}
.recovery-buyread .operate .input .agreement.checked:after{
    content:"";
    display:block;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    background-color:#ffc000;
    width:5px;
    height:5px;
    border-radius:50%
}
.recovery-buyread .operate .btns{
    display:flex;
    align-content:center;
    justify-content:center;
    align-items:center
}
.recovery-buyread .operate .buy,.recovery-buyread .operate .think{
    flex:1 1;
    display:block;
    background-color:#ffc000;
    margin-left:10px;
    margin-right:10px;
    border-radius:20px;
    padding:10px;
    font-size:.28rem;
    color:#fff;
    text-align:center;
    margin-bottom:7.5px;
    transition:all .25s
}
.recovery-buyread .operate .disable,.recovery-buyread .operate .think{
    background-color:#eee
}
.rebate-guide .tips{
    color:#ffc000;
    font-size:13px;
    padding:10px;
    display:flex;
    align-items:center;
    justify-content:center
}
.rebate-guide .tips .icon{
    margin-right:5px
}
.rebate-guide .list dl{
    border-bottom:1px solid #ccc
}
.rebate-guide .list dl dt{
    padding:10px;
    display:flex;
    align-items:center
}
.rebate-guide .list dl dt .text{
    flex:1 1;
    width:0;
    color:#333;
    font-size:.28rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.rebate-guide .list dl dt .icon{
    font-size:.3rem
}
.rebate-guide .list dl .icon-down{
    display:block
}
.rebate-guide .list dl .icon-up{
    display:none
}
.rebate-guide .list dl dd{
    overflow:hidden;
    padding:10px;
    color:#666;
    font-size:.26rem;
    border-top:1px solid #ccc;
    display:none
}
.rebate-guide .list dl.active dd{
    display:block
}
.rebate-guide .list dl.active .icon-down{
    display:none
}
.rebate-guide .list dl.active .icon-up{
    display:block
}
.rebate-index .rebate-head{
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#fff;
    height:45px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-bottom:1px solid #eee;
    max-width:720px;
    margin:0 auto
}
.rebate-index .rebate-head .item{
    flex:1 1;
    text-align:center;
    font-size:15px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transition:all .25s;
    color:#333
}
.rebate-index .rebate-head .item:after{
    content:"";
    display:none;
    width:25px;
    height:2px;
    margin-top:2.5px;
    background-color:#ffc000
}
.rebate-index .rebate-head .item.active{
    font-size:16px;
    color:#000;
    font-weight:700
}
.rebate-index .rebate-head .item.active:after{
    display:block
}
.rebate-index .rebate-body{
    margin-top:45px;
    position:relative
}
.rebate-index .rebate-body .type-item{
    display:none
}
.rebate-index .rebate-body .type-item.active{
    display:block
}
.rebate-can{
    padding:42.5px 12.5px 12.5px
}
.rebate-can .rebate-tips{
    position:fixed;
    z-index:333;
    top:calc(env(safe-area-inset-top) + 85px);
    left:0;
    right:0;
    padding:0 5px;
    text-align:center;
    color:red;
    justify-content:center;
    height:30px;
    font-size:12px
}
.rebate-can .rebate-item,.rebate-can .rebate-tips{
    display:flex;
    align-items:center
}
.rebate-can .rebate-item .icon{
    width:65px;
    height:65px;
    margin-right:10px;
    border-radius:8px;
    overflow:hidden
}
.rebate-can .rebate-item .icon img{
    display:block;
    width:100%;
    height:100%
}
.rebate-can .rebate-item .info{
    flex:1 1;
    width:0;
    overflow:hidden
}
.rebate-can .rebate-item .info .name{
    color:#333;
    font-size:.28rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.rebate-can .rebate-item .info .time{
    color:#666
}
.rebate-can .rebate-item .info .amount,.rebate-can .rebate-item .info .time{
    font-size:13px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:2.5px
}
.rebate-can .rebate-item .info .amount{
    color:#333
}
.rebate-can .rebate-item .info span{
    color:red
}
.rebate-can .rebate-item .operate{
    padding:4px 8px;
    background-color:#ffc000;
    color:#fff;
    border-radius:12px
}
.rebate-submit{
    min-height:100vh;
    background-color:#f8f8f8
}
.rebate-submit .input-group{
    margin-bottom:10px;
    background-color:#fff;
    padding:5px
}
.rebate-submit .input-item{
    display:flex;
    align-items:center;
    padding:5px
}
.rebate-submit .input-item .icon{
    margin-right:7.5px
}
.rebate-submit .input-item .icon img{
    display:block;
    height:25px
}
.rebate-submit .input-item .name{
    font-size:.28rem;
    color:#333
}
.rebate-submit .input-item .value{
    flex:1 1;
    text-align:right;
    font-size:.26rem;
    color:#666
}
.rebate-submit .input-item .value span{
    color:red
}
.rebate-submit .rebate-content textarea{
    width:100%;
    padding:10px;
    background-color:#fff;
    border:none;
    line-height:1.5;
    resize:none
}
.rebate-submit .rebate-operate{
    flex:1 1;
    background-color:#ffc000;
    border-radius:20px;
    padding:7.5px;
    font-size:.28rem;
    color:#fff;
    text-align:center;
    margin:10px
}
.rebate-submit .rebate-confirm{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    z-index:555;
    background-color:rgba(0,0,0,.75);
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center
}
.rebate-submit .rebate-confirm .container{
    background-color:#fff;
    width:75%;
    border-radius:8px;
    overflow:hidden
}
.rebate-submit .rebate-confirm .body{
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:12.5px
}
.rebate-submit .rebate-confirm .icon img{
    display:block;
    height:75px
}
.rebate-submit .rebate-confirm .title{
    font-size:.32rem;
    color:#000
}
.rebate-submit .rebate-confirm .info{
    font-size:.26rem;
    color:#666;
    padding:15px 0
}
.rebate-submit .rebate-confirm .info p{
    margin:5px auto
}
.rebate-submit .rebate-confirm .btns{
    border-top:1px solid #eee;
    display:flex
}
.rebate-submit .rebate-confirm .btns .btn{
    flex:1 1;
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:10px
}
.rebate-submit .rebate-confirm .btns .btn:first-child{
    border-right:1px solid #eee
}
.rebate-submit .rebate-confirm .btns .btn:last-child{
    color:#ffc000
}
.rebate-success{
    padding:10px
}
.rebate-success .icon{
    display:flex;
    justify-content:center;
    padding-top:50px
}
.rebate-success .icon img{
    display:block;
    height:100px
}
.rebate-success .title{
    font-size:.3rem;
    color:#000;
    display:flex;
    justify-content:center
}
.rebate-success .info{
    border-bottom:1px solid #eee
}
.rebate-success .info dl{
    padding:7.5px 0;
    display:flex;
    align-items:center
}
.rebate-success .info dl dt{
    color:#999
}
.rebate-success .info dl dd{
    flex:1 1;
    width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#333;
    text-align:right
}
.rebate-success .info dl dd span{
    color:#ffc000
}
.rebate-success .tips{
    margin-top:12.5px
}
.rebate-success .tips .title{
    font-size:.3rem;
    color:#333
}
.rebate-success .tips .content{
    margin-top:10px;
    font-size:.26rem;
    color:#666
}
.rebate-success .tips .content p{
    margin:2.5px auto
}
.rebate-success .operate{
    display:flex;
    align-items:center;
    margin-top:15px
}
.rebate-success .operate .btn{
    flex:1 1;
    border:1px solid #ffc000;
    border-radius:20px;
    margin-left:5px;
    margin-right:5px;
    display:flex;
    justify-content:center;
    align-items:center;
    padding:7.5px
}
.rebate-success .operate .btn:first-child{
    background-color:#fff;
    color:#ffc000
}
.rebate-success .operate .btn:last-child{
    background-color:#ffc000;
    color:#fff
}
.rebate-detail{
    background:#f8f8f8;
    padding-bottom:50px
}
.rebate-detail .rebate-tit-bg{
    padding:25% 7.5% 0;
    background-repeat:no-repeat;
    min-height:37vh;
    background-size:100%
}
.rebate-detail .rebate-desc-desc{
    position:relative;
    margin-top:-4rem
}
.rebate-detail .rebate-desc-desc .wp{
    padding:0 .3rem
}
.rebate-detail .rebate-desc-desc .wp .desc-box .desc-info{
    background:#fff;
    margin:-.2rem .1rem;
    padding:.2rem;
    border-bottom-left-radius:.2rem;
    border-bottom-right-radius:.2rem
}
.rebate-detail .title{
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:.3rem;
    color:#000;
    padding-top:.5rem
}
.rebate-detail .title img{
    height:3px;
    margin:0 5px
}
.rebate-detail .info{
    font-size:13px
}
.rebate-detail .info dl{
    display:flex;
    align-items:center;
    padding:5px 0
}
.rebate-detail .info dl dt{
    width:75px
}
.rebate-detail .info dl dd{
    flex:1 1;
    width:0;
    color:#333;
    font-size:13px;
    overflow:hidden
}
.rebate-detail .info dl dd .id-codes{
    padding:.42rem 0
}
.rebate-detail .info dl dd .id-codes:first-child{
    padding-top:0
}
.rebate-detail .info dl dd .codes{
    float:left
}
.rebate-detail .info dl dd .btn{
    background-color:#ffc000;
    color:#fff;
    border-radius:12px;
    width:20%;
    text-align:center;
    float:right
}
.rebate-detail .info .mores{
    text-align:center;
    padding:.2rem;
    border-bottom:1px dashed #dedede
}
.rebate-detail .info .mores a{
    color:#ffc000
}
.rebate-detail .data{
    display:flex;
    align-items:center;
    padding:.2rem 0 0
}
.rebate-detail .data .time{
    color:#333
}
.rebate-detail .data .amount{
    flex:1 1;
    text-align:right;
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.rebate-detail .data .amount span{
    color:#ffc000;
    font-size:.32rem
}
.rebate-detail .remind{
    margin-top:10px
}
.rebate-detail .remind p{
    position:relative;
    padding-left:20px;
    font-size:13px;
    color:#666
}
.rebate-detail .remind p:before{
    content:"!";
    position:absolute;
    top:50%;
    left:0;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    background-color:#ffc000;
    width:12px;
    height:12px;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:10px
}
.rebate-detail .operate{
    display:flex;
    align-items:center;
    margin-top:15px
}
.rebate-detail .operate .btn{
    flex:1 1;
    border:1px solid #ffc000;
    border-radius:20px;
    margin-left:5px;
    margin-right:5px;
    display:flex;
    justify-content:center;
    align-items:center;
    padding:7.5px
}
.rebate-detail .operate .btn:first-child{
    background-color:#fff;
    color:#ffc000
}
.rebate-detail .operate .btn:last-child{
    background-color:#ffc000;
    color:#fff
}
.rebate-detail .tips{
    font-size:12px;
    text-align:center;
    color:#999;
    margin-top:10px
}
.rebate-codes{
    background-color:#fff;
    min-height:100vh;
    padding:10px
}
.rebate-codes .data{
    padding:.5rem 0
}
.rebate-codes .data .name{
    float:left
}
.rebate-codes .data .operate{
    background-color:#ffc000;
    color:#fff;
    border-radius:12px;
    width:20%;
    float:right;
    text-align:center
}
.rebate-codes .data:first-child{
    padding-top:.2rem
}
.rebate-record{
    background-color:#f8f8f8;
    min-height:100vh;
    padding:10px
}
.rebate-record .item{
    display:block;
    padding:10px;
    background-color:#fff;
    border-radius:4px;
    margin-top:10px
}
.rebate-record .item:first-child{
    margin-top:0
}
.rebate-record .item .main{
    display:flex;
    align-items:center;
    padding-bottom:7.5px;
    border-bottom:1px solid #eee
}
.rebate-record .item .main .icon{
    width:65px;
    height:65px;
    margin-right:10px;
    border-radius:8px;
    overflow:hidden
}
.rebate-record .item .main .icon img{
    display:block;
    width:100%;
    height:100%
}
.rebate-record .item .main .info{
    flex:1 1;
    width:0;
    overflow:hidden
}
.rebate-record .item .main .info .name{
    color:#333;
    font-size:.28rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.rebate-record .item .main .info .time{
    color:#666
}
.rebate-record .item .main .info .amount,.rebate-record .item .main .info .time{
    font-size:13px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:2.5px
}
.rebate-record .item .main .info .amount{
    color:#333
}
.rebate-record .item .main .info span{
    color:red
}
.rebate-record .item .operate{
    margin-top:5px;
    display:flex;
    align-items:center
}
.rebate-record .item .operate .state{
    flex:1 1;
    width:0;
    overflow:hidden;
    color:#666
}
.rebate-record .item .operate .state span{
    color:red
}
.rebate-record .item .operate .btn{
    background-color:#ffc000;
    color:#fff;
    padding:3.5px 7.5px;
    border-radius:12px
}
.rebate-record .item .remark{
    margin-top:5px;
    color:red
}
.ptb-index{
    padding:.2rem
}
.ptb-index .ptb-amount{
    background-color:#ffc000;
    background-image:linear-gradient(90deg,#f99935,#f7b26f);
    border-radius:.2rem;
    padding:.3rem;
    color:#fff
}
.ptb-index .ptb-amount .name{
    font-size:.3rem
}
.ptb-index .ptb-amount .value{
    font-size:.5rem
}
.ptb-index .amount-title{
    font-size:.3rem;
    color:#000;
    margin-top:.2rem
}
.ptb-index .amount-title span{
    font-size:.28rem;
    color:#999
}
.ptb-index .amount-item{
    overflow:hidden;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between
}
.ptb-index .amount-item .item{
    width:30%;
    margin:.15rem 0;
    border:1px solid #ccc;
    padding:.1rem;
    color:#ffc000;
    border-radius:4px;
    text-align:center;
    font-size:.4rem;
    transition:all .25s
}
.ptb-index .amount-item .item.active{
    border:1px solid #ffc000
}
.ptb-index .amount-input{
    margin-top:.2rem;
    color:#ffc000;
    font-size:.28rem;
    display:flex;
    align-items:center
}
.ptb-index .amount-input input{
    flex:1 1;
    border:1px solid #ccc;
    border-radius:4px;
    padding:.15rem;
    font-size:.3rem
}
.ptb-index .amount-result{
    font-size:.28rem;
    color:#999;
    margin-top:.2rem
}
.ptb-index .amount-result span{
    color:#ffc000
}
.ptb-index .pay-title{
    margin-top:.2rem;
    font-size:.29rem;
    color:#999
}
.ptb-index .pay-type{
    overflow:hidden;
    display:flex;
    align-items:stretch;
    margin:.2rem -5px 0
}
.ptb-index .pay-type .item{
    flex:1 1;
    margin:0 5px;
    border:1px solid #ccc;
    color:#ffc000;
    padding:.15rem .2rem;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:4px;
    transition:all .25s
}
.ptb-index .pay-type .item.active{
    border:1px solid #ffc000
}
.ptb-index .pay-type .alipay{
    color:#00f;
    font-size:.35rem;
    margin-right:.3rem
}
.ptb-index .pay-type .wxpay{
    color:green;
    font-size:.37rem;
    margin-right:.3rem
}
.ptb-index .pay-btn{
    background-color:#ffc000;
    padding:.16rem;
    border-radius:8px;
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    margin-top:.3rem
}
.ptb-record{
    padding:.2rem
}
.ptb-record .item{
    display:flex;
    align-items:center;
    font-size:.28rem;
    padding:.2rem
}
.ptb-record .item .time{
    flex:1 1;
    width:0
}
.ptb-record .item .amount,.ptb-record .item .time{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.ptb-record .empty{
    display:flex;
    flex-direction:column;
    align-items:center
}
.ptb-record .empty img{
    display:block;
    width:50%
}
.pay-check-auth{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.pay-check-auth .auth-index{
    width:80%;
    margin-left:10%;
    background:#fff;
    margin-top:40%;
    overflow:auto;
    padding:20px;
    border-radius:10px;
    line-height:180%;
    text-align:center
}
.pay-check-auth .auth-index .close{
    position:absolute;
    width:4%;
    margin-left:65%
}
.pay-check-auth .auth-index .title .title-img{
    width:30%;
    margin:0 auto
}
.pay-check-auth .auth-index .title h3{
    color:#282828;
    font-weight:700;
    font-size:18px
}
.pay-check-auth .auth-index .title p{
    text-align:left
}
.pay-check-auth .auth-index .auth-user-realname{
    padding:12.5px 0;
    text-align:left
}
.pay-check-auth .auth-index .auth-user-realname .auth-user-input{
    padding:7.5px 0;
    display:flex;
    align-items:center
}
.pay-check-auth .auth-index .auth-user-realname .auth-user-input .name{
    flex-shrink:0;
    color:#000;
    font-weight:700;
    margin-right:.2rem
}
.pay-check-auth .auth-index .auth-user-realname .auth-user-input input{
    flex:1 1;
    background:none;
    padding:12px;
    background:#f5f6f8;
    border:1px solid #f5f6f8;
    border-radius:5px
}
.pay-check-auth .auth-index .auth-user-realname span{
    color:#f74949;
    font-size:12px
}
.pay-check-auth .auth-index .auth-user-realname .auth-user-btn{
    margin:25px 0 0;
    border-radius:20px;
    padding:10px;
    background:#ffc000;
    font-size:16px;
    color:#fff;
    text-align:center
}
.pay-check-auth .adult-index{
    margin-top:68%
}
.message-index .message-group{
    padding:10px 10px 0
}
.message-index .message-group .item{
    display:flex;
    align-items:stretch;
    border-bottom:1px solid #eee;
    padding-bottom:10px;
    margin-bottom:10px
}
.message-index .message-group .item:last-child{
    border-bottom:none
}
.message-index .message-group .item .icon{
    width:65px;
    height:65px;
    margin-right:10px
}
.message-index .message-group .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.message-index .message-group .item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:space-around;
    padding:5px 0
}
.message-index .message-group .item .info .name{
    font-size:15px;
    font-weight:700;
    color:#000
}
.message-index .message-group .item .info .name .empty{
    color:#999
}
.message-index .message-sys .sys-title{
    background-color:#ccc;
    padding:10px 15px
}
.message-comment{
    padding:10px
}
.message-comment .item{
    display:flex;
    background-color:#fff;
    transition:all .25s;
    max-height:100px
}
.message-comment .item .entity{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    border-bottom:1px solid #eee;
    padding-bottom:10px;
    margin-bottom:10px
}
.message-comment .item .icon{
    width:65px;
    height:65px;
    overflow:hidden;
    border-radius:50%
}
.message-comment .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.message-comment .item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    padding:0 10px
}
.message-comment .item .info .name{
    font-size:15px;
    color:#000
}
.message-comment .item .info .desc{
    font-size:13px;
    color:#999
}
.message-comment .item .info .text{
    color:#666
}
.message-comment .item .time{
    font-size:13px
}
.message-comment .item .operate{
    width:0;
    background-color:red;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all .1s
}
.message-comment .item.operable .operate{
    width:50px;
    margin-left:10px
}
.message-comment .item.exit-active{
    max-height:0;
    opacity:0
}
.message-qa{
    padding:10px
}
.message-qa .item{
    display:flex;
    background-color:#fff;
    transition:all .25s;
    max-height:100px
}
.message-qa .item .entity{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    border-bottom:1px solid #eee;
    padding-bottom:10px;
    margin-bottom:10px
}
.message-qa .item .icon{
    width:65px;
    height:65px;
    overflow:hidden;
    border-radius:50%
}
.message-qa .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.message-qa .item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    padding:0 10px
}
.message-qa .item .info .name{
    font-size:15px;
    color:#000
}
.message-qa .item .info .desc{
    font-size:13px;
    color:#999
}
.message-qa .item .info .text{
    color:#666
}
.message-qa .item .time{
    font-size:13px
}
.message-qa .item .operate{
    width:0;
    background-color:red;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all .1s
}
.message-qa .item.operable .operate{
    width:50px;
    margin-left:10px
}
.message-qa .item.exit-active{
    max-height:0;
    opacity:0
}
.sys-mess-index{
    padding:10px;
    border-bottom:1px solid #ededed
}
.sys-mess-data{
    overflow:hidden;
    background:#fff;
    border-radius:8px
}
.sys-mess-data .data-head{
    display:flex;
    align-items:center;
    padding-top:5px
}
.sys-mess-data .data-head .text{
    font-size:18px;
    font-weight:700;
    color:#000;
    flex:1 1
}
.sys-mess-data .tips{
    text-overflow:ellipsis;
    overflow:hidden;
    white-space:nowrap
}
.message-new{
    padding:.3rem
}
.credit-index{
    padding-top:calc(276px + env(safe-area-inset-top))
}
.credit-index .credit-head{
    position:fixed;
    z-index:111;
    top:0;
    left:0;
    right:0
}
.credit-index .credit-head .container{
    background-color:#555;
    padding:calc(env(safe-area-inset-top) + 50px) 15px 15px;
    position:relative
}
.credit-index .credit-head .container:after{
    content:"";
    display:block;
    position:absolute;
    z-index:11;
    background-color:#fff;
    bottom:0;
    left:0;
    right:0;
    height:50%;
    border-top-left-radius:30px;
    border-top-right-radius:30px
}
.credit-index .credit-head .container .banner{
    background:50% no-repeat;
    background-size:100% auto;
    height:125px;
    position:relative;
    z-index:33;
    border-radius:12px
}
.credit-index .credit-head .container .banner .btns{
    position:absolute;
    right:10%;
    top:7.5%
}
.credit-index .credit-head .container .banner .btn{
    background-color:#7b5d17;
    color:#f4d88f;
    font-size:13px;
    padding:5px 10px;
    border-radius:10px;
    margin-right:10px
}
.credit-index .credit-head .container .info{
    position:relative;
    z-index:33;
    margin-top:15px;
    display:flex;
    align-items:center;
    height:25px;
    flex-direction:row;
    justify-content:space-between
}
.credit-index .credit-head .container .info .credit{
    color:#ffc000;
    font-size:13px
}
.credit-index .credit-head .container .info .operate{
    color:#999;
    display:flex;
    align-items:center
}
.credit-index .credit-head .container .info .operate .icon{
    margin-left:5px
}
.credit-index .credit-head .type{
    height:45px;
    background-color:#fff;
    position:relative;
    z-index:33;
    display:flex;
    align-items:center;
    border-top:1px solid #f8f8f8;
    border-bottom:1px solid #ccc
}
.credit-index .credit-head .type .item{
    flex:1 1;
    text-align:center;
    padding:0 10px;
    font-size:14px;
    transition:all .25s
}
.credit-index .credit-head .type .item.active{
    color:#000;
    font-size:15px
}
.credit-index .credit-body{
    padding:10px
}
.credit-index .credit-body .type-item{
    display:none
}
.credit-index .credit-body .type-item.active{
    display:block
}
.credit-gift{
    padding:10px
}
.credit-gift .item{
    display:flex;
    align-items:center;
    padding-top:10px;
    margin-top:10px;
    border-top:1px solid #ccc
}
.credit-gift .item:first-child{
    border-top:none;
    padding-top:0;
    margin-top:0
}
.credit-gift .item .icon{
    width:75px;
    height:75px;
    overflow:hidden;
    border-radius:12px
}
.credit-gift .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.credit-gift .item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    align-items:flex-end
}
.credit-gift .item .text{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:0 7.5px
}
.credit-gift .item .name{
    color:#333
}
.credit-gift .item .code,.credit-gift .item .game,.credit-gift .item .time{
    font-size:12px;
    color:#666;
    margin-top:2.5px
}
.credit-gift .item .btn{
    background-color:#ffc000;
    color:#fff;
    padding:3.5px 10px;
    border-radius:8px;
    margin-bottom:10px
}
.credit-ptb .item{
    display:flex;
    align-items:center;
    margin-top:10px;
    background-color:#fff;
    border-radius:4px;
    padding:10px
}
.credit-ptb .item:first-child{
    margin-top:0
}
.credit-ptb .item .icon{
    width:125px;
    height:75px
}
.credit-ptb .item .icon img{
    display:block;
    height:100%;
    margin:auto
}
.credit-ptb .item .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.credit-ptb .item .ptb{
    font-size:16px;
    color:#000
}
.credit-ptb .item .credit{
    color:red;
    font-size:15px;
    margin-top:5px
}
.credit-ptb .item .btn{
    background-color:#ffc000;
    color:#fff;
    padding:3.5px 10px;
    border-radius:8px;
    margin-bottom:10px
}
.credit-game .item{
    background-color:#fff;
    margin-top:10px;
    border-radius:8px;
    padding:10px;
    display:flex;
    align-items:center
}
.credit-game .item:first-child{
    margin-top:0
}
.credit-game .item .icon{
    width:75px;
    height:75px;
    overflow:hidden;
    border-radius:12px
}
.credit-game .item .icon img{
    display:block;
    width:100%;
    height:100%
}
.credit-game .item .info{
    flex:1 1;
    overflow:hidden;
    padding-left:10px;
    padding-right:10px
}
.credit-game .item .info .name{
    color:#000;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.credit-game .item .info .amount,.credit-game .item .info .count,.credit-game .item .info .game{
    font-size:12px;
    margin-top:2.5px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.credit-game .item .info .amount{
    color:red
}
.credit-game .item .btn{
    background-color:#ffc000;
    color:#fff;
    padding:3.5px 10px;
    border-radius:8px;
    margin-bottom:10px
}
.credit-game .item .btn.disable{
    background-color:#ccc
}
.credit-game .detail{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
.credit-game .detail .mask{
    position:fixed;
    z-index:666;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.5)
}
.credit-game .detail .container{
    background-color:#fff;
    padding:12.5px;
    position:relative;
    z-index:777
}
.credit-game .detail .game{
    display:flex;
    align-items:stretch;
    margin-bottom:25px
}
.credit-game .detail .game .icon{
    width:75px;
    height:75px;
    overflow:hidden;
    border-radius:12px
}
.credit-game .detail .game .icon img{
    display:block;
    width:100%;
    height:100%
}
.credit-game .detail .game .info{
    flex:1 1;
    overflow:hidden;
    padding-left:10px;
    padding-right:10px;
    display:flex;
    flex-direction:column;
    justify-content:space-between
}
.credit-game .detail .game .info .title{
    color:#000;
    font-size:15px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.credit-game .detail .game .info .name{
    color:#666;
    font-size:13px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.credit-game .detail .game .info .count{
    font-size:13px;
    color:red;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.credit-game .detail .game .more{
    color:#000;
    font-size:18px;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.credit-game .detail .title{
    color:#000;
    font-size:16px
}
.credit-game .detail .content{
    padding:10px 0;
    font-size:14px;
    color:#666
}
.credit-game .detail .btn{
    background-color:#ffc000;
    color:#fff;
    padding:10px;
    border-radius:8px;
    margin:25px 10px 10px;
    text-align:center
}
.credit-game .detail .btn.disable{
    background-color:#ccc
}
.credit-time .item{
    display:flex;
    align-items:center;
    flex-direction:row;
    justify-content:space-between;
    margin-top:10px;
    background-color:#fff;
    border-radius:4px;
    padding:10px
}
.credit-time .item:first-child{
    margin-top:0
}
.credit-time .item .voucher{
    background:50% no-repeat;
    background-size:100% 100%;
    width:225px;
    padding:15px 10px;
    display:flex;
    align-items:center;
    flex-direction:row;
    justify-content:space-between
}
.credit-time .item .voucher .info{
    color:#fff
}
.credit-time .item .voucher .info .type{
    font-size:16px;
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.credit-time .item .voucher .info .desc{
    padding:5px 0;
    border-bottom:1px solid #eee;
    margin-bottom:5px
}
.credit-time .item .voucher .info .desc,.credit-time .item .voucher .info .time{
    font-size:12px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.credit-time .item .voucher .price{
    display:flex;
    flex-direction:column;
    align-items:center
}
.credit-time .item .voucher .price .amount{
    color:#000;
    font-size:18px;
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.credit-time .item .voucher .price .meet{
    color:red;
    font-size:10px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.credit-time .item .data{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center
}
.credit-time .item .data .price{
    font-size:15px;
    color:#000
}
.credit-time .item .data .count{
    margin-top:5px;
    color:#666;
    font-size:12px
}
.credit-time .item .data .btn{
    background-color:#ffc000;
    color:#fff;
    padding:3.5px 10px;
    border-radius:8px;
    margin-top:5px
}
.invite-index .img{
    position:relative
}
.invite-index .img img{
    display:block
}
.invite-index .number{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    align-items:center;
    justify-content:center
}
.invite-index .count,.invite-index .sum{
    flex:1 1;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#f7db97;
    font-size:24px;
    font-weight:700
}
.invite-record{
    padding-top:35px
}
.invite-record .thead{
    position:fixed;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#eee;
    height:35px;
    display:flex;
    align-items:center
}
.invite-record .thead .th{
    flex:1 1;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px
}
.invite-record .tbody .tr{
    display:flex;
    align-items:center;
    padding:10px;
    border-bottom:1px solid #eee
}
.invite-record .tbody .td{
    flex:1 1;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center
}
.save-index .save-head{
    background:#fff top no-repeat;
    background-size:100% 100%;
    display:flex;
    align-items:stretch;
    padding:calc(env(safe-area-inset-top) + 55px) 15px 15px
}
.save-index .save-head .icon{
    width:65px;
    height:65px;
    overflow:hidden;
    border-radius:50%
}
.save-index .save-head .icon img{
    display:block;
    width:100%;
    height:100%
}
.save-index .save-head .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:space-around;
    padding:7.5px
}
.save-index .save-head .info .name{
    font-size:16px;
    color:#fff;
    display:flex;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.save-index .save-head .info .name img{
    display:block;
    margin-left:5px;
    height:20px
}
.save-index .save-head .info .desc{
    color:#ccc
}
.save-index .save-head .operate{
    color:#ccc;
    display:flex;
    align-items:center
}
.save-index .save-type{
    padding:10px
}
.save-index .save-type,.save-index .save-type .item{
    display:flex;
    align-items:center;
    justify-content:center
}
.save-index .save-type .item{
    flex:1 1;
    flex-direction:column;
    color:#333;
    font-size:16px;
    transition:all .25s
}
.save-index .save-type .item.active:after{
    content:"";
    display:block;
    background-color:#ffc000;
    height:3px;
    width:15px;
    margin-top:2.5px
}
.save-index .save-type .item.active{
    font-weight:700;
    color:#000;
    font-size:18px
}
.save-card{
    background:#1c1714 top no-repeat;
    background-size:100% auto;
    padding:20% 12.5px
}
.save-card .card-type{
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex;
    padding-bottom:20px;
    justify-content:center
}
.save-card .card-type .item{
    width:31%;
    flex-shrink:0;
    margin-left:10px;
    position:relative;
    overflow:hidden;
    text-align:center;
    padding:10px 5px;
    background:50% no-repeat;
    background-size:100% 100%
}
.save-card .card-type .item:first-child{
    margin-left:0
}
.save-card .card-type .item .vip{
    position:absolute;
    z-index:11;
    top:-2.5px;
    right:-2.5px;
    transition:all .25s
}
.save-card .card-type .item .vip img{
    display:block;
    width:60px
}
.save-card .card-type .item .good{
    color:#fff;
    position:absolute;
    top:0;
    right:0;
    font-size:.2rem;
    padding:0 5px;
    border-bottom-left-radius:5px
}
.save-card .card-type .item .title{
    font-size:20px;
    font-weight:700;
    color:#000;
    padding-top:10px
}
.save-card .card-type .item .price{
    font-size:13px;
    color:#1b1b1b
}
.save-card .card-type .item .price span{
    font-size:30px;
    font-weight:700
}
.save-card .card-type .item .value{
    color:#6f4935;
    margin-bottom:10px
}
.save-card .card-type .item .choose{
    position:absolute;
    z-index:11;
    bottom:0;
    right:0;
    transition:all .25s;
    opacity:0
}
.save-card .card-type .item .choose img{
    display:block;
    width:35px
}
.save-card .card-type .item.active .choose{
    opacity:1
}
.save-card .card-btn{
    color:#1e1917;
    font-size:20px;
    background-image:linear-gradient(90deg,#e9b87a,#f8d9ad);
    padding:8.5px;
    text-align:center;
    border-radius:50px;
    margin-top:10px
}
.save-card .card-btn span{
    font-size:.2rem
}
.save-card .card-tips{
    font-size:12px;
    color:#fff3dc;
    text-align:center;
    margin-top:10px;
    line-height:20px;
    height:20px
}
.save-card .card-info{
    margin-top:10px
}
.save-card .card-info .title{
    font-size:17px;
    color:#fff3dc;
    text-align:center
}
.save-card .card-info .items{
    display:flex;
    align-items:center;
    margin-top:10px
}
.save-card .card-info .items .item{
    flex:1 1;
    text-align:center;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    font-size:13px;
    color:#dab082
}
.save-card .card-info .items .item img{
    display:block;
    width:20vw;
    margin-bottom:5px
}
@media (min-width:1119px){
    .save-card .card-info .items .item img{
        width:auto
    }
}
.save-card .card-explain{
    margin-top:15px;
    border:1px solid #fff3dc;
    padding:15px;
    border-radius:8px;
    position:relative
}
.save-card .card-explain .title{
    position:absolute;
    top:0;
    left:50%;
    right:0;
    font-size:17px;
    color:#fff3dc;
    width:30%;
    text-align:center;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    background-color:#1c1714
}
.save-card .card-explain .content dl{
    display:flex;
    align-items:flex-start
}
.save-card .card-explain .content dl dt{
    color:#c9a278
}
.save-card .card-explain .content dl dd{
    flex:1 1;
    width:0;
    overflow:hidden;
    color:#dcdddf
}
.save-card .card-explain .content dl dd span{
    color:#ffe6b5
}
.save-vip{
    padding:12.5px
}
.save-vip .vip-title{
    padding:10px;
    background:50% no-repeat;
    background-size:contain;
    font-size:19px;
    color:#603c20;
    font-weight:700;
    text-align:center
}
.save-vip .vip-title:first-child{
    padding-top:0
}
.save-vip .vip-type{
    margin-top:10px;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex;
    padding-bottom:25px;
    align-items:stretch
}
.save-vip .vip-type .item{
    width:31%;
    flex-shrink:0;
    margin-left:10px;
    position:relative;
    overflow:hidden;
    border:1px solid #ccc;
    background-color:#fff;
    border-radius:4px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    text-align:center;
    padding-bottom:10px;
    transition:all .25s
}
.save-vip .vip-type .item:first-child{
    margin-left:0
}
.save-vip .vip-type .item.active{
    border:1px solid #905e06
}
.save-vip .vip-type .item .good{
    display:flex;
    justify-content:flex-end;
    position:relative;
    transition:all .25s
}
.save-vip .vip-type .item .good img{
    display:block;
    width:50px
}
.save-vip .vip-type .item .good:after{
    content:"推荐";
    display:block;
    position:absolute;
    right:0;
    bottom:0;
    width:50px;
    top:50%;
    -webkit-transform:translateY(-60%);
    transform:translateY(-60%);
    text-align:center;
    font-size:10px;
    color:#fff;
    line-height:1.15
}
.save-vip .vip-type .item .title{
    font-size:15px;
    color:#000
}
.save-vip .vip-type .item .price{
    font-size:13px;
    color:#905e06
}
.save-vip .vip-type .item .price span{
    font-size:30px;
    font-weight:700
}
.save-vip .vip-type .item .name{
    font-size:13px;
    color:#999
}
.save-vip .vip-type .item .ptb{
    color:#666;
    margin-top:5px;
    margin-bottom:5px
}
.save-vip .vip-type .item .choose{
    position:absolute;
    z-index:11;
    bottom:0;
    right:0;
    transition:all .25s;
    opacity:0
}
.save-vip .vip-type .item .choose img{
    display:block;
    width:30px
}
.save-vip .vip-type .item.active .choose{
    opacity:1
}
.save-vip .vip-btn{
    color:#1e1917;
    font-size:20px;
    background-image:linear-gradient(90deg,#e9b87a,#f8d9ad);
    padding:8.5px;
    text-align:center;
    border-radius:50px;
    margin-top:10px;
    margin-bottom:10px
}
.save-vip .vip-info{
    padding:15px 0;
    background-color:#f5d3a3;
    height:215px;
    border-radius:8px
}
.save-vip .vip-info .item{
    float:left;
    width:25%;
    padding:10px;
    display:flex;
    flex-direction:column;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    position:relative
}
.save-vip .vip-info .item:first-child{
    margin-top:0
}
.save-vip .vip-info .item img{
    display:block;
    width:50px;
    height:50px
}
.save-vip .vip-info .item div{
    flex:1 1;
    overflow:hidden;
    padding-top:.12rem
}
.save-vip .vip-info .item h1{
    font-size:13px;
    color:#462b16;
    white-space:nowrap
}
.save-vip .vip-info .item p{
    font-size:13px;
    color:#999;
    margin-top:2.5px
}
.save-vip .vip-future{
    padding:25px 0;
    background:50% no-repeat;
    background-size:contain;
    font-size:17px;
    color:#282828;
    text-align:center
}
.vip-index-intro{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.vip-index-intro .vip-site{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.vip-index-intro .vip-site .vip-nav{
    width:100%
}
.vip-index-intro .vip-site .container{
    margin:auto;
    padding:10px 0 15px;
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex;
    width:90%
}
.vip-index-intro .vip-site .container .vip-nav-item{
    float:left;
    width:20%;
    text-align:center;
    padding-bottom:10px;
    transition:all .25s;
    margin-top:5px;
    height:75px;
    overflow:hidden;
    position:relative;
    flex-shrink:0;
    display:flex;
    flex-direction:column;
    align-items:center
}
.vip-index-intro .vip-site .container .vip-nav-item img{
    width:60%
}
.vip-index-intro .vip-site .container .vip-nav-item.active{
    color:#fff
}
.vip-index-intro .vip-site .vip-pop-main{
    width:80%
}
.vip-index-intro .vip-site .vip-pop-main .container{
    height:100%
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section{
    height:8.6rem;
    background-size:100% 100%;
    margin-top:15px
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object{
    padding:1.5rem .3rem;
    font-size:13px
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object .img{
    width:30%
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object .vip-intro{
    margin-bottom:15px
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object .vip-intro .coin-table table{
    width:100%;
    margin-top:.5em
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object .vip-intro .coin-table table td,.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object .vip-intro .coin-table table tr{
    text-align:center;
    border:1px solid #fff;
    font-size:12px;
    padding:.5em .25em
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object .vip-intro .birthday-img{
    width:50%;
    margin:0 auto
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object .vip-intro .text-vip-i{
    color:#fe2e5a;
    font-size:12px
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object .vip-intro .game-item{
    float:left;
    text-align:center;
    border:1px solid #bc8b6b;
    border-radius:8px;
    padding:10px;
    margin-right:13px;
    width:150px
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object .vip-intro .game-item .icon{
    width:50px;
    margin:0 auto
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object .vip-intro .game-item .name{
    font-size:.26rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:2.5px;
    color:#333
}
.vip-index-intro .vip-site .vip-pop-main .intro-pop-section .vip-intro-and-object .vip-object .vip-pop-button{
    color:#fff;
    background-size:100% 100%;
    text-align:center;
    line-height:.8rem;
    margin-top:.1rem;
    position:absolute;
    width:90%;
    bottom:.3rem
}
.vip-index-intro .vip-site .vip-pop-main .swiper-button-next,.vip-index-intro .vip-site .vip-pop-main .swiper-button-prev{
    position:fixed
}
.vip-index-intro .vip-site .vip-pop-main .swiper-button-prev{
    left:0
}
.vip-index-intro .vip-site .vip-pop-main .swiper-button-next{
    right:0
}
.vip-index-intro .vip-site .vip-pop-main .swiper-button-next:after,.vip-index-intro .vip-site .vip-pop-main .swiper-button-prev:after{
    color:#fff;
    font-size:.5rem
}
.vip-index-intro .vip-site .close{
    width:12%;
    z-index:2000;
    margin:2% 44%
}
.vip-index-intro .vip-site .close img{
    width:75%;
    margin-left:12.5%;
    margin-top:50%
}
.save-pay{
    z-index:555;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    align-items:stretch
}
.save-pay,.save-pay .mask{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.save-pay .mask{
    z-index:666;
    background-color:rgba(0,0,0,.75);
    transition:all .25s;
    opacity:0
}
.save-pay .container{
    position:relative;
    z-index:777;
    background-color:#fff;
    border-top-left-radius:8px;
    border-top-right-radius:8px;
    padding:10px 10px env(safe-area-inset-bottom);
    transition:all .25s;
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.save-pay .title{
    text-align:center;
    font-weight:700;
    font-size:16px;
    color:#000
}
.save-pay iframe{
    width:100%;
    min-height:200px;
    overflow:hidden
}
.save-pay.enter-active .mask,.save-pay.enter-done .mask{
    opacity:1
}
.save-pay.enter-active .container,.save-pay.enter-done .container{
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0)
}
.save-pay.exit-active .mask{
    opacity:0
}
.save-pay.exit-active .container{
    opacity:0;
    -webkit-transform:translateY(100%);
    transform:translateY(100%)
}
.card-record{
    padding-top:35px
}
.card-record .thead{
    position:fixed;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    background-color:#eee;
    height:35px;
    display:flex;
    align-items:center
}
.card-record .thead .th{
    flex:1 1;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px
}
.card-record .tbody .tr{
    display:flex;
    align-items:center;
    padding:10px;
    border-bottom:1px solid #eee
}
.card-record .tbody .td{
    flex:1 1;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center
}
.transfer-index .img{
    display:block;
    width:100%
}
.transfer-index .body{
    padding:10px;
    margin:-15% 10px 10px;
    background-color:#fff;
    border-radius:8px;
    position:relative;
    z-index:917
}
.transfer-index .title{
    font-size:17px;
    color:#000;
    display:flex;
    align-items:center
}
.transfer-index .title:before{
    content:"";
    display:block;
    margin-right:10px;
    height:15px;
    width:2px;
    background-color:#ff8d8d
}
.transfer-index .info{
    color:#ff8d8d;
    margin:12.5px auto;
    border:1px solid #eee;
    border-radius:8px;
    padding:10px
}
.transfer-index .btn{
    display:block;
    color:#fff;
    font-size:17px;
    background-color:#ff8d8d;
    border-radius:20px;
    text-align:center;
    padding:10px
}
.welfare-index{
    overflow:hidden;
    min-height:100vh;
    padding:env(safe-area-inset-top) 12.5px 12.5px;
    background:#eee top no-repeat;
    background-size:contain
}
.welfare-index .welfare-halo{
    position:fixed;
    z-index:100;
    top:0;
    left:0;
    right:0;
    padding-top:env(safe-area-inset-top);
    background-color:#ffc000;
    color:#fff
}
.welfare-index .welfare-halo .background{
    opacity:1;
    position:absolute;
    z-index:1;
    inset:0;
    background-color:#ffc000;
    transition:all .1s ease 0s
}
.welfare-index .welfare-halo .container{
    position:relative;
    z-index:560;
    height:40px;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:18px;
    transition:all .1s
}
.welfare-index .welfare-head{
    background:#fff top no-repeat;
    border-radius:15px
}
.welfare-index .welfare-head .head-title{
    display:flex;
    align-items:stretch;
    margin-top:1.5rem;
    padding:15px 15px 5px
}
.welfare-index .welfare-head .head-title .icon{
    width:55px;
    height:55px;
    overflow:hidden;
    border-radius:50%
}
.welfare-index .welfare-head .head-title .icon img{
    display:block;
    width:100%;
    height:100%
}
.welfare-index .welfare-head .head-title .info{
    flex:1 1;
    width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:space-around;
    padding:7.5px
}
.welfare-index .welfare-head .head-title .info .name{
    font-size:18px;
    color:#282828;
    display:flex;
    align-items:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-weight:700
}
.welfare-index .welfare-head .head-title .info .name img{
    margin-left:5px;
    height:20px
}
.welfare-index .welfare-head .head-title .info .desc{
    color:#ccc;
    font-size:.2rem
}
.welfare-index .welfare-head .head-title .operate{
    color:#ccc;
    display:flex;
    align-items:center
}
.welfare-index .welfare-head .head-title .operate .operate-btn{
    border-radius:8px;
    padding:5px 0;
    font-size:16px;
    color:#fff;
    width:80px
}
.welfare-index .welfare-head .head-groups{
    padding:0 15px 5px
}
.welfare-index .welfare-head .head-groups .item{
    flex:1 1;
    width:48%;
    padding:10px 20px;
    background-color:#f5f6f8;
    display:flex;
    align-items:center;
    border-radius:8px;
    float:left;
    margin-bottom:.2rem
}
.welfare-index .welfare-head .head-groups .item .info{
    flex:1 1;
    width:0;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.welfare-index .welfare-head .head-groups .item .info .name{
    font-weight:700;
    font-size:.32rem;
    color:#282828
}
.welfare-index .welfare-head .head-groups .item .info .name img{
    height:15px
}
.welfare-index .welfare-head .head-groups .item .info .value{
    color:#999;
    margin-top:-.05rem;
    font-size:.24rem
}
.welfare-index .welfare-head .head-groups .icon{
    padding-right:15px
}
.welfare-index .welfare-head .head-groups .icon img{
    display:block;
    height:35px
}
.welfare-index .welfare-head .head-groups .item:nth-child(2n){
    margin-left:4%
}
.welfare-index .title-img{
    width:40%
}
.welfare-index .plat-item{
    background:#f5f6f8;
    padding:.3rem;
    border-radius:15px;
    margin:10px 0
}
.welfare-index .plat-item:first-child{
    margin-top:0
}
.welfare-index .plat-item .title{
    color:#999;
    font-size:.24rem;
    padding:0 0 10px;
    border-bottom:1px solid #e0e0e0
}
.welfare-index .plat-item .title span:first-child{
    color:#282828;
    padding-right:.28rem;
    font-size:.3rem;
    font-weight:700
}
.welfare-index .plat-item .content{
    display:flex;
    align-items:center;
    padding:15px 0 0
}
.welfare-index .plat-item .content .icon{
    padding-right:8px
}
.welfare-index .plat-item .content .icon img{
    display:block;
    height:28px
}
.welfare-index .plat-item .content .desc{
    flex:1 1;
    color:#f27b89;
    font-size:.28rem
}
.welfare-index .plat-item .content .but-opened{
    background-color:#ffc000;
    font-size:.28rem;
    border-radius:5px;
    color:#fff;
    transition:all .1s;
    text-align:center;
    padding:.1rem .2rem
}
.welfare-index .welfare-cert-auth{
    margin-top:15px;
    background-repeat:no-repeat;
    background-size:100% 100%;
    height:65px;
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    align-content:space-around;
    justify-content:space-around;
    align-items:center;
    padding:0 15px
}
.welfare-index .welfare-cert-auth .welfare-cert-first-part{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    align-content:space-around;
    justify-content:space-around;
    align-items:center;
    flex:1 1;
    padding-left:20px
}
.welfare-index .welfare-cert-auth .welfare-cert-first-part img{
    width:65%
}
.welfare-index .welfare-cert-auth .welfare-cert-second-part{
    color:#fff;
    opacity:.8
}
.welfare-index .welfare-plat{
    background:#fff top no-repeat;
    border-radius:15px;
    margin-top:15px
}
.welfare-index .welfare-plat .welfare-main{
    padding:0 15px 15px
}
.welfare-index .welfare-plat .plat-groups{
    display:flex;
    align-items:stretch
}
.welfare-index .welfare-plat .plat-groups .item{
    flex:1 1;
    width:50%;
    display:flex;
    align-items:center;
    border-radius:15px;
    background:#f5f6f8;
    padding:10px;
    justify-content:center
}
.welfare-index .welfare-plat .plat-groups .item .desc{
    line-height:1.8;
    width:50%
}
.welfare-index .welfare-plat .plat-groups .item .desc h1{
    font-size:.3rem;
    color:#282828;
    font-weight:700
}
.welfare-index .welfare-plat .plat-groups .item .desc p{
    color:#999;
    font-size:.24rem;
    display:flex;
    align-items:center
}
.welfare-index .welfare-plat .plat-groups .item .desc p span{
    margin-right:.1rem
}
.welfare-index .welfare-plat .plat-groups .item .desc p img{
    height:15px
}
.welfare-index .welfare-plat .plat-groups .item .icon img{
    display:block;
    height:50px
}
.welfare-index .welfare-plat .plat-groups .item:first-child{
    margin-right:10px
}
.welfare-index .welfare-plat .plat-groups .plat-desc{
    position:absolute;
    padding:.4rem 4.5% 4.5% 4%;
    margin-top:5%;
    font-size:.24rem
}
.welfare-index .welfare-plat .item-indepen{
    flex:1 1;
    padding:5px 0 10px;
    background-color:#fff;
    display:flex;
    align-items:center;
    border-radius:8px
}
.welfare-index .welfare-plat .item-indepen .plat-desc{
    position:absolute;
    padding:4.5%;
    margin-top:5%
}
.welfare-index .welfare-task{
    background:#fff top no-repeat;
    border-radius:15px;
    margin-top:15px
}
.welfare-index .welfare-task .welfare-main{
    padding:0 15px 15px
}
.welfare-index .welfare-task .welfare-main .item{
    flex:1 1;
    padding:10px;
    display:flex;
    align-items:center;
    border-radius:15px;
    margin-bottom:.2rem;
    background-size:100% 100%
}
.welfare-index .welfare-task .welfare-main .item .icon{
    padding-right:10px
}
.welfare-index .welfare-task .welfare-main .item .icon img{
    display:block;
    height:50px
}
.welfare-index .welfare-task .welfare-main .item .info{
    flex:1 1;
    width:0;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.welfare-index .welfare-task .welfare-main .item .info .name{
    color:#282828;
    font-size:.32rem;
    font-weight:700
}
.welfare-index .welfare-task .welfare-main .item .info .value{
    color:#999
}
.welfare-index .welfare-task .welfare-main .item .welfare-back{
    color:#ccc;
    display:flex;
    align-items:center;
    flex-direction:column;
    flex-wrap:wrap;
    align-content:flex-end
}
.welfare-index .welfare-task .welfare-main .item .welfare-back img{
    width:25%
}
.welfare-index .welfare-first-charge{
    background:#fff top no-repeat;
    border-radius:15px;
    margin-top:15px
}
.welfare-index .welfare-first-charge .first-charge-title{
    display:flex;
    align-items:center;
    width:100%;
    padding-right:15px
}
.welfare-index .welfare-first-charge .first-charge-title .img{
    font-size:18px;
    font-weight:700;
    color:#000;
    flex:1 1
}
.welfare-index .welfare-first-charge .first-charge-title .img img{
    width:45.5%
}
.welfare-index .welfare-first-charge .first-charge-title a{
    color:#999
}
.welfare-index .welfare-first-charge .welfare-main{
    padding:0 15px 15px
}
.welfare-index .welfare-first-charge .welfare-main .first-charge-title{
    display:flex;
    align-items:center;
    width:100%
}
.welfare-index .welfare-first-charge .welfare-main .first-charge-title .img{
    font-size:18px;
    font-weight:700;
    color:#000;
    flex:1 1
}
.welfare-index .welfare-first-charge .welfare-main .first-charge-title .img img{
    width:25%
}
.welfare-index .welfare-first-charge .welfare-main .first-charge-title .more{
    color:#999
}
.welfare-index .welfare-first-charge .welfare-main .items{
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex
}
.welfare-index .welfare-first-charge .welfare-main .items .item{
    background-color:#f5f6f8;
    border-radius:15px;
    width:60%;
    padding-bottom:5px;
    flex-shrink:0;
    display:flex;
    flex-direction:column;
    margin-right:10px;
    white-space:normal
}
.welfare-index .welfare-first-charge .welfare-main .items .item .voucher-name{
    flex:1 1;
    padding:10px 10px 0;
    display:flex;
    align-items:center;
    border-radius:8px;
    margin-bottom:.2rem;
    background-size:100% 100%
}
.welfare-index .welfare-first-charge .welfare-main .items .item .voucher-name .icon{
    margin-right:5px
}
.welfare-index .welfare-first-charge .welfare-main .items .item .voucher-name .icon img{
    width:45px
}
.welfare-index .welfare-first-charge .welfare-main .items .item .voucher-name .info{
    flex:1 1;
    width:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    color:#282828;
    font-size:.25rem;
    word-break:break-all
}
.welfare-index .welfare-first-charge .welfare-main .items .item .vouchar-desc{
    width:90%;
    background-color:#fff;
    flex:1 1;
    padding:8px 10px;
    display:flex;
    align-items:center;
    border-radius:8px;
    margin:0 auto .2rem;
    background-size:100% 100%
}
.welfare-index .welfare-first-charge .welfare-main .items .item .vouchar-desc .info{
    flex:1 1;
    width:0;
    display:flex;
    justify-content:flex-start;
    align-items:center;
    align-content:center;
    flex-wrap:wrap
}
.welfare-index .welfare-first-charge .welfare-main .items .item .vouchar-desc .info .des1{
    color:#ff505b
}
.welfare-index .welfare-first-charge .welfare-main .items .item .vouchar-desc .info .des2{
    font-size:12px
}
.welfare-index .welfare-first-charge .welfare-main .items .item .vouchar-desc .operate{
    flex:1 1;
    width:0;
    display:flex;
    justify-content:flex-end;
    color:#282828;
    font-size:.3rem;
    word-break:break-all
}
.welfare-index .welfare-first-charge .welfare-main .items .item .vouchar-desc .operate .operate-btn{
    background-color:#ffc000;
    border-radius:8px;
    padding:5px 15px;
    font-size:12px;
    color:#fff
}
.welfare-index .welfare-first-charge .welfare-main .items .item .vouchar-desc .operate .alreadly-operate-btn{
    background-color:#ccc;
    border-radius:8px;
    padding:5px 15px;
    font-size:12px;
    color:#fff
}
.welfare-index .welfare-first-charge .welfare-main .items .item:last-child{
    margin-right:0
}
.welfare-index .welfare-project-items{
    display:block;
    margin-top:10px;
    background-color:#fff;
    border-radius:15px
}
.welfare-index .welfare-project-items .project-items-title{
    display:flex;
    align-items:center;
    width:100%;
    padding-right:15px
}
.welfare-index .welfare-project-items .project-items-title .img{
    font-size:18px;
    font-weight:700;
    color:#000;
    flex:1 1
}
.welfare-index .welfare-project-items .project-items-title .img img{
    width:45.5%
}
.welfare-index .welfare-project-items .project-items-title .more{
    color:#999
}
.welfare-index .welfare-project-items .welfare-main{
    padding:0 15px 15px
}
.welfare-index .welfare-project-items .project-item{
    padding-top:15px
}
.welfare-index .welfare-project-items .project-item .item-base{
    display:flex;
    align-items:center
}
.welfare-index .welfare-project-items .project-item .item-base .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1rem;
    height:1rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.welfare-index .welfare-project-items .project-item .item-base .text{
    flex:1 1;
    width:0;
    font-size:.2rem;
    color:#999;
    line-height:1.7;
    display:flex;
    flex-direction:column
}
.welfare-index .welfare-project-items .project-item .item-base .text .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.28rem;
    color:#282828;
    margin-bottom:.05rem
}
.welfare-index .welfare-project-items .project-item .item-base .text .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem
}
.welfare-index .welfare-project-items .project-item .item-base .text .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#ff5e00
}
.welfare-index .welfare-project-items .project-item .item-base .text .info2 .tag{
    display:inline-block;
    margin-right:5px
}
.welfare-index .welfare-project-items .project-item .item-base .text .info2 .tag:first-child{
    color:#ff4200
}
.welfare-index .welfare-project-items .project-item .item-base .text .info2 .tag:nth-child(2){
    color:#75d100
}
.welfare-index .welfare-project-items .project-item .item-base .text .info2 .tag:nth-child(3){
    color:#2893ff
}
.welfare-index .welfare-project-items .project-item .item-gift-text .text-title{
    background-repeat:no-repeat;
    background-position:50%;
    background-size:100% 100%;
    padding:0 10px;
    width:40%;
    color:#fff;
    margin-top:10px
}
.welfare-index .welfare-project-items .project-item .item-gift-text .text-info{
    background:#f5f6f8;
    display:flex;
    align-items:stretch;
    padding:15px 10px;
    border-bottom-left-radius:15px;
    border-bottom-right-radius:15px;
    border-top-right-radius:15px
}
.welfare-index .welfare-project-items .project-item .item-gift-text .text-info .info-content{
    flex:1 1;
    width:0;
    flex-direction:column;
    justify-content:space-around;
    display:-webkit-box;
    -webkit-line-clamp:2;
    text-overflow:ellipsis;
    overflow:hidden;
    font-size:.26rem;
    color:#282828
}
.welfare-index .welfare-project-items .project-item .item-gift-text .text-info .info-btn{
    display:flex;
    align-items:center
}
.welfare-index .welfare-project-items .project-item .item-gift-text .text-info .info-btn .btn-receive{
    background-color:#ffc000;
    border-radius:8px;
    padding:5px 20px;
    font-size:16px;
    color:#fff
}
.welfare-index .welfare-project-items .project-item .item-gift-text .text-info .info-btn .btn-copy{
    background-color:#80c5fe;
    border-radius:8px;
    padding:5px 20px;
    font-size:16px;
    color:#fff
}
.welfare-index .welfare-project-items .project-item:first-child,.welfare-index .welfare-project-items .special{
    padding-top:0
}
.welfare-index .welfare-active{
    background:#fff top no-repeat;
    border-radius:15px;
    margin-top:15px
}
.welfare-index .welfare-active .welfare-main{
    padding:0 15px 15px
}
.welfare-index .welfare-active .welfare-main .active-img img{
    border-radius:15px;
    width:100%
}
.welfare-index .welfare-active .welfare-main .active-text{
    color:#282828;
    font-size:.3rem
}
.welfare-index .cdk{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    align-content:center;
    justify-items:center;
    justify-content:center
}
.welfare-index .cdk .mask{
    display:block;
    position:absolute;
    z-index:666;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.5)
}
.welfare-index .cdk .entity{
    position:relative;
    z-index:777;
    background:top no-repeat;
    background-size:100% 100%;
    width:325px;
    padding:100px 40px 20px;
    overflow:hidden
}
.welfare-index .cdk .entity .title{
    font-size:.32rem;
    color:#000;
    text-align:center
}
.welfare-index .cdk .entity .info{
    color:#ccc;
    font-size:13px;
    padding:10px 0
}
.welfare-index .cdk .entity .desc{
    color:#000
}
.welfare-index .cdk .entity .input{
    margin-top:10px;
    display:flex;
    align-items:center
}
.welfare-index .cdk .entity .input input{
    border:1px solid #ccc;
    border-radius:20px;
    flex:1 1;
    width:0;
    padding:5px 10px;
    font-size:.28rem
}
.welfare-index .cdk .entity .input .btn{
    background-color:#ffc000;
    color:#fff;
    padding:5px 10px;
    border-radius:20px;
    text-align:center;
    margin:0 auto 0 10px
}
.welfare-index .cdk .close{
    position:relative;
    z-index:777;
    margin-top:20px;
    color:#fff;
    width:30px;
    height:30px;
    display:flex;
    text-align:center;
    align-content:center;
    align-items:center;
    justify-items:center;
    justify-content:center;
    border:1px solid #fff;
    border-radius:50%;
    font-size:.3rem
}
.shop-index{
    overflow:hidden;
    min-height:100vh;
    padding:calc(env(safe-area-inset-top) + 40px) 12.5px 12.5px;
    background:#eee top no-repeat;
    background-size:contain
}
.shop-index .shop-user-head{
    background:#fff;
    margin-top:150px;
    border-radius:8px
}
.shop-index .shop-user-head .items .item{
    margin-top:15px;
    border-radius:8px;
    display:flex;
    align-items:center;
    padding:7.5px
}
.shop-index .shop-user-head .items .item .coin-info{
    flex:1 1;
    width:0;
    display:flex;
    border:1px solid #ffc000;
    border-radius:20px;
    align-items:center;
    padding:5px
}
.shop-index .shop-user-head .items .item .coin-info .icon{
    width:25px;
    height:25px
}
.shop-index .shop-user-head .items .item .coin-info .icon:first-child{
    margin-right:.1rem
}
.shop-index .shop-user-head .items .item .coin-info .icon:last-child{
    margin-right:0;
    margin-left:.1rem
}
.shop-index .shop-user-head .items .item .coin-info .text{
    color:#ffc000;
    font-size:14px;
    width:70%
}
.shop-index .shop-user-head .items .item .coin-desc{
    text-align:center;
    font-size:10px;
    padding-left:10px;
    display:flex;
    align-content:center;
    flex-wrap:nowrap;
    align-items:center;
    font-size:14px;
    color:#ffc000
}
.shop-index .shop-user-head .items .item .coin-desc span{
    color:#999
}
.shop-index .shop-details{
    margin-top:15px
}
.shop-index .shop-details .item{
    background-size:100% 100%;
    background-repeat:no-repeat;
    display:flex;
    overflow:hidden;
    border-radius:8px;
    padding:10px;
    margin-top:10px
}
.shop-index .shop-details .item .info{
    display:flex;
    flex-direction:column;
    justify-items:center;
    justify-content:center;
    flex-shrink:0;
    color:#fff;
    flex:1 1;
    width:0;
    overflow:hidden
}
.shop-index .shop-details .item .info .amount{
    font-size:25px
}
.shop-index .shop-details .item .info .amount .mj{
    font-size:13px;
    width:15px;
    float:left;
    margin-right:.1rem;
    border:1px solid #fff;
    flex:1 1;
    opacity:.75
}
.shop-index .shop-details .item .info .amount .tj{
    font-size:15px;
    margin-left:.1rem
}
.shop-index .shop-details .item .info .desc{
    font-size:16px
}
.shop-index .shop-details .item .info .time{
    opacity:.75
}
.shop-index .shop-details .item .operate{
    text-align:center;
    color:#282828;
    font-size:.26rem;
    display:flex;
    flex-direction:column;
    justify-items:center;
    justify-content:center
}
.shop-index .shop-details .item .operate .operate-btn{
    height:.55rem;
    line-height:.55rem;
    background:#ffb701;
    border-radius:25px;
    padding:0 .1rem;
    font-size:.28rem;
    color:#fff;
    width:75%;
    margin:.1rem auto
}
.shop-index .obain-index{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.shop-index .obain-index .obain-site{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.shop-index .obain-index .obain-site .obain-head{
    background-size:100% 100%;
    width:60%;
    padding:30px;
    text-align:center;
    color:#000;
    font-size:17px
}
.shop-index .obain-index .obain-site .obain-main{
    width:60%;
    background-color:#fff;
    border-bottom-left-radius:8px;
    border-bottom-right-radius:8px
}
.shop-index .obain-index .obain-site .obain-main .text{
    padding:10px
}
.shop-index .obain-index .obain-site .obain-main .obain-btn{
    text-align:center;
    padding:10px;
    border-top:1px solid #ededed;
    color:#ffc000
}
.shop-index .exchange-index{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.shop-index .exchange-index .exchange-site{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.shop-index .exchange-index .exchange-site .exchange-main{
    background:#fff;
    width:75%;
    text-align:center;
    padding:20px;
    border-radius:8px
}
.shop-index .exchange-index .exchange-site .exchange-main .close{
    text-align:right
}
.shop-index .exchange-index .exchange-site .exchange-main .close img{
    width:20px
}
.shop-index .exchange-index .exchange-site .exchange-main .exchange-title{
    padding-bottom:10px;
    font-size:22px
}
.shop-index .exchange-index .exchange-site .exchange-main .info{
    font-size:16px;
    color:#282828;
    padding-bottom:10px
}
.shop-index .exchange-index .exchange-site .exchange-main .info .des2{
    color:#ffc000
}
.shop-index .exchange-index .exchange-site .exchange-main .exchange-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px
}
.shop-index .exchange-index .exchange-site .exchange-main .exchange-btn .item{
    flex:1 1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:#333;
    font-size:16px;
    transition:all .25s;
    border-radius:30px;
    padding:10px
}
.shop-index .exchange-index .exchange-site .exchange-main .exchange-btn .btn-about{
    border:1px solid #ffc000;
    color:#ffc000;
    margin-right:15px
}
.shop-index .exchange-index .exchange-site .exchange-main .exchange-btn .btn-confirm{
    background-color:#ffc000;
    color:#fff
}
.country-index .sel-letters{
    position:fixed;
    right:0;
    top:12%;
    font-size:.2rem;
    width:23px;
    text-align:center;
    -webkit-transition:.2s;
    z-index:100
}
.country-index .sel-letters ul li{
    color:grey;
    font-size:12px;
    line-height:25px
}
.country-index .sel-area-main .letters_control_list{
    position:absolute;
    z-index:1;
    width:100%
}
.country-index .sel-area-main .letters_control_list .letters_control .letters{
    background-color:#f5f6f8;
    color:#282828;
    padding:0 .2rem;
    font-size:.28rem;
    font-weight:700
}
.country-index .sel-area-main .letters_control_list .letters_control ul{
    padding:0 .5rem 0 .2rem
}
.country-index .sel-area-main .letters_control_list .letters_control ul li{
    display:flex;
    line-height:.75rem;
    border-bottom:1px solid #ededed
}
.country-index .sel-area-main .letters_control_list .letters_control ul li .area-text{
    flex:1 1
}
.country-index .sel-area-main .letters_control_list .letters_control ul li:last-child{
    border-bottom:0
}
.country-index .sel-area-main .letters_control_list .letters_control ul li .area-country-num{
    display:flex;
    flex-wrap:wrap;
    flex-direction:row;
    align-content:center;
    align-items:center
}
.country-index .sel-area-main .letters_control_list .letters_control ul li .area-country-num img{
    width:8px;
    height:8px
}
.index-video{
    position:fixed;
    z-index:999;
    top:calc(env(safe-area-inset-top) + 40px);
    left:0;
    right:0;
    bottom:calc(env(safe-area-inset-bottom))
}
.index-video .video-operate{
    position:fixed;
    z-index:917917;
    top:calc(env(safe-area-inset-top) + 50px);
    right:calc(env(safe-area-inset-right) + 10px);
    background-color:#fff;
    border-radius:8px;
    padding:10px;
    max-width:0;
    max-height:0;
    overflow:hidden;
    opacity:0;
    transition:all .25s
}
.index-video .video-operate.active{
    max-width:222px;
    max-height:222px;
    opacity:1
}
.index-video .video-operate .item{
    padding:5px;
    margin:5px auto
}
.index-video .video-body{
    width:100%;
    height:100%;
    background-color:#000
}
.index-video .video-item{
    display:flex;
    flex-direction:column
}
.index-video .video-item .body{
    flex:1 1;
    height:0;
    overflow:hidden;
    position:relative
}
.index-video .video-item video{
    width:100%;
    height:100%
}
.index-video .video-item .play{
    position:absolute;
    z-index:2;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    font-size:64px;
    color:#fff;
    background:50% no-repeat;
    background-size:contain
}
.index-video .video-item .operate{
    position:absolute;
    z-index:3;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column
}
.index-video .video-item .operate .item{
    padding:10px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:16px
}
.index-video .video-item .operate .item .icon{
    font-size:24px;
    margin-bottom:5px
}
.index-video .video-item .operate .item .icon.active{
    color:red
}
.index-video .video-item .game{
    color:#fff;
    display:flex;
    align-items:center;
    padding:10px 10px 20px
}
.index-video .video-item .game>.icon{
    width:65px;
    height:65px;
    overflow:hidden;
    border-radius:8px;
    margin-right:10px
}
.index-video .video-item .game>.icon img{
    display:block;
    width:100%;
    height:100%
}
.index-video .video-item .game .info{
    flex:1 1;
    width:0;
    overflow:hidden
}
.index-video .video-item .game .info .name{
    font-size:15px;
    color:#fff
}
.index-video .video-item .game .info .desc{
    margin-top:2.5px;
    font-size:13px;
    color:#999
}
.index-video .video-item .game .info .tags{
    display:flex;
    align-items:center
}
.index-video .video-item .game .info .tag{
    font-size:12px;
    margin-right:5px
}
.index-video .video-item .game .info .tag:first-child{
    color:#ff4200
}
.index-video .video-item .game .info .tag:nth-child(2){
    color:#75d100
}
.index-video .video-item .game .info .tag:nth-child(3){
    color:#2893ff
}
.index-video .video-item .game .btn{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    font-size:12px;
    display:none
}
.index-video .video-item .game .btn .icon{
    width:35px;
    height:35px;
    background-color:#ffc000;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    font-size:20px;
    border-radius:50%;
    margin-bottom:2.5px
}
.couple-index{
    background-color:#5249d9;
    min-height:calc(100vh - 85px - env(safe-area-inset-top));
    padding-bottom:50px
}
.couple-index .top .rule{
    position:absolute;
    right:0;
    line-height:27px;
    margin-top:5px;
    background:#f9ecd0;
    color:#f1937e;
    font-weight:700;
    padding:0 .15rem;
    border-bottom-left-radius:15px;
    border-top-left-radius:15px
}
.couple-index .couple-head{
    z-index:100;
    left:0;
    right:0;
    background-color:#fff8e3;
    height:33px;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    border-bottom:1px solid #fff8e3;
    max-width:720px;
    margin:0 .3rem
}
.couple-index .couple-head .item{
    flex:1 1;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:15px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transition:all .25s;
    position:relative;
    color:#f8ac22
}
.couple-index .couple-head .item .icon{
    display:none;
    position:absolute
}
.couple-index .couple-head .item.active .icon{
    display:block
}
.couple-index .couple-body{
    background-color:#fff;
    position:relative;
    margin:0 .3rem;
    border-bottom-left-radius:8px;
    border-bottom-right-radius:8px
}
.couple-index .couple-body .type-item{
    padding:10px;
    display:none
}
.couple-index .couple-body .type-item.active{
    display:block
}
.couple-index .couple-body .width{
    padding:0 5px
}
.couple-index .couple-body .one-day-index .first-card h1{
    color:#282828;
    font-size:.35rem;
    font-weight:500;
    padding-bottom:10px
}
.couple-index .couple-body .one-day-index .first-task{
    padding-top:10px;
    padding-bottom:10px
}
.couple-index .couple-body .one-day-index .first-task h1{
    color:#282828;
    font-size:.35rem;
    font-weight:500;
    padding-bottom:10px
}
.couple-index .couple-body .one-day-index .first-task .task{
    display:flex;
    align-items:center;
    background-size:100% 100%;
    padding:10px;
    border-radius:8px;
    margin-top:15px
}
.couple-index .couple-body .one-day-index .first-task .task .icon{
    width:50px;
    height:50px
}
.couple-index .couple-body .one-day-index .first-task .task .info{
    flex:1 1;
    width:0;
    padding-left:7.5px;
    padding-right:7.5px
}
.couple-index .couple-body .one-day-index .first-task .task .info .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    display:flex;
    align-items:center;
    font-size:.32rem
}
.couple-index .couple-body .one-day-index .first-task .task .info .desc{
    font-size:.28rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:5px
}
.couple-index .couple-body .one-day-index .first-task .task .operate{
    font-size:.28rem;
    background-color:#ffc000;
    padding:6px 15px;
    color:#fff;
    border-radius:20px;
    text-align:center;
    width:80px
}
.couple-index .couple-body .one-day-index .first-task .avatar{
    background-image:linear-gradient(90deg,#ddebff,#d8e0ff);
    margin-top:0
}
.couple-index .couple-body .one-day-index .first-task .avatar .name{
    color:#352ccc
}
.couple-index .couple-body .one-day-index .first-task .avatar .desc{
    color:#726bf7
}
.couple-index .couple-body .one-day-index .first-task .avatar .operate{
    background-image:linear-gradient(270deg,#3a62ff,#559cff)
}
.couple-index .couple-body .one-day-index .first-task .avatar .alreadly-lq{
    background:#ccc
}
.couple-index .couple-body .one-day-index .first-task .nickname{
    background-image:linear-gradient(90deg,#e5e2ff,#ece9fd)
}
.couple-index .couple-body .one-day-index .first-task .nickname .name{
    color:#5140d5
}
.couple-index .couple-body .one-day-index .first-task .nickname .desc{
    color:#8477e8
}
.couple-index .couple-body .one-day-index .first-task .nickname .operate{
    background-image:linear-gradient(90deg,#a191f4,#7e6eff)
}
.couple-index .couple-body .one-day-index .first-task .nickname .alreadly-lq{
    background:#ccc
}
.couple-index .couple-body .one-day-index .first-task .phone{
    background-image:linear-gradient(90deg,#fff2d7,#ffe7ae)
}
.couple-index .couple-body .one-day-index .first-task .phone .name{
    color:#664508
}
.couple-index .couple-body .one-day-index .first-task .phone .desc{
    color:#a27a30
}
.couple-index .couple-body .one-day-index .first-task .phone .operate{
    background-image:linear-gradient(90deg,#ffd334,#f59a02)
}
.couple-index .couple-body .one-day-index .first-task .phone .alreadly-lq{
    background:#ccc
}
.couple-index .couple-body .one-day-index .first-task .authent{
    background-image:linear-gradient(90deg,#fee9e5,#ffe3e5)
}
.couple-index .couple-body .one-day-index .first-task .authent .name{
    color:#680e0e
}
.couple-index .couple-body .one-day-index .first-task .authent .desc{
    color:#b05f5f
}
.couple-index .couple-body .one-day-index .first-task .authent .operate{
    background-image:linear-gradient(90deg,#fb775e,#ff505b)
}
.couple-index .couple-body .one-day-index .first-task .authent .alreadly-lq{
    background:#ccc
}
.couple-index .couple-body .one-day-index .first-task .playgame{
    background-image:linear-gradient(90deg,#e4dbee,#e2daf0)
}
.couple-index .couple-body .one-day-index .first-task .playgame .name{
    color:#5f209e
}
.couple-index .couple-body .one-day-index .first-task .playgame .desc{
    color:#a073cb
}
.couple-index .couple-body .one-day-index .first-task .playgame .operate{
    background-image:linear-gradient(90deg,#9c50e6,#7218c9)
}
.couple-index .couple-body .one-day-index .first-task .playgame .alreadly-lq{
    background:#ccc
}
.couple-index .couple-body .one-day-index .first-task .wechat{
    background-image:linear-gradient(90deg,#f1f7d6,#e1eedf)
}
.couple-index .couple-body .one-day-index .first-task .wechat .name{
    color:#174b0b
}
.couple-index .couple-body .one-day-index .first-task .wechat .desc{
    color:#5b7c54
}
.couple-index .couple-body .one-day-index .first-task .wechat .operate{
    background-image:linear-gradient(90deg,#70cc03,#449437)
}
.couple-index .couple-body .one-day-index .first-task .wechat .alreadly-lq{
    background:#ccc
}
.couple-index .couple-body .one-day-index .bouch-mask{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content{
    width:80%;
    background:#f5f6f8;
    border-radius:8px
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .head{
    text-align:center;
    position:relative
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .head .title{
    font-size:.36rem;
    font-weight:700;
    padding:10px;
    text-align:center;
    color:#282828
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .head .close{
    position:absolute;
    top:50%;
    right:10px;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    width:15px
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .wp{
    padding:0 .2rem
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .desc{
    color:#666;
    font-size:.26rem
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .desc .tips{
    color:#282828;
    padding-top:10px;
    text-align:left
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .desc .tips span{
    color:red
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list{
    margin-top:.2rem;
    overflow:auto;
    max-height:360px
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item{
    margin-bottom:.1rem;
    display:flex;
    align-items:center;
    position:relative;
    background:#fff;
    padding:.2rem;
    border-radius:8px
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.16rem;
    height:1.16rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.7;
    display:flex;
    flex-direction:column;
    position:relative
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .name{
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.28rem;
    color:#282828
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem;
    margin-top:.05rem;
    font-size:.2rem
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.21rem
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info2 .tag{
    display:inline;
    padding-left:5px
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info2 .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info2 .tag:nth-child(2){
    color:#75d100
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info2 .tag:nth-child(3){
    color:#2893ff
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .status{
    margin-right:5px;
    border:2px solid #ccc;
    width:15px;
    height:15px;
    border-radius:50%;
    display:inline-block;
    vertical-align:middle;
    margin-bottom:2.5px;
    position:relative
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .checked .status{
    background:#ffc000;
    border:2px solid #ffc000
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .sel-list .checked .status:after{
    content:"";
    display:block;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    background-color:#fff;
    width:5px;
    height:5px;
    border-radius:50%
}
.couple-index .couple-body .one-day-index .bouch-mask .mask-site .mask-content .accept{
    flex:1 1;
    background-color:#ffc000;
    font-size:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:20px;
    color:#fff;
    padding:10px 5px;
    transition:all .1s;
    flex-direction:column;
    line-height:1.25;
    width:65%;
    margin:.3rem auto
}
.couple-index .couple-body .two-day .two-card h1{
    color:#282828;
    font-size:.35rem;
    font-weight:500;
    padding-bottom:10px
}
.couple-index .couple-body .two-day .two-card .card-index{
    background-size:100% 100%;
    background-repeat:no-repeat;
    display:flex;
    align-items:center;
    flex:1 1;
    padding:15px
}
.couple-index .couple-body .two-day .two-card .card-index .text{
    flex:1 1;
    width:0;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.couple-index .couple-body .two-day .two-card .card-index .text .name{
    font-size:.5rem;
    color:#282828
}
.couple-index .couple-body .two-day .two-card .card-index .text .desc{
    font-size:.28rem;
    color:#3d3106
}
.couple-index .couple-body .two-day .two-card .card-index .but{
    color:#ccc;
    display:flex;
    align-items:center;
    flex-direction:column;
    flex-wrap:wrap;
    align-content:flex-end;
    width:25%
}
.couple-index .couple-body .two-day .two-task{
    padding-top:10px;
    padding-bottom:10px
}
.couple-index .couple-body .two-day .two-task h1{
    color:#282828;
    font-size:.35rem;
    font-weight:500;
    padding-bottom:10px
}
.couple-index .couple-body .two-day .two-task .task{
    display:flex;
    align-items:center;
    background-size:100% 100%;
    padding:10px;
    border-radius:8px;
    margin-top:15px;
    background-image:linear-gradient(90deg,#fff2d7,#ffe7ae)
}
.couple-index .couple-body .two-day .two-task .task .icon{
    width:50px;
    height:50px
}
.couple-index .couple-body .two-day .two-task .task .info{
    flex:1 1;
    width:0;
    padding-left:7.5px;
    padding-right:7.5px
}
.couple-index .couple-body .two-day .two-task .task .info .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    display:flex;
    align-items:center;
    font-size:.32rem;
    color:#664508
}
.couple-index .couple-body .two-day .two-task .task .info .desc{
    font-size:.28rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:5px;
    color:#a27a30
}
.couple-index .couple-body .two-day .two-task .task .operate{
    font-size:.28rem;
    background-image:linear-gradient(90deg,#ffd334,#f59a02);
    padding:6px 15px;
    color:#fff;
    border-radius:20px;
    text-align:center;
    width:80px
}
.couple-index .couple-body .two-day .two-task .task .alreadly-lq,.couple-index .couple-body .two-day .two-task .task .no-open{
    background:#ccc
}
.couple-index .couple-body .two-day .two-task .sign{
    margin-top:0
}
.couple-index .couple-body .three-day .three-card h1{
    color:#282828;
    font-size:.35rem;
    font-weight:500;
    padding-bottom:10px
}
.couple-index .couple-body .three-day .three-card .card-index{
    background-size:100% 100%;
    background-repeat:no-repeat;
    display:flex;
    align-items:center;
    flex:1 1;
    padding:15px
}
.couple-index .couple-body .three-day .three-card .card-index .text{
    flex:1 1;
    width:0;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.couple-index .couple-body .three-day .three-card .card-index .text .name{
    font-size:.5rem;
    color:#282828
}
.couple-index .couple-body .three-day .three-card .card-index .text .desc{
    font-size:.28rem;
    color:#3d3106
}
.couple-index .couple-body .three-day .three-card .card-index .but{
    color:#ccc;
    display:flex;
    align-items:center;
    flex-direction:column;
    flex-wrap:wrap;
    align-content:flex-end;
    width:25%
}
.couple-index .couple-body .three-day .three-task{
    padding-top:10px;
    padding-bottom:10px
}
.couple-index .couple-body .three-day .three-task h1{
    color:#282828;
    font-size:.35rem;
    font-weight:500;
    padding-bottom:10px
}
.couple-index .couple-body .three-day .three-task .task{
    display:flex;
    align-items:center;
    background-size:100% 100%;
    padding:10px;
    border-radius:8px;
    margin-top:15px;
    background-image:linear-gradient(90deg,#fff2d7,#ffe7ae)
}
.couple-index .couple-body .three-day .three-task .task .icon{
    width:50px;
    height:50px
}
.couple-index .couple-body .three-day .three-task .task .info{
    flex:1 1;
    width:0;
    padding-left:7.5px;
    padding-right:7.5px
}
.couple-index .couple-body .three-day .three-task .task .info .name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    display:flex;
    align-items:center;
    font-size:.32rem;
    color:#664508
}
.couple-index .couple-body .three-day .three-task .task .info .desc{
    font-size:.28rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:5px;
    color:#a27a30
}
.couple-index .couple-body .three-day .three-task .task .operate{
    font-size:.28rem;
    background-image:linear-gradient(90deg,#ffd334,#f59a02);
    padding:6px 15px;
    color:#fff;
    border-radius:20px;
    text-align:center;
    width:80px
}
.couple-index .couple-body .three-day .three-task .task .alreadly-lq,.couple-index .couple-body .three-day .three-task .task .no-open{
    background:#ccc
}
.couple-index .couple-body .three-day .three-task .sign{
    margin-top:0
}
.couple-index .tips{
    text-align:center;
    color:#fff;
    padding-top:10px;
    font-size:12px
}
.couple-index .cdk{
    position:fixed;
    z-index:555;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    align-content:center;
    justify-items:center;
    justify-content:center
}
.couple-index .cdk .mask{
    display:block;
    position:absolute;
    z-index:666;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.5)
}
.couple-index .cdk .entity{
    position:relative;
    z-index:777;
    background:top no-repeat;
    background-size:100% 100%;
    width:300px;
    padding:100px 35px 15px;
    overflow:hidden
}
.couple-index .cdk .head img{
    display:block;
    margin:0 auto;
    width:75%
}
.couple-index .cdk .info{
    color:#fff;
    margin-top:10px
}
.couple-index .cdk .input{
    margin-top:10px;
    display:flex;
    align-items:center
}
.couple-index .cdk .input input{
    background-color:#fff;
    border-radius:20px;
    border:none;
    flex:1 1;
    width:0;
    padding:5px 10px;
    font-size:.28rem
}
.couple-index .cdk .input .btn{
    padding:5px 10px;
    margin:0 auto 0 10px
}
.couple-index .cdk .input .btn,.couple-index .cdk .operate{
    background-color:#ffc000;
    color:#fff;
    border-radius:20px;
    text-align:center
}
.couple-index .cdk .operate{
    display:block;
    width:100px;
    padding:5px;
    margin:10px auto 0
}
.couple-index .cdk .close{
    position:relative;
    z-index:777;
    margin-top:20px;
    color:#fff;
    width:30px;
    height:30px;
    display:flex;
    text-align:center;
    align-content:center;
    align-items:center;
    justify-items:center;
    justify-content:center;
    border:1px solid #fff;
    border-radius:50%;
    font-size:.3rem
}
.couple-index .rule-bounced{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    margin:0 auto
}
.couple-index .rule-bounced .rule-index{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.couple-index .rule-bounced .rule-index .rule-content{
    width:80%;
    background:#fff;
    overflow:auto;
    padding:20px;
    border-radius:10px;
    line-height:180%;
    max-width:650px
}
.couple-index .rule-bounced .rule-index .close{
    background-size:100% 100%;
    width:25px;
    height:25px;
    z-index:500;
    margin:10% auto
}
.regression-index .all{
    background:#f3973e
}
.regression-index .all .rule{
    z-index:1;
    position:absolute;
    right:0;
    line-height:.5rem;
    opacity:.8;
    margin-top:5px;
    color:#fff;
    width:1.5rem;
    text-align:center;
    background:#282828;
    border-top-left-radius:.2rem;
    border-bottom-left-radius:.2rem
}
.regression-index .all .first-part{
    position:relative
}
.regression-index .all .first-part .end_time{
    position:absolute;
    top:2.95rem;
    font-size:.3rem;
    color:#fff;
    text-align:center;
    width:100%
}
.regression-index .all .first-part .gift-section{
    margin-top:-4.15rem
}
.regression-index .all .first-part .gift-section .gift-bag{
    position:relative;
    background-repeat:no-repeat;
    background-size:100%;
    height:4.4rem;
    width:90%;
    margin:0 auto
}
.regression-index .all .first-part .gift-section .gift-bag p{
    text-align:center;
    padding-top:.1rem;
    color:#ea4e00;
    font-size:.24rem
}
.regression-index .all .first-part .gift-section .gift-bag p:first-child{
    text-align:center;
    padding-top:.85rem;
    color:#666
}
.regression-index .all .first-part .gift-section .gift-bag p:nth-child(2){
    font-size:.28rem
}
.regression-index .all .first-part .gift-section .gift-bag ul li{
    width:33.3%;
    text-align:center;
    padding-top:.1rem;
    float:left
}
.regression-index .all .first-part .gift-section .gift-bag ul li .bag-img{
    height:1.25rem
}
.regression-index .all .first-part .gift-section .gift-bag ul li .bag-img .open-img{
    width:85.9%
}
.regression-index .all .first-part .gift-section .gift-bag ul li .bag-img .close-img{
    width:55%
}
.regression-index .all .first-part .gift-section .gift-bag ul li .bag-test{
    font-size:.23rem
}
.regression-index .all .first-part .gift-section .gift-bag ul li .lg-button{
    color:#fff;
    height:.5rem;
    line-height:.5rem;
    border-radius:.1rem;
    width:1.3rem;
    margin:.1rem auto;
    background-color:#f85835;
    font-size:.23rem
}
.regression-index .all .first-part .gift-section .gift-bag ul li .already-lq,.regression-index .all .first-part .gift-section .gift-bag ul li .no-open{
    background-color:#ccc
}
.regression-index .all .second-part{
    position:relative;
    padding-bottom:1rem
}
.regression-index .all .second-part .first-section{
    width:90%;
    box-shadow:inset 0 0 15px #f3973e;
    margin:.35rem auto 0
}
.regression-index .all .second-part .desc{
    z-index:199;
    position:relative;
    background-size:100%;
    margin-top:-8px
}
.regression-index .all .second-part .desc .title{
    color:#ea4e00;
    z-index:999;
    font-size:.295rem;
    font-weight:400;
    text-align:center;
    margin-bottom:.1rem
}
.regression-index .all .second-part .desc ul li{
    width:95%;
    margin:0 auto;
    padding:8px 0;
    border-bottom:1px solid #fdc8b6
}
.regression-index .all .second-part .desc ul li .text{
    padding:3px 0 0
}
.regression-index .all .second-part .desc ul li .text .logo{
    width:8%;
    float:left;
    margin-right:.2rem;
    margin-top:.15rem
}
.regression-index .all .second-part .desc ul li .text .describe{
    position:relative;
    display:inline-block;
    width:3.67rem;
    line-height:.4rem
}
.regression-index .all .second-part .desc ul li .text .describe p{
    font-size:.23rem;
    color:#999
}
.regression-index .all .second-part .desc ul li .text .describe .name{
    font-size:.295rem;
    color:#282828;
    font-family:PingFang SC;
    font-weight:500
}
.regression-index .all .second-part .desc ul li .text .discount{
    float:right;
    text-align:center;
    margin-top:.145rem;
    margin-right:.5em
}
.regression-index .all .second-part .desc ul li .text .discount .load-button{
    cursor:pointer;
    background:#f85835;
    color:#fff;
    border-radius:5px;
    border:0;
    padding:5px 10px;
    width:1.3rem;
    font-weight:400;
    font-size:.23rem
}
.regression-index .all .second-part .desc ul li .text .discount .alreadly-lq{
    background:#ccc
}
.regression-index .all .second-part .desc ul li:last-child{
    border-bottom:0;
    padding:8px 0 0
}
.regression-index .all .second-part .hg2 img{
    position:relative;
    z-index:198;
    margin-top:-.6rem
}
.regression-index .all .second-part .second-section,.regression-index .all .second-part .third-section{
    width:90%;
    box-shadow:inset 0 0 15px #f3973e;
    margin:.28rem auto 0
}
.regression-index .bouch-mask{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.regression-index .bouch-mask .mask-site{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.regression-index .bouch-mask .mask-site .mask-content{
    width:80%;
    background:#f5f6f8;
    border-radius:8px
}
.regression-index .bouch-mask .mask-site .mask-content .head{
    text-align:center;
    position:relative
}
.regression-index .bouch-mask .mask-site .mask-content .head .title{
    font-size:.36rem;
    font-weight:700;
    padding:10px;
    text-align:center;
    color:#282828
}
.regression-index .bouch-mask .mask-site .mask-content .head .close{
    position:absolute;
    top:50%;
    right:10px;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    width:15px
}
.regression-index .bouch-mask .mask-site .mask-content .wp{
    padding:0 .2rem
}
.regression-index .bouch-mask .mask-site .mask-content .czk-coins{
    background:#feeeed;
    display:flex;
    padding:5px 0
}
.regression-index .bouch-mask .mask-site .mask-content .czk-coins ul li{
    width:50%;
    float:left
}
.regression-index .bouch-mask .mask-site .mask-content .czk-coins img{
    width:50%;
    margin:0 auto;
    display:block
}
.regression-index .bouch-mask .mask-site .mask-content .czk-coins div{
    padding:5px 0
}
.regression-index .bouch-mask .mask-site .mask-content .name-title{
    text-align:center;
    font-size:.32rem;
    color:#282828;
    padding:5px;
    font-weight:500
}
.regression-index .bouch-mask .mask-site .mask-content .desc{
    color:#666;
    font-size:.26rem
}
.regression-index .bouch-mask .mask-site .mask-content .desc .tips{
    color:#282828;
    padding-top:10px;
    text-align:left
}
.regression-index .bouch-mask .mask-site .mask-content .desc .tips span{
    color:red
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list{
    margin-top:.2rem;
    overflow:auto;
    max-height:260px
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item{
    margin-bottom:.1rem;
    display:flex;
    align-items:center;
    position:relative;
    background:#fff;
    padding:.2rem;
    border-radius:8px
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.16rem;
    height:1.16rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.7;
    display:flex;
    flex-direction:column;
    position:relative
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .name{
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.28rem;
    color:#282828
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:.05rem;
    margin-top:.05rem;
    font-size:.2rem
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.21rem
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info2 .tag{
    display:inline;
    padding-left:5px
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info2 .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info2 .tag:nth-child(2){
    color:#75d100
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .text .info2 .tag:nth-child(3){
    color:#2893ff
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .new-week-item .status{
    margin-right:5px;
    border:2px solid #ccc;
    width:15px;
    height:15px;
    border-radius:50%;
    display:inline-block;
    vertical-align:middle;
    margin-bottom:2.5px;
    position:relative
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .checked .status{
    background:#ffc000;
    border:2px solid #ffc000
}
.regression-index .bouch-mask .mask-site .mask-content .sel-list .checked .status:after{
    content:"";
    display:block;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    background-color:#fff;
    width:5px;
    height:5px;
    border-radius:50%
}
.regression-index .bouch-mask .mask-site .mask-content .accept{
    flex:1 1;
    background-color:#f85835;
    font-size:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    color:#fff;
    padding:10px 5px;
    transition:all .1s;
    flex-direction:column;
    line-height:1.25;
    width:65%;
    margin:.3rem auto
}
.regression-index .vouch-box{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    max-width:720px;
    margin:0 auto
}
.regression-index .vouch-box .vouch-site{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.regression-index .vouch-box .vouch-site .content{
    width:80%
}
.regression-index .vouch-box .vouch-site .close{
    width:12%;
    z-index:2000;
    margin:2% 44%
}
.regression-index .vouch-box .vouch-site .close img{
    width:75%;
    margin-left:12.5%;
    margin-top:50%
}
.regression-index .rule-bounced{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.8);
    z-index:999;
    margin:0 auto
}
.regression-index .rule-bounced .rule-index{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center;
    flex-direction:column;
    height:100%
}
.regression-index .rule-bounced .rule-index .rule-content{
    width:80%;
    background:#fff;
    overflow:auto;
    padding:20px;
    border-radius:10px;
    line-height:180%;
    max-width:650px
}
.regression-index .rule-bounced .rule-index .close{
    background-size:100% 100%;
    width:25px;
    height:25px;
    z-index:500;
    margin:10% auto
}
.beta-index .second{
    background-repeat:no-repeat;
    background-size:100% 100%;
    margin-top:-.1rem;
    color:#fff;
    text-align:center
}
.beta-index .second .baglist{
    display:flex;
    padding:.5rem .5rem .2rem
}
.beta-index .second .baglist .text{
    font-size:.3rem
}
.beta-index .second p{
    padding:.2rem .79rem .8rem;
    font-size:.24rem
}
.beta-index .third{
    background-repeat:no-repeat;
    background-size:100% 100%;
    margin-top:-.1rem
}
.beta-index .third .rollinglist{
    height:185px;
    overflow:auto;
    padding-top:.6rem
}
.beta-index .third .rollinglist .text{
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    align-content:center;
    padding:.1rem
}
.beta-index .third .rollinglist .text .banner{
    width:20px;
    margin-right:5px;
    height:20px
}
.beta-index .third .rollinglist .text:first-child{
    padding-top:0
}
.beta-index .third .rollinglist .text .desc{
    width:75%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.beta-index .third .rollinglist .inner{
    max-height:115px;
    overflow:hidden
}
.beta-index .glist{
    background-repeat:no-repeat;
    background-size:100% 100%;
    margin-top:-.1rem;
    padding-bottom:30px
}
.beta-index .glist .width{
    padding:0 .2rem
}
.beta-index .glist .title{
    color:#fff;
    text-align:center;
    font-size:.38rem;
    padding:.3rem .8rem
}
.beta-index .glist .content{
    background-repeat:no-repeat;
    background-size:100% 100%
}
.beta-index .glist .content .project-item .item-base{
    display:flex;
    align-items:center;
    position:relative;
    padding:.5rem .5rem 0
}
.beta-index .glist .content .project-item .item-base .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.4rem;
    height:1.4rem;
    display:flex;
    align-content:center;
    align-items:center;
    justify-content:center;
    justify-items:center
}
.beta-index .glist .content .project-item .item-base .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column
}
.beta-index .glist .content .project-item .item-base .text .name{
    font-weight:700;
    font-size:.3rem;
    color:#282828
}
.beta-index .glist .content .project-item .item-base .text .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.beta-index .glist .content .project-item .item-base .text .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.26rem;
    color:#282828
}
.beta-index .glist .content .project-item .item-base .text .info2 span{
    color:#f54427;
    font-size:.38rem
}
.beta-index .glist .content .project-item .item-gift-list{
    flex:1 1;
    padding:10px 30px 0 10px;
    display:flex;
    align-items:center;
    border-radius:8px
}
.beta-index .glist .content .project-item .item-gift-list .icon{
    width:30%
}
.beta-index .glist .content .project-item .item-gift-list .item-gift-text{
    flex:1 1
}
.beta-index .glist .content .project-item .item-gift-list .item-gift-text .text-title{
    background:50% no-repeat;
    background-size:100% 100%;
    padding:5px 10px;
    color:#fff;
    width:60%
}
.beta-index .glist .content .project-item .item-gift-list .item-gift-text .text-info{
    background:#f5f6f8;
    display:flex;
    align-items:stretch;
    padding:5px 5px 5px 10px;
    border-bottom-left-radius:8px;
    border-bottom-right-radius:8px;
    border-top-right-radius:8px
}
.beta-index .glist .content .project-item .item-gift-list .item-gift-text .text-info .info-content{
    flex:1 1;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:space-around
}
.beta-index .glist .content .project-item .item-gift-list .item-gift-text .text-info .info-btn{
    display:flex;
    align-items:center
}
.beta-index .glist .content .project-item .item-gift-list .item-gift-text .text-info .info-btn .btn-receive{
    background-image:linear-gradient(180deg,#ffb658,#f85320);
    border-radius:25px;
    padding:5px 0;
    font-size:12px;
    color:#fff;
    width:60px;
    text-align:center
}
.beta-index .glist .content .project-item .item-gift-list .item-gift-text .text-info .info-btn .already-lq{
    background-image:linear-gradient(180deg,#d8d8d8,#aeaeae)
}
.beta-index .glist .content .project-item .join{
    width:60%;
    margin:0 auto;
    padding:10px 0 40px
}
.new-my-reserve{
    padding:.2rem .3rem
}
.new-my-reserve-item{
    display:block;
    margin-bottom:.3rem;
    overflow:hidden;
    background:#fff;
    padding:.2rem;
    border-radius:8px
}
.new-my-reserve-item .icon,.new-my-reserve-item .subject{
    display:flex;
    align-items:center
}
.new-my-reserve-item .icon{
    flex-shrink:0;
    margin-right:.2rem;
    width:1.2rem;
    height:1.2rem;
    align-content:center;
    justify-content:center;
    justify-items:center
}
.new-my-reserve-item .icon img{
    display:block;
    max-width:100%;
    max-height:100%
}
.new-my-reserve-item .text{
    flex:1 1;
    width:0;
    font-size:.24rem;
    color:#999;
    line-height:1.6;
    display:flex;
    flex-direction:column
}
.new-my-reserve-item .name{
    display:flex;
    align-items:center
}
.new-my-reserve-item .name .named{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-weight:700;
    font-size:.3rem;
    color:#282828
}
.new-my-reserve-item .name .date{
    margin:0 3.5px;
    padding:0 3.5px;
    color:#fff;
    background-color:#ff1493;
    border-radius:4px;
    font-size:12px;
    font-weight:400;
    white-space:nowrap
}
.new-my-reserve-item .info1{
    color:#999;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    display:flex;
    align-items:center
}
.new-my-reserve-item .reserve{
    margin:0 5px;
    color:red;
    font-weight:700
}
.new-my-reserve-item .info2{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.24rem;
    color:#ff5e00
}
.new-my-reserve-item .tag{
    display:inline-block;
    padding-left:5px;
    color:#fab72b
}
.new-my-reserve-item .tag:first-child{
    color:#ff4200;
    padding-left:0
}
.new-my-reserve-item .tag:nth-child(2){
    color:#75d100
}
.new-my-reserve-item .tag:nth-child(3){
    color:#2893ff
}
.new-my-reserve-item .btn{
    width:1.1rem;
    border-radius:.25rem;
    background:#ffc000;
    font-size:.28rem;
    color:#fff;
    line-height:.5rem;
    text-align:center
}
.new-my-reserve-item .medias{
    margin-top:.15rem;
    white-space:nowrap;
    overflow:hidden;
    overflow-x:scroll;
    -webkit-backface-visibility:hidden;
    -webkit-overflow-scrolling:touch;
    text-align:justify;
    display:flex;
    margin-left:-.2rem
}
.new-my-reserve-item .media{
    flex-shrink:0;
    width:25%;
    padding-left:.2rem;
    position:relative
}
.new-my-reserve-item .media:last-child{
    margin-right:0
}
.new-my-reserve-item .media .container{
    position:relative
}
.new-my-reserve-item .media img{
    width:100%;
    border-radius:8px
}
.new-my-reserve-item .media .play{
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    color:#fff;
    font-size:32px
}
.view-end{
    color:#666;
    text-align:center;
    padding:10px;
    display:flex;
    align-items:center;
    justify-content:center
}
.view-end:after,.view-end:before{
    width:10%;
    margin:0 5%;
    content:"";
    display:block;
    height:1px;
    background-color:#ccc
}
.view-img{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#000
}
.view-img .swiper-container{
    height:100%
}
.view-img .swiper-container-horizontal>.swiper-pagination-bullets,.view-img .swiper-pagination-custom,.view-img .swiper-pagination-fraction{
    bottom:5px
}
.view-img .swiper-pagination-bullet{
    background-color:#fff
}
.view-img .img{
    display:flex;
    align-items:center;
    align-content:center;
    justify-content:center;
    justify-items:center
}
.view-img .img img{
    display:block;
    max-width:100%;
    max-height:100%
}
.view-iframe{
    width:100%;
    height:calc(100vh - 40px - env(safe-area-inset-top));
    position:relative;
    border-top:1px solid transparent;
    transition:all .25s
}
@media (orientation:landscape){
    .view-iframe{
        height:calc(100vh - env(safe-area-inset-top))
    }
}
.view-iframe .progress{
    position:absolute;
    top:0;
    left:0;
    height:1px;
    background-color:transparent;
    transition:all .25s
}
.view-iframe .progress.loading{
    background-color:#ffc000
}
.view-iframe .progress.loaded{
    background-color:transparent
}
.view-iframe iframe{
    width:100%;
    height:100%
}
.iframe-roam-screen{
    height:100vh
}
.root .video-react .video-react-big-play-button{
    opacity:0;
    display:none
}
.video-react.video-react-fullscreen .video-react-control-bar{
    bottom:env(safe-area-inset-bottom)
}
.view-video{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#000;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding-top:env(safe-area-inset-top);
    padding-bottom:env(safe-area-inset-bottom)
}
.view-video .video-react .video-react-control-bar{
    bottom:0
}
.view-video .video-react.video-react-fullscreen .video-react-control-bar{
    bottom:env(safe-area-inset-bottom)
}
.am-modal-transparent{
    width:auto;
    min-width:75%;
    max-width:85%
}
.am-modal-alert-content{
    text-align:left
}
.ant-image{
    width:100%;
    height:100%
}
.van-overflow-hidden{
    overflow:hidden!important
}
/*# sourceMappingURL=main.47bc850e.chunk.css.map */