@charset "utf-8";

/* 틀린그림찾기 */

#game { position:relative; width: 100%; height: 100%; } 

#wrap #game #score{top: 8px;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 #timer{width: 40px;height: 40px;top: 19px;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: 29px;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 #life {width: 6%;height: 23%;left: 2%;top: 45%;} 
#wrap #game #life span {background-image: url(https://dbins2.speedgabia.com/jjansun/images/game15/life.png);display:block;height: 27%;width: 100%;background-repeat: no-repeat;background-size: contain;} 
#wrap #game #life span.life2{margin: 10px 0;}

#wrap #game #gameBoard { width: 82%; height: 83%; top: 15%; left: 9%; } 
#wrap #game #gameBoard .board { width: 100%; height: 45%; background-size: contain; background-repeat: no-repeat; box-shadow: 0 0 0 2px #6e6256 inset; } 
#wrap #game #gameBoard .board.top { top: 0%; } 
#wrap #game #gameBoard .board.bottom { bottom: 3%; } 
#wrap #game #gameBoard .txt { top: 46%; font-weight: 400; font-size: 13px; width:100%; left:0px;} 
#wrap #game #gameBoard .spot{z-index: 999;}
/* #wrap #game #gameBoard .spot em { display: none; background-image: url(https://dbins2.speedgabia.com/jjansun/images/game15/correct.png); width: 100%; height: 100%; background-size: contain; background-repeat: no-repeat; background-position: center; }  */
#wrap #game #gameBoard .spot em { display: none; width:24px; height:24px; top:50%; left:50%; margin:-12px 0 0 -12px; border: 3px solid #ff0000; border-radius: 50%; position: absolute; box-shadow: 1px 1px 3px 1px #000000;} 
#wrap #game #gameBoard .spot.correct em { display:block; } 
#wrap #game #gameBoard #cover{width:100%; height:100%; z-index: 998;}

#wrap #game.mon #gameBoard .board.top { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game1-1.jpg); } 
#wrap #game.mon #gameBoard .board.bottom { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game1-2.jpg); } 
#wrap #game.tue #gameBoard .board.top { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game2-1.jpg); } 
#wrap #game.tue #gameBoard .board.bottom { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game2-2.jpg); } 
#wrap #game.wed #gameBoard .board.top { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game3-1.jpg); } 
#wrap #game.wed #gameBoard .board.bottom { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game3-2.jpg); } 
#wrap #game.thu #gameBoard .board.top { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game4-1.jpg); } 
#wrap #game.thu #gameBoard .board.bottom { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game4-2.jpg); } 
#wrap #game.fri #gameBoard .board.top { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game5-1.jpg); } 
#wrap #game.fri #gameBoard .board.bottom { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game5-2.jpg); } 
#wrap #game.sat #gameBoard .board.top { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game6-1.jpg); } 
#wrap #game.sat #gameBoard .board.bottom { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game6-2.jpg); } 
#wrap #game.sun #gameBoard .board.top { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game7-1.jpg); } 
#wrap #game.sun #gameBoard .board.bottom { background-image:url(https://dbins2.speedgabia.com/jjansun/images/game15/game7-2.jpg); } 

/* 월요일 */
#wrap #game.mon .board.bottom .spot1 { width: 14%; height: 20%; left: 1%; top: 15%; } 
#wrap #game.mon .board.bottom .spot2 { width: 25%; height: 23%; left: 16%; top: 8%; transform: rotate(-23deg); } 
#wrap #game.mon .board.bottom .spot3 { width: 7%; height: 31%; left: 52%; top: -4%; transform: rotate(-44deg); } 
#wrap #game.mon .board.bottom .spot4 { width: 10%; height: 20%; right: 2%; top: 13%; } 
#wrap #game.mon .board.bottom .spot5 { width: 15%; height: 13%; top: 36%; left: 30%; } 
#wrap #game.mon .board.bottom .spot6 { width: 9%; height: 12%; left: 10%; top: 58%; } 
#wrap #game.mon .board.bottom .spot7 { width: 15%; height: 16%; left: 41%; top: 70%; } 
#wrap #game.mon .board.bottom .spot8 { width: 8%; height: 18%; right: 10%; top: 68%; transform: rotate(45deg); } 
#wrap #game.mon .board.bottom .spot9 { width: 13%; height: 12%; left: 39%; bottom: 0%; } 
#wrap #game.mon .board.bottom .spot10 { width: 38%; height: 13%; right: 0%; bottom: 0%; } 

/* 화요일 */
#wrap #game.tue .board.bottom .spot1 { width: 33%; height: 20%; left: -1%; top: -1%; transform: rotate(-32deg); } 
#wrap #game.tue .board.bottom .spot2 { width: 15%; height: 15%; left: 27%; top: 10%; } 
#wrap #game.tue .board.bottom .spot3 { width: 16%; height: 14%; top: 28%; left: 62%; } 
#wrap #game.tue .board.bottom .spot4 { width: 7%; height: 13%; top: 24%; right: 13%; } 
#wrap #game.tue .board.bottom .spot5 { width: 9%; height: 8%; top: 43%; right: 10%; } 
#wrap #game.tue .board.bottom .spot6 { width: 8%; height: 10%; left: 49%; top: 51%; } 
#wrap #game.tue .board.bottom .spot7 { width: 14%; height: 7%; top: 67%; left: 41%; } 
#wrap #game.tue .board.bottom .spot8 { width: 20%; height: 11%; top: 73%; left: 58%; } 
#wrap #game.tue .board.bottom .spot9 { width: 10%; height: 18%; left: 33%; top: 72%; } 
#wrap #game.tue .board.bottom .spot10 { width: 35%; height: 13%; bottom: 0%; left: 65%; } 

/* 수요일 */
#wrap #game.wed .board.bottom .spot1 { width: 10%; height: 15%; top: 4%; left: 18%; } 
#wrap #game.wed .board.bottom .spot2 { width: 13%; height: 20%; top: 0%; left: 45%; } 
#wrap #game.wed .board.bottom .spot3 { width: 20%; height: 28%; right: 0%; top: 0%; } 
#wrap #game.wed .board.bottom .spot4 { width: 12%; height: 20%; left: 0%; top: 14%; } 
#wrap #game.wed .board.bottom .spot5 { width: 15%; height: 21%; top: 57%; left: 31%; } 
#wrap #game.wed .board.bottom .spot6 { width: 10%; height: 13%; top: 65%; left: 52%; } 
#wrap #game.wed .board.bottom .spot7 { width: 10%; height: 36%; right: 11%; top: 31%; } 
#wrap #game.wed .board.bottom .spot8 { width: 12%; height: 11%; top: 86%; left: 0%; } 
#wrap #game.wed .board.bottom .spot9 { width: 9%; height: 20%; top: 70%; left: 62%; } 
#wrap #game.wed .board.bottom .spot10 { width: 16%; height: 37%; right: 0%; bottom: 0%; } 

/* 목요일 */
#wrap #game.thu .board.bottom .spot1 { width: 17%; height: 14%; left: 11%; top: 0%; } 
#wrap #game.thu .board.bottom .spot2 { width: 10%; height: 17%; left: 10%; top: 35%; } 
#wrap #game.thu .board.bottom .spot3 { width: 21%; height: 12%; top: 35%; left: 22%; transform: rotate(21deg); } 
#wrap #game.thu .board.bottom .spot4 { width: 10%; height: 12%; right: 16%; top: 27%; } 
#wrap #game.thu .board.bottom .spot5 { right: 7%; top: 37%; width: 9%; height: 11%; } 
#wrap #game.thu .board.bottom .spot6 {width: 13%;height: 13%;left: 28%;top: 71%;} 
#wrap #game.thu .board.bottom .spot7 { width: 10%; height: 20%; right: 26%; top: 61%; } 
#wrap #game.thu .board.bottom .spot8 { width: 10%; height: 18%; right: 4%; top: 65%; } 
#wrap #game.thu .board.bottom .spot9 { width: 13%; height: 11%; bottom: 0%; left: 0%; } 
#wrap #game.thu .board.bottom .spot10 {width: 27%;height: 16%;left: 24%;bottom: 0%;} 

/* 금요일 */
#wrap #game.fri .board.bottom .spot1 { width: 10%; height: 20%; left: 2%; top: 15%; } 
#wrap #game.fri .board.bottom .spot2 { width: 20%; height: 20%; left: 24%; top: 16%; } 
#wrap #game.fri .board.bottom .spot3 { width: 11%; height: 13%; top: 24%; left: 52%; } 
#wrap #game.fri .board.bottom .spot4 { width: 12%; height: 15%; top: 18%; left: 71%; } 
#wrap #game.fri .board.bottom .spot5 { width: 17%; height: 27%; left: 1%; top: 50%; } 
#wrap #game.fri .board.bottom .spot6 { width: 12%; height: 13%; top: 41%; left: 40%; } 
#wrap #game.fri .board.bottom .spot7 { width: 18%; height: 12%; left: 37%; top: 67%; } 
#wrap #game.fri .board.bottom .spot8 { width: 10%; height: 10%; left: 70%; top: 69%; } 
#wrap #game.fri .board.bottom .spot9 { width: 10%; height: 16%; left: 75%; top: 80%; } 
#wrap #game.fri .board.bottom .spot10 { width: 20%; height: 12%; right: 0%; top: 56%; } 

/* 토요일 */
#wrap #game.sat .board.bottom .spot1 { width: 12%; height: 21%; left: 0%; top: 11%; } 
#wrap #game.sat .board.bottom .spot2 { width: 10%; height: 18%; left: 36%; top: 30%; } 
#wrap #game.sat .board.bottom .spot3 { width: 10%; height: 12%; right: 0%; top: 43%; } 
#wrap #game.sat .board.bottom .spot4 { width: 7%; height: 10%; left: 64%; top: 11%; } 
#wrap #game.sat .board.bottom .spot5 { width: 11%; height: 17%; left: 15%; top: 49%; } 
#wrap #game.sat .board.bottom .spot6 { width: 11%; height: 14%; top: 49%; left: 53%; } 
#wrap #game.sat .board.bottom .spot7 { width: 14%; height: 18%; top: 63%; left: 0%; } 
#wrap #game.sat .board.bottom .spot8 { width: 18%; height: 21%; left: 26%; top: 75%; } 
#wrap #game.sat .board.bottom .spot9 { width: 12%; height: 12%; left: 73%; top: 58%; } 
#wrap #game.sat .board.bottom .spot10 { width: 24%; height: 26%; right: 0%; bottom: 0%; } 

/* 일요일 */
#wrap #game.sun .board.bottom .spot1 { width: 20%; height: 24%; left: 7%; top: 8%; } 
#wrap #game.sun .board.bottom .spot2 { width: 21%; height: 28%; top: 0%; left: 35%; } 
#wrap #game.sun .board.bottom .spot3 { width: 20%; height: 19%; right: 14%; top: 21%; transform: rotate(34deg); } 
#wrap #game.sun .board.bottom .spot4 { width: 10%; height: 14%; right: 8%; top: 37%; } 
#wrap #game.sun .board.bottom .spot5 { width: 8%; height: 10%; left: 26%; top: 59%; } 
#wrap #game.sun .board.bottom .spot6 { width: 13%; height: 19%; top: 56%; left: 33%; } 
#wrap #game.sun .board.bottom .spot7 { width: 10%; height: 15%; right: 17%; top: 53%; } 
#wrap #game.sun .board.bottom .spot8 {width: 23%;height: 22%;top: 68%;left: 0%;transform: rotate(-6deg);} 
#wrap #game.sun .board.bottom .spot9 {width: 9%;height: 14%;bottom: 18%;left: 45%;} 
#wrap #game.sun .board.bottom .spot10 {width: 11%;height: 29%;right: 0%;top: 57%;} 


@media (min-width: 600px){
 #wrap #game #gameBoard .txt { font-size: 16px;} 
 }