.body {
  background-color: rgba(0, 0, 0, 1);
  height: 100vh;
  margin: 0;
  padding: 0;
}
.body:after {
  content: "";
  display: block;
  height: 100%;
  background-image: url("back.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: rgba(0, 0, 0, 1);
  animation: fadeInImage 3s forwards;
  /*
  filter: blur(2px);
  */
}
.contents {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
}
.banner {
  animation: fadeInBanner 5s forwards;
  margin-top: calc(35vh);
  text-shadow: 1px 1px 2px white, 1px 1px 1px black;
  text-align: center;
  user-select: none;
  z-Index: 100;
  font-weight: bold;
  .title {
    font-size: 40px;
  }
  .message {
    font-size: 30px;
  }
}
@keyframes fadeInImage {
  from { opacity: 0; }
  to { opacity: 0.5; }
}
@keyframes fadeInBanner {
  0% { opacity: 0; }
  30% { opacity: 0; }
  100% { opacity: 1; }
}