html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea,menu {margin: 0;padding: 0;box-sizing: border-box;}
html,body,fieldset,img,iframe,abbr {border: 0}
li {list-style: none}
textarea {overflow: auto;resize: none}
a,button {cursor: pointer}
h1,h2,h3,h4,h5,h6,em,strong,b {font-weight: 700}
a,a:hover {text-decoration: none}
a{text-decoration: none}
input{-webkit-appearance: none;appearance: none}
* {outline: 0;-webkit-tap-highlight-color: transparent;-webkit-focus-ring-color: rgba(0,0,0,0)}
html{font-size: calc(100vw/7.5);}
table{border-collapse:collapse}
body{
    font:.22rem / .3rem 'Microsoft Yahei',Arial;
    color: #010200;
    text-align: center;
}
img{
    display: block;
    width: 100%;
    user-select: none;
}
::-webkit-scrollbar {
    display:none;
}
.cell{
    display:-webkit-box;
    display:-webkit-flex;
    display:flex;
    -webkit-box-align:center;
    -webkit-align-items:center;
    align-items:center
}
.bd{
    -webkit-box-flex:1;
    -webkit-flex:1;
    flex:1;
}
.top{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background-color: #f5f5f5;
}

.app{
    width:7.5rem;
    margin:0 auto;
    background-color: #d4262e;
    background-image: url('../imgs/page.jpg?v=1');
    background-size: 7.5rem auto;
    background-repeat: no-repeat;
    background-position: center top;
    min-height: 38.37rem;
}
.part1{
    padding-top: 10rem;
    height: 13.93rem;
}
.join{
    color: #e03f13;
    font-size: 1.3rem;
    font-weight: bold;
    line-height: 1.28rem;
    height: 1.28rem;
    overflow: hidden;
}
.scroll-box{
    margin-top: .35rem;
    height: .38rem;
    line-height: .38rem;
    font-size: .2rem;
    color: #4f4644;
    overflow: hidden;
}
.scroll-box ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
.scroll-box li{
    background: url('../imgs/scroll-bg.jpg') no-repeat  center / 3.84rem .38rem;
    height: .38rem;
    line-height: .38rem;
    text-align: center;
}
.scroll-box li span{
    display: inline-block;
    padding-left: .4rem;
    background: url('../imgs/lb.png') no-repeat left center / .34rem .29rem;
}
.btn_join{
    width: 4.92rem;
    height: 1.03rem;
    background: url('../imgs/join.png') no-repeat center / 100% auto;
    margin: .4rem auto 0;
    font-size: 0;
}
.btn_join.gray{
    background: url('../imgs/join_end.png') no-repeat center / 100% auto;
}
.part2{
    height: 9.5rem;
    overflow: hidden;
}
.prize{
    margin: .92rem auto .84rem;
    width: 6.56rem;
    height: 6rem;
    position: relative;
}
.prize li{
    position: absolute;
    left: 0;
    top: 0;
    user-select: none;
    width: 6.56rem;
    height: 6rem;
    display: none;
}
.prize-btns{
    display: flex;
    justify-content: center;
}
.prize-btn{
    width: 1.75rem;
    height: .84rem;
    line-height: .7rem;
    font-size: .26rem;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 .01rem .01rem rgba(142,3,3,.71);
    background: url('../imgs/prize-btn.png?v=1') no-repeat center top / 1.75rem auto;
    margin: 0 .04rem;
}
.prize-btn.cur{
	background-position:0 -.94rem;
}
.prize-btn.end{
	background-position:0 -1.88rem;
}
.part3{
    height: 10rem;
    overflow: hidden;
    position: relative;
}
.part3::after{
    content: '';
    position: absolute;
    bottom: .62rem;
    width: 6.89rem;
    left: .31rem;
    height: 1.4rem;
    border-radius: 0 0 .36rem .36rem;
    background: linear-gradient(to bottom, transparent, #ffffff);
}
.rule{
    overflow-y: auto;
    margin: 1.1rem .44rem 0 .5rem;
    height: 8.2rem;
    font-size: .22rem;
    color: #000;
    line-height: .38rem;
    text-align: left;
}
.rule b{
    font-weight: bold;
    display: inline-block;
    margin-top: .1rem;
}
.cash-table{
    width: 100%;
    margin: .12rem 0 .2rem;
    border-collapse: collapse;
    font-size: .2rem;
    line-height: .32rem;
    text-align: center;
}
.cash-table th,
.cash-table td{
    border: .01rem solid #7a4b2b;
    padding: .06rem .08rem;
}
.cash-table th{
    font-weight: bold;
    background: rgba(255, 226, 158, .5);
}
.qr{
    display: flex;
    justify-content: center;
    margin: .9rem auto 0;
}
.qr-item{
    margin: 0 .4rem;
    width: 2.92rem;
    height: 2.92rem;
}

.twpop{
    z-index: 100;
    position: relative;
}
/*
.gray{
    -webkit-filter: grayscale(100%);filter: grayscale(100%);filter: gray;
}
*/
.sidebar{
    position: fixed;
    top: 2rem;
    right: 0;
    width: .57rem;
}
.btn-prize,.btn-past,.btn-my{
    width: .57rem;
    height: 1.26rem;
    background: url('../imgs/side.png') no-repeat left top / .57rem 4.15rem;
    font-size: 0;
}
.btn-prize{
    background-position: 0 0;
}
.btn-past{
    background-position: 0 -1.26rem;
    height: 1.56rem;
}
.btn-my{
    margin-top: .04rem;
    background-position: 0 -2.84rem;
    height: 1.28rem;
}


.twpop .twpop-main{
    width: 6.3rem;
    color: #000;
    border: .04rem solid #fcce69;
    border-radius: .2rem;
    background-image: linear-gradient(top,#fcf4dd,#ffffff);
    background-image: -webkit-linear-gradient(top,#fcf4dd,#ffffff);
}
.twpop .twpop-title{
    border-color: #f4ecd6;
    color: #ff6000;
    font-weight: bold;
}
.twpop .twpop-btn{
    width: 2.14rem;
    height: .72rem;
    line-height: .64rem;
    font-size: .26rem;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 .01rem .01rem rgba(142,3,3,.71);
    background: url('../imgs/prize-btn.png') no-repeat center top / 100% auto;
    padding: 0;
    border: none;
}
.twpop .twpop-foot{
    margin-top: .2rem;
}
.twpop .pop-prize,
.twpop .pop-past,
.twpop .pop-my{
    width: 7.08rem;
    height: 12.36rem;
    background: url('../imgs/pop.png') no-repeat center top / cover;
    border: none;
    overflow: hidden;
    padding-top: 3.27rem;
    box-sizing: border-box;
}
.twpop .pop-prize::before,
.twpop .pop-past::before,
.twpop .pop-my::before{
    content: '';
    width: 3.5rem;
    height: .58rem;
    background: url('../imgs/pop-title.png?v=1') no-repeat left top / 100% auto;
    position: absolute;
    top: 2.6rem;
    left: 50%;
    margin-left: -1.75rem;
}
.twpop .pop-past::before{
    background-position: 0 -.68rem;
}
.twpop .pop-my::before{
    background-position: 0 -1.36rem;
}
.twpop .pop-prize .twpop-title,
.twpop .pop-past .twpop-title,
.twpop .pop-my .twpop-title{
    display: none;
}
.twpop .pop-prize .twpop-cont,
.twpop .pop-past .twpop-cont,
.twpop .pop-my .twpop-cont{
    padding: 0 .46rem;
}
.twpop .pop-prize .twpop-diy-content,
.twpop .pop-past .twpop-diy-content,
.twpop .pop-my .twpop-diy-content{
    max-height: 8.4rem;
}
.twpop .pop-prize .twpop-close,
.twpop .pop-past .twpop-close,
.twpop .pop-my .twpop-close{
    width: .7rem;
    height: .7rem;
    background-color: #fd4236;
    background-image: url('../imgs/close.png');
    background-size: .34rem;
    background-position: center;
    border-radius: 50%;
    top: 1.4rem;
}

.twpop-msg .twpop-main::after,.twpop-msg .twpop-main::before,.twpop-load .twpop-main::after,.twpop-load .twpop-main::before{
    display: none;
}


.tips{
    text-align: justify;
}
.tips p{
    margin-bottom: .18rem;
}

.list{
    padding-top: .66rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    background-size: 2.65rem auto;
    background-repeat: no-repeat;
    background-position: center top;
}
.grand{
    background-image: url('../imgs/grand-tit.png');
}
.first{
    background-image: url('../imgs/first-tit.png');
    margin-top: .1rem;
}
.second{
    background-image: url('../imgs/second-tit.png');
    margin-top: .1rem;
}
.third{
    background-image: url('../imgs/third-tit.png');
    margin-top: .1rem;
}
.fourth{
    background-image: url('../imgs/fourth-tit.png');
    margin-top: .1rem;
}
.list .item{
    margin-top: .36rem;
    width: 2.9rem;
    position: relative;
    text-align: left;
    height: 1.12rem;
    padding-left: .74rem;

}
.list .item p{
    line-height: .28rem;
    font-size: .2rem;
    color: #575757;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: break-word;
}
.list .item .avatar{
    width: .6rem;
    height: .6rem;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -.3rem;
    overflow: hidden;
}

.pop-my .list{
    background: transparent;
    padding: 0;
}