/* game_box */
.game_box { position: relative; }

/* lotteryBox */
.luckdraw { padding: 13% 0; width: 100%; background: url(../img/img_bg.jpg) no-repeat 50% / cover; border-radius: 10px; }
.luckdraw ul { overflow: hidden; position: relative; margin: auto; width: 539px; height: 539px; }
.luckdraw li { width: 131px; height: 131px; background: url(../img/icon_prize_bg.png) no-repeat 50%; display: flex; justify-content: center; align-items: center; transition: none; -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; }
.luckdraw li:before { position: absolute; width: 100%; height: 100%; display: block; top: 0; left: 0; content: ""; transition: none; -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; }
.luckdraw li.on:before { background: url(../img/icon_prize_bg_h.png) no-repeat 50%; }
.luckdraw li img { position: relative; }
.luckdraw_go { position: absolute; width: 255px; height: 252px; cursor: pointer; top: 50%; left: 50%; -webkit-transform: translate(-50%, -48%); transform: translate(-50%, -48%); }

/* bonus_info */
#bonus_info { margin: 25px 0; padding: 30px 40px; background: #ccc; border: 9px #eee solid; border-radius: 10px; }
#bonus_info h3 { font-size: 33px; }
#bonus_info ul { margin-top: 25px; display: grid; grid-template-columns: repeat(6, 1fr); grid-gap: 25px; }
#bonus_info ul li { background: #fff; }
#bonus_info ul li font { padding: 2px 0; background: #fdb413; display: block; text-align: center; font-weight: 600; font-size: 24px; color: #fff; }

/* win_box */
#win_box { border-radius: 10px; }

/* prizerecord */
#prizerecord { margin: 30px auto 0; width: 700px; }

@media screen and (max-width: 800px) {
	#prizerecord { width: 95%; }
}
@media screen and (max-width: 768px) {
	.luckdraw ul { width: 500px; }
	.luckdraw li { width: 120px; height: 120px; background-size: cover; }
	.luckdraw_go { width: 240px; height: 240px; }
	#bonus_info h3 { font-size: 25px; }
	#bonus_info ul { grid-gap: 15px; }
	#bonus_info ul li font { padding: 0; font-weight: 400; font-size: 16px; }
	#bonus_info { padding: 20px 15px; }
	#bonus_info ul { grid-gap: 15px; }
}
@media screen and (max-width: 640px) {
	.luckdraw ul { width: 90vw; }
	.luckdraw li { width: 18vw; height: 18vw; }
	.luckdraw_go { width: 36vw; height: 36vw; }
	#bonus_info ul { grid-template-columns: repeat(4, 1fr); }
}
@media screen and (max-width: 480px) {
	#bonus_info { padding: 10px 0; }
	#bonus_info ul { padding: 0 10px; }
}