@charset "utf-8";

body.loading{
  height: 100vh;
  overflow: hidden;
}
body.loading .loading_cover{
  background-image: url("../img/loading_cover.png");
  background-color: #000;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: ceover;
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 10000;
  opacity: 0;
  transition: opacity 1s;
  color: #fff;
  visibility: visible;
  pointer-events: none;
}
body.loading .loading_cover .label{
  animation: loading 2s ease-in-out;
  animation-iteration-count: infinite;
  text-shadow: 0 0 10px rgba(255,255,255,.8), 0 0 10px rgba(255,255,255,.8), 0 0 10px rgba(255,255,255,.8);
  letter-spacing: .4em;
}
body.loading.initialized .loading_cover{
  opacity: 1;
}
@media screen and (max-width: 520px){
  .loading_cover{
    font-size: 80%;
  }
}

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

body section.hero,
body .precede,
body section.shop,
body section.onlineshop,
body section.notice,
body section.news,
body section.gallery,
body section.faq{
  filter: blur(0px);
  opacity: 1;
  transition: filter 3s, opacity 2s;
}
body.loading section.hero,
body.loading .precede,
body.loading section.shop,
body.loading section.onlineshop,
body.loading section.notice,
body.loading section.news,
body.loading section.gallery,
body.loading section.faq{
  filter: blur(10px);
  transition: opacity .3s;
  opacity: 0;
  pointer-events: none;
}

.-revealer.t--blur{
  filter: blur(10px);
  transition: filter 1s;
  transition-timing-function: ease-out;
}
.-revealer.-anim-start.t--blur{
  filter: blur(0px);
}

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

.-revealer.t--blur_hero_1{
  filter: blur(10px);
  transition: filter 2s;
}
.-revealer.-anim-start.t--blur_hero_1{
  filter: blur(0px);
}

.-revealer.t--blur_hero_2{
  filter: blur(10px);
  transition: filter 2.2s, opacity 2.2s;
  opacity: 0;
  transition-delay: 1.5s;
}
.-revealer.-anim-start.t--blur_hero_2{
  filter: blur(0px);
  opacity: 1;
}

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

@keyframes loading{
  0%{
    opacity: .4;
  }
  25%{
    opacity: 1;
  }
  75%{
    opacity: 1;
  }
  100%{
    opacity: .4;
  }
}