*:active {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -moz-tap-highlight-color: rgba(0,0,0,0);
    tap-highlight-color: rgba(0,0,0,0);
}

body {
  background-color: #000;
  margin: 0;
  overflow: hidden;
  font-size: 16px;
}

.load_page {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: rgb(30, 30, 30);
}

.load {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 260px;
  height: 0px;
  padding-top: 260px;
  margin-top: -130px;
  margin-left: -130px;
  background-size: 100% 100%;
}

#r_blue {
  background-image: url("load_src/r_blue.png");
  animation: spin_r 4s infinite linear;
}

#r_red {
  background-image: url("load_src/r_red.png");
  animation: spin_r 2s infinite linear reverse;
}

#r_txt {
  background-image: url("load_src/r_txt.png");
  animation: spin_r 20s infinite linear;
}

.perc {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 170px;
  height: 58px;
  transform: translate(-50%, -50%);
}

@font-face {
  font-family: Gravedigger;
  src: url("http://www.picto3d.co.kr/sp/font/Gravedigger.otf"), url("load_src/Gravedigger.otf");
  font-style: normal;
  font-weight: normal;
}

.perc_txt {
  position: absolute;
  top: 0%;
  text-align: center;
  width: 62.5px;
  height: 58px;
  font-family: Gravedigger;
  font-size: 54px;
  color: rgb(255, 255, 255);
}

#perc_txt1 {
  left: 5%;
}

#perc_txt2 {
  right: 25%;
}

#perc_p {
  position: absolute;
  width: 45px;
  height: 39px;
  bottom: 0%;
  right: 0%;
  background-image: url("load_src/tper.png");
  background-size: 100% 100%;
}

@keyframes spin_r {
  0% {transform: rotate(0deg);}
  100% {transform: rotate(360deg);};
}

#main_canvas_container {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
  visibility: hidden;
}

#shadow {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  visibility: hidden;
}

#mabp {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  visibility: hidden;
}

#logo {
  position: absolute;
  top: 15px;
  left: 15px;
  width: 106px;
  height: 40px;
  background-image: url("assets/logo.png");
  background-size: 100% 100%;
}

.minimap {
  position: absolute;
  bottom: 80px;
  right: 30px;
  width: 300px;
  height: 300px;
  background-image: url("blender/img_src/map_back.png");
  background-size: 100% 100%;
}

.minimap img {
  position: absolute;
  width: 300px;
  height: 300px;
}

.hide {
  visibility: hidden;
}

.click {
  position: absolute;
}

.click:hover {
  cursor: pointer;
}

#_auto_rotate {
  bottom: 20px;
  right: 20px;
  width: 72px;
  height: 37px;
  background-image: url("blender/img_src/btn_rot.png");
  background-size: 100% 100%;
}

#prev {
  bottom: 20px;
  right: 92px;
  width: 72px;
  height: 37px;
  background-image: url("blender/img_src/prev.png");
  background-size: 100% 100%;
  visibility: hidden;
}

#prev:hover {
  background-image: url("blender/img_src/prevx.png");
}

#minimap_show {
  bottom: 20px;
  left: 20px;
  width: 73px;
  height: 37px;
  background-image: url("blender/img_src/btn_map.png");
  background-size: 100% 100%;
  visibility: hidden;
}

#a0 {
  top: 52.167%;
  left: 66%;
  width: 18%;
  height: 18%;
}

#a1 {
  top: 46.334%;
  left: 34%;
  width: 27%;
  height: 29.334%;
}

#a2 {
  top: 76%;
  left: 42.334%;
  width: 23.334%;
  height: 21.667%;
}

#a3 {
  top: 3.334%;
  left: 37%;
  width: 20.335%;
  height: 22.667%;
}

#a4 {
  top: 27%;
  left: 38.334%;
  width: 16%;
  height: 18.334%;
}

#a5 {
  top: 2%;
  left: 58%;
  width: 11.334%;
  height: 15.667%;
}

.menu {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 54px;
  height: 54px;
  visibility: hidden;
}

.menu p {
  position: absolute;
  font-family: "Nanum Square";
  font-weight: bold;
  top: 0%;
  right: 120%;
  width: 100px;
  height: 54px;
  text-align: right;
  visibility: hidden;
  font-size: 16px;
  color: rgb(255, 255, 255);
}

@media screen and (max-width: 700px), screen and (max-height: 700px){
  .minimap {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 300px;
    height: 300px;
    transform: translate(-50%, -50%);
    visibility: hidden;
  }
}