@charset "UTF-8";
/* CSS Document */
/*----------------------------------------*/
/*ローディング
----------------------------------------*/
#loading_area {
  opacity: 0;
}

.loading header {
  opacity: 0;
}
.loading header img {
  opacity: 0;
}

.loading main {
  visibility: hidden;
}

@-webkit-keyframes dots {
  0% {
    top: 0px;
  }
  5% {
    top: -2.5px;
  }
  10% {
    top: -5px;
  }
  15% {
    top: -7.5px;
  }
  20% {
    top: -10px;
  }
  25% {
    top: -7.5px;
  }
  30% {
    top: -5px;
  }
  35% {
    top: -2.5px;
  }
  40% {
    top: 0px;
  }
  100% {
    top: 0px;
  }
}
@keyframes dots {
  0% {
    top: 0px;
  }
  5% {
    top: -2.5px;
  }
  10% {
    top: -5px;
  }
  15% {
    top: -7.5px;
  }
  20% {
    top: -10px;
  }
  25% {
    top: -7.5px;
  }
  30% {
    top: -5px;
  }
  35% {
    top: -2.5px;
  }
  40% {
    top: 0px;
  }
  100% {
    top: 0px;
  }
}
.loaded #loading_area {
  opacity: 0;
  background-color: #FFF;
  -webkit-transition: opacity 0.8s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  -o-transition: opacity 0.8s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  transition: opacity 0.8s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
}

.loading #loading_area {
  background-color: #FFF;
  width: 100vw;
  margin: 0;
  text-align: center;
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  z-index: 99999;
  opacity: 1;
  display: block;
  -webkit-transition: opacity 0.8s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  -o-transition: opacity 0.8s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  transition: opacity 0.8s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
}
.loading #loading_area ul {
  top: 48%;
  display: inline-block;
  list-style: none;
  width: 30px;
  position: relative;
}
.loading #loading_area ul .block {
  height: 6px;
  width: 6px;
  position: absolute;
  top: 0;
  -webkit-animation: dots 0.6s ease infinite;
  animation: dots 0.6s ease infinite;
}
.loading #loading_area ul .block.block01 {
  left: 0;
  background-color: #4a72ce;
  -webkit-animation-delay: -0.6s;
  animation-delay: -0.6s;
}
.loading #loading_area ul .block.block02 {
  left: 6px;
  background-color: #6186dc;
  -webkit-animation-delay: -0.5s;
  animation-delay: -0.5s;
}
.loading #loading_area ul .block.block03 {
  left: 12px;
  background-color: #789ae6;
  -webkit-animation-delay: -0.4s;
  animation-delay: -0.4s;
}
.loading #loading_area ul .block.block04 {
  left: 18px;
  background-color: #90adf0;
  -webkit-animation-delay: -0.3s;
  animation-delay: -0.3s;
}
.loading #loading_area ul .block.block05 {
  left: 24px;
  background-color: #a0baf6;
  -webkit-animation-delay: -0.2s;
  animation-delay: -0.2s;
}
.loading #loading_area ul .block.block06 {
  left: 30px;
  background-color: #c1d4ff;
  -webkit-animation-delay: -0.1s;
  animation-delay: -0.1s;
}

/*----------------------------------------*/