/**調整用**/
.header-mag {
  margin-top: 5rem;
}

@media (min-width: 820px) {
  .header-mag {
    margin-top: 0;
  }
}
html {
  scroll-behavior: smooth;
}

.cap-h1-zai-box-zai::after {
  content: "";
  display: block;
  position: absolute;
  background-size: contain;
  background-image: url(/assets/images/area-cp/zai-top-15000-re.svg);
  background-repeat: no-repeat;
  transform: translateY(0%) translateX(-6%);
  width: 16rem;
  height: 12rem;
  top: 2rem;
  right: 0rem;
  animation: yureru-s-zai 5s infinite;
}

.area-top-posi-re {
  position: relative;
  margin: 0 auto;
  height: 30rem;
}


.area-top-posi-re .top-all {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.area-top-posi-re .top-anime-01 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  animation: image1 1s forwards 0.5s, bounce-in-top 1s 1s both, bounce-in-top2 1.3s 2s infinite;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  overflow: hidden
}



@keyframes image1 {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes bounce-in-top {
  0% {
    transform: translateY(-500px);
    animation-timing-function: ease-in;
    opacity: 0;
  }

  38% {
    transform: translateY(0);
    animation-timing-function: ease-out;
    opacity: 1;
  }

  55% {
    transform: translateY(-60px);
    animation-timing-function: ease-in;
  }

  72% {
    transform: translateY(0);
    animation-timing-function: ease-out;
  }

  81% {
    transform: translateY(-30px);
    animation-timing-function: ease-in;
  }

  90% {
    transform: translateY(0);
    animation-timing-function: ease-out;
  }

  95% {
    transform: translateY(-10px);
    animation-timing-function: ease-in;
  }

  100% {
    transform: translateY(0);
    animation-timing-function: ease-out;
  }
}


@keyframes bounce-in-top2 {


  38% {
    transform: translateY(0);
    animation-timing-function: ease-out;
    opacity: 1;
  }

  55% {
    transform: translateY(-30px);
    animation-timing-function: ease-in;
  }

  72% {
    transform: translateY(0);
    animation-timing-function: ease-out;
  }

  81% {
    transform: translateY(-15px);
    animation-timing-function: ease-in;
  }

  90% {
    transform: translateY(0);
    animation-timing-function: ease-out;
  }

  95% {
    transform: translateY(-5px);
    animation-timing-function: ease-in;
  }

  100% {
    transform: translateY(0);
    animation-timing-function: ease-out;
  }
}

.top-zai-und-text-area {
  z-index: 10;
}

.cap-h1-zai-box-zai {
  position: relative;
  margin-top: 0rem;
}

.zai-re-dl-box {
  margin: 0;
}

.zai-re-dl {
  margin-left: 0rem;
}

@media (min-width: 780px) {
  .area-top-posi-re {
    height: 30rem;
  }

  .cap-h1-zai-box-zai {
    position: relative;
    margin-top: 0rem;
  }

  .thumb .slick-slide,
  .thumb02 .slick-slide {
    flex: 0 0 30% !important;
  }

  .area-job-bg {
    padding: 1rem 1.5rem !important;
  }

  .zai-re-dl {
    margin-left: 0rem !important;
  }

  .cap-h1-zai-box-zai::after {
    width: 16rem !important;
    height: 12rem !important;
  }

  .sec-access-bg {
    height: 65rem !important;
  }

}