@charset "UTF-8";


.floating {
  animation: floating 5s infinite linear alternate;
}

@-webkit-keyframes floating {
  0%   { -webkit-transform:translate(0, -15px) rotate(-10deg); }
  50%  { -webkit-transform:translate(0, 0) rotate(0deg); }
  100% { -webkit-transform:translate(0, 15px) rotate(10deg); }
}

  @keyframes floating {
  0%   { transform:translate(0, -15px) rotate(-10deg); }
  50%  { transform:translate(0, 0) rotate(0deg); }
  100% { transform:translate(0, 15px) rotate(10deg); }
}


.scale {
  animation: scale 5s infinite linear alternate;
}

@-webkit-keyframes scale {
  0% { -webkit-transform: scale(1.1) }
  50% { -webkit-transform: scale(0.9) translate(0, 15px)}
  100% { -webkit-transform: scale(1.1) }
}

  @keyframes scale {
  0% { transform: scale(1.1) }
  70% { transform: scale(0.9) translate(0, 15px)}
  100% { transform: scale(1.1) }
}


.hover {
  animation: hover 6.5s infinite linear alternate;
}

@-webkit-keyframes hover {
  0%   { -webkit-transform: translate(0, 0) rotate(2deg); }
  50%  { -webkit-transform: translate(-15px, 10px) rotate(-3deg); }
  100% { -webkit-transform: translate(-5px, 5px) rotate(3deg); }
}

  @keyframes hover {
  0%   { transform: translate(0, 0) rotate(2deg); }
  50%  { transform: translate(-15px, 10px) rotate(-3deg); }
  100% { transform: translate(-5px, 5px) rotate(3deg); }
}


.hover-top {
  animation: hover-top 5s infinite linear alternate;
}

@-webkit-keyframes hover-top {
  0%   { -webkit-transform: translate(0, 0) rotate(1deg); }
  30%  { -webkit-transform: translate(-10px, 10px) rotate(-2deg); }
  60%  { -webkit-transform: translate(-15px, 5px) rotate(1deg); }
  100% { -webkit-transform: translate(5px, -5px) rotate(-1deg); }
}

  @keyframes hover-top {
  0%   { transform: translate(0, 0) rotate(1deg); }
  30%  { transform: translate(-10px, 10px) rotate(-2deg); }
  60%  { transform: translate(-15px, 5px) rotate(1deg); }
  100% { transform: translate(5px, -5px) rotate(-1deg); }
}


.hover-flow {
  animation: hover-flow 5s infinite linear alternate;
}

@-webkit-keyframes hover-flow {
  0%   { -webkit-transform: translate(0, 0) rotate(1deg); }
  30%  { -webkit-transform: translate(-10px, 10px) rotate(-2deg); }
  60%  { -webkit-transform: translate(-15px, 5px) rotate(1deg); }
  100% { -webkit-transform: translate(5px, -5px) rotate(-1deg); }
}

  @keyframes hover-flow {
  0%   { transform: translate(0, 0) rotate(1deg); }
  30%  { transform: translate(-10px, 10px) rotate(-2deg); }
  60%  { transform: translate(-15px, 5px) rotate(1deg); }
  100% { transform: translate(5px, -5px) rotate(-1deg); }
}


.fly {
  animation: fly 2.5s infinite cubic-bezier(0.9, 0.65, 1, 1) alternate;
}

@-webkit-keyframes fly {
  0%   { -webkit-transform: translate(0, 0) rotate(0); }
  50%  { -webkit-transform: translate(-5px, 5px) rotate(5deg); }
  100% { -webkit-transform: translate(3px, 3px) rotate(-2deg); }
}

  @keyframes fly {
  0%   { transform: translate(0, 0) rotate(0); }
  50%  { transform: translate(-5px, 5px) rotate(5deg); }
  100% { transform: translate(3px, 3px) rotate(-2deg); }
}


.flow-bg {
  animation: flow-bg 7s infinite linear alternate;
}

@-webkit-keyframes flow-bg {
  0%   { -webkit-transform: translate(0, 0) rotate(2deg); }
  30%  { -webkit-transform: translate(2px, -10px) rotate(-2deg); }
  60%  { -webkit-transform: translate(-3px, -15px) rotate(0deg); }
  100% { -webkit-transform: translate(2px, 5px) rotate(2deg); }
}

  @keyframes flow-bg {
  0%   { transform: translate(0, 0) rotate(2deg); }
  30%  { transform: translate(2px, -10px) rotate(-2deg); }
  60%  { transform: translate(-3px, -15px) rotate(0deg); }
  100% { transform: translate(2px, 5px) rotate(2deg); }
}



@-webkit-keyframes slide-in-first {
  0%   {
    bottom: 81px;
    right: 400px;
  }
  100% {
    bottom: 81px;
    right: -43px;
    opacity: 1;
  }
}

  @keyframes slide-in-first {
  0%   {
    bottom: 81px;
    right: 300px;
  }
  100% {
    bottom: 81px;
    right: -43px;
    opacity: 1;
  }
}

@-webkit-keyframes slide-in-first-sp {
  0%   {
    top: 210px;
    top: 56vw;
    right: 200px;
    right: 53.333vw;
  }
  100% {
    top: 210px;
    top: 56vw;
    right: 70px;
    right: 18.667vw;
    opacity: 1;
  }
}

  @keyframes slide-in-first-sp {
  0%   {
    top: 210px;
    top: 56vw;
    right: 200px;
    right: 53.333vw;
  }
  100% {
    top: 210px;
    top: 56vw;
    right: 70px;
    right: 18.667vw;
    opacity: 1;
  }
}


@-webkit-keyframes slide-in-second {
  0%   {
    top: 94px;
    left: 300px;
    opacity: 0;
  }
  100% {
    top: 94px;
    left: -76px;
    opacity: 1;
  }
}

  @keyframes slide-in-second {
  0%   {
    top: 94px;
    left: 300px;
    opacity: 0;
  }
  100% {
    top: 94px;
    left: -76px;
    opacity: 1;
  }
}

@-webkit-keyframes slide-in-second-sp {
  0%   {
    top: 187px;
    top: 49.867vw;
    left: 150px;
    left: 40vw;
    opacity: 0;
  }
  100% {
    top: 187px;
    top: 49.867vw;
    left: 20px;
    left: 5.333vw;
    opacity: 1;
  }
}

  @keyframes slide-in-second-sp {
  0%   {
    top: 187px;
    top: 49.867vw;
    left: 150px;
    left: 40vw;
    opacity: 0;
  }
  100% {
    top: 187px;
    top: 49.867vw;
    left: 20px;
    left: 5.333vw;
    opacity: 1;
  }
}


@-webkit-keyframes slide-in-third {
  0%   {
    bottom: 130px;
    right: 300px;
    opacity: 0;
  }
  100% {
    bottom: 130px;
    right: -23px;
    opacity: 1;
  }
}

  @keyframes slide-in-third {
  0%   {
    bottom: 130px;
    right: 300px;
    opacity: 0;
  }
  100% {
    bottom: 130px;
    right: -23px;
    opacity: 1;
  }
}

@-webkit-keyframes slide-in-third-sp {
  0%   {
    top: 222px;
    top: 59.2vw;
    right: 170px;
    right: 45.333vw;
    opacity: 0;
  }
  100% {
    top: 222px;
    top: 59.2vw;
    right: 20px;
    right: 5.333vw;
    opacity: 1;
  }
}

  @keyframes slide-in-third-sp {
  0%   {
    top: 222px;
    top: 59.2vw;
    right: 170px;
    right: 45.333vw;
    opacity: 0;
  }
  100% {
    top: 222px;
    top: 59.2vw;
    right: 20px;
    right: 5.333vw;
    opacity: 1;
  }
}


@-webkit-keyframes border-top {
  0%   {
    width: 0;
  }
  100%   {
    width: 298px;
  }
}

  @keyframes border-top {
  0%   {
    width: 0;
  }
  100%   {
    width: 298px;
  }
}

@-webkit-keyframes border-left {
  0%   {
    height: 0;
  }
  100%   {
    height: 759px;
  }
}

  @keyframes border-left {
  0%   {
    height: 0;
  }
  100%   {
    height: 759px;
  }
}

@-webkit-keyframes border-bottom {
  0%   {
    width: 0;
  }
  100%   {
    width: 298px;
  }
}

  @keyframes border-bottom {
  0%   {
    width: 0;
  }
  100%   {
    width: 298px;
  }
}

@-webkit-keyframes border-right {
  0%   {
    height: 0;
  }
  100%   {
    height: 759px;
  }
}

  @keyframes border-right {
  0%   {
    height: 0;
  }
  100%   {
    height: 759px;
  }
}


@-webkit-keyframes plane-top {
  0%   {
    top: -60px;
    right: 575px;
  }
  100%   {
    top: 182px;
    right: 140px;
  }
}

  @keyframes plane-top {
  0%   {
    top: -60px;
    right: 575px;
  }
  100%   {
    top: 182px;
    right: 140px;
  }
}

@-webkit-keyframes plane-top-sp {
  0%   {
    top: 146px;
    top: 38.933vw;
    left: -60px;
    left: -16vw;
  }
  100%   {
    top: 175px;
    top: 46.667vw;
    left: 15px;
    left: 4vw;
  }
}

  @keyframes plane-top-sp {
  0%   {
    top: 146px;
    top: 38.933vw;
    left: -60px;
    left: -16vw;
  }
  100%   {
    top: 175px;
    top: 46.667vw;
    left: 15px;
    left: 4vw;
  }
}


/*@-webkit-keyframes slide-item {*/
  /*0%   {*/
    /*opacity: 1;*/
  /*}*/
  /*20%  {*/
    /*opacity: 0;*/
  /*}*/
  /*100%   {*/
    /*opacity: 1;*/
  /*}*/
/*}*/

/*  @keyframes slide-item {*/
    /*0%   {*/
      /*opacity: 1;*/
    /*}*/
    /*20%  {*/
      /*opacity: 0;*/
    /*}*/
    /*100%   {*/
      /*opacity: 1;*/
    /*}*/
/*}*/
