animation을 적용할 때

@keyframes splashAnimation {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

#splash-screen {
  ...

  animation: splashAnimation 0.3s ease-in-out forwards;
  animation-delay: 1s;
}

forwards를 써주면 splashAnimation의 마지막 효과를 유지해준다. 즉, 마지막 값을 유지하고싶을 경우 forward를 사용하면 된다.

추가로 animation을 쓸 경우 바로 재생되는데 이를 없애기 위해서는 animation-delay를 사용하면 된다.