choujiang.wxss 4.4 KB
page{
	width:100%;
	height:100vh
}
.remaincishu{
		color:#FB5A44;
		font-size: 32rpx;
		font-weight: bold;
		position: absolute;
		top:476rpx;
		left:228rpx;
		letter-spacing: 2rpx;
}
.chouimg{
	width:100%;
	/* height:100vh; */
	position: relative;
/* background:url('https://binhai.w.broing.cn/image/b22ca3fa145158a572f9bf6953bfaab.png')no-repeat center;
background-size:100% 100%; */

	
	
}
image{
	width:100%;
	height:100%;
}

.box{ width: 566rpx; height:472rpx; margin: 0 auto; box-sizing: border-box; position: relative;


}
.pagebox{
	position: absolute;
	top:599rpx;
	left:92rpx;
}
.list{ width: 185rpx; height: 153rpx; position: absolute; background-color: transparent;
	display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-content: center; align-items: center;
	border-radius: 20rpx;
	display:flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
/* 抽奖过程中选定样式 */
.list.change_in{ color: #fff; background-color: #3D9AF9;}
.list_t{ width: 89rpx; height: 96rpx;}
.list_t image{ width: 100%; height: 100%;}
.list_b{ width: 90%;  text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
color:#DA321B;
font-size: 20rpx;
font-weight: bold;
}
/* 根据TOP */
.list:nth-child(1){ left: 50%; top: 50%; color: #fff; background-color: #1CBBB4;
	display: flex; justify-content: center; align-content: center; align-items: center;
	-webkit-transform: translate(-50%,-50%);
			transform: translate(-50%,-50%);
}
.list.grey:nth-child(1){ background-color: #5F9EA0;}
.list:nth-child(2) , .list:nth-child(3) , .list:nth-child(4){ top: 0;}
.list:nth-child(6) , .list:nth-child(7) , .list:nth-child(8){ bottom: 0;}
.list:nth-child(5) , .list:nth-child(9){ top: 50%;
	-webkit-transform: translateY(-50%);
			transform: translateY(-50%);
}
/* 根据LEFT */
.list:nth-child(2) , .list:nth-child(8) , .list:nth-child(9){ left: 0;}
.list:nth-child(3) , .list:nth-child(7){ left: 50%;
	-webkit-transform: translateX(-50%);
			transform: translateX(-50%);
}
.list:nth-child(4) , .list:nth-child(5) , .list:nth-child(6){ right: 0;}

/* 中奖名单 */
.zhongtitle{
	display:flex;
	align-items: center;
	justify-content: center;
}
.zhongleft{
	color:#FB5A44;
	font-size: 32rpx;
	font-weight: bold;
}
.zhongright{
	color:#333;
	font-size: 32rpx;
	font-weight: bold;
}
.zhonglist{
	position: absolute;
	bottom:52rpx;
	left:52rpx;
	width:640rpx;

}
.zhongboxitem{
	display:flex;
	align-items: center;
	justify-content: space-around;
	margin-bottom:12rpx
}
.zhongtou{
	width:52rpx;
	height:52rpx;
	font-size: 0;
	border-radius: 50%;
	margin-right:22rpx;
}
.zhongtou image{
	width:100%;
	height:100%;
	border-radius: 50%;
}
.zhongname{
	/* width:173rpx; */
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color:#333;
	font-size: 24rpx;
}
.zhongmiddle{
	color:#FB5A44;
	font-size: 24rpx;
}
.zhongrightk{
	color:#333;
	font-size: 24rpx;
}
.zhongbox{
	padding: 20rpx;
	box-sizing: border-box;
	border: 4rpx solid #FB5A44;
	border-radius: 20rpx;
	margin-top: 20rpx;
	height:300rpx;
	overflow-y: scroll;
}
.prise{
	width:640rpx;
	display:flex;
	align-items: center;
	justify-content: space-between;
	position: absolute;
	bottom:-23rpx;
	left:52rpx;
}
.priseleft{
	width:72rpx;
	height:72rpx;
	background:#FD3217;
	border-radius: 50%;
	display:flex;
	align-items: center;
	justify-content: center;
}
.priseleft image{
	width:38rpx;
	height:38rpx;
}
.jilu{
	display:flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.priseright{
	width:72rpx;
	height:72rpx;
	background:#3D9AF9;
	border-radius: 50%;
	display:flex;
	align-items: center;
	justify-content: center;
}
.priseright image{
		width:38rpx;
		height:38rpx;
}
.zhongjilu{
		color:#FD3217;
		font-size: 28rpx;
}
.huodongrule{
	color:#3D9AF9;
	font-size: 28rpx;
}
.daowrap{
	width:100%;
	height:100%;
	position: relative;
	z-index:-2;


}
.daojitime{
	display:flex;
	align-items: center;

	z-index: 999;
	color:#fff;
	font-size: 40rpx;
	
}
.hourday{
	position: absolute;
	top:415rpx;
	left:172rpx;
}
.hourhour{
	position: absolute;
	top:415rpx;
	left:285rpx;
}
.hourminute{
	position: absolute;
	top:415rpx;
	left:394rpx;
}
.hoursecond{
	position: absolute;
	top:415rpx;
	left:509rpx;
}
.anniu{
	width:305rpx;
	height:121rpx;
	font-size: 0;
	position: absolute;
	bottom:306rpx;
	left:235rpx;
}
.chahao{
	width:78rpx;
	height:78rpx;
	font-size: 0;
	position: absolute;
	bottom:120rpx;
	left:340rpx;
}