.PC{display: block;}
.SP{display:none;}

/* .title_top{margin:50px 0 0 0;} */
.title{text-align:center;}
.title h1{margin: 15px 0 0 0;}
.title p{margin-top: 30px;}
.title strong{color: #0A3F67;font-size: 50px;letter-spacing: 0.05em;}

.contents{display: flex;flex-direction: column;gap: 30px;margin: 0 auto 50px auto;}
.list{background: #EAEAEA;border-radius: 18px;height:fit-content;padding: 30px 50px;width: calc(100% - 100px);position: relative;}
.list h2{font-size: 16px;letter-spacing: 0.2em;font-weight: bold;}
.list p{margin-top: 10px;}
.list_more{display: block;position: absolute;bottom:30px;right:50px;border: solid 2px #0A3F67;background: #fff;color: #0A3F67;height: 35px;line-height: 35px;font-size: 14px;font-weight: bold;text-align: center;width: 180px;border-radius: 6px;}

@media screen and (max-width: 740px) {
.contents {margin: 80px auto;}
.title{padding: 0;}
.title_top{margin: 10px 0 20px 0;}
.title strong{font-size: 9vw;}
}
/* ここまで共通 */


/* ここからアニメーションCSS */

.top_contents { background: center/cover url(../img/bg_new.png);}
/* header{background: #99DDF6;} */
.mv {width: 100vw; height: 50vw; overflow: hidden;margin: -2vw 0 0 0;}

.mv_bg {position: absolute;}
.mv_bg.bdg {animation: bdg 1.6s ease 0s 1 normal running forwards;}
.mv_bg.odr {animation: bdg 1.6s ease .3s 1 normal running forwards;}
.mv_bg.flr {animation: bdg 1.6s ease .5s 1 normal running forwards; z-index:20;}
@keyframes bdg {
  0% {
    transform: translateY(50vw);
  }
  100% {
    transform: translateY(0);
  }
}

.mv_title {
  position: absolute;
  left: 0;
  right: 0;
  top: 12vw; /* Consider using top: 12svw if that's what you intended */
  width: fit-content;
  margin: 0 auto;
  animation: title 1.6s ease 1.5s 1 normal running both; /* Added 1.5s delay */
}.mv_title h1{font-size: 1.4vw;letter-spacing: 0.15em;}
/* .mv_copy{text-align: center;position:absolute;margin:0 auto;left:0;right:0;top: 15vw;animation: title 1.6s ease 0s 1 normal running both; letter-spacing: 0.1em;top: 13vw;} */
.mv_copy{text-align: center;letter-spacing: 0.1em;top: 13vw;font-size: 14px;color: #172d69;
font-size: 14px;
margin-top: 0px;
font-weight: 600;}
@keyframes title {
  0% {
    opacity: 0;
    transform: translateY(-50vw);
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.mv_kumo{animation: kumo 2s ease 0s 1 normal running both;}
@keyframes kumo {
  0% {
    opacity: 0;
    transform: translateY(50vw);
  }
  50% {
    opacity: 0;
  }
  100% {
    transform: translateY(0);
  }
}
.mv_kumo_l {position: absolute; left:-.1vw; top:2vw; width: 22vw;}
.mv_kumo_r {position: absolute; /*right: -4vw;*/right:-1vw; top: 8vw; width: 26.5vw;}
.mv_kumo img{width: 100%;}
.kumo_l{ animation: 2s fuwafuwa_l infinite;}
.kumo_r{ animation: 3s fuwafuwa_r infinite;}
/* このクラスをつけると回転を無限に繰り返します */
@keyframes fuwafuwa_l {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}
@keyframes fuwafuwa_r {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px);
  }
}

/* 追加 */
    .kumo_onde { position: absolute; bottom: 1vw; left: 7vw; transform: rotate(-12deg); overflow: hidden; width: 100px; height: 100px; top: 13vw; left: 8vw; transform: rotate(10deg); }
    .kumo_onde_hand { position: absolute; left: 0; animation: 10s kumo_onde_hand infinite; transition: 0.3s; animation-delay: 10s; }
    .kumo_onde_face { position: absolute; left: 0; animation: 10s kumo_onde_face infinite; transition: 0.3s; animation-delay: 10s; }

    @keyframes kumo_onde_hand {
        0% {
            bottom: -5vw;
            z-index: -2;
        }
        85% {
            bottom: -5vw;
            z-index: -2;
        }
        100% {
            bottom: 0;
            z-index: 2;
        }
    }

    @keyframes kumo_onde_face {
        0% {
            bottom: -5vw;
            z-index: -2;
        }
        90% {
            bottom: -5vw;
            z-index: -2;
        }
        100% {
            bottom: 0;
            z-index: 2;
        }
    }
.kumo_onde .hover_onde{position: absolute;z-index: -2;}
.kumo_onde:hover .hover_onde{display: block;transition:0.1s;z-index: 2;}
.akumo_onde .hover_onde1_c{top:-63px;}
.kumo_onde .hover_onde2_c{top:0;}
.kumo_onde:hover .hover_onde1_c{transition:0.1s;top:-78px;z-index: 2;}
.kumo_onde:hover .hover_onde2_c{transition:0.3s;top:-78px;z-index: -2;}


.mv_bird{width: 6vw;position: absolute;top: 11vw;left: 24vw; animation: wobbling_x 3s ease-in-out infinite alternate, wobbling_y 1s ease-in-out infinite alternate, bird .5s ease-in-out 1.8s normal running both;}
.mv_bird img{width: 100%;}
    @keyframes wobbling_x {
    	0% {
    		margin-left: 20px;
    	}
    	100% {
    		margin-left: 0px;
    	}
    }
    @keyframes wobbling_y {
    	0% {
    		margin-top: 0px;
    	}
    	100% {
    		margin-top: 15px;
    	}
    }
    @keyframes bird {
      0% {
        transform: scale(0) rotate(-5deg);
      }
      50% {
        transform: scale(2);
      }
      100% {
        transform: scale(1) rotate(0);
      }
    }

.mv_hand1{position: absolute;right: 8vw;top: 18.1vw;width: 7vw; animation: hand .5s ease-in-out 1.7s normal running both; }
.mv_hand1 img{width: 100%;}
.mv_hand2{position: absolute;right: 2vw;top: 16.5vw;width: 7vw; animation: hand .5s ease-in-out 1.9s normal running both;}
.mv_hand2 img{width: 100%;}
@keyframes hand {
  0% {
    transform: scale(0) rotate(-2deg);
  }
  50% {
    transform: scale(1.5);
  }
  100% {
    transform: scale(1) rotate(-9deg);
  }
}


.mv_title img{width: 100%;}
/* .mv_ {display:flex; width:76vw; height:100%; position:absolute; right:0; bottom:0; animation:anim1 40s linear infinite;} */
.mv_person{position: absolute;right: 0;bottom: 2.5vw;width: 84.5vw;height:180px;overflow: hidden; animation: person 1.6s ease .3s 1 normal running forwards;}
.mv_imgs {display:flex; height:100%; animation:anim1 28s linear infinite;}
.mv_imgs.mv2 {margin-top:-180px;animation:anim2 48s linear infinite; }
.next .mv_imgs{animation:anim3 28s linear infinite;}
.next .mv_imgs.mv2{animation:anim4 48s linear infinite;}
.mv_person img{margin-right: 0;height: 100%;}
@keyframes person {
  0% {
    transform: translateY(50vw) rotate(5deg) skew(3deg,0deg);
    -webkit-transform: translate3d(0, 50vw, 0) rotate(5deg) skew(3deg,0deg);
  }
  100% {
    transform: translateY(0) rotate(5deg) skew(3deg,0deg);
    -webkit-transform: translate3d(0, 0, 0) rotate(5deg) skew(3deg,0deg);
  }
}

@keyframes anim1 {
  0% {
transform: translateX(0%) scale(100%);
-webkit-transform: translate3d(0%, 0, 0);

  /* transform: translateX(-50%) scale(100%); */
  }
  100% {
transform: translateX(-100%) scale(90%);
-webkit-transform: translate3d(-100%, 0, 0);
  /* transform: translateX(-150%) scale(90%); */
  }
}
@keyframes anim2 {
  0% {
transform: translateX(120%) scale(100%);
-webkit-transform: translate3d(120%, 0, 0);
  /* transform: translateX(70%) scale(100%); */
  }
  100% {
transform: translateX(-120%) scale(90%);
-webkit-transform: translate3d(-120%, 0, 0);
  /* transform: translateX(-170%) scale(90%); */
  }
}
@keyframes anim3 {
  0% {
transform: translateX(100%) scale(110%);
-webkit-transform: translate3d(100%, 0, 0);
  /* transform: translateX(50%)scale(110%); */
  }
  100% {
transform: translateX(0%) scale(100%);
-webkit-transform: translate3d(0%, 0, 0);
  /* transform: translateX(-50%) scale(100%); */
  }
}
@keyframes anim4 {
  0% {
transform: translateX(320%) scale(110%);
-webkit-transform: translate3d(320%, 0, 0);
  /* transform: translateX(270%) scale(110%); */
  }
  100% {
transform: translateX(120%) scale(100%);
-webkit-transform: translate3d(120%, 0, 0);
  /* transform: translateX(70%) scale(100%); */
  }
}




/* 全体共通レスポンシブ */
@media screen and (max-width: 740px) {
.PC{display: none;}
.SP{display:block;}
.contents {margin: 40px auto;}
.list{padding: 30px;position: inherit;width: calc(100% - 60px);}
.list h2{margin-top: 10px;}
.list_more{position: inherit;margin: 20px auto 0;}

}

.mv.SP .fukidashi_open { width:45%; max-width:500px; position:absolute; right:2.5%; bottom:35vw; }
@media screen and (min-width: 740px) {
  .fukidashi_open { width:40%; max-width:500px; position:absolute; right:0; top:10vw; }
}