﻿@charset "utf-8";

/* 퍼즐  */

#game{position:relative; width:  100%; height: 100%;}

#wrap #game .wrap{width: 90%;margin:0 auto;position: absolute;height: 100%;left: 5%;}

#wrap #game #timer{width: 40px;height: 40px;top: calc(48% - 20px);left: 32%;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: 46%;height: 21px;top: calc(48% - 11px);left: 43%;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 #board{left: 7%;top: 22%;width: 86%;height: 50.66%;}
#wrap #board .puzzleBg{top: 0;left: 0;}

#wrap #cardDrop{width:100%; height:100%; overflow: hidden;}
#wrap #cardDrop li{position: absolute; width: 25%; height: 25%;}
#wrap #cardDrop li.m0{top: 0; left:0;}
#wrap #cardDrop li.m1{top: 0; left:25%;}
#wrap #cardDrop li.m2{top: 0; left:50%;}
#wrap #cardDrop li.m3{top: 0; left:75%;}
#wrap #cardDrop li.m4{top: 25%; left:0;}
#wrap #cardDrop li.m5{top: 25%; left:25%;}
#wrap #cardDrop li.m6{top: 25%; left:50%;}
#wrap #cardDrop li.m7{top: 25%; left:75%;}
#wrap #cardDrop li.m8{top: 50%; left:0;}
#wrap #cardDrop li.m9{top: 50%; left:25%;}
#wrap #cardDrop li.m10{top: 50%;left:50%;}
#wrap #cardDrop li.m11{top: 50%; left:75%;}
#wrap #cardDrop li.m12{top: 75%; left:0;}
#wrap #cardDrop li.m13{top: 75%; left:25%;}
#wrap #cardDrop li.m14{top: 75%; left:50%;}
#wrap #cardDrop li.m15{top: 75%; left:75%;}

#wrap #cardDrag li{position: absolute;width: 11.5%;height: 42.34%;background-repeat: no-repeat;background-size: cover;display: inline-block; display:none; vertical-align: top;margin-bottom: 1%;box-shadow: 1px 1px 2px #343434;}
#wrap #cardDrag{width: 100%;height: 16%;left: 0%;top: 77%;}

#wrap #cardDragDrop{position: absolute; z-index: 100; top: 0; width:100%; height:100%; overflow: hidden;}
#wrap #cardDragDrop li{position: absolute; width: 25%; height: 25%; background-repeat: no-repeat;background-size: cover;}

/* 일요일 */
#game.sun #hint .hintImg{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1.jpg); }
#game.sun .drag li.m0{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-1.png);}
#game.sun .drag li.m1{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-2.png);}
#game.sun .drag li.m2{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-3.png);}
#game.sun .drag li.m3{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-4.png); }
#game.sun .drag li.m4{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-5.png);}
#game.sun .drag li.m5{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-6.png);}
#game.sun .drag li.m6{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-7.png);}
#game.sun .drag li.m7{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-8.png);}
#game.sun .drag li.m8{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-9.png);}
#game.sun .drag li.m9{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-10.png);}
#game.sun .drag li.m10{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-11.png);}
#game.sun .drag li.m11{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-12.png);}
#game.sun .drag li.m12{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-13.png);}
#game.sun .drag li.m13{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-14.png);}
#game.sun .drag li.m14{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-15.png);}
#game.sun .drag li.m15{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/1-16.png);}
/* 월요일 */
#game.mon #hint .hintImg{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2.jpg); }
#game.mon .drag li.m0{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-1.png);}
#game.mon .drag li.m1{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-2.png);}
#game.mon .drag li.m2{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-3.png);}
#game.mon .drag li.m3{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-4.png); }
#game.mon .drag li.m4{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-5.png);}
#game.mon .drag li.m5{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-6.png);}
#game.mon .drag li.m6{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-7.png);}
#game.mon .drag li.m7{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-8.png);}
#game.mon .drag li.m8{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-9.png);}
#game.mon .drag li.m9{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-10.png);}
#game.mon .drag li.m10{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-11.png);}
#game.mon .drag li.m11{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-12.png);}
#game.mon .drag li.m12{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-13.png);}
#game.mon .drag li.m13{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-14.png);}
#game.mon .drag li.m14{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-15.png);}
#game.mon .drag li.m15{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/2-16.png);}
/* 화요일 */
#game.tue #hint .hintImg{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3.jpg); }
#game.tue .drag li.m0{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-1.png);}
#game.tue .drag li.m1{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-2.png);}
#game.tue .drag li.m2{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-3.png);}
#game.tue .drag li.m3{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-4.png); }
#game.tue .drag li.m4{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-5.png);}
#game.tue .drag li.m5{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-6.png);}
#game.tue .drag li.m6{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-7.png);}
#game.tue .drag li.m7{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-8.png);}
#game.tue .drag li.m8{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-9.png);}
#game.tue .drag li.m9{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-10.png);}
#game.tue .drag li.m10{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-11.png);}
#game.tue .drag li.m11{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-12.png);}
#game.tue .drag li.m12{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-13.png);}
#game.tue .drag li.m13{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-14.png);}
#game.tue .drag li.m14{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-15.png);}
#game.tue .drag li.m15{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/3-16.png);}
/* 수요일 */
#game.wed #hint .hintImg{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4.jpg); }
#game.wed .drag li.m0{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-1.png);}
#game.wed .drag li.m1{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-2.png);}
#game.wed .drag li.m2{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-3.png);}
#game.wed .drag li.m3{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-4.png); }
#game.wed .drag li.m4{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-5.png);}
#game.wed .drag li.m5{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-6.png);}
#game.wed .drag li.m6{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-7.png);}
#game.wed .drag li.m7{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-8.png);}
#game.wed .drag li.m8{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-9.png);}
#game.wed .drag li.m9{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-10.png);}
#game.wed .drag li.m10{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-11.png);}
#game.wed .drag li.m11{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-12.png);}
#game.wed .drag li.m12{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-13.png);}
#game.wed .drag li.m13{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-14.png);}
#game.wed .drag li.m14{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-15.png);}
#game.wed .drag li.m15{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/4-16.png);}
/* 목요일 */
#game.thu #hint .hintImg{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5.jpg); }
#game.thu .drag li.m0{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-1.png);}
#game.thu .drag li.m1{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-2.png);}
#game.thu .drag li.m2{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-3.png);}
#game.thu .drag li.m3{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-4.png); }
#game.thu .drag li.m4{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-5.png);}
#game.thu .drag li.m5{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-6.png);}
#game.thu .drag li.m6{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-7.png);}
#game.thu .drag li.m7{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-8.png);}
#game.thu .drag li.m8{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-9.png);}
#game.thu .drag li.m9{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-10.png);}
#game.thu .drag li.m10{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-11.png);}
#game.thu .drag li.m11{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-12.png);}
#game.thu .drag li.m12{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-13.png);}
#game.thu .drag li.m13{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-14.png);}
#game.thu .drag li.m14{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-15.png);}
#game.thu .drag li.m15{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/5-16.png);}
/* 금요일 */
#game.fri #hint .hintImg{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6.jpg); }
#game.fri .drag li.m0{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-1.png);}
#game.fri .drag li.m1{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-2.png);}
#game.fri .drag li.m2{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-3.png);}
#game.fri .drag li.m3{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-4.png); }
#game.fri .drag li.m4{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-5.png);}
#game.fri .drag li.m5{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-6.png);}
#game.fri .drag li.m6{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-7.png);}
#game.fri .drag li.m7{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-8.png);}
#game.fri .drag li.m8{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-9.png);}
#game.fri .drag li.m9{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-10.png);}
#game.fri .drag li.m10{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-11.png);}
#game.fri .drag li.m11{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-12.png);}
#game.fri .drag li.m12{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-13.png);}
#game.fri .drag li.m13{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-14.png);}
#game.fri .drag li.m14{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-15.png);}
#game.fri .drag li.m15{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/6-16.png);}
/* 토요일 */
#game.sat #hint .hintImg{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7.jpg); }
#game.sat .drag li.m0{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-1.png);}
#game.sat .drag li.m1{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-2.png);}
#game.sat .drag li.m2{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-3.png);}
#game.sat .drag li.m3{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-4.png); }
#game.sat .drag li.m4{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-5.png);}
#game.sat .drag li.m5{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-6.png);}
#game.sat .drag li.m6{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-7.png);}
#game.sat .drag li.m7{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-8.png);}
#game.sat .drag li.m8{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-9.png);}
#game.sat .drag li.m9{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-10.png);}
#game.sat .drag li.m10{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-11.png);}
#game.sat .drag li.m11{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-12.png);}
#game.sat .drag li.m12{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-13.png);}
#game.sat .drag li.m13{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-14.png);}
#game.sat .drag li.m14{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-15.png);}
#game.sat .drag li.m15{background-image:url(https://dbins2.speedgabia.com/jjansun/images/game13/7-16.png);}

#wrap .drag li.pos0{top:0; left:0;}
#wrap .drag li.pos1{top:0; left: 12.5%;}
#wrap .drag li.pos2{top:0; left: 25%;}
#wrap .drag li.pos3{top:0; left: 37.5%;}
#wrap .drag li.pos4{ top:0; left: 50%;}
#wrap .drag li.pos5{ top:0; left: 62.5%;}
#wrap .drag li.pos6{ top:0; left: 75%;}
#wrap .drag li.pos7{top:0; left: 87.5%;}
#wrap .drag li.pos8{top: 49%; left:0;}
#wrap .drag li.pos9{top: 49%; left: 12.5%;}
#wrap .drag li.pos10{top: 49%; left: 25%;}
#wrap .drag li.pos11{top: 49%; left: 37.5%;}
#wrap .drag li.pos12{top: 49%; left: 50%;}
#wrap .drag li.pos13{top: 49%; left: 62.5%;}
#wrap .drag li.pos14{top: 49%; left: 75%;}
#wrap .drag li.pos15{top: 49%; left: 87.5%;}

#wrap #hint{display:none; width: 98%;background: #ffffffab;height: 14%;top: 5%;left: 1%;border-radius: 15px;box-shadow: 0px 3px 3px #7f7f7f;}
#wrap #hint .hintImg{ width: 21%; height: 86.6%; float: left;margin-left: 6%;margin-top: 1.3%;border: 2px solid red; background-size:cover; background-repeat: no-repeat;}

@media (min-width: 600px){
  #wrap #game #bar{left:39%;}
}