body{
    background-color:rgba(23,21,32,1);
 }
 /* 弹窗 */
.mask{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 98;
    display: none;
}
.pop{
    width:5.4rem;
	height:6rem;
	position: fixed;
	background: url(../img/pop_bg.png) no-repeat;
    background-size:100%;
	display: none;
	text-align: center;
	top:50%;
	left:50%;
	-webkit-transform:translate(-50%,-50%);
	transform:translate(-50%,-50%);
	-webkit-transition:.3s all ease;
	transition:.3s all ease;
	z-index:100;
	-webkit-user-select:auto; 
    padding:.34rem .42rem;
    color:#e0c091;
}
.pop .close{
    position:absolute;
	width:.63rem;
	height:.63rem;
	right:.1rem;
	top:-.8rem;
	display:block;
	background:url(../img/close.png) no-repeat;
	background-size:100% auto;
	z-index:99;
    
}
.pop-rule{
    text-align: left;
    font-size: .24rem;
}
.pop-rule .content-box span{
    font-size: .28rem;
}
.pop .content-box{
    width:100%;
    height:100%;
    overflow-y: auto;
    word-wrap: break-word;
    line-height: 1.5;
}
.pop-error{
    width:5.4rem;
	height:3rem;
    background:url(../img/pop_error.png) no-repeat;
	background-size:100% auto;
    padding-top:.95rem;
}
.container{
    height:96rem;
    width: 7.5rem;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    background: url(../img/main_bg.jpg) no-repeat top;
    background-size: 100%;
    margin-top:0.88rem;
}
.ele-img{
    width:100%;
}
.page{
    position: relative;
}
.page1{
    height:20.62rem;
}
.page1 .logo{
    width:2.02rem;
    height:1.21rem;
    margin:.36rem 0 0 .64rem;
}
.page1 .slogan-box{
    width:7.33rem;
    margin:6.05rem auto 0;
}
.page1 .rule-box{
    margin:.75rem auto 0;
    width:6.67rem;
    height:8.07rem;
    background:url(../img/rule.png) no-repeat center;
    background-size: 100%;
    position: relative;
    padding-top:.9rem;
}
.page1 .rule-content{
    width:5.8rem;
    height:6rem;
    margin:0 auto;
    position: relative;
    
}
.page1 .rule-content .top-box{
    position: absolute;
    height:1.7rem;
    width: 100%;
    overflow-y: auto;
    text-align: center;
    color:#804a1b;
    font-size:.28rem;
    line-height:1.5;
}
.page1 .rule-content .top-box span{
    color:#921f00;
}
.page1 .rule-content .bottom-box{
    position: absolute;
    bottom:.08rem;
    height:3.8rem;
    width: 100%;
    color:#804a1b;
    line-height:1.6;
    overflow-y: auto;
}
.page1 .check-detail{
    width:4.21rem;
    height:.53rem;
    background: url(../img/check_detail.png) no-repeat center;
    background-size: 100%;
    line-height: .53rem;
    text-align: center;
    position: absolute;
    bottom:.65rem;
    left:50%;
    font-size: .24rem;
    color:#efd9b3;
    transform: translateX(-50%);
}
.page .title-box{
    text-align: center;
}
.page2 .title-box img{
    width:5.93rem;
    height:1.91rem;
}
.table-box{
    margin:.32rem auto 0;
    width:6.4rem;
    height:10.82rem;
    background:url(../img/ph_bg.png) no-repeat center;
    background-size: 100%;
    padding: .54rem .38rem;
}
.table-box .input-box{
    width:5.68rem;
    height:.88rem;
    background-color:rgba(137,65,33,.4);
    border:2px solid #e5a469; 
    position: relative;
    border-radius: 5px;
}
.table-box .input-box input{
    height:100%;
    width:100%;
    padding:.2rem;
    color:#ffe4ab;
    text-indent: .2rem;
    background:none;
}
.table-box .input-box .search-box{
    background:url(../img/search.png) no-repeat left;
    background-size: .3rem;
    position: absolute;
    left:50%;
    top:50%;
    transform: translateX(-50%);
    transform: translateY(-50%);
    padding-left:.4rem;
    color:#ffe4ab;
    
}

.table-box .content-box{
    margin-top:.3rem;
    border:2px solid #e5a469; 
    border-radius: 5px;


}
.table-box .content-box .header-box{
    height:.82rem;
    line-height: .82rem;
    color:#ffe4ab;
    border-bottom:2px solid #e5a469; 
    background-color:rgba(137,65,33,.4);

    
}
.table-box .content-box .header-box .title{
    display: inline-block;
}
.table-box .content-box .header-box .name-header{
    width:2.26rem;
    background:url(../img/line.png) no-repeat right;
    background-size: .02rem .36rem;
    padding-left:.36rem;
    
}
.table-box .content-box .header-box .jf-header{
    width:1.8rem;
    background:url(../img/line.png) no-repeat right;
    background-size: .02rem .36rem;
    text-align: center;

}
.table-box .content-box .header-box .grade-header{
    width:1.2rem;
    text-align: center;
}
.overflow-box{
    width:100%;
    overflow-x:hidden;
}
.table-box .content-box ul{
    padding:.2rem 0;
    height:7.72rem;
    overflow-y: auto;
    width:110%;
}
.table-box .content-box ul li{
    color:#ffe4ab;
    height:.62rem;
    word-wrap: break-word;
}
.table-box .content-box ul .checked{
    color:#ff7431
}
.table-box .content-box ul .name{
    display: inline-block;
    width:2.26rem;
    padding-left:.36rem;
    vertical-align: top;
}
.table-box .content-box ul .jf{
    display: inline-block;
    width:1.8rem;
    text-align: center;
    vertical-align: top;


}
.table-box .content-box ul .grade{
    display: inline-block;
    width:1.2rem;
    text-align: center;
    vertical-align: top;

}
.page3 .title-box img{
    width:5.93rem;
    height:2.01rem;
}
.page3 .en-box img{
    width:7.23rem;
    height:2.01rem;
}
.page4{
    margin-top:1.14rem;
}
.page4 .title-box img{
    width:5.93rem;
    height:.85rem;
}
.reward-box{
    width:6.40rem;
    height:20.25rem;
    background:url(../img/jl_bg.png) no-repeat center;
    background-size: 100%;
    margin:.32rem auto 0;
    padding: .54rem .38rem;
}
.reward-box .reward-content{
    border:2px solid #e5a469; 
    border-radius: 5px;
    height:100%;
}
.reward-box .reward-content .btns-box{
    background-color:rgba(159,73,37,.4);
    height:.82rem;
    line-height: .82rem;
    text-align: center;
    font-size:0;
    border-bottom:2px solid #e5a469; 

}
.reward-box .reward-content .btns-box .btn{
    display: inline-block;
    color:#ffe4ab;
    width:50%;
    font-size:.24rem;
}
.reward-box .reward-content .btns-box .left{
    background:url(../img/line.png) no-repeat right;
    background-size: .02rem .36rem;
}
.reward-box .reward-content .btns-box .active{
    color:#ffa517;
}
.reward-box .reward-content .reward-detail{
    padding:.46rem .32rem;
}
.reward-box .reward-content .jc-detail{
    display: none;
}
.reward-box .reward-content .title{
    width:3.85rem;
    height:.585rem;
    margin:0 auto;
    background:url(../img/4.png) no-repeat center;
    background-size: 100%;
    text-align: center;
    line-height: .585rem;
    color:#68331d;
}
.reward-box .reward-content .first-box .title{
    background:url(../img/1.png) no-repeat center;
    background-size: 100%;
}
.reward-box .reward-content .second-box .title{
    background:url(../img/2.png) no-repeat center;
    background-size: 100%;
}
.reward-box .reward-content .third-box .title{
    background:url(../img/3.png) no-repeat center;
    background-size: 100%;
}
.reward-box .reward-content .other-box .title{
    background:url(../img/4.png) no-repeat center;
    background-size: 100%;
}
.reward-box .reward-content .box .content{
    font-size: 0;
    display: flex;
    justify-content: space-between;
}
.reward-box .reward-content .box .content .item-box{
    display: inline-block;
    width:30%;
    font-size:.24rem;
    text-align: center;
    vertical-align: top;
    color:#fde1a9;
}

.reward-box .reward-content .box .content .item-box img{
    width:.91rem;
    height:.91rem;
    margin:.24rem 0 .2rem 0;
}
.reward-box .reward-content .box .content .item-box .text{
    height:.96rem;
    overflow-y: auto;
}
.reward-box .reward-content .two-box .content .item-box{
    width:40%;

}
.page5{
    margin-top:1.16rem;
}
.page5 .title-box img{
    width:5.93rem;
    height:.85rem;
}