﻿@charset "utf-8";

/* 캐치캐치 */
#bgContainer{position: absolute; width:auto; height:100%; top:0; left: 0%; z-index: 1;}
#bgContainer span{position: absolute; width:auto; height:100%; top:0; left: 0; }
#bgContainer img{ width: auto; height:100%; }
#bgContainer .item1{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game10/item1.png');display: block; width: 4%;height: 7%;background-size: contain; background-repeat: no-repeat;}
#bgContainer .item2{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game10/item2.png');display: block; width: 4%;height: 8%;background-size: contain; background-repeat: no-repeat;}
#bgContainer .rock{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game10/rock.png');display: block; width: 4%;height: 5%;background-size: contain; background-repeat: no-repeat; z-index: 2;}
#bgContainer .rock .hit{position: absolute; width: 67%; height: 70%; left: 15%; top: 15%;}

#wrap #game{position: relative;}
#wrap #game .wrap{width:100%;height: 100%;top: 0%;left:0%;}

#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; }

#wrap #game #bee{z-index: 99;transition: all .3s; top: 20%;left: 7%;width: 30%;height: 11.5%; transform: rotate(15deg); display:none;}
#wrap #game #bee span{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game10/bee0.png'); background-size: contain; background-position: center; background-repeat: no-repeat; position: absolute; width:100%; height:100%; top:0%; left:0%;}
#wrap #game #bee span.get{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game10/bee1.png');}
#wrap #game #bee span.clash{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game10/bee2.png');}
#wrap #game #bee span .hit{width: 43%;height: 80%;background-color:red;position:absolute;left: 29%;top: 15%;opacity: 0;}

#wrap #game #txt{top:39%;left:0%; width:100%; height:13%; display: none; z-index: 20;}
#wrap #game #txt span{background-size: contain; background-position: center; background-repeat: no-repeat; position: absolute; width:100%; height:100%; top:0%; left:0%;}
#wrap #game #txt span.get{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game10/game_txt_get.png'); }
#wrap #game #txt span.clash{background-image: url('https://dbins2.speedgabia.com/jjansun/images/game10/game_txt_clash.png'); }

#wrap #game #bonus{top:27%; left:0%; display: none; z-index: 100;}
#wrap #game #bonus img{width:80%;}

