@charset "UTF-8";
/* CSS Information
---------------------------------------------------------------
Site URL:Undefined
File name:nsLazyLoad.css
Summary:要素が表示する時に発火するアニメーション一式
Created:2025-07-30
author:96
--------------------------------------------------------------- */
[data-ns-lazyload=""] {
  transition: all 0.5s ease-in-out;
  transform: translate(0, 0);
  opacity: 1;
}

[data-ns-lazyload=""]:not(.is-active) {
  opacity: 0;
}

[data-ns-lazyload=""][data-ns-lazytype=up]:not(.is-active) {
  transform: translateY(3rem);
}

[data-ns-lazyload=""][data-ns-lazytype=down]:not(.is-active) {
  transform: translateY(-3rem);
}

[data-ns-lazyload=""][data-ns-lazytype=left]:not(.is-active) {
  transform: translateX(3rem);
}

[data-ns-lazyload=""][data-ns-lazytype=right]:not(.is-active) {
  transform: translateX(-3rem);
}

/*[data-lazyload=''][data-lazytype=up].is-active {
  animation-name: titlePopup;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

[data-lazyload=''][data-lazytype=left] {
  transform: translateX(2rem);
  opacity: 0;
}

[data-lazyload=''][data-lazytype=left].is-active {
  animation-name: contSlideInLeft;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

[data-lazyload=''][data-lazytype=right] {
  transform: translateX(-2rem);
  opacity: 0;
}

[data-lazyload=''][data-lazytype=right].is-active {
  animation-name: contSlideInRight;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}*/
[data-ns-lazytype=random] {
  position: relative;
  overflow: clip;
}
[data-ns-lazytype=random] > span {
  opacity: 0;
  position: relative;
  transform: translateY(2rem);
  display: inline-block;
}
[data-ns-lazytype=random].is-active > span {
  animation-name: contPopup;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
}

[data-ns-lazyload=child] > * {
  transform: translateY(5rem);
  opacity: 0;
}

[data-ns-lazyload=child][data-ns-lazytype=up].is-active > * {
  animation-name: contPopup;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

@keyframes contPopup {
  0% {
    transform: translateY(2rem);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes contSlideInLeft {
  0% {
    transform: translateX(2rem);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes contSlideRight {
  0% {
    transform: translateX(-2rem);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

/*# sourceMappingURL=nsLazyload.css.map */