@charset "utf-8";

/* ==========================================
 Contents
============================================*/

/* follow */
.follow {
  position: fixed;
  bottom: var(--sz-30);
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
}

/* ==========================================
 Footer
============================================*/

.footer {
  padding-top: var(--sz-80);
  padding-bottom: var(--sz-300);
  font-weight: normal;
}

/* ==========================================
 Layer
============================================*/

.layer--1 {
  top: 0%;
}

.layer--1_1 {
  top: 36%;
}

.layer--2 {
  top: 73%;
}

.layer--3 {
  top: 10%;
}

.layer--4 {
  top: 62%;
}

.layer--5 {
  top: 4%;
}

.layer--6 {
  top: 18%;
  transform: translateX(calc(-50% - var(--sz-280)));
}

.layer--7 {
  top: 18%;
  transform: translateX(calc(-50% + var(--sz-280)));
}

.layer--8 {
  top: 44%;
  transform: translateX(calc(-50% - var(--sz-273)));
}

.layer--9 {
  top: 44%;
  transform: translateX(calc(-50% + var(--sz-280)));
}

.layer--10 {
  top: 72%;
}

.layer--11 {
  top: 11%;
}

.layer--12 {
  top: 8%;
}

.layer--13 {
  top: 4.5%;
}

.layer--14 {
  top: 11%;
}

.layer--15 {
  top: 41%;
}

.layer--16 {
  top: 70%;
}

.layer--17 {
  top: 5%;
}

/* ==========================================
 Animation
============================================*/

/* ふわふわ */
[data-aos="fluffy"] {
  animation: fluffy 3s infinite;
}

@keyframes fluffy {
  0% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-30px);
  }

  100% {
    transform: translateY(0px);
  }
}

/* 拡大・縮小 */
[data-aos="pulse2"] {
  animation: pulse2 1s ease 0s infinite alternate;
}

@keyframes pulse2 {
  from {
    transform: scale(0.9, 0.9);
  }

  to {
    transform: scale(1, 1);
  }
}

/* フェードイン */
.fadeInUp {
  opacity: 0;
  transform: translateY(20px);
  transition: 2s ease;
}

.fadeInUp.animate {
  animation: fadeInUp 2s ease;
}

.fadeInRight {
  opacity: 0;
  transform: translateX(-20px);
  transition: 2s ease;
}

.fadeInRight.animate {
  animation: fadeInRight 2s ease;
}

.fadeInLeft {
  opacity: 0;
  transform: translateX(20px);
  transition: 2s ease;
}

.fadeInLeft.animate {
  animation: fadeInLeft 2s ease;
}