body,html{
    width:100%;
    height:100%
}
body{
    margin:0;
    padding:0;
    font-size:16px;
    font-family:微软雅黑,PingFangSC-Regular,Helvetica Neue,Helvetica,Arial,sans-serif
}
a{
    text-decoration:none
}
img[src=""]{
    opacity:0
}
footer{
    position:fixed;
    line-height:1rem;
    left:0;
    bottom:0;
    width:100%;
    color:#fff;
    z-index:11
}
footer div{
    display:inline-block
}
footer .content{
    display:inline-block;
    opacity:0;
    height:0;
    width:0
}
#main,.x-mobile-website,.x-pc-website{
    width:100%;
    height:100%;
    position:relative
}
#qrcode{
    background:#fff;
    border-radius:5px;
    padding:15px;
    margin-top:-125px;
    display:inline-block;
    cursor:pointer
}
@media screen and (max-width:1024px){
    .x-pc-website{
        display:none
    }
    .x-mobile-website{
        display:block
    }
}
@media screen and (min-width:1024px){
    .x-pc-website{
        display:block
    }
    .x-mobile-website{
        display:none
    }
}
.container{
    z-index:1;
    height:100%;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center
}
.fixed-bg{
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background-color:#fff;
    -o-object-fit:cover;
    object-fit:cover;
    z-index:-1
}
.fixed-header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:10vh;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    padding:0 10vh 0 15vh;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
    z-index:2
}
.fixed-logo{
    z-index:1;
    height:6vh
}
.contact-us{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    color:#fff;
    font-size:18px;
    line-height:26px;
    cursor:pointer;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center
}
.contact-us img{
    height:26px;
    padding:0
}
.fixed-main{
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,.15)
}
.layout{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:end;
    -ms-flex-pack:end;
    justify-content:flex-end;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    z-index:1;
    padding-right:10vw;
    padding-top:68vh
}
.doc-container{
    position:fixed;
    left:0;
    top:-100%;
    width:100%;
    height:100%;
    -webkit-transition:all 1s;
    -o-transition:all 1s;
    transition:all 1s;
    opacity:0;
    color:#fff;
    background-color:#111;
    overflow-x:hidden;
    overflow-y:auto
}
.customer1 {
  width: 0.7rem;
  height: 1rem;
  position: fixed;
  top: 2.7rem;
  left: 0;
  margin-top: -15px;
  z-index: 100;
}
.customer2 {
  width: 1.4rem;
  height: 2.1rem;
  position: fixed;
  top: 6rem;
  right: 0;
  margin-top: -15px;
  z-index: 100;
}
.doc-container.active{
    opacity:1;
    top:0;
    z-index:10
}
.qrcode-container{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    min-height:60vh;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center
}
.qrcode-container .qrcode-item{
    font-size:4vh;
    text-align:center;
    padding:0 4vh
}
.doc-container .doc-close-wrap{
    position:absolute;
    right:5vh;
    top:5vh;
    z-index:10;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    font-size:1.8vh;
    color:#f1f1f1;
    cursor:pointer
}
.doc-container .doc-close{
    padding:.3vh;
    -webkit-transform:rotate(40deg) translateY(-8%);
    -ms-transform:rotate(40deg) translateY(-8%);
    transform:rotate(40deg) translateY(-8%);
    font-size:3.5vh
}
.doc-container .doc-main{
    width:100%;
    height:100%;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center
}
.doc-container .description-wrap{
    margin-top:10vh;
    text-align:center
}
.doc-container .description-wrap img{
    width:100vh
}
.doc-container .doc-fixed-logo{
    position:absolute;
    left:12vh;
    top:5vh;
    height:5vh
}
.slogn{
    display:inline;
    padding-right:50px
}
.slogn img{
    display:inline-block;
    width:35vw
}
.info{
    font-size:14px;
    color:rgba(255,255,255,.75);
    position:absolute;
    bottom:15px;
    text-align:center;
    width:100%
}
.info img{
    vertical-align:middle;
    height:.14rem
}
.x-top{
    position:absolute;
    top:0;
    left:0;
    width:100%
}
.x-top-img-list{
    font-size:0;
    overflow-x:auto;
    overflow-y:hidden;
    white-space:nowrap;
    scrollbar-width:none;
    -ms-overflow-style:none
}
.x-top-img-list::-webkit-scrollbar{
    display:none
}
.x-top-img{
    display:inline-block;
    width:100%;
    min-height:250px;
    margin:0
}
.header-split{
    padding:.18rem;
    position:relative
}
.header-split span{
    line-height:.6rem;
    color:#40128a;
    font-weight:700;
    font-size:.32rem
}
.active{
    top:.2rem;
    right:.125rem;
    position:absolute
}
.active-load{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
    -webkit-box-align:end;
    -ms-flex-align:end;
    align-items:flex-end;
    width:.533333rem;
    height:.426667rem;
    margin:0 auto
}
.active-load span{
    display:block;
    float:left;
    width:.076rem;
    height:.42rem;
    background:#fff
}
.active-load .z1{
    background-color:#40128a;
    height:.106667rem;
    -webkit-animation:ac_load_1 1s .2s ease infinite;
    animation:ac_load_1 1s .2s ease infinite
}
.active-load .z2{
    background-color:#40128a;
    height:.186667rem;
    -webkit-animation:ac_load_2 1s .4s ease infinite;
    animation:ac_load_2 1s .4s ease infinite
}
.active-load .z3{
    background-color:#40128a;
    height:.266667rem;
    -webkit-animation:ac_load_3 1s .6s ease infinite;
    animation:ac_load_3 1s .6s ease infinite
}
.active-load .z4{
    background-color:#40128a;
    height:.4rem;
    -webkit-animation:ac_load_4 1s .8s ease infinite;
    animation:ac_load_4 1s .8s ease infinite
}
.app-logo{
    float:left;
    width:100%;
    height:1.28rem;
    margin-top:.03rem;
    background:url("../img/app-logo.gif");
    background-size:cover!important
}
.app-name{
    position:absolute;
    line-height:.45rem;
    font-size:.35rem;
    opacity:0
}
.app-name .desc{
    font-size:.25rem;
    color:#ddd;
    -webkit-animation:ac_desc 1s .8s ease infinite;
    animation:ac_desc 1s .8s ease infinite
}
.ZdLoELx7s{
    display:inline-block;
    background:#40128a;
    float:right;
    padding:.165rem .25rem;
    line-height:1rem;
    color:#fff;
    font-size:.38rem
}
.ZdLoELx7s img{
    height:.45rem;
    vertical-align:middle
}
.content{
    padding:0 .15rem
}
.commit ul,.content ul{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    list-style:none;
    margin:0;
    padding:0
}
.content ul li{
    width:48.5%;
    padding-bottom:.35rem;
    position:relative
}
.content ul li span{
    font-size:.28rem;
    padding-top:.18rem
}
.content ul li .play{
    position:absolute;
    padding:0;
    background-color:rgba(0,0,0,.35);
    box-sizing:border-box;
    border-radius:100%;
    width:1rem;
    height:1rem;
    top:1.75rem;
    left:1.25rem
}
.content ul li .play div{
    border-style:solid;
    margin:.23rem 0 0 .32rem;
    border-width:.28rem 0 .28rem .48rem;
    border-color:transparent transparent transparent rgba(255,255,255,.6)
}
.content ul li .tag{
    position:absolute;
    top:0;
    right:.15rem;
    color:#fff;
    background:#ff3360;
    border-radius:0 0 .1rem .1rem;
    padding:.075rem .15rem;
    font-size:.28rem
}
.content ul li .playing{
    position:absolute;
    top:.1rem;
    left:.15rem;
    background:rgba(0,0,0,.5);
    padding:0 .18rem;
    border-radius:1rem;
    font-size:.26rem;
    color:#fff;
    line-height:.42rem
}
.content ul li .playing i{
    display:inline-block;
    height:.15rem;
    width:.15rem;
    background:#3fff00;
    border-radius:.15rem;
    margin:0 .1rem 0 0;
    -webkit-animation:dot 1s 1s ease infinite;
    animation:dot 1s 1s ease infinite
}
.content ul li .detail{
    position:absolute;
    bottom:0;
    background:rgba(0,0,0,.45);
    color:#ccc;
    width:100%;
    z-index:11;
    padding:.06rem 0
}
.content ul li .detail span{
    padding:0
}
.content ul li .detail .good{
    float:left;
    padding-left:.1rem;
    font-size:.24rem
}
.content ul li .detail .watch{
    float:right;
    padding-right:.1rem;
    font-size:.24rem
}
.content ul li .img{
    position:relative;
    display:block;
    width:100%;
    height:4.5rem;
    overflow:hidden;
    border-radius:.15rem
}
.content ul li .img img{
    width:100%;
    min-height:100%;
    object-fit:cover
}
.content ul li .img:after{
    content:'';
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    height:2.6rem;
    background:url("../img/bg.png") no-repeat 0/cover;
    z-index:6;
    border-radius:.053333rem
}
.commit li{
    padding:.25rem .15rem .15rem .15rem;
    border-bottom:1px solid rgba(60,30,120,.1);
    width:100%
}
.commit li:last-child{
    border-bottom:none
}
.message{
    position:relative;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
    -ms-flex-direction:row;
    flex-direction:row;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center
}
.message img{
    width:1rem;
    height:1rem;
    border-radius:1rem;
    float:left;
    vertical-align:middle;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center
}
.message p{
    padding-left:.25rem;
    font-size:.28rem;
    margin:0;
    width:100%
}
.message .name{
    font-weight:700;
    line-height:.5rem;
    color:#333
}
.message .msg{
    font-size:.28rem;
    color:#555
}
.message .time{
    font-size:.24rem;
    color:#aaa;
    line-height:.5rem;
    float:right
}
.warning{
    font-size:.28rem;
    color:#aaa;
    padding:1rem .25rem 1.8rem .25rem
}
.warning span{
    display:block;
    line-height:.45rem;
    text-align:center
}
.copyright{
    color:#555
}
.copyright span{
    display:inline-block
}
.xdeFwaCx{
    display:block;
    font-size:.32rem;
    padding:.25rem;
    text-align:center;
    background:rgba(145,85,255,.1);
    color:#40128a
}
.eYOBqc8xX{
    text-align:center;
    color:#555;
    padding:.25rem;
    border-bottom:1px solid rgba(60,30,120,.1);
    display:block
}
.eYOBqc8xX img{
    height:.28rem;
    vertical-align:middle
}
.xasEwsax{
    display:block;
    width:68%;
    text-align:center;
    margin:.25rem auto;
    background:#40128a;
    border-radius:5rem;
    padding:.2rem
}
.xasEwsax img{
    height:.45rem;
    vertical-align:middle
}
@keyframes ac_load_4{
    0%,100%{
        height:.4rem
    }
    50%{
        height:.266667rem
    }
}
@-webkit-keyframes ac_load_1{
    0%,100%{
        height:.106667rem
    }
    50%{
        height:.186667rem
    }
}
@-moz-keyframes ac_load_1{
    0%,100%{
        height:.106667rem
    }
    50%{
        height:.186667rem
    }
}
@keyframes ac_load_1{
    0%,100%{
        height:.106667rem
    }
    50%{
        height:.186667rem
    }
}
@-webkit-keyframes ac_load_2{
    0%,100%{
        height:.186667rem
    }
    50%{
        height:.266667rem
    }
}
@-moz-keyframes ac_load_2{
    0%,100%{
        height:.186667rem
    }
    50%{
        height:.266667rem
    }
}
@keyframes ac_load_2{
    0%,100%{
        height:.186667rem
    }
    50%{
        height:.266667rem
    }
}
@-webkit-keyframes ac_load_3{
    0%,100%{
        height:.266667rem
    }
    50%{
        height:.346667rem
    }
}
@-moz-keyframes ac_load_3{
    0%,100%{
        height:.266667rem
    }
    50%{
        height:.346667rem
    }
}
@keyframes ac_load_3{
    0%,100%{
        height:.266667rem
    }
    50%{
        height:.346667rem
    }
}
@-webkit-keyframes ac_load_4{
    0%,100%{
        height:.4rem
    }
    50%{
        height:.266667rem
    }
}
@-moz-keyframes ac_load_4{
    0%,100%{
        height:.4rem
    }
    50%{
        height:.266667rem
    }
}
@keyframes dot{
    0%{
        opacity:0
    }
    100%{
        opacity:100
    }
}
@-webkit-keyframes dot{
    0%{
        opacity:0
    }
    100%{
        opacity:100
    }
}
@-moz-keyframes dot{
    0%{
        opacity:0
    }
    100%{
        opacity:100
    }
}
