@charset "utf-8";

/*  */
#wrap #game #timer{width: 40px;height: 40px;top: 30px;left: 20px;position:absolute;z-index: 5;border-radius: 50%;border: 3px solid #152c74;line-height: 40px;background-color: #fff;}
#wrap #game #timer em{color:#152c75;font-size: 24px;font-weight: 800;text-align: center; display: block;width: 100%;height: 100%;box-sizing: border-box;}

#wrap #game #bar{width: 40%;height: 22px;top: 39px;left:60px;background-color: #152c75;overflow: hidden;border: 3px solid #152c75;border-radius: 0 15px 15px 0;z-index: 4;}
#wrap #game #bar span{border-radius: 0 15px 15px 0; display: block;width: 100%;height:100%;top:0px;left: 0%; background-image: url('https://dbins2.speedgabia.com/jjansun/images/game_timer_gauge.png'); background-size: contain; background-repeat: repeat-x; overflow: hidden;position: absolute;}

#wrap #game #score{top: 20px;right: 20px;font-weight: bold;z-index: 10;text-align: center;}
#wrap #game #score span{font-size:17px; color:#484848; display: block;}
#wrap #game #score em{font-size: 27px; width:85px; padding:3px 0px; letter-spacing:2px; line-height:30px; border-radius:30px; text-shadow: -2px 0 #456c19, 0 2px #456c19, 2px 0 #456c19, 0 -2px #456c19; color:#e9fc47; background-color: #86d3de; display: block; }

#game .wrap .txt1{display:none; width:57%; height:11.2%; top:56.7%; left:21%; position: absolute;}
#game .wrap .txt1 span{display:none;}

#game .wrap #area{width: 92%;height: 13%;top: 42%;left: 3.5%; overflow: hidden; position: absolute;border: 3px solid #ffffff;background-color: #ffffffc4;border-radius: 15px;}
#game .wrap #area .item{width: 13%;height: 74%;top: 13%;left: 0%;position: absolute;z-index: 3;}
#game .wrap #area .item span{position: absolute; width:100%; height:100%; top:0%; left:0%; background-repeat: no-repeat; background-size: contain;}
#game .wrap #area .item span.item1{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game11/item1.png');}
#game .wrap #area .item span.item2{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game11/item2.png');}
#game .wrap #area .item span.item3{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game11/item3.png');}
#game .wrap #area .item span.trick{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game11/bomb.png');}

#game .character{top:31%; position: absolute;}
 

#game .wrap #area #hand{width: 16%;height: 100%;top: 0%;left: 74%;position: absolute;z-index:5;cursor:pointer;}
#game .wrap #area #hand span{width: 75%;height: 51%;top: 20%;left: 5%;position: absolute;z-index:2;background-repeat: no-repeat;background-size: contain;background-color: #005bff; opacity: 0.7; border-radius: 50%;border: 3px solid #fff;}
#game .wrap #area #hand span .hit{width: 100%;height: 70%;top: 15%;left: 0%;position: absolute;border-radius: 50%;}
#game .wrap #area #hand em{width: 118%;height: 81%;top: 7.5%;left: -13%;position: absolute;background-repeat: no-repeat;background-size: contain;}
#game .wrap #area #hand em.click{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game11/game_area_click.png');}
#game .wrap #area #hand em.correct{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game11/game_area_click_correct.png');}
#game .wrap #area #hand em.incorrect{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game11/game_area_click_incorrect.png');}
#game .wrap .handObj{display:none; animation: hand 1s ease infinite; position: absolute;top: 50%;z-index: 5;width: 15%;right:11%;}

@keyframes hand {
	0%{transform: translateY(0);}
	60% {transform: translateY(10px);}
	100% {transform: translateY(0);}
}