@charset "UTF-8";
/* ---------------------------------------------------------------------------
  ★ロードアニメーション
--------------------------------------------------------------------------- */
.fade-in {
  opacity: 0;
  /* 初期状態では透明にする */
  transform: translateX(-20px);
  transition: opacity 0.2s ease, transform 0.95s ease;
  /* アニメーションのプロパティとタイミングを設定 */
}

.fade-in.active {
  opacity: 1;
  /* フェードイン時に不透明にする */
  transform: translateY(0);
  /* 上昇を停止して表示 */
}

.d0 {
  transition-delay: 0.1s;
}

.d01 {
  transition-delay: 0.2s;
}

.d02 {
  transition-delay: 0.4s;
}

.d03 {
  transition-delay: 0.6s;
}

.d04 {
  transition-delay: 0.8s;
}

.d05 {
  transition-delay: 1s;
}

.d06 {
  transition-delay: 1.2s;
}

.d07 {
  transition-delay: 1.4s;
}

.d08 {
  transition-delay: 1.5s;
}

.d09 {
  transition-delay: 1.6s;
}

.d10 {
  transition-delay: 1.7s;
}

.d11 {
  transition-delay: 1.8s;
}

.d12 {
  transition-delay: 1.9s;
}

/* ---------------------------------------------------------------------------
    ★スクロールアニメーション
  --------------------------------------------------------------------------- */
.elem {
  position: relative;
}

.f01,
.f02,
.f03,
.f04,
.f05,
.f06,
.f07,
.f08,
.f09,
.f010,
.f011,
.f012,
.f013,
.f014,
.f015,
.f016 {
  opacity: 0;
}

.isAnimate .f01,
.isAnimate .f02,
.isAnimate .f03,
.isAnimate .f04,
.isAnimate .f05,
.isAnimate .f06,
.isAnimate .f07,
.isAnimate .f08,
.isAnimate .f09,
.isAnimate .f010,
.isAnimate .f011,
.isAnimate .f012,
.isAnimate .f013,
.isAnimate .f014,
.isAnimate .f015,
.isAnimate .f016 {
  animation: fadeDown 0.6s cubic-bezier(0.43, 0.05, 0.47, 1.03) forwards;
}

.isAnimate .f01 {
  animation-delay: 0.1s;
}

.isAnimate .f02 {
  animation-delay: 0.2s;
}

.isAnimate .f03 {
  animation-delay: 0.3s;
}

.isAnimate .f04 {
  animation-delay: 0.4s;
}

.isAnimate .f05 {
  animation-delay: 0.5s;
}

.isAnimate .f06 {
  animation-delay: 0.6s;
}

.isAnimate .f07 {
  animation-delay: 0.7s;
}

.isAnimate .f08 {
  animation-delay: 0.8s;
}

.isAnimate .f09 {
  animation-delay: 0.9s;
}

.isAnimate .f010 {
  animation-delay: 1s;
}

.isAnimate .f011 {
  animation-delay: 1.1s;
}

.isAnimate .f012 {
  animation-delay: 1.2s;
}

.isAnimate .f013 {
  animation-delay: 1.3s;
}

.isAnimate .f014 {
  animation-delay: 1.4s;
}

.isAnimate .f015 {
  animation-delay: 1.5s;
}

.isAnimate .f016 {
  animation-delay: 1.6s;
}

@keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translate(0px, 40px);
  }
  100% {
    opacity: 1;
    transform: translate(0px, 0px);
  }
}
@keyframes fadeDown {
  0% {
    opacity: 0;
    transform: translate(0px, -40px);
  }
  100% {
    opacity: 1;
    transform: translate(0px, 0px);
  }
}
/* ---------------------------------------------------------------------------
  ★画像が左から右に現れる
--------------------------------------------------------------------------- */
.img-wrap {
  overflow: hidden;
  position: relative;
}

.img-wrap::before {
  animation: img-wrap 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  animation-fill-mode: both;
  background: #fff;
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}

@keyframes img-wrap {
  100% {
    transform: translateX(100%);
  }
}
/* ---------------------------------------------------------------------------
  ★1文字ずつ現れる
--------------------------------------------------------------------------- */
.h2Animation p.mainTitle1:nth-child(1) span:nth-child(1) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.2s;
}

.h2Animation p.mainTitle1:nth-child(1) span:nth-child(2) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.23s;
}

.h2Animation p.mainTitle1:nth-child(1) span:nth-child(3) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.26s;
}

.h2Animation p.mainTitle1:nth-child(1) span:nth-child(4) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.29s;
}

.h2Animation p.mainTitle1:nth-child(1) span:nth-child(5) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.32s;
}

.h2Animation p.mainTitle1:nth-child(1) span:nth-child(6) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.35s;
}

.h2Animation p.mainTitle1:nth-child(1) span:nth-child(7) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.38s;
}

.h2Animation p.mainTitle1:nth-child(1) span:nth-child(8) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.41s;
}

.h2Animation p.mainTitle1:nth-child(1) span:nth-child(9) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.44s;
}

.h2Animation p.mainTitle1:nth-child(2) span:nth-child(5) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.6s;
}
.h2Animation p.mainTitle1:nth-child(2) span:nth-child(5) img {
  margin-top: 0.6vw;
  margin-left: 1rem;
}

.h2Animation p.mainTitle1:nth-child(2) span:nth-child(6) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.61s;
}
.h2Animation p.mainTitle1:nth-child(2) span:nth-child(6) img {
  margin-top: 0.6vw;
}

.h2Animation p.mainTitle1:nth-child(2) span:nth-child(7) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.62s;
}
.h2Animation p.mainTitle1:nth-child(2) span:nth-child(7) img {
  margin-top: 0.6vw;
  margin-left: 0.4rem;
}

.h2Animation p.mainTitle1:nth-child(2) span:nth-child(8) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.63s;
}
.h2Animation p.mainTitle1:nth-child(2) span:nth-child(8) img {
  margin-top: 0.6vw;
}

.h2Animation p.mainTitle1:nth-child(2) span:nth-child(9) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.64s;
}
.h2Animation p.mainTitle1:nth-child(2) span:nth-child(9) img {
  margin-top: 0.6vw;
  margin-left: 0.3rem;
}

.h2Animation p.mainTitle1:nth-child(2) span:nth-child(10) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.65s;
}
.h2Animation p.mainTitle1:nth-child(2) span:nth-child(10) img {
  margin-top: 0.6vw;
}

.h2Animation p.mainTitle1:nth-child(2) span:nth-child(11) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.66s;
}
.h2Animation p.mainTitle1:nth-child(2) span:nth-child(11) img {
  margin-top: 0.6vw;
}

.h2Animation p.mainTitle1:nth-child(2) span:nth-child(12) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.67s;
}
.h2Animation p.mainTitle1:nth-child(2) span:nth-child(12) img {
  margin-top: 0.6vw;
}

.h2Animation p.mainTitle1:nth-child(4) span:nth-child(1) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.8s;
}
.h2Animation p.mainTitle1:nth-child(4) span:nth-child(1) img {
  margin-left: 0.3rem;
  margin-top: -0.1vw;
}

.h2Animation p.mainTitle1:nth-child(4) span:nth-child(2) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.81s;
}
.h2Animation p.mainTitle1:nth-child(4) span:nth-child(2) img {
  margin-top: -0.1vw;
}

.h2Animation p.mainTitle1:nth-child(4) span:nth-child(3) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.82s;
}
.h2Animation p.mainTitle1:nth-child(4) span:nth-child(3) img {
  margin-top: -0.1vw;
}

.h2Animation p.mainTitle1:nth-child(4) span:nth-child(4) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.83s;
}
.h2Animation p.mainTitle1:nth-child(4) span:nth-child(4) img {
  margin-top: -0.1vw;
}

.h2Animation p.mainTitle1:nth-child(4) span:nth-child(5) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.84s;
}
.h2Animation p.mainTitle1:nth-child(4) span:nth-child(5) img {
  margin-top: -0.1vw;
  margin-left: 0.2rem;
}

.h2Animation p.mainTitle1:nth-child(4) span:nth-child(6) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.85s;
}
.h2Animation p.mainTitle1:nth-child(4) span:nth-child(6) img {
  margin-top: -0.1vw;
  margin-left: 0.2rem;
}

.h2Animation p.mainTitle1:nth-child(4) span:nth-child(7) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.86s;
}
.h2Animation p.mainTitle1:nth-child(4) span:nth-child(7) img {
  margin-top: -0.1vw;
  margin-left: 0.1rem;
}

.h2Animation p.mainTitle1:nth-child(4) span:nth-child(8) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.87s;
}
.h2Animation p.mainTitle1:nth-child(4) span:nth-child(8) img {
  margin-top: -0.1vw;
  margin-left: 0.1rem;
}

.h2Animation p.mainTitle1:nth-child(4) span:nth-child(9) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.88s;
}
.h2Animation p.mainTitle1:nth-child(4) span:nth-child(9) img {
  margin-top: -0.1vw;
  margin-left: 0.1rem;
}

/*１行用　mainTitle1_01*/
.mainTitle1_01 span:nth-child(1) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0s;
}

.mainTitle1_01 span:nth-child(2) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.1s;
}

.mainTitle1_01 span:nth-child(3) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.2s;
}

.mainTitle1_01 span:nth-child(4) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.3s;
}

.mainTitle1_01 span:nth-child(5) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.12s;
}

.mainTitle1_01 span:nth-child(6) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.15s;
}

.mainTitle1_01 span:nth-child(7) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.18s;
}

.mainTitle1_01 span:nth-child(8) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.21s;
}

.mainTitle1_01 span:nth-child(9) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.24s;
}

.mainTitle1_01 span:nth-child(10) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.27s;
}

.mainTitle1_01 span:nth-child(11) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.3s;
}

.mainTitle1_01 span:nth-child(12) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.33s;
}

.mainTitle1_01 span:nth-child(13) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.36s;
}

.mainTitle1_01 span:nth-child(14) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.39s;
}

.mainTitle1_01 span:nth-child(15) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.42s;
}

.mainTitle1_01 span:nth-child(16) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.45s;
}

.mainTitle1_01 span:nth-child(17) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.48s;
}

.mainTitle1_01 span:nth-child(18) {
  animation: mainTitle1 0.4s cubic-bezier(0.27, -0.11, 0.4, 1.21);
  animation-fill-mode: forwards;
  animation-delay: 0.51s;
}

_::-webkit-full-page-media .h2Animation p.mainTitle1 span,
_:future .h2Animation p.mainTitle1 span,
:root .h2Animation p.mainTitle1 span {
  opacity: 0;
}
@keyframes mainTitle1 {
  0% {
    top: 1.38em;
    opacity: 0;
  }
  100% {
    top: 0em;
    opacity: 1;
  }
}
p.mainTitle1 {
  white-space: pre-line;
  overflow: hidden;
  line-height: 120%;
}

p.mainTitle1 span,
.mainTitle1_01 span {
  display: inline;
  top: 1.38em;
  position: relative;
}

.mainTitle1_01 {
  white-space: pre-line;
  overflow: hidden;
}/*# sourceMappingURL=animation.css.map */