@charset "UTF-8";
/* ===== 雪を表示するコンテナのスタイル ===== */
.snow-container {
  position: relative;
  height: 100%;
  /* コンテナの高さ */
  width: 100%;
  /* コンテナの横幅 */
  overflow: hidden;
  /*background-color: #000;*/
  /* コンテナの背景 */
}

/* ===== 雪のスタイル ===== */
.snow {
  background-color: #fff;
  /* 雪の色 */
  border-radius: 50%;
  position: absolute;
  -webkit-animation: animate-snow 100s linear;
          animation: animate-snow 100s linear;
  z-index: 999;
}

/* ===== 雪のアニメーション ===== */
@-webkit-keyframes animate-snow {
  0% {
    opacity: 1;
    top: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    top: 100%;
  }
}
@keyframes animate-snow {
  0% {
    opacity: 1;
    top: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    top: 100%;
  }
}