@charset 'UTF-8';
.loading {width: 100vw;height: 100vh;transition: all .9s;background-color: #FFF;position: fixed;top: 0;left: 0;z-index: 9999;opacity: 1;visibility: visible;}
.loading.is-active {opacity: 0;visibility: hidden;}
.loading-animation {width: 100vw;height: 100vh;transition: all .6s;background-color: #B8DE00;z-index: 9999;display: flex;align-items: center;justify-content: center;opacity: 0;visibility: hidden;padding: 0 0 60px;}
.loading-animation img {width: 100px;margin: 0 0 30px;}
.loading-animation.is-active {opacity: 1;visibility: visible;}


.loader {
  width: 45px;
  aspect-ratio: 1;
  --c:no-repeat linear-gradient(#fff 0 0);
  background: 
    var(--c) 0    0, 
    var(--c) 50%  50%, 
    var(--c) 100% 100%;
  animation: 
    l17 1s infinite alternate;
}
@keyframes l17 {
 0%,
 10%  {background-size:20% 100%}
 50%  {background-size:20% 20%}
 90%,
 100% {background-size:100% 20%}
}