/* --------------------
		animation
-------------------- */
.--delay {
  transition-delay: 0.7s !important;
}

.color {
  filter: grayscale(100%);
  transition: all 1.5s ease;
}
.color.active {
  filter: grayscale(0%);
}

.fadein-up-color {
  opacity: 0;
  transform: translateY(20px);
  filter: grayscale(100%);
  transition: opacity 1.5s ease, transform 1.5s ease, filter 1.2s ease 0.8s;
}
.fadein-up-color.active {
  opacity: 1;
  transform: translateY(0);
  filter: grayscale(0%);
}

.fadein {
  opacity: 0;
  visibility: hidden;
  transition: all 1.8s ease 0.3s;
}
.fadein.active {
  opacity: 1;
  visibility: visible;
}

.fadein-up {
  opacity: 0;
  transition: all 1.5s ease;
  transform: translateY(30px);
}
.fadein-up.active {
  opacity: 1;
  transform: translateY(0);
}

.fadein-left {
  opacity: 0;
  transition: all 1s ease 0.3s;
  transform: translateX(40px);
}
.fadein-left.active {
  opacity: 1;
  transform: translateX(0);
}

.fadein-right {
  opacity: 0;
  transition: all 1s ease 0.3s;
  transform: translateX(-40px);
}
.fadein-right.active {
  opacity: 1;
  transform: translateX(0);
}

.scale img {
  opacity: 0;
  transform: scale(1.04);
  transition: all 1.6s ease 0.3s;
}
.scale.active img {
  opacity: 1;
  transform: scale(1);
}

.clip-path {
  overflow: hidden;
}
.clip-path img {
  display: block;
  -webkit-clip-path: inset(0 0 100% 0);
          clip-path: inset(0 0 100% 0);
  transition: -webkit-clip-path 1s ease 1s;
  transition: clip-path 1s ease 1s;
  transition: clip-path 1s ease 1s, -webkit-clip-path 1s ease 1s;
  opacity: 0;
}
.clip-path.active img {
  -webkit-clip-path: inset(0 0 0 0);
          clip-path: inset(0 0 0 0);
  opacity: 1;
}
/*# sourceMappingURL=style_animation.css.map */