@charset "UTF-8";

/*------------------------------------------------------------
	Home
------------------------------------------------------------*/

/* .pg-home-mv */
.pg-home-mv-title-box__text{
  opacity: 0;
  animation: mvtext 1s ease-in-out;
  animation-fill-mode: forwards;
}
.pg-home-mv-image-box{
  transform: translateY(50px);
  opacity: 0;
  animation: mvimage 1s ease-in-out;
  animation-delay: 1s;
  animation-fill-mode: forwards;
}
.pg-home-mv-image-box__item01:before{
  content: '';
  display: block;
  width: 21%;
  height: 20%;
  background: url(../../images/home/mv/image01-fukidashi.svg)no-repeat center center / contain;
  position: absolute;
  left: 77%;
  bottom: 78%;
  animation:mvimage01 4s ease-in-out infinite;
  transition: 1s;
  transition-delay: 1s;
  opacity: 0;
}
.pg-home-mv-image-box__item03:before{
  content: '';
  display: block;
  width: 12%;
  height: 21%;
  background: url(../../images/home/mv/image03-mail.svg) no-repeat center center / contain;
  position: absolute;
  left: 38%;
  bottom: 88%;
  animation: mvimage03 10s ease-in infinite;
  transition: 1s;
  transition-delay: 1s;
  opacity: 1;
}

@keyframes mvtext{
  0%{
    opacity: 0;
  }
  100%{
    opacity: 1;
  }
}
@keyframes mvimage{
  0%{
    transform: translateY(50px);
    opacity: 0;
  }
  100%{
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes mvimage01{
  0%{
    transform:scale(0.6) translateY(10px);
    opacity: 0;
  }
  25%{
    transform:scale(1) translateY(0px);
    opacity: 1;
  }
  75%{
    transform:scale(1) translateY(0px);
    opacity: 1;
  }
  100%{
    transform:scale(0.6) translateY(10px);
    opacity: 0;
  }
}
@keyframes mvimage03{
  0%{
    transform: translateY(0px);
  }
  25%{
    transform: translateY(-7px);
  }
  50%{
    transform: translateY(0px);
  }
  75%{
    transform: translateY(-7px);
  }
  100%{
    transform: translateY(0px);
  }
}