@charset "utf-8";

body{
	background-color: #000;
    height: 100%;
    font-family: Arial,"Apple LiGothic Black", "Impact", "微軟正黑體";
}






.btnMenu{
    display: block;
    width: 8%;

    position: absolute;
    top: 2%;
    right: 4%;
}

.menuDiv{
    display: block;
    display: none;
    width: 100%;
    height: 100%;

    position: fixed;
    top: 0;
    left: 0;
}

.menubackground{
    display: block;
    width: 100%;
    height: 100%;

    position: absolute;
    top: 0;
    left: 0;

    background-color: #31414e;
    opacity: 0.84;
}

.menuBG{
    display: block;
    width: 80%;

    position: absolute;
    top: 10%;
    left: 10%;
}

.btnCancel{
    display: block;
    width: 13%;

    position: absolute;
    top: 6%;
    right: 5%;
}

.mOption{
    display: block;
    width: 80%;

    position: absolute;
    left: 10%;

    /*border: 1px solid #ff00ff;*/
}

.m1{ top:19%; }
.m2{ top:28.5%; }
.m3{ top:38.5%; }
.m4{ top:48%; }





.cutSet{
    display: block;
    width: 100%;

    position: absolute;
    top: 0;
    left: 0;
}


.bgSet{
    display: block;
    width: 100%;

    position: absolute;
    top: 0;
    left: 0;

    pointer-events: none;
}

.logo{
    display: block;
    width: 15%;

    /*position: fixed;*/
    position: absolute;
    top: 0;
    left: 0;
}









.refH{
    display: block;
    width: 100%;

    position: absolute;
    top: 0;
    left: 0;

    opacity: 0;
}



.whiteCover{
    display: block;
    /*display: none;*/
    width: 100%;
    height: 100%;
    background-color: #fff;
    position: absolute;
    top:0;
    left: 0;

    color: #ccc;
}

.whiteCover span{
    display: block;
    position: absolute;
    top:4%;
    left:10%;
    font-size: 10vw;
}



.loadinggif{
    display: block;
    width: 20%;

    position: absolute;
    left: 40%;
    top:30%;
}



.vibrate-1 {
  -webkit-animation: vibrate-1 0.3s linear infinite both;
          animation: vibrate-1 0.3s linear infinite both;
}

/* ----------------------------------------------
 * Generated by Animista on 2020-11-2 12:4:45
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation vibrate-1
 * ----------------------------------------
 */
@-webkit-keyframes vibrate-1 {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
  20% {
    -webkit-transform: translate(-2px, 2px);
            transform: translate(-2px, 2px);
  }
  40% {
    -webkit-transform: translate(-2px, -2px);
            transform: translate(-2px, -2px);
  }
  60% {
    -webkit-transform: translate(2px, 2px);
            transform: translate(2px, 2px);
  }
  80% {
    -webkit-transform: translate(2px, -2px);
            transform: translate(2px, -2px);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}
@keyframes vibrate-1 {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
  20% {
    -webkit-transform: translate(-2px, 2px);
            transform: translate(-2px, 2px);
  }
  40% {
    -webkit-transform: translate(-2px, -2px);
            transform: translate(-2px, -2px);
  }
  60% {
    -webkit-transform: translate(2px, 2px);
            transform: translate(2px, 2px);
  }
  80% {
    -webkit-transform: translate(2px, -2px);
            transform: translate(2px, -2px);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}


