#wrap{  display:block;background-color:#315911;  position: relative; margin:30px 0;/*overflow: hidden;*/}
#wrap #gameContainer{width:100%; min-height:1170px; background:url('./mimg/roul_bg_moon_m.png') no-repeat; background-size:100%; position: relative; }
#wrap #gameContainer:after{content:""; display:block; clear:both;}
#wrap #gameContainer h1{}
#wrap #gameContainer .obj{position: absolute;}
#wrap #gameContainer .board_start{  
    text-align: center;
    vertical-align: middle; 
	cursor:pointer;
	position:absolute; left:100px; top:100px;z-index:9;
	width:100px;

 }
 .bg_rabbit{position:absolute; top:-24px; left:-25px; width:45%; z-index:8;}
#wrap #gameContainer .roulette_wrap{position:absolute; width:300px; height:300px; top:358px; left:calc(50% - 150px); z-index: 3;   /*box-shadow: 1px 0px 15px rgb(5 43 51 / 36%);*/ border-radius: 50%; }
#wrap #gameContainer .board_arrow{position:absolute; left:calc(50% - 12.5px ); top:-10px;z-index:9; width:25px;}
#wrap #gameContainer .board_arrow img{width:100%;}
#wrap #gameContainer .board_start
img{width:100%;}
#wrap #gameContainer .board_bg{width:300px; height:300px; top:0; left:0px; z-index: 2;}
#wrap #gameContainer .board_bg img{width:100%;}
#wrap #gameContainer .board_on{width:300px; height:300px; top:0; left:0px; z-index: 3; background-image: url('./mimg/bg_moon.png');    background-size: contain;
 border-radius:50%;}
#wrap #gameContainer .board_on img{position:absolute; width:60px;top:0; height:auto;}

#wrap #gameContainer .board_on img:nth-child(1){    left: 82px;  transform: rotate( -60deg );  top: 34px;}
#wrap #gameContainer .board_on img:nth-child(2){left: 23px;  transform: rotate( -100deg );  top: 80px;  }
#wrap #gameContainer .board_on img:nth-child(3){  left: 27px;  top: 163px; transform: rotate(-140deg);}  
#wrap #gameContainer .board_on img:nth-child(4){left: 84px; top: 211px;  transform: rotate(-185deg);}
#wrap #gameContainer .board_on img:nth-child(5){ left: 156px;  top: 207px;  transform: rotate(-232deg);   }
#wrap #gameContainer .board_on img:nth-child(6){  left: 211px;  top: 157px;  transform: rotate(-270deg); }  
#wrap #gameContainer .board_on img:nth-child(7){ left: 211px;  top: 85px;  transform: rotate(-320deg);   }
#wrap #gameContainer .board_on img:nth-child(8){  left: 160px;  top: 20px;  transform: rotate(3deg); }  

#wrap #gameContainer .obj.board_arrow{width:90px; height:105px; top:0px; left:195px; z-index: 5;}
#wrap #gameContainer .char1{width:259px; height:246px; top:400px; left:90px; z-index: 1;}
#wrap #gameContainer .char2{width:175px; height:198px; top:449px; left:600px; z-index: 1;}
#wrap #gameContainer .char3{width:112px; height:108px; top:540px; left:550px; z-index: 3;}
#wrap #gameContainer .txt1{width:420px; height:30px; bottom:20px; left:260px; z-index: 3;}

.revent_bottom{position: absolute;bottom: 0;left: 0;width: 100%;}
.revent_bottom img{width:80%;}
.board_real {text-align: center;padding: 0 0 30px 0;}
.roul_info{ padding: 20px;box-sizing: border-box;}
.roul_info ul{margin-bottom:18px;}
.roul_info ul:last-child{margin:0;}
.roul_info li{color: #fff;font-size: 12px; line-height: 18px; font-weight: normal; padding: 1px 0 1px 5px;}
.roul_info h4{font-weight:700; font-size: 12px;background: #236130; color:#fff; width: auto;display: inline-block;padding: 5px 10px;border-radius: 50px; box-sizing:border-box; margin-bottom:5px;} 

.rpopup {display: none; position: fixed; left: 50%; z-index: 99999; text-align: center;}
#fade {display: none;background: #000;position: fixed;left: 0;top: 0;width: 100%;height: 100%;opacity: .60;z-index: 9999;}
#popup_gift{width:300px; height:300px; position:fixed;top:30%;}
#popup_gift .lottery_present {text-align:center;}
#popup_gift .lottery_present img{ display:block; width:100%}
#popup_gift .lottery_present .txt_fail {margin-top:30%; color:#fff;font-weight:bold;}
#popup_fail{width:300px; height:300px; top:120px;}
.rpopup  .rclose{ position: absolute;bottom: 130px;left: 0;display: block;width: 100%;height: 100%;top: 0;} 


@media all and (min-width:1024px){
	#wrap #gameContainer{min-height:1900px;}
	#wrap #gameContainer .roulette_wrap{top:45%; left:calc(50% - 250px); width:500px; height:500px;}
	#wrap #gameContainer .board_bg{width:500px; height:500px; top:0; left:0px; z-index: 2;}
	#wrap #gameContainer .board_on{width:500px; height:500px; top:0; left:0px; z-index: 3; background-image: url('./mimg/bg_moon.png');    background-size: contain;
	 border-radius:50%;}
	#wrap #gameContainer .board_start{left:calc(50% - 75px); top:calc(50% - 75px); width:150px;}
		
	#wrap #gameContainer .board_on img{width:95px}
	#wrap #gameContainer .board_on img:nth-child(1){    left: 135px;  transform: rotate( -60deg );  top: 54px;}
	#wrap #gameContainer .board_on img:nth-child(2){left: 47px;  transform: rotate( -100deg );  top: 142px;  }
	#wrap #gameContainer .board_on img:nth-child(3){  left: 37px;  top: 265px; transform: rotate(-140deg);}  
	#wrap #gameContainer .board_on img:nth-child(4){left: 140px; top: 348px;  transform: rotate(-185deg);}
	#wrap #gameContainer .board_on img:nth-child(5){ left: 255px;  top: 344px;  transform: rotate(-232deg);   }
	#wrap #gameContainer .board_on img:nth-child(6){  left: 358px;  top: 263px;  transform: rotate(-270deg); }  
	#wrap #gameContainer .board_on img:nth-child(7){ left: 352px;  top: 142px;  transform: rotate(-320deg);   }
	#wrap #gameContainer .board_on img:nth-child(8){  left: 272px;  top: 45px;  transform: rotate(3deg); }  

	.roul_info ul {
		margin-bottom: 18px;
		display: inline-block;
		vertical-align: top;
		width: 45%;
	}

}

@media all and (min-width:768px) and (max-width:1023px) {
	#wrap #gameContainer{min-height:1700px;}
	#wrap #gameContainer .roulette_wrap{top:35%; left:calc(50% - 250px); width:500px; height:500px;}
	#wrap #gameContainer .board_bg{width:500px; height:500px; top:0; left:0px; z-index: 2;}
	#wrap #gameContainer .board_on{width:500px; height:500px; top:0; left:0px; z-index: 3; background-image: url('./mimg/bg_moon.png');    background-size: contain;
	 border-radius:50%;}
	#wrap #gameContainer .board_start{left:calc(50% - 50px); top:calc(50% - 50px)}
	
#wrap #gameContainer .board_on img{width:95px}
#wrap #gameContainer .board_on img:nth-child(1){    left: 135px;  transform: rotate( -60deg );  top: 54px;}
#wrap #gameContainer .board_on img:nth-child(2){left: 47px;  transform: rotate( -100deg );  top: 142px;  }
#wrap #gameContainer .board_on img:nth-child(3){  left: 37px;  top: 265px; transform: rotate(-140deg);}  
#wrap #gameContainer .board_on img:nth-child(4){left: 140px; top: 348px;  transform: rotate(-185deg);}
#wrap #gameContainer .board_on img:nth-child(5){ left: 255px;  top: 344px;  transform: rotate(-232deg);   }
#wrap #gameContainer .board_on img:nth-child(6){  left: 358px;  top: 263px;  transform: rotate(-270deg); }  
#wrap #gameContainer .board_on img:nth-child(7){ left: 352px;  top: 142px;  transform: rotate(-320deg);   }
#wrap #gameContainer .board_on img:nth-child(8){  left: 272px;  top: 45px;  transform: rotate(3deg); }  


}


@media all and (min-width:480px) and (max-width:767px) {
  #wrap #gameContainer{min-height:1350px;}
  #wrap #gameContainer .roulette_wrap{top:422px;}

}


@media screen and (max-width: 380px) {
  #wrap #gameContainer .roulette_wrap{top:320px;}
}


