.three_banner{
	background: url('https://resource.bangbangce.com/FzjPXRb8YmEH') no-repeat;
	background-size: 100% 100%;
	width: 100%;
	height: 11.34rem;
	position: relative;
}
.hed_fex{
	position: absolute;
	right: .12rem;
	top: 3.2rem;
	z-index: 9;
}
.hed_fex i{
	width: 1.12rem;
	height: 1rem;
	display: block;
}
.icon_relu{
	background: url('https://resource.bangbangce.com/3jzeGTwfn3md') no-repeat;
	background-size: 100% 100%;
}
.icon_order{
	background: url('https://resource.bangbangce.com/hXsQRTbsRxK4') no-repeat;
	background-size: 100% 100%;
	margin-top: .52rem;
}
.icon_title{
	padding: .88rem .5rem 0 .5rem;
	text-align: center;
}
.icon_title i{
	background: url('https://resource.bangbangce.com/CbzxDSbHS8hP') no-repeat;
	background-size: 100% 100%;
	width: 100%;
	height: 1.74rem;
	display: inline-block;
}
.twisting_box{
	padding: 0 .52rem;
}
.twisting_box .bg{
	background: url('https://resource.bangbangce.com/4tRXYCarR6Ft') no-repeat;
	background-size: 100% 100%;
	width: 100%;
	height: 7.9rem;
	position: relative;
}
.swper_box{
	position: absolute;
	left: 1.54rem;
	top: 1.09rem;
	height: .3rem;
	width: 3.3rem;
	text-align: center;
}
.swper_box .list_slider {
    overflow: hidden;
    height: 0.3rem;
	color: #fff;
}
.em_list{
	font-size: .2rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.em_list span{
	color: #FFF768;
	display: initial;
}
.draw_btn{
	background: url('https://resource.bangbangce.com/KKMK6RyiKEbT') no-repeat;
	background-size: 100% 100%;
	width: 3.04rem;
	height: 2.02rem;
	position: absolute;
	bottom: 1.5rem;
	left: 1.9rem;
	z-index: 3;
}
.draw_btn.on{
	background: url('https://resource.bangbangce.com/tY7zz2ijfF5s') no-repeat;
	background-size: 100% 100%;
	width: 3.04rem;
	height: 1.66rem;
	transform-origin: 50% 50% ;
}

.draw_btn:active{
	background: url('https://resource.bangbangce.com/tY7zz2ijfF5s') no-repeat;
	background-size: 100% 100%;
	width: 3.04rem;
	height: 1.66rem;
}


.draw_num{
	color: #fff;
	font-size: .32rem;
	font-weight: bold;
	position: absolute;
	left: .9rem;
	top: 6.8rem;
	height: 0.6rem;
	width: 1.86rem;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}
.draw_lottery{
	position: absolute;
	top: 6.44rem;
	right: 1.1rem;
	width: 1.3rem;
	height: 1.1rem;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.draw_lottery i{
	background: url('https://resource.bangbangce.com/KBQTXNXnzatB') no-repeat;
	background-size: 100% 100%;
	width: .85rem;
	height: .78rem;
	display: none;
}
.draw_lottery i.animation_on{	
	display: block;
	animation:cujpin 0.7s ease-out  forwards;
}
@keyframes cujpin{
	0%{ 
		transform:translateY(-60px);
	}
	100% {  
	    transform:translateY(0); 
	}
}

.ball_box{
	width: 4.4rem;
	height: 2.6rem;
	position: absolute;
	left: 1.04rem;
	top: 2rem;
	overflow: hidden;
}
.ball_box span{
	width: .85rem;
	height: .78rem;
	position: absolute;
}
.ball_box span.span_1{
	background: url('https://resource.bangbangce.com/Ay6TF8zXRxSa') no-repeat;
	background-size: 100% 100%;
	left: 0;
	bottom: 0;
}
.ball_box span.span_2{
	background: url('https://resource.bangbangce.com/ZJwa7kF7D8kb') no-repeat;
	background-size: 100% 100%;
	left: .16rem;
	bottom: .78rem;
}
.ball_box span.span_3{
	background: url('https://resource.bangbangce.com/sAAyhyGr63X4') no-repeat;
	background-size: 100% 100%;
	left: 1.6rem;
	bottom: .18rem;
	z-index: 3;
}
.ball_box span.span_4{
	background: url('https://resource.bangbangce.com/sraNFa6pYGpD') no-repeat;
	background-size: 100% 100%;
	left: .8rem;
	bottom: -.06rem;
}
.ball_box span.span_5{
	background: url('https://resource.bangbangce.com/drmMBXhik22k') no-repeat;
	background-size: 100% 100%;
	right: .5rem;
	bottom: .15rem;
	z-index: 1;
}
.ball_box span.span_6{
	background: url('https://resource.bangbangce.com/KBQTXNXnzatB') no-repeat;
	background-size: 100% 100%;
	left: 2.36rem;
	bottom: -.08rem;
}
.ball_box span.span_7{
	background: url('https://resource.bangbangce.com/wPACjRxhD667') no-repeat;
	background-size: 100% 100%;
	right: 1.1rem;
	bottom: .7rem;
}
.ball_box span.span_8{
	background: url('https://resource.bangbangce.com/te5mSFWzhHwX') no-repeat;
	background-size: 100% 100%;
	left: .9rem;
	bottom: .72rem;
}
.ball_box span.span_9{
	background: url('https://resource.bangbangce.com/aJyitbpNS5W3') no-repeat;
	background-size: 100% 100%;
	left: 1.7rem;
	bottom: 1rem;
}
.ball_box span.span_10{
	background: url('https://resource.bangbangce.com/6z2HEhsBJzjp') no-repeat;
	background-size: 100% 100%;
	right: .3rem;
	bottom: 1rem;
}
.ball_box span.span_11{
	background: url('https://resource.bangbangce.com/5yhmFkafGHsE') no-repeat;
	background-size: 100% 100%;
	left: 1rem;
	bottom: 1.52rem;
}
.ball_box span.span_12{
	background: url('https://resource.bangbangce.com/8fN2bxmk2J3k') no-repeat;
	background-size: 100% 100%;
	right: 1.12rem;
	bottom: 1.4rem;
}

.qiu_1{animation:dialuodn 1s linear 0.9s backwards;}
.qiu_2{animation:dialuodn 1s linear 0.6s backwards;}
.qiu_3{animation:dialuodn 1s linear 0.4s backwards;}
.qiu_4{animation:dialuodn 1s linear 1.1s backwards;}
.qiu_5{animation:dialuodn 1s linear 0.8s backwards;}
.qiu_6{animation:dialuodn 1s linear 0.4s backwards;}
.qiu_7{animation:dialuodn 1s linear 0.9s backwards;}
.qiu_8{animation:dialuodn 1s linear 1.1s backwards;}
.qiu_9{animation:dialuodn 1s linear 1.1s backwards;}
.qiu_10{animation:dialuodn 1s linear 0.2s backwards;}
.qiu_11{animation:dialuodn 1s linear 1.4s backwards;}
.qiu_12{animation:dialuodn 1s linear .6s backwards;}
/*掉落动画*/
@keyframes dialuodn {  
	0% {          
		transform:translateY(-200%); 
		opacity:0       
	}
	5% {       
	    transform:translateY(-200%);     
	}
	15% {  
	    transform:translateY(0);  
	}  
	30% {  
	    transform:translateY(-100%);  
	}  
	40% {      
	    transform:translateY(0%);    
	}
	50% {  
	    transform:translateY(-60%);  
	}  
	70% {  
	    transform:translateY(0%);  
	}  
	80% {  
	    transform:translateY(-30%);  
	}  
	90% {  
	    transform:translateY(0%);  
	}  
	95% {  
	    transform:translateY(-14%);  
	}  
	97% {  
	    transform:translateY(0%);  
	}  
	99% {  
	    transform:translateY(-6%);  
	}  
	100% {  
		transform:translateY(0);  
		opacity: 1;  
	}
} 

/*抽奖转动*/
.wieyi_1{animation:around1 1.5s linear infinite;}
.wieyi_2{animation:around2 1.5s linear infinite;}
.wieyi_3{animation:around3 1.5s linear infinite;}
.wieyi_4{animation:around4 1.5s linear infinite;}
.wieyi_5{animation:around5 1.5s linear infinite;}
.wieyi_6{animation:around6 1.5s linear infinite;}
.wieyi_7{animation:around7 1.5s linear infinite;}
.wieyi_8{animation:around8 1.5s linear infinite;}
.wieyi_9{animation:around9 1.5s linear infinite;}
.wieyi_10{animation:around10 1.5s linear infinite;}
.wieyi_11{animation:around11 1.5s linear infinite;}
.wieyi_12{animation:around12 1.5s linear infinite;}


@keyframes around1 {  
	0%{ transform:translate(0px,0px)  }
	20%{transform:translate(60px,-100px) }
	40%{transform:translate(80px,-60px) }
	60%{transform:translate(100px,-120px) }
	80%{transform:translate(0px,-20px) }
	100%{transform:translate(20px,40px) }
}


@keyframes around2 {  
0%{ transform:translate(0px,0px)  }
10%{transform:translate(80px,-120px) }
30%{transform:translate(60px,-80px) }
50%{transform:translate(40px,-100px) }
80%{transform:translate(0px,-10px) }
100%{transform:translate(30px,-10px) }
}



@keyframes around3 {  
0%{ transform:translate(0px,0px)  }
25%{transform:translate(70px,-290px) }
50%{transform:translate(320px,0px) }
80%{transform:translate(-20px,-290px) }
100%{transform:translate(290px,0px) }

}

@keyframes around4 {  
0%{ transform:translate(0px,0px)  }
12%{transform:translate(50px,20px) }
30%{transform:translate(-10px,-30px) }
60%{transform:translate(-40px,60px) }
80%{transform:translate(-10px,-30px) }
100%{transform:translate(-20px,60px) }

}



@keyframes around5 {  
0%{ transform:translate(0px,0px)  }
22%{transform:translate(-50px,-170px) }
46%{transform:translate(150px,145px) }
80%{transform:translate(200px,-115px) }
100%{transform:translate(-100px,145px) }
}




@keyframes around6 {  
0%{ transform:translate(0px,0px)  }
15%{ transform:translate(60px,40px)  }
30%{ transform:translate(-80px,-20px)  }
45%{ transform:translate(-40px,40px)  }
60%{ transform:translate(10px,-20px)  }
75%{ transform:translate(-80px,-20px)  }
100%{ transform:translate(10px,40px)  }

}


@keyframes around7 {  
0%{ transform:translate(0px,0px)  }
20%{ transform:translate(-60px,-10px)  }
40%{ transform:translate(90px,60px)  }
60%{ transform:translate(-20px,-40px)  }
80%{ transform:translate(60px,-60px)  }
100%{ transform:translate(-10px,-10px)  }

}


@keyframes around8 {  
0%{ transform:translate(0px,0px)  }
20%{ transform:translate(140px,-120px)  }
40%{ transform:translate(-140px,40px)  }
60%{ transform:translate(-180px,-240px)  }
80%{ transform:translate(100px,50px)  }
100%{ transform:translate(-180px,-220px)  }
}


@keyframes around9 {  
0%{ transform:translate(0px,0px)  }
30%{ transform:translate(-30px,-10px)  }
60%{ transform:translate(-50px,30px)  }
80%{ transform:translate(-10px,-40px)  }
100%{ transform:translate(-20px,10px)  }
}


@keyframes around10 {  
0%{ transform:translate(0px,0px)  }
15%{ transform:translate(-30px,-70px)  }
30%{ transform:translate(20px,-20px)  }
50%{ transform:translate(-50px,10px)  }
75%{ transform:translate(0px,-10px)  }
100%{ transform:translate(-30px,-30px)  }
}




@keyframes around11 {  
0%{ transform:translate(0px,0px)  }
32%{ transform:translate(-20px,-70px)  }
60%{ transform:translate(-30px,20px)  }
80%{ transform:translate(10px,-10px)  }
100%{ transform:translate(-60px,20px)  }

}





@keyframes around12 {  
0%{ transform:translate(0px,0px)  }
15%{ transform:translate(20px,40px)  }
30%{ transform:translate(-80px,-20px)  }
45%{ transform:translate(-40px,40px)  }
60%{ transform:translate(10px,-20px)  }
75%{ transform:translate(-80px,-20px)  }
100%{ transform:translate(10px,40px)  }

}



.three_conten{
	background: #EDCFF6;
	width: 100%;
	padding: 0 .32rem;
}
.task_seppd{
	background: url('https://resource.bangbangce.com/kDE7QJKyaTd7') no-repeat;
	background-size: 100% 100%;
	width: 100%;
	height: 3.42rem;
	position: relative;
	top: -.8rem;
}
.end_title{
	text-align: center;
	padding-top: .28rem;
}
.end_title i{
	background: url('https://resource.bangbangce.com/XZeGjD5iR3T2') no-repeat;
	background-size: 100% 100%;
	width: 2.54rem;
	height: .36rem;
	display: inline-block;
}
.end_box{
	text-align: center;
	padding-top: .32rem;
}
.end_box img{
	width: 2.49rem;
	height: 1.7rem;
}
.end_box p{
	color: #A6B3BB;
	font-size: .24rem;
	position: relative;
	top: -.35rem;
}
.complete{
	text-align: center;
	padding-top: 1.1rem;
}
.complete h3{
	color: #1C2760;
	font-size: .3rem;
	display: flex;
	align-items: center;
	justify-content: center;
}
.complete h3 i{
	background: url('https://resource.bangbangce.com/KBQTXNXnzatB') no-repeat;
	background-size: 100% 100%;
	width: .6rem;
	height: .6rem;
	display: inline-block;
}
.complete h3 span{
	color: #F52F6E;
}
.complete h3 b{
	font-weight: bold;
}
.complete p{
	color: #768892;
	font-size: .24rem;
	padding-top: .1rem;
}
.seppd_title{
	text-align: center;
	padding-top: .28rem;
}
.seppd_title i{
	background: url('https://resource.bangbangce.com/ZdrH8zs8MdXX') no-repeat;
	background-size: 100% 100%;
	width: 2.52rem;
	height: .36rem;
	display: inline-block;
}
.progress_bar{
	padding: .4rem .52rem .32rem .52rem;
}
.progress_bar section{
	width: 100%;
	position: relative;
}
.progress_bar ul{
	display: flex;
	position: relative;
}
.progress_bar ul::after{
	content: "";
	border-radius: 16px;
	position: absolute;
	left: 0;
	top: .7rem;
	width: 94%;
	height: .26rem;
	background: linear-gradient( 180deg, #F5E7D9 0%, #FBF2ED 100%);
}
.progress_bar ul li{
	flex: 1;
	text-align: right;
	position: relative;
	height: .26rem;
}
.progress_bar ul li span{
	background: url('https://resource.bangbangce.com/CEGS3BEA3Sjc') no-repeat;
	background-size: 100% 100%;
	width: 1.04rem;
	height: .48rem;
	line-height: .4rem;
	display: inline-block;
	text-align: center;
	font-size: .24rem;
	color: #fff;
}
.progress_bar ul li em{
	position: absolute;
	top: .62rem;
	left: 1.2rem;
	z-index: 9;
	background: #D8C8C8;
	box-shadow: 0px 4px 8px 0px rgba(211,66,66,0.3);
	text-align: center;
	line-height: initial;
	border-radius: 50%;
	border: 4px solid #FFFBF2;
	width: .4rem;
	height: .4rem;
	color: #fff;
	font-size: .2rem;
}
.progress_bar ul li:last-child span{
	/* position: relative;
	left: .4rem; */
}
.progress_bar ul li:last-child em{
	/* left: 1.6rem; */
}
.progress_bar ul li.on::after {
	content: "";
	
}
.progress_bar ul li.on span{
	background: url('https://resource.bangbangce.com/bmBPZpX6kNp5') no-repeat;
	background-size: 100% 100%;
}
.progress_bar ul li.on em{
	background: #41C9FF;
}
.xian,
.xian2{
	position: absolute;
	left: 0;
	top: .7rem;
	width: 0%;
	height: .26rem;
	z-index: 3;
	background: linear-gradient( 180deg, #FF70BD 6%, #FC349F 96%);
	border-radius: 16px;
	border: 2px solid #FFFFFF;
}
.xian2{
	/* animation:xian2 1.5s linear infinite; */
}

.seppd_text{
	text-align: center;
	color: #BDA183;
	font-size: .22rem;
	padding-top: .8rem;
}

.tabs_prize{
	background: #fff;
	padding: .24rem .32rem;
	border-radius: 12px;
	position: relative;
	top: -.5rem;
}
.tabs_prize .title{
	background: url('https://resource.bangbangce.com/eNPhP2zrKGBz') no-repeat;
	background-size: 100% 100%;
	width: 5.18rem;
	height: .76rem;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 .06rem;
}
.tabs_prize .title span{
	width: 2.56rem;
	height: .64rem;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #806161;
	font-size: .3rem;
}
.tabs_prize .title span.on{
	background: url('https://resource.bangbangce.com/eJsrdD58N357') no-repeat;
	background-size: 100% 100%;
	color: #FFFFFF;
}

.tabs_lit{
	height: 8rem;
}
.shop_lit{
	padding: .32rem 0 .12rem 0;
	display: grid;
	gap: 10px;
	grid-template-columns: 1fr 1fr 1fr;
}
.shop_lit li{
	text-align: center;
}
.shop_lit li img{
	width: 1.92rem;
	height: 1.92rem;
	border-radius: 12px;
    object-fit: fill;
}
.shop_lit li p{
	width: 1.92rem;
	color: #323232;
	font-size: .26rem;
	font-weight: bold;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.not_lit{
	text-align: center;
	padding-top: 2.5rem;
}
.not_lit img{
	width: 2.8rem;
	height: 1.72rem;
}
.not_lit p{
	color: #BCC3C2;
	font-size: .26rem;
	position: relative;
	top: -.2rem;
}
.record_lit ul{
	overflow: scroll;
	height: 7.5rem;
}
.record_lit ul li{
	display: flex;
	border-bottom: 1px solid #EFEFEF;
	padding: .32rem 0;
}
.record_lit ul li .tst{
	flex: 1;
}
.record_lit ul li .tst p{
	color: #717171;
	font-size: .3rem;
}
.record_lit ul li .tst b{
	color: #1F1F1F;
	font-weight: normal;
}
.record_lit ul li .tst span{
	color: #999999;
	font-size: .24rem;
}
.record_lit ul li a{
	color: #A3A3A3;
	font-size: .3rem;
}
.record_lit ul li a.on{
	color: #26C9FF;
}
.msde{
	color: #C0C0C0;
	font-size: .22rem;
	text-align: center;
	padding-top: .12rem;
}

.footer_rule{
	background: #fff;
	padding: 0.24rem 0.32rem;
	border-radius: 12px;
	position: relative;
	top: -0.2rem;
}
.footer_rule .title{
	text-align: center;
	padding-top: 0.04rem;
}
.footer_rule .title i{
    background: url(https://resource.bangbangce.com/dX7zfheDpZzm) no-repeat;
    background-size: 100% 100%;
    width: 1.88rem;
    height: 0.36rem;
    display: inline-block;
}
.footer_rule ul li{
	display: flex;
	padding-top: .3rem;
}
.footer_rule ul li i{
	width: .06rem;
	height: .34rem;
	background: #41C9FF;
	display: inline-block;
	position: relative;
	top: .08rem;
}
.footer_rule ul li div{
	flex: 1;
	padding-left: .16rem
}
.footer_rule ul li div h3{
	color: #615252;
	font-weight: normal;
	font-size: .36rem;
}
.footer_rule ul li div p{
	color: #A1A1A1;
	font-size: .24rem;
}

.rule_box{
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 901;
	width: 6rem;
}
.rule_box .footer_rule{
	top: 0;
	padding-bottom: .64rem;
}
.icon_close{
	text-align: center;
	padding-top: .32rem;
}
.icon_close i{
	background: url(https://resource.bangbangce.com/rGkrWs3dB7dZ) no-repeat;
	background-size: 100% 100%;
	width: .64rem;
	height: 0.64rem;
	display: inline-block;
}



.lottery_box{
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 901;
}
.lottery_box .bg{
	background: url(https://resource.bangbangce.com/p6BRchmhXTEz) no-repeat;
	background-size: 100% 100%;
	width: 7.24rem;
	height: 8.62rem;
	padding: 2.42rem 1.68rem 0 1.72rem;
	text-align: center;
}
.lott_title i{
	background: url(https://resource.bangbangce.com/QeBaNW2syxhT) no-repeat;
	background-size: 100% 100%;
	width: 3.84rem;
	height: .36rem;
	display: inline-block;
}
.lottery_box .bg .txt{
	color: #982833;
	font-size: .28rem;
}
.lottery_box .bg img{
	width: 1.92rem;
	height: 1.92rem;
	border-radius: 8px;
	object-fit: cover;
	margin-top: .32rem;
}
.lottery_box .bg p{
	color: #BDA183;
	font-size: .24rem;
	padding-top: .22rem;
}
.lottery_box .bg_2 .img{
	display: flex;
	align-items: center;
	justify-items: center;
	padding-top: .32rem;
}
.lottery_box .bg_2 .img i{
	background: url(https://resource.bangbangce.com/ZyFeGPJQpT4s) no-repeat;
	background-size: 100% 100%;
	width: .42rem;
	height: .6rem;
	display: inline-block;
	margin: 0 .1rem;
}
.lottery_box .bg_2 .img img{
	margin-top: 0;
}
.btn_accept{
	background: url(https://resource.bangbangce.com/DYCRTsYiS6dQ) no-repeat;
	background-size: 100% 100%;
	width: 3.14rem;
	height: 1.18rem;
	line-height: .8rem;
	display: inline-block;
	color: #fff !important;
	font-size: .32rem;
	font-weight: bold;
	margin-top: .32rem;
}
.btn_copy{
	background: url(https://resource.bangbangce.com/DYCRTsYiS6dQ) no-repeat;
	background-size: 100% 100%;
	width: 3.14rem;
	height: 1.18rem;
	line-height: .8rem;
	display: inline-block;
	color: #fff !important;
	font-size: .28rem;
	font-weight: bold;
	margin-top: .32rem;
	position: relative;
}
.btn_copy i{
	position: absolute;
	right: 0;
	top: -.18rem;
	background: #FF59B0;
	padding: 1px .2rem;
	border-radius: 30px 20px 20px 1px;
	color: #fff !important;
	font-size: .18rem;
	line-height: initial;
	display: flex;
	align-items: center;
	justify-content: center;
}