.button {
    display: table;
    cursor: pointer;
}
.button div {
    display: table-cell;
    padding: .4em 1.5em .5em 1.5em;
    color: white;
    font-size: 1.1em;
    font-weight: 100;
    white-space: pre;
    transition: all .3s;
}
.button b {
    font-weight: 500;
}
@media screen and (min-width:0\0){
    .button b {
        font-weight: 900;
    }
}

.button.on {
    background: #1d7abd;
}
.button.off {
    background: #777;
}


.spinnerLoading {
    width: 40px;
    height: 40px;
    margin: 100px auto;
    background-color: #333;
  
    border-radius: 100%;  
    -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
    animation: sk-scaleout 1.0s infinite ease-in-out;
  }
  
  @-webkit-keyframes sk-scaleout {
    0% { -webkit-transform: scale(0) }
    100% {
      -webkit-transform: scale(1.0);
      opacity: 0;
    }
  }
  
  @keyframes sk-scaleout {
    0% { 
      -webkit-transform: scale(0);
      transform: scale(0);
    } 100% {
      -webkit-transform: scale(1.0);
      transform: scale(1.0);
      opacity: 0;
    }
  }

/* 큰 버튼 스타일~ */
.Button {
    font-size: 1.2em;
    color: white;
    transition: all .3s;
}
.Button.gray {
    background: #666;
}
.Button.gray:hover {
    background: #505050;
}

.Button.heavyGray {
    background: #444445;
}
.Button.heavyGray:hover {
    background: #303030;
}

.Button.lightGray {
    background: #959595;
}
.Button.lightGray:hover {
    background: #7a7a7a;
}

.Button.blue {
    background: #0062a8;
}
.Button.blue:hover {
    background: #005693;
}

.Button.green {
    background: #0ca800;
}

.Button.lightRed {
    background: #ef5d4b;
}
.Button.lightRed:hover {
    background: #e9432f;
}


/* 큰 버튼 스타일~ */
.Button {
    font-size: 1.2em;
    color: white;
    transition: all .3s;
}
.Button.gray {
    background: #666;
}
.Button.gray:hover {
    background: #505050;
}

.Button.heavyGray {
    background: #444445;
}
.Button.heavyGray:hover {
    background: #303030;
}

.Button.lightGray {
    background: #959595;
}
.Button.lightGray:hover {
    background: #7a7a7a;
}

.Button.blue {
    background: #0062a8;
}
.Button.blue:hover {
    background: #005693;
}

.Button.green {
    background: #0ca800;
}

.Button.heavyGreen {
    background: #00b135;
}
.Button.heavyGreen:hover {
    background: #009e2f;
}

.Button.lightRed {
    background: #ef5d4b;
}
.Button.lightRed:hover {
    background: #e9432f;
}

@media screen and (min-width:0\0){
    .Button > div {
        font-weight: 500;
    }
}




.Input {
    outline: 0;
    width: 100%;
    height: 100%;
    border: none;
    background: transparent;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 1.1em;
    font-weight: 300;
}
.Input::placeholder {
    font-family: 'Noto Sans KR';
    font-weight: 300;
    font-size: 1.1em;
    color: #666;
}