.orange {
  color: #F8981A;
}

.gressn {
  color: #60AB44;
}

.fadeUp {
  opacity: 0;
}
.fadeUp.active {
  animation-name: fadeUpAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
}

.fadeScale {
  opacity: 0;
}
.fadeScale.active {
  animation-name: fadeScaleAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

.fadeSlide {
  opacity: 0;
}
.fadeSlide.active {
  animation-name: fadeslideAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px) rotate(10deg);
  }
  to {
    opacity: 1;
    transform: translateY(0) rotate(0deg);
  }
}
@keyframes fadeScaleAnime {
  from {
    opacity: 0;
    transform: translateY(-10em) scale(1.5);
    filter: blur(0.2em);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}
@keyframes fadeslideAnime {
  from {
    opacity: 0;
    transform: translateX(20em);
    filter: blur(0.2em);
  }
  to {
    opacity: 1;
    transform: translateX(0);
    filter: blur(0);
  }
}
.delay-time01 {
  animation-delay: 0.1s;
}

.delay-time02 {
  animation-delay: 0.2s;
}

.delay-time03 {
  animation-delay: 0.3s;
}

.delay-time04 {
  animation-delay: 0.4s;
}

.delay-time05 {
  animation-delay: 0.5s;
}

.delay-time06 {
  animation-delay: 0.6s;
}

.delay-time07 {
  animation-delay: 0.7s;
}

.delay-time08 {
  animation-delay: 0.8s;
}

.delay-time09 {
  animation-delay: 0.9s;
}

.delay-time10 {
  animation-delay: 1s;
}

@media screen and (max-width: 950px) {
  html {
    font-size: 1.8vw;
  }
  footer {
    font-size: 4vw;
  }
}
@media screen and (max-width: 600px) {
  html {
    font-size: 3vw;
  }
  .sp-br {
    display: block;
  }
  .section-title {
    width: 100%;
    padding: 1em;
  }
  .section-title h2 {
    font-size: 2.1em;
    text-align: center;
    width: 100%;
  }
  main {
    width: 100%;
    padding: 0em 1em 3em;
  }
  .top-text {
    width: calc(100% - 3em);
    margin: 0 auto 1em;
    text-align: left;
  }
  .main-title .main img {
    height: 5em;
  }
  .main-title .main h1 {
    font-size: 2.3em;
  }
  .flow-wrap .flow-line {
    width: 100%;
    margin-top: 8em;
    padding: 0 2em 2em;
    background: linear-gradient(90deg, #fae7f0 0%, #fae7f0 49%, rgb(255, 255, 255) 49%, rgb(255, 255, 255) 51%, #cfebfa 51%, #cfebfa 100%);
  }
  .flow-wrap .flow-line .icons {
    gap: 4.5em;
  }
  .flow-wrap .flow-line .icons .icon-wrap {
    margin-top: -5em;
  }
  .flow-wrap .flow-line .icons .icon-wrap .icon {
    width: 10em;
  }
  .flow-wrap .flow-line .side-by-side {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 1em;
  }
  .flow-wrap .flow-line .side-by-side img {
    width: 55%;
  }
  .flow-wrap .flow-line .side-by-side .documents {
    width: 45%;
  }
  .flow-wrap .flow-line .side-by-side .documents p {
    font-size: 1em;
  }
}/*# sourceMappingURL=responsive.css.map */