@keyframes blurToClear {
    /* from {
        filter: blur(6px);
    }
    to {
        filter: blur(0);
    } */
}

@keyframes scaleIn {
    0% {
        transform: scale(0%);
        opacity: 0;
    }
    100% {
        transform: scale(100%);
        opacity: 1;
    }
}

.scale-in {
    animation: scaleIn .5s ease-out forwards;
}

/* 拍照閃光 */
.flash {
  pointer-events: none;
  animation: cameraFlash 2.5s ease-in-out;
}

/* 閃光效果 */
@keyframes cameraFlash {
  0%, 88%, 100% {
    opacity: 0;
  }
  90% {
    opacity: .65;
  }
  94% {
    opacity: 0;
  }
}

@keyframes kvZoom {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.025);
  }
}

.kv-animation {
    animation: kvZoom 2s ease-in-out forwards, blurToClear 1.4s ease-in-out .4s forwards;
}

@keyframes fade-up {
    0% {
        opacity: 0;
        transform: translateY(100px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

[data-animation-type="fade-up"] {
    opacity: 0;
    transform: translateY(100px);
}

@keyframes left-down {
    0% {
      transform: translate(-200px, 20px);
    }
    100% {
      transform: translate(25px, 0px);
    }
}

.left-down-animation {
    animation: left-down 8s linear infinite;
}

@keyframes move-mask {
  from {
    mask-position: 10px 0px;
  }

  to {
    mask-position: 0px 0px;
  }
}

.animation-active.decoration-animation {
  mask-image: url("../image/reward/text-decoration.svg");

  -webkit-mask-repeat: no-repeat;
	-webkit-mask-size: cover;
  mask-repeat: no-repeat;
  mask-position: 10px 0px;
  mask-size: cover;
  animation: move-mask 1s ease-in-out forwards;
}