@charset "UTF-8";

.flake_wrap {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 1; }
  .flake_wrap .flake {
    position: absolute;
    top: -10%;
    -webkit-animation-name: snowflakes-fall,snowflakes-shake;
    animation-name: snowflakes-fall,snowflakes-shake;
    -webkit-animation-duration: 10s,3s;
    animation-duration: 10s,3s;
    -webkit-animation-timing-function: linear,ease-in-out;
    animation-timing-function: linear,ease-in-out;
    -webkit-animation-iteration-count: infinite,infinite;
    animation-iteration-count: infinite,infinite;
    -webkit-animation-play-state: running,running;
    animation-play-state: running,running;
    cursor: default;
    width: 1.2vw; }
    .flake_wrap .flake__01 {
      max-width: 24px;
      height: 20px;
      background-image: url("../images/flake01.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 1%;
      -webkit-animation-delay: 0s,0s;
      animation-delay: 0s,0s; }
    .flake_wrap .flake__02 {
      max-width: 27px;
      height: 34px;
      background-image: url("../images/flake02.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 10%;
      -webkit-animation-delay: 1s,1s;
      animation-delay: 1s,1s; }
    .flake_wrap .flake__03 {
      max-width: 19px;
      height: 25px;
      background-image: url("../images/flake03.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 20%;
      -webkit-animation-delay: 6s,5s;
      animation-delay: 6s,5s; }
    .flake_wrap .flake__04 {
      max-width: 30px;
      height: 26px;
      background-image: url("../images/flake04.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 30%;
      -webkit-animation-delay: 4s,2s;
      animation-delay: 4s,2s; }
    .flake_wrap .flake__05 {
      max-width: 24px;
      height: 25px;
      background-image: url("../images/flake05.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 40%;
      -webkit-animation-delay: 2s,2s;
      animation-delay: 2s,2s; }
    .flake_wrap .flake__06 {
      max-width: 32px;
      height: 30px;
      background-image: url("../images/flake06.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 50%;
      -webkit-animation-delay: 8s,3s;
      animation-delay: 8s,3s; }
    .flake_wrap .flake__07 {
      max-width: 29px;
      height: 30px;
      background-image: url("../images/flake07.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 60%;
      -webkit-animation-delay: 6s,2s;
      animation-delay: 6s,2s; }
    .flake_wrap .flake__08 {
      max-width: 22px;
      height: 27px;
      background-image: url("../images/flake08.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 70%;
      -webkit-animation-delay: 2.5s,1s;
      animation-delay: 2.5s,1s; }
    .flake_wrap .flake__09 {
      max-width: 24px;
      height: 20px;
      background-image: url("../images/flake01.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 80%;
      -webkit-animation-delay: 0s,0s;
      animation-delay: 0s,0s; }
    .flake_wrap .flake__10 {
      max-width: 27px;
      height: 34px;
      background-image: url("../images/flake02.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 90%;
      -webkit-animation-delay: 1s,1s;
      animation-delay: 1s,1s; }
    .flake_wrap .flake__11 {
      max-width: 19px;
      height: 25px;
      background-image: url("../images/flake03.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 100%;
      -webkit-animation-delay: 6s,5s;
      animation-delay: 6s,5s; }
    .flake_wrap .flake__12 {
      max-width: 30px;
      height: 26px;
      background-image: url("../images/flake04.png");
      background-size: 100%;
      background-position: 0 0;
      background-repeat: no-repeat;
      left: 95%;
      -webkit-animation-delay: 4s,2s;
      animation-delay: 4s,2s; }
  @media screen and (max-width: 540px) {
    .flake_wrap .flake {
      width: 3vw; } }
@-webkit-keyframes snowflakes-fall {
  0% {
    top: -10%; }
  100% {
    top: 100%; } }

@keyframes snowflakes-fall {
  0% {
    top: -10%; }
  100% {
    top: 100%; } }
@-webkit-keyframes snowflakes-shake {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px); }
  50% {
    -webkit-transform: translateX(80px);
    transform: translateX(80px); }
  100% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px); } }

@keyframes snowflakes-shake {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px); }
  50% {
    -webkit-transform: translateX(80px);
    transform: translateX(80px); }
  100% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px); } }