/* ========================================
   01. Base
======================================== */

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  min-width:320px;
  font-family:"fot-tsukuardgothic-std","hiragino-kaku-gothic-pron","Hiragino Sans","Yu Gothic","YuGothic",sans-serif;
  color:#222;
  background:#fff;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

img{
  display:block;
  max-width:100%;
  height:auto;
  vertical-align:bottom;
}

a{
  color:inherit;
  text-decoration:none;
}

ul,
ol{
  margin:0;
  padding:0;
  list-style:none;
}

p,
h1,
h2,
h3,
h4,
h5,
h6{
  margin:0;
}

button,
input,
textarea,
select{
  font:inherit;
}

/* ========================================
   02. Layout
======================================== */

.l-container{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
}

/* ========================================
   03. Hero
======================================== */

.p-muhi-hero{
  position:relative;
  overflow:hidden;
}

.p-muhi-hero__visual{
  position:relative;
  height:540px;
}

.p-muhi-hero__line{
  position:absolute;
  top:0;
  left:50%;
  width:1440px;
  max-width:none;
  opacity:0;
  transform:translateX(-50%) translateY(60px);
}

.p-muhi-hero__red{
  position:absolute;
  top:0;
  left:0;
  width:60%;
  opacity:0;
  transform:translateX(-80px);
}

.p-muhi-hero__lead{
  padding:160px 20px 64px;
  text-align:center;
  opacity:0;
  transform:translateY(40px);
}

.p-muhi-hero__lead p{
  color:#ff1a1a;
  font-size:28px;
  font-weight:700;
  line-height:1.9;
  letter-spacing:0.04em;
}

/* ========================================
   03. Hero SP
======================================== */

@media screen and (max-width: 767px){
  .l-container{
    padding:0 16px;
  }

  .p-muhi-hero__visual{
    height:460px;
  }

  .p-muhi-hero__line{
    top:0;
    left:50%;
    width:980px;
    transform:translateX(-50%) translateY(40px);
  }

  .p-muhi-hero__red{
    width:90%;
    max-width:none;
    transform:translateX(-40px);
  }

  .p-muhi-hero__lead{
    padding:24px 16px 56px;
  }

  .p-muhi-hero__lead p{
    font-size:14px;
    line-height:1.95;
    letter-spacing:0.03em;
  }
}

/* ========================================
   04. Project - 産学連携で挑む、新しいポケムヒ
======================================== */

.p-muhi-project{
  padding:104px 0 20px;
  overflow:hidden;
}

.p-muhi-project__head{
  text-align:center;
}

.p-muhi-project__title{
  display:flex;
  justify-content:center;
  gap:0.01em;
  font-family:"effra","Yu Gothic","YuGothic",sans-serif;
  font-size:76px;
  font-weight:700;
  line-height:1;
  letter-spacing:0.01em;
  color:#ff1a1a;
  opacity:0;
  transform:translateY(24px);
}

.p-muhi-project__title span{
  display:inline-block;
}

.p-muhi-project__lead{
  margin-top:34px;
  font-size:34px;
  font-weight:700;
  line-height:1.5;
  letter-spacing:0.02em;
  opacity:0;
  transform:translateY(24px);
}

.p-muhi-project__body{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:32px;
  margin-top:86px;
}

.p-muhi-project__text{
  flex:0 0 480px;
  max-width:480px;
  font-size:16px;
  font-weight:400;
  line-height:1.8;
  letter-spacing:0.02em;
}

.p-muhi-project__text p + p{
  margin-top:16px;
}

.p-muhi-project__imageWrap{
  flex:0 0 420px;
  text-align:right;
  opacity:0;
  transform:translateY(28px) scale(0.94);
  transform-origin:center center;
}

.p-muhi-project__image{
    display:block;
    margin:0 auto;
    width:100%;
}

.p-muhi-project__copyright{
  margin-top:9px;
  font-size:12px;
  font-weight:400;
  line-height:1.4;
  position: relative;
  left: -60px;
}

@media screen and (max-width: 767px){
  .p-muhi-project{
    padding:72px 0 84px;
  }

  .p-muhi-project__title{
    font-size:58px;
  }

  .p-muhi-project__lead{
    margin-top:18px;
    font-size:26px;
    line-height:1.45;
  }

  .p-muhi-project__body{
    display:flex;
    flex-direction:column-reverse;
    gap:44px;
    margin-top:44px;
  }

  .p-muhi-project__text{
    flex:1;
    max-width:520px;
    margin:0 auto;
    padding:0 30px;
    font-size:14px;
    line-height:2;
    letter-spacing:0.01em;
  }

  .p-muhi-project__text p + p{
    margin-top:10px;
  }

  .p-muhi-project__imageWrap{
    flex:0 0 auto;
    width:100%;
    max-width:336px;
  }

  .p-muhi-project__copyright{
    margin-top:10px;
    font-size:14px;
  }
}

/* ========================================
   05. Company - 産学連携ロゴ
======================================== */

.p-muhi-company{
  padding:10px 0 10px;
  position: relative;
  margin-top: -30px;
  z-index: 2;
}

.p-muhi-company__stage{
  position:relative;
  width:100%;
  max-width:520px;
  height:400px;
  margin:0 auto;
}

.p-muhi-company__bg{
  position:absolute;
  top:78px;
  left:50%;
  width:300px;
  opacity:0;
  transform:translateX(-50%) scale(0.7);
  transition:opacity 0.2s linear;
  pointer-events:none;
}

.p-muhi-company__item{
  position:absolute;
  width:150px;
  will-change:transform;
  opacity:0;
}

.p-muhi-company__logo{
  display:block;
  width:100%;
}

.p-muhi-company__item--muhi{
  top:0;
  left:50%;
}

.p-muhi-company__item--nua{
  bottom:18px;
  left:50px;
}

.p-muhi-company__item--jeki{
  bottom:18px;
  right:50px;
}

@media screen and (max-width: 767px){
  .p-muhi-company{
    padding:58px 0 60px;
    margin-top: -120px;
    z-index: 2;
  }

  .p-muhi-company__stage{
    max-width:320px;
    height:300px;
  }

  .p-muhi-company__bg{
    top:42px;
    width:250px;
  }

  .p-muhi-company__item{
    width:110px;
  }

  .p-muhi-company__item--muhi{
    top:0;
    left:50%;
  }

  .p-muhi-company__item--nua{
    bottom:10px;
    left:20px;
  }

  .p-muhi-company__item--jeki{
    bottom:10px;
    right:20px;
  }
}

/* ========================================
   06. Purpose　- 授業のねらい
======================================== */

.p-muhi-purpose{
  padding:80px 0 120px;
}

.p-muhi-purpose__box{
  position:relative;
  max-width:820px;
  margin:0 auto;
  padding:120px 36px 30px;
  background:#f7eded;
  border-radius:10px;
}

.p-muhi-purpose__label{
  position:absolute;
  top:26px;
  left:50%;
  min-width:320px;
  padding:24px 40px 22px;
  border-radius:999px;
  background:#ff1208;
  color:#fff;
  font-size:16px;
  font-weight:400;
  line-height:1;
  letter-spacing:0.02em;
  text-align:center;
  transform:translateX(-50%);
}

.p-muhi-purpose__item{
  padding:20px 0 18px;
}

.p-muhi-purpose__item + .p-muhi-purpose__item{
  border-top:2px dashed rgba(255,18,8,0.35);
}

.p-muhi-purpose__item p{
  font-size:16px;
  font-weight:400;
  line-height:1.9;
  letter-spacing:0.01em;
}

@media screen and (max-width: 767px){
  .p-muhi-purpose{
    padding:56px 0 84px;
  }

  .p-muhi-purpose__box{
  padding:92px 24px 22px;
  border-radius:10px;
}

.p-muhi-purpose__label{
  top:22px;
  min-width:190px;
  padding:16px 28px 15px;
  font-size:16px;
  transform:translateX(-50%);
  }

  .p-muhi-purpose__item{
    padding:28px 0 26px;
  }

  .p-muhi-purpose__item + .p-muhi-purpose__item{
    border-top:2px dashed rgba(255,18,8,0.35);
  }

  .p-muhi-purpose__item p{
    font-size:14px;
    font-weight:400;
    line-height:1.9;
    letter-spacing:0.01em;
  }
}

/* ========================================
   07. ClassRoom Process - チームでデザインコンセプト
======================================== */

.p-muhi-classroom{
  overflow:hidden;
}

.p-muhi-classroom__head{
  position:relative;
  overflow:hidden;
}

.p-muhi-classroom__bg{
  height:400px;
  background:url("../assets/img/muhi/classroom-bg-line.png") no-repeat center top;
  background-size:cover;
}

.p-muhi-classroom__titleWrap{
  position:relative;
  z-index:2;
  margin-top:-78px;
  text-align:center;
}

.p-muhi-classroom__title{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:0.01em;
  font-family:"effra","Yu Gothic","YuGothic",sans-serif;
  font-size:64px;
  font-weight:700;
  line-height:1;
  letter-spacing:0.01em;
  color:#ff1208;
  opacity:0;
  transform:translateY(24px);
}

.p-muhi-classroom__title span{
  display:inline-block;
}

.p-muhi-classroom__lead{
  margin-top:24px;
  font-size:28px;
  font-weight:700;
  line-height:1.5;
  letter-spacing:0.02em;
  opacity:0;
  transform:translateY(24px);
}

.p-muhi-classroom__body{
  padding:68px 0 120px;
}

/* Process Layout */

.p-muhi-classroom__process{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  flex-direction:row;
}

.p-muhi-classroom__process + .p-muhi-classroom__process{
  margin-top:56px;
}


/* Photo */

.p-muhi-classroom__photoWrap{
  flex:0 0 380px;
  opacity:0;
  transform:translateY(36px) scale(0.96);
}

.p-muhi-classroom__process--01 .p-muhi-classroom__photoWrap,
.p-muhi-classroom__process--03 .p-muhi-classroom__photoWrap,
.p-muhi-classroom__process--05 .p-muhi-classroom__photoWrap{
  flex-basis:360px;
}

.p-muhi-classroom__process--02 .p-muhi-classroom__photoWrap,
.p-muhi-classroom__process--04 .p-muhi-classroom__photoWrap,
.p-muhi-classroom__process--06 .p-muhi-classroom__photoWrap{
  flex-basis:380px;
}

.p-muhi-classroom__photo{
  display:block;
  width:100%;
  border-radius:24px;
}

/* Content */

.p-muhi-classroom__content{
  position:relative;
  width:100%;
  max-width:380px;
  opacity:0;
  transform:translateY(28px);
}

/* Icon */

.p-muhi-classroom__icon{
  position:absolute;
  opacity:0;
  width:80px;
  transform-origin:center;
}

.p-muhi-classroom__process--01 .p-muhi-classroom__icon{
  top:-18px;
  right:-6px;
  width:68px;
}

.p-muhi-classroom__process--02 .p-muhi-classroom__icon{
  top:-68px;
  right:1px;
  width:74px;
}

.p-muhi-classroom__process--03 .p-muhi-classroom__icon{
  top:-10px;
  right:0;
  width:92px;
}

.p-muhi-classroom__process--04 .p-muhi-classroom__icon{
  top:-18px;
  right:20px;
  width:88px;
}

.p-muhi-classroom__process--05 .p-muhi-classroom__icon{
  top:-55px;
  right:10px;
  width:120px;
}

.p-muhi-classroom__process--06 .p-muhi-classroom__icon{
  top:-14px;
  right:-46px;
  width:140px;
}

/* Text */

.p-muhi-classroom__processLabel{
  display:inline-block;
  padding-bottom:6px;
  border-bottom:3px solid #ff1208;
  color:#ff1208;
  font-family:"din-condensed","DINAlternate","DINCondensed",Arial,sans-serif;
  font-size:22px;
  font-weight:500;
  line-height:1;
  letter-spacing:0.12em;
}

.p-muhi-classroom__processLabel span{
  margin-left:4px;
  font-size:42px;
  font-weight:700;
  letter-spacing:0.01em;
}

.p-muhi-classroom__processTitle{
  margin-top:16px;
  color:#ff1208;
  font-size:28px;
  font-weight:700;
  line-height:1.45;
  letter-spacing:0.02em;
}

.p-muhi-classroom__text{
  margin-top:14px;
  font-size:16px;
  line-height:1.8;
  letter-spacing:0.01em;
}

/* Responsive */

@media screen and (max-width: 767px){

  .p-muhi-classroom__bg{
    height:170px;
  }

  .p-muhi-classroom__bgImage{
    width:900px;
  }

  .p-muhi-classroom__titleWrap{
    margin-top:0;
  }

  .p-muhi-classroom__title{
    font-size:40px;
    line-height:1.05;
  }

  .p-muhi-classroom__lead{
    margin-top:16px;
    font-size:18px;
  }

  .p-muhi-classroom__body{
    padding:40px 0 72px;
  }

  .p-muhi-classroom__process{
    flex-direction:column;
    gap:22px;
  }

  .p-muhi-classroom__process + .p-muhi-classroom__process{
    margin-top:-100px;
  }

  .p-muhi-classroom__photoWrap{
    width:100%;
    max-width:320px;
  }

  .p-muhi-classroom__content{
    max-width:none;
    padding:0 20px;
  }

  .p-muhi-classroom__icon{
    width:64px;
  }

  .p-muhi-classroom__process--01 .p-muhi-classroom__icon{
    top:-10px;
    right:6px;
    width:56px;
  }

  .p-muhi-classroom__process--02 .p-muhi-classroom__icon{
    top:-26px;
    right:38px;
    width:48px;
  }

  .p-muhi-classroom__process--03 .p-muhi-classroom__icon{
    top:20px;
    right:28px;
    width:50px;
  }

  .p-muhi-classroom__process--04 .p-muhi-classroom__icon{
    top:14px;
    right:14px;
    width:65px;
  }

  .p-muhi-classroom__process--05 .p-muhi-classroom__icon{
    top:-10px;
    right:30px;
    width:65px;
  }

  .p-muhi-classroom__process--06 .p-muhi-classroom__icon{
    top:4px;
    right:4px;
    width:85px;
  }

  .p-muhi-classroom__processLabel{
    font-size:18px;
  }

  .p-muhi-classroom__processLabel span{
    font-size:38px;
  }

  .p-muhi-classroom__processTitle{
    font-size:22px;
  }

  .p-muhi-classroom__text{
    font-size:15px;
    line-height:1.9;
  }

    .p-muhi-classroom__process{
    flex-direction:column;
    gap:22px;
  }

  .p-muhi-classroom__process--01,
  .p-muhi-classroom__process--03,
  .p-muhi-classroom__process--05{
    flex-direction:column-reverse;
  }

}

.p-muhi-classroom__end{
  position:relative;
  height:315px;
  overflow:visible;
  background:linear-gradient(90deg, #ff1208 0%, #ff6f79 100%);
}

.p-muhi-classroom__end::before{
  content:"";
  position:absolute;
  top:0;
  left:50%;
  width:120%;
  height:240px;
  background:#fff;
  border-radius:0 0 50% 50% / 0 0 100% 100%;
  transform:translateX(-50%);
}

.p-muhi-classroom__endLine{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:center;
  padding-top:18px;
}

.p-muhi-classroom__endImage{
  width:520px;
  max-width:100%;
  transform:translateY(-120px);
}

@media screen and (max-width: 767px){
  .p-muhi-classroom__end{
    height:180px;
  }

  .p-muhi-classroom__end::before{
    height:120px;
    width:140%;
  }

  .p-muhi-classroom__endLine{
    padding-top:10px;
  }

  .p-muhi-classroom__endImage{
    width:280px;
  }
}

/* ========================================
   08. Student Work - 学生作品の発表
======================================== */

.p-muhi-student-work{
  padding:120px 0 120px;
  background:#f8f1f1;
  overflow:hidden;
}

/* Head */

.p-muhi-student-work__head{
  text-align:center;
}

.p-muhi-student-work__title{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:0.01em;
  font-family:"effra","Yu Gothic","YuGothic",sans-serif;
  font-size:64px;
  font-weight:700;
  line-height:1;
  letter-spacing:0.01em;
  color:#ff1208;
  opacity:0;
  transform:translateY(24px);
}

.p-muhi-student-work__title span{
  display:inline-block;
}

.p-muhi-student-work__lead{
  margin-top:20px;
  font-size:28px;
  font-weight:700;
  line-height:1.4;
  letter-spacing:0.02em;
  opacity:0;
  transform:translateY(24px);
}

/* List */

.p-muhi-student-work__list{
  display:flex;
  flex-direction:column;
  gap:72px;
  margin-top:70px;
}

/* Card */

.p-muhi-student-work__card{
  padding:36px 32px 40px;
  border:2px solid #ff1208;
  border-radius:28px;
  background:#fff;
}

.p-muhi-student-work__card:nth-child(2) .p-muhi-student-work__package{
  width:375px;
  left:52%;
  top:48%
}

.p-muhi-student-work__card:nth-child(3) .p-muhi-student-work__package{
  width:340px;
  top:48%
}


/* Visual */

.p-muhi-student-work__visual{
  position:relative;
  height:760px;
  overflow:hidden;
}

.p-muhi-student-work__circle{
  position:absolute;
  top:50%;
  left:50%;
  width:600px;
  height:600px;
  border-radius:50%;
  background:#f7eaea;
  opacity:0;
  transform:translate(-50%,-50%) scale(0.7);
}

.p-muhi-student-work__package{
  position:absolute;
  top:50%;
  left:50%;
  width:190px;
  opacity:0;
  transform:translate(-50%,-50%) scale(0.45) rotate(-10deg);
  transform-origin:center;
}

/* Body */

.p-muhi-student-work__body{
  margin-top:-60px;
  text-align:center;
}

.p-muhi-student-work__team{
  position:absolute;
  left:50%;
  bottom:54px;
  margin:0;
  padding-bottom:2px;
  font-family:"effra","Yu Gothic","YuGothic",sans-serif;
  font-size:52px;
  font-weight:900;
  line-height:1.2;
  letter-spacing:0;
  color:#ff1208;
  text-align:center;
  white-space:nowrap;
  opacity:0;
  transform:translateX(-50%);
  z-index:2;
}

.p-muhi-student-work__team::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:120px;
  height:6px;
  background:#ff1208;
  transform:translateX(-50%);
}

.p-muhi-student-work__team span{
  display:inline-block;
  margin-right:-0.2em;
}

/* TEAMアニメーション */

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(1){
  animation:bounce 3.2s ease-in-out 0.20s both, bounce 3.2s ease-in-out 3.40s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(2){
  animation:bounce 3.2s ease-in-out 0.26s both, bounce 3.2s ease-in-out 3.46s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(3){
  animation:bounce 3.2s ease-in-out 0.32s both, bounce 3.2s ease-in-out 3.52s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(4){
  animation:bounce 3.2s ease-in-out 0.38s both, bounce 3.2s ease-in-out 3.58s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(5){
  animation:none;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(6){
  animation:bounce 3.2s ease-in-out 0.44s both, bounce 3.2s ease-in-out 3.64s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(7){
  animation:bounce 3.2s ease-in-out 0.50s both, bounce 3.2s ease-in-out 3.70s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(8){
  animation:bounce 3.2s ease-in-out 0.56s both, bounce 3.2s ease-in-out 3.76s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(9){
  animation:bounce 3.2s ease-in-out 0.62s both, bounce 3.2s ease-in-out 3.82s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(10){
  animation:bounce 3.2s ease-in-out 0.68s both, bounce 3.2s ease-in-out 3.88s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(11){
  animation:bounce 3.2s ease-in-out 0.74s both, bounce 3.2s ease-in-out 3.94s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(12){
  animation:bounce 3.2s ease-in-out 0.80s both, bounce 3.2s ease-in-out 4.00s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(13){
  animation:bounce 3.2s ease-in-out 0.86s both, bounce 3.2s ease-in-out 4.06s infinite;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team span:nth-child(14){
  animation:bounce 3.2s ease-in-out 0.92s both, bounce 3.2s ease-in-out 4.12s infinite;
}

.p-muhi-student-work__member{
  margin-top:16px;
  font-size:16px;
  font-weight:400;
  line-height:1.7;
  opacity:0;
  transform:translateY(24px);
}

.p-muhi-student-work__conceptLabel{
  position:relative;
  z-index:2;
  margin-top:40px;
  margin-bottom:-18px;
  font-family:"effra","Yu Gothic","YuGothic",sans-serif;
  font-size:22x;
  font-weight:400;
  line-height:1;
  letter-spacing:0.6em;
  text-transform:lowercase;
  color:#ff1208;
  opacity:0;
  transform:translateX(24px);
  text-align:center;
  font-family:"din-condensed","DINAlternate","effra","Yu Gothic","YuGothic",sans-serif;
}

.p-muhi-student-work__concept{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:480px;
  margin-top:10px;
  padding:12px 28px 14px;
  border-radius:999px;
  background:#f7eaea;
  color:#ff1208;
  font-size:32px;
  font-weight:400;
  line-height:1.2;
  opacity:0;
  transform:translateX(32px);
}

/* Point */

.p-muhi-student-work__point{
  position:relative;
  margin-top:40px;
  padding:28px 0;
  opacity:0;
  transform:translateY(26px);
}

.p-muhi-student-work__point::before,
.p-muhi-student-work__point::after{
  content:"";
  position:absolute;
  left:50%;
  width:60%;
  height:2px;
  background:repeating-linear-gradient(
    to right,
    #ff1208 0 2px,
    transparent 2px 6px
  );
  transform:translateX(-50%);
}

.p-muhi-student-work__point::before{
  top:0;
}

.p-muhi-student-work__point::after{
  bottom:0;
}

.p-muhi-student-work__point{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:40px;
}

.p-muhi-student-work__pointLabel{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:90px;
  height:90px;
  border-radius:50%;
  background:#f7eaea;
  color:#ff1208;
  font-family:"din-condensed","DINAlternate",Arial,sans-serif;
  font-size:26px;
  letter-spacing:0.08em;
  line-height:1;
}

.p-muhi-student-work__pointList{
  width:100%;
  max-width:520px;
  margin:0;
  padding:0;
  text-align:left;
}

.p-muhi-student-work__pointList li{
  position:relative;
  padding-left:18px;
  font-size:16px;
  line-height:1.9;
}

.p-muhi-student-work__pointList li::before{
  content:"";
  position:absolute;
  top:0.72em;
  left:0;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#ff1208;
}

/* Section Animation */

.p-muhi-student-work.is-active .p-muhi-student-work__title{
  animation:muhiStudentWorkTitleFade 0.8s ease forwards;
}

.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(1){ animation:bounce 3.2s ease-in-out 0.20s both, bounce 3.2s ease-in-out 3.40s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(2){ animation:bounce 3.2s ease-in-out 0.26s both, bounce 3.2s ease-in-out 3.46s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(3){ animation:bounce 3.2s ease-in-out 0.32s both, bounce 3.2s ease-in-out 3.52s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(4){ animation:bounce 3.2s ease-in-out 0.38s both, bounce 3.2s ease-in-out 3.58s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(5){ animation:bounce 3.2s ease-in-out 0.44s both, bounce 3.2s ease-in-out 3.64s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(6){ animation:bounce 3.2s ease-in-out 0.50s both, bounce 3.2s ease-in-out 3.70s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(7){ animation:bounce 3.2s ease-in-out 0.56s both, bounce 3.2s ease-in-out 3.76s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(8){ animation:none; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(9){ animation:bounce 3.2s ease-in-out 0.62s both, bounce 3.2s ease-in-out 3.82s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(10){ animation:bounce 3.2s ease-in-out 0.68s both, bounce 3.2s ease-in-out 3.88s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(11){ animation:bounce 3.2s ease-in-out 0.74s both, bounce 3.2s ease-in-out 3.94s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(12){ animation:bounce 3.2s ease-in-out 0.80s both, bounce 3.2s ease-in-out 4.00s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(13){ animation:bounce 3.2s ease-in-out 0.86s both, bounce 3.2s ease-in-out 4.06s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(14){ animation:bounce 3.2s ease-in-out 0.92s both, bounce 3.2s ease-in-out 4.12s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(15){ animation:bounce 3.2s ease-in-out 0.98s both, bounce 3.2s ease-in-out 4.18s infinite; }
.p-muhi-student-work.is-active .p-muhi-student-work__title span:nth-child(16){ animation:bounce 3.2s ease-in-out 1.04s both, bounce 3.2s ease-in-out 4.24s infinite; }

.p-muhi-student-work.is-active .p-muhi-student-work__lead{
  animation:muhiStudentWorkLeadFade 0.8s ease 0.2s forwards;
}

/* Card Animation */

.p-muhi-student-work__card.is-active .p-muhi-student-work__circle{
  animation:muhiStudentWorkCircleGrow 0.9s cubic-bezier(0.22,1,0.36,1) forwards;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__package{
  animation:muhiStudentWorkPackagePop 1.1s cubic-bezier(0.22,1,0.36,1) forwards;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__team{
  animation:muhiStudentWorkTeamFade 0.8s ease forwards;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__member{
  animation:muhiStudentWorkTextFade 0.8s ease 0.28s forwards;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__conceptLabel,
.p-muhi-student-work__card.is-active .p-muhi-student-work__concept{
  animation:muhiStudentWorkConceptSlide 0.8s ease 0.38s forwards;
}

.p-muhi-student-work__card.is-active .p-muhi-student-work__point{
  animation:muhiStudentWorkPointFade 0.8s ease 0.52s forwards;
}

/* Keyframes */

@keyframes muhiStudentWorkTitleFade{
  from{
    opacity:0;
    transform:translateY(24px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes muhiStudentWorkLeadFade{
  from{
    opacity:0;
    transform:translateY(24px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes muhiStudentWorkCircleGrow{
  from{
    opacity:0;
    transform:translate(-50%,-50%) scale(0.7);
  }

  to{
    opacity:1;
    transform:translate(-50%,-50%) scale(1);
  }
}

@keyframes muhiStudentWorkPackagePop{
  0%{
    opacity:0;
    transform:translate(-50%,-50%) scale(0.45) rotate(-10deg);
  }

  12%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.58) rotate(8deg);
  }

  24%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.70) rotate(-7deg);
  }

  36%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.80) rotate(6deg);
  }

  48%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.88) rotate(-5deg);
  }

  60%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.94) rotate(4deg);
  }

  72%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.98) rotate(-3deg);
  }

  84%{
    opacity:1;
    transform:translate(-50%,-50%) scale(1.02) rotate(2deg);
  }

  100%{
    opacity:1;
    transform:translate(-50%,-50%) scale(1) rotate(0deg);
  }
}

/* 03 package animation - PC */

.p-muhi-student-work__card:nth-child(3).is-active .p-muhi-student-work__package{
  animation:muhiStudentWorkPackagePop03 1.1s cubic-bezier(0.22,1,0.36,1) forwards;
}

@keyframes muhiStudentWorkPackagePop03{
  0%{
    opacity:0;
    transform:translate(-50%,-50%) scale(0.40) rotate(-10deg);
  }

  12%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.50) rotate(8deg);
  }

  24%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.60) rotate(-7deg);
  }

  36%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.70) rotate(6deg);
  }

  48%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.78) rotate(-5deg);
  }

  60%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.82) rotate(4deg);
  }

  72%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.86) rotate(-3deg);
  }

  84%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.88) rotate(2deg);
  }

  100%{
    opacity:1;
    transform:translate(-50%,-50%) scale(0.85) rotate(0deg);
  }
}

/* 03 package animation - SP */

@media screen and (max-width: 767px){

  .p-muhi-student-work__card:nth-child(3).is-active .p-muhi-student-work__package{
    animation:muhiStudentWorkPackagePop03-sp 1.1s cubic-bezier(0.22,1,0.36,1) forwards;
  }

  @keyframes muhiStudentWorkPackagePop03-sp{
    0%{
      opacity:0;
      transform:translate(-50%,-50%) scale(0.14) rotate(-10deg);
    }

    12%{
      opacity:1;
      transform:translate(-50%,-50%) scale(0.18) rotate(8deg);
    }

    24%{
      opacity:1;
      transform:translate(-50%,-50%) scale(0.22) rotate(-7deg);
    }

    36%{
      opacity:1;
      transform:translate(-50%,-50%) scale(0.25) rotate(6deg);
    }

    48%{
      opacity:1;
      transform:translate(-50%,-50%) scale(0.27) rotate(-5deg);
    }

    60%{
      opacity:1;
      transform:translate(-50%,-50%) scale(0.29) rotate(4deg);
    }

    72%{
      opacity:1;
      transform:translate(-50%,-50%) scale(0.31) rotate(-3deg);
    }

    84%{
      opacity:1;
      transform:translate(-50%,-50%) scale(0.32) rotate(2deg);
    }

    100%{
      opacity:1;
      transform:translate(-50%,-50%) scale(0.3) rotate(0deg);
    }
  }

}

@keyframes muhiStudentWorkTextFade{
  from{
    opacity:0;
    transform:translateY(24px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes muhiStudentWorkConceptSlide{
  from{
    opacity:0;
    transform:translateX(32px);
  }

  to{
    opacity:1;
    transform:translateX(0);
  }
}

@keyframes muhiStudentWorkPointFade{
  from{
    opacity:0;
    transform:translateY(26px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

/* Responsive */

@media screen and (max-width: 767px){
  .p-muhi-student-work{
    padding:88px 0 100px;
  }

  .p-muhi-student-work__title{
    font-size:40px;
    line-height:1.05;
  }

  .p-muhi-student-work__lead{
    margin-top:16px;
    font-size:18px;
  }

  .p-muhi-student-work__list{
    gap:40px;
    margin-top:42px;
  }

  .p-muhi-student-work__card{
    padding:26px 16px 28px;
    border-radius:24px;
  }

 .p-muhi-student-work__visual{
  height:360px;
}

  .p-muhi-student-work__circle{
    width:230px;
    height:230px;
  }

  .p-muhi-student-work__package{
    width:118px;
  }

.p-muhi-student-work__team{
  top:auto;
  bottom:70px;
  font-size:24px;
}

  .p-muhi-student-work__team::after{
    width:40px;
    height:3px;
  }

  .p-muhi-student-work__member{
    margin-top:12px;
    font-size:12px;
    line-height:1.7;
  }

  .p-muhi-student-work__conceptLabel{
    margin-top:22px;
    font-size:12px;
  }

  .p-muhi-student-work__concept{
    min-width:240px;
    padding:10px 20px 12px;
    font-size:18px;
  }

  .p-muhi-student-work__pointLabel{
    width:50px;
    height:50px;
    font-size:24px;
  }

  .p-muhi-student-work__pointList{
    margin-top:16px;
  }

  .p-muhi-student-work__pointList li{
    font-size:13px;
    line-height:1.8;
  }


.p-muhi-student-work__card:nth-child(1) .p-muhi-student-work__package{
  width:70px;
  top:45%
}

.p-muhi-student-work__card:nth-child(2) .p-muhi-student-work__package{
  width:120px;
  left:52%;
  top:45%
}

.p-muhi-student-work__point{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
}

}

/* ========================================
   09. Comments　- コメント
======================================== */


.p-muhi-comments{
  padding:20px 0 100px;
  background:#f8f1f1;
  overflow:hidden;
}

.p-muhi-comments__head{
  text-align:center;
}

.p-muhi-comments__title{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:0.01em;
  font-family:"effra","Yu Gothic","YuGothic",sans-serif;
  font-size:64px;
  font-weight:700;
  line-height:1;
  letter-spacing:0.01em;
  color:#ff1208;
  opacity:0;
  transform:translateY(24px);
}

.p-muhi-comments__title span{
  display:inline-block;
}

.sp-break{
  display:none;
}

@media screen and (max-width: 767px){
  .sp-break{
    display:block;
    flex-basis:100%;
    height:0;
  }
}

.p-muhi-comments__sub{
  margin-top:20px;
  font-size:28px;
  font-weight:700;
  line-height:1.4;
  letter-spacing:0.02em;
  opacity:0;
  transform:translateY(24px);
}

.p-muhi-comments__list{
  display:flex;
  justify-content:center;
  gap:24px;
  margin-top:64px;
}

.p-muhi-comments__card{
  position:relative;
  width:100%;
  max-width:290px;
  padding:44px 22px 28px;
  border:2px solid #ff1208;
  border-radius:24px;
  background:#fff;
  overflow:visible;
}

.p-muhi-comments__label{
  position:absolute;
  top:-12px;
  left:20px;
  z-index:2;
  padding:0 6px;
  font-family:"din-condensed","DINAlternate",Arial,sans-serif;
  font-size:24px;
  letter-spacing:0.08em;
  color:#ff1208;
}

.p-muhi-comments__label::before{
  content:"";
  position:absolute;
  top:0;
  left:2px;
  width:calc(100% + 1px);
  height:13px;
  background:#f8f1f1;
  z-index:-1;
}

.p-muhi-comments__illustWrap{
  position:absolute;
  top:-44px;
  right:18px;
  z-index:2;
  width:92px;
  padding:0 8px;
  opacity:0;
  transform:translateY(16px);
}

.p-muhi-comments__illust{
  display:block;
  width:100%;
  height:auto;
}

.p-muhi-comments__inner{
  min-height:560px;
}

.p-muhi-comments__lead{
  margin:0;
  color:#ff1208;
  font-size:20px;
  font-weight:700;
  line-height:1.7;
  letter-spacing:0.06em;
  opacity:0;
  transform:translateY(20px);
}

.p-muhi-comments__lead span{
  display:block;
  width:max-content;
  padding-bottom:4px;
  border-bottom:3px dotted #ff1208;
}

.p-muhi-comments__lead span + span{
  margin-top:8px;
}

.p-muhi-comments__text{
  margin-top:18px;
  font-size:16px;
  font-weight:400;
  line-height:1.95;
  letter-spacing:0.01em;
  opacity:0;
  transform:translateY(20px);
}

.p-muhi-comments.is-active .p-muhi-comments__title{
  animation:muhiCommentsTitleFade 0.8s ease forwards;
}

.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(1){ animation:bounce 3.2s ease-in-out 0.20s both, bounce 3.2s ease-in-out 3.40s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(2){ animation:bounce 3.2s ease-in-out 0.26s both, bounce 3.2s ease-in-out 3.46s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(3){ animation:bounce 3.2s ease-in-out 0.32s both, bounce 3.2s ease-in-out 3.52s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(4){ animation:bounce 3.2s ease-in-out 0.38s both, bounce 3.2s ease-in-out 3.58s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(5){ animation:bounce 3.2s ease-in-out 0.44s both, bounce 3.2s ease-in-out 3.64s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(6){ animation:bounce 3.2s ease-in-out 0.50s both, bounce 3.2s ease-in-out 3.70s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(7){ animation:none; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(8){ animation:bounce 3.2s ease-in-out 0.56s both, bounce 3.2s ease-in-out 3.76s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(9){ animation:bounce 3.2s ease-in-out 0.62s both, bounce 3.2s ease-in-out 3.82s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(10){ animation:bounce 3.2s ease-in-out 0.68s both, bounce 3.2s ease-in-out 3.88s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(11){ animation:bounce 3.2s ease-in-out 0.74s both, bounce 3.2s ease-in-out 3.94s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(12){ animation:none; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(13){ animation:bounce 3.2s ease-in-out 0.80s both, bounce 3.2s ease-in-out 4.00s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(14){ animation:bounce 3.2s ease-in-out 0.86s both, bounce 3.2s ease-in-out 4.06s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(15){ animation:bounce 3.2s ease-in-out 0.92s both, bounce 3.2s ease-in-out 4.12s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(16){ animation:none; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(17){ animation:bounce 3.2s ease-in-out 0.98s both, bounce 3.2s ease-in-out 4.18s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(18){ animation:bounce 3.2s ease-in-out 1.04s both, bounce 3.2s ease-in-out 4.24s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(19){ animation:bounce 3.2s ease-in-out 1.10s both, bounce 3.2s ease-in-out 4.30s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(20){ animation:bounce 3.2s ease-in-out 1.16s both, bounce 3.2s ease-in-out 4.36s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(21){ animation:bounce 3.2s ease-in-out 1.22s both, bounce 3.2s ease-in-out 4.42s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(22){ animation:bounce 3.2s ease-in-out 1.28s both, bounce 3.2s ease-in-out 4.48s infinite; }
.p-muhi-comments.is-active .p-muhi-comments__title span:nth-child(23){ animation:bounce 3.2s ease-in-out 1.34s both, bounce 3.2s ease-in-out 4.54s infinite; }

.p-muhi-comments.is-active .p-muhi-comments__sub{
  animation:muhiCommentsSubFade 0.8s ease 0.18s forwards;
}

.p-muhi-comments__card.is-active{
  animation:muhiCommentsCardFade 0.8s ease forwards;
}

.p-muhi-comments__card.is-active .p-muhi-comments__illustWrap{
  animation:muhiCommentsIllustPop 0.8s cubic-bezier(0.22,1,0.36,1) 0.2s forwards;
}

.p-muhi-comments__card.is-active .p-muhi-comments__lead{
  animation:muhiCommentsTextFade 0.8s ease 0.28s forwards;
}

.p-muhi-comments__card.is-active .p-muhi-comments__text{
  animation:muhiCommentsTextFade 0.8s ease 0.42s forwards;
}

@keyframes muhiCommentsTitleFade{
  from{
    opacity:0;
    transform:translateY(24px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes muhiCommentsSubFade{
  from{
    opacity:0;
    transform:translateY(24px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes muhiCommentsCardFade{
  from{
    opacity:0;
    transform:translateY(28px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes muhiCommentsIllustPop{
  0%{
    opacity:0;
    transform:translateY(16px) scale(0.9);
  }
  60%{
    opacity:1;
    transform:translateY(-4px) scale(1.03);
  }
  100%{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes muhiCommentsTextFade{
  from{
    opacity:0;
    transform:translateY(20px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@media screen and (max-width: 767px){
  .p-muhi-comments{
    padding:2px 0 0;
  }

  .p-muhi-comments__title{
    font-size:42px;
    line-height:1.05;
  }

  .p-muhi-comments__sub{
    margin-top:14px;
    font-size:18px;
  }

  .p-muhi-comments__list{
    flex-direction:column;
    gap:28px;
    margin-top:42px;
  }

  .p-muhi-comments__card{
    max-width:none;
    padding:38px 18px 24px;
  }

  .p-muhi-comments__card::before{
    width:calc(100% - 128px);
  }

  .p-muhi-comments__card::after{
    width:28px;
  }

  .p-muhi-comments__label{
  top:-10px;
  left:16px;
  font-size:20px;
}

.p-muhi-comments__illustWrap{
  top:32px;
  right:12px;
  width:100px;
  padding:0 6px;
}

  .p-muhi-comments__inner{
    min-height:auto;
  }

  .p-muhi-comments__lead{
    font-size:16px;
    line-height:1.7;
  }

  .p-muhi-comments__text{
    margin-top:16px;
    font-size:13px;
    line-height:1.9;
  }
}

/* ========================================
   10. Last Photo - 最後の写真
======================================== */
.p-muhi-final{
  padding:40px 0 140px;
  background:#f8f1f1;
}

.p-muhi-final__inner{
  max-width:1000px;
  margin:0 auto;
  padding:0 20px;
}

.p-muhi-final__photo{
  position:relative;
  margin:0;
  border-radius:0;
  overflow:hidden;
  box-shadow:none;
  opacity:0;
  filter:blur(10px);
  transform:scale(1.05);
}

.p-muhi-final.is-active .p-muhi-final__photo{
  animation:muhiFinalPhotoFade 1.6s ease forwards;
}

.p-muhi-final__photo img{
  display:block;
  width:100%;
  height:auto;
}


/* ========================================
   11. Footer - フッター
======================================== */

.p-muhi-footer{
  background:#ff1208;
  padding:80px 20px 40px;
  text-align:center;
}

.p-muhi-footer__logos{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:180px;
}

.p-muhi-footer__logo{
  display:block;
}

.p-muhi-footer__logo--muhi{
  width:180px;
}

.p-muhi-footer__logo--nua{
  width:140px;
}

.p-muhi-footer__copy{
  margin-top:40px;
  font-size:12px;
  color:#fff;
  letter-spacing:0.05em;
}

@media screen and (max-width: 767px){

  .p-muhi-final{
    padding:30px 0 40px;
  }

  .p-muhi-footer{
    padding:60px 20px 30px;
  }

  .p-muhi-footer__logos{
    flex-direction:column;
    gap:24px;
  }

  .p-muhi-footer__logo--muhi{
    width:140px;
  }

  .p-muhi-footer__logo--nua{
    width:110px;
  }

  .p-muhi-footer__copy{
    margin-top:24px;
    font-size:10px;
  }

}

/* ========================================
   12. Page Top - 上矢印ボタン
======================================== */

.c-pagetop{
  position:fixed;
  right:24px;
  bottom:24px;
  width:72px;
  opacity:0;
  pointer-events:none;
  transition:0.3s;
  z-index:999;
}

.c-pagetop.is-show{
  opacity:1;
  pointer-events:auto;
}

.c-pagetop img{
  display:block;
  width:100%;
  height:auto;
}

@media screen and (max-width: 767px){

  .c-pagetop{
    width:56px;
    right:16px;
    bottom:16px;
  }

}

/* ========================================
   50. Animation
======================================== */

.p-muhi-hero.is-active .p-muhi-hero__line{
  animation:muhiLine 1s ease forwards;
}

.p-muhi-hero.is-active .p-muhi-hero__red{
  animation:muhiRed 1s ease forwards;
  animation-delay:0.6s;
}

.p-muhi-hero.is-active .p-muhi-hero__lead{
  animation:muhiLead 1s ease forwards;
  animation-delay:1.2s;
}

@keyframes muhiLine{
  from{
    opacity:0;
    transform:translateX(-50%) translateY(100px);
  }

  to{
    opacity:1;
    transform:translateX(-50%) translateY(0);
  }
}

@keyframes muhiRed{
  from{
    opacity:0;
    transform:translateX(-120px);
  }

  to{
    opacity:1;
    transform:translateX(0);
  }
}

@keyframes muhiLead{
  from{
    opacity:0;
    transform:translateY(40px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

.p-muhi-project.is-active .p-muhi-project__title{
  animation:muhiProjectTitleFade 0.8s ease forwards;
}

.p-muhi-project.is-active .p-muhi-project__title span:nth-child(1){
  animation:bounce 3.2s ease-in-out 0.35s both, bounce 3.2s ease-in-out 3.55s infinite;
}

.p-muhi-project.is-active .p-muhi-project__title span:nth-child(2){
  animation:bounce 3.2s ease-in-out 0.42s both, bounce 3.2s ease-in-out 3.62s infinite;
}

.p-muhi-project.is-active .p-muhi-project__title span:nth-child(3){
  animation:bounce 3.2s ease-in-out 0.49s both, bounce 3.2s ease-in-out 3.69s infinite;
}

.p-muhi-project.is-active .p-muhi-project__title span:nth-child(4){
  animation:bounce 3.2s ease-in-out 0.56s both, bounce 3.2s ease-in-out 3.76s infinite;
}

.p-muhi-project.is-active .p-muhi-project__title span:nth-child(5){
  animation:bounce 3.2s ease-in-out 0.63s both, bounce 3.2s ease-in-out 3.83s infinite;
}

.p-muhi-project.is-active .p-muhi-project__title span:nth-child(6){
  animation:bounce 3.2s ease-in-out 0.70s both, bounce 3.2s ease-in-out 3.90s infinite;
}

.p-muhi-project.is-active .p-muhi-project__title span:nth-child(7){
  animation:bounce 3.2s ease-in-out 0.77s both, bounce 3.2s ease-in-out 3.97s infinite;
}

.p-muhi-project.is-active .p-muhi-project__lead{
  animation:muhiProjectTextFade 0.8s ease 0.28s forwards;
}

.p-muhi-project.is-active .p-muhi-project__imageWrap{
  animation:muhiProjectImagePop 0.95s cubic-bezier(0.22,1,0.36,1) 0.48s forwards;
}

@keyframes muhiProjectTitleFade{
  from{
    opacity:0;
    transform:translateY(24px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes muhiProjectTextFade{
  from{
    opacity:0;
    transform:translateY(24px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes bounce{
  0%{
    transform:translateY(0);
  }

  15%{
    transform:translateY(-8px);
  }

  30%{
    transform:translateY(0);
  }

  100%{
    transform:translateY(0);
  }
}

@keyframes muhiProjectImagePop{
  0%{
    opacity:0;
    transform:translateY(28px) scale(0.94) rotate(-1.2deg);
  }

  45%{
    opacity:1;
    transform:translateY(-8px) scale(1.02) rotate(0.8deg);
  }

  70%{
    opacity:1;
    transform:translateY(2px) scale(0.995) rotate(-0.4deg);
  }

  100%{
    opacity:1;
    transform:translateY(0) scale(1) rotate(0deg);
  }
}

.p-muhi-classroom.is-active .p-muhi-classroom__title{
  animation:muhiClassroomTitleFade 0.8s ease forwards;
}

.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(1){ animation:bounce 3.2s ease-in-out 0.20s both, bounce 3.2s ease-in-out 3.40s infinite; }
.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(2){ animation:bounce 3.2s ease-in-out 0.26s both, bounce 3.2s ease-in-out 3.46s infinite; }
.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(3){ animation:bounce 3.2s ease-in-out 0.32s both, bounce 3.2s ease-in-out 3.52s infinite; }
.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(4){ animation:bounce 3.2s ease-in-out 0.38s both, bounce 3.2s ease-in-out 3.58s infinite; }
.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(5){ animation:bounce 3.2s ease-in-out 0.44s both, bounce 3.2s ease-in-out 3.64s infinite; }
.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(6){ animation:bounce 3.2s ease-in-out 0.50s both, bounce 3.2s ease-in-out 3.70s infinite; }
.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(7){ animation:bounce 3.2s ease-in-out 0.56s both, bounce 3.2s ease-in-out 3.76s infinite; }
.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(8){ animation:none; }
.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(9){ animation:bounce 3.2s ease-in-out 0.62s both, bounce 3.2s ease-in-out 3.82s infinite; }
.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(10){ animation:bounce 3.2s ease-in-out 0.68s both, bounce 3.2s ease-in-out 3.88s infinite; }
.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(11){ animation:bounce 3.2s ease-in-out 0.74s both, bounce 3.2s ease-in-out 3.94s infinite; }
.p-muhi-classroom.is-active .p-muhi-classroom__title span:nth-child(12){ animation:bounce 3.2s ease-in-out 0.80s both, bounce 3.2s ease-in-out 4.00s infinite; }

.p-muhi-classroom.is-active .p-muhi-classroom__lead{
  animation:muhiClassroomLeadFade 0.8s ease 0.25s forwards;
}

.p-muhi-classroom__process.is-active .p-muhi-classroom__photoWrap{
  animation:muhiClassroomPhotoFloat 0.9s cubic-bezier(0.22,1,0.36,1) forwards;
}

.p-muhi-classroom__process.is-active .p-muhi-classroom__content{
  animation:muhiClassroomContentFade 0.8s ease 0.15s forwards;
}

.p-muhi-classroom__process.is-active .p-muhi-classroom__icon{
  animation:muhiClassroomIconPop 0.7s ease 0.35s forwards;
}

@keyframes muhiClassroomTitleFade{
  from{
    opacity:0;
    transform:translateY(24px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes muhiClassroomLeadFade{
  from{
    opacity:0;
    transform:translateY(24px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes muhiClassroomPhotoFloat{
  0%{
    opacity:0;
    transform:translateY(36px) scale(0.96);
  }

  60%{
    opacity:1;
    transform:translateY(-6px) scale(1.01);
  }

  100%{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes muhiClassroomContentFade{
  from{
    opacity:0;
    transform:translateY(28px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes muhiClassroomIconPop{
  0%{
    opacity:0;
    transform:translateY(16px) scale(0.8) rotate(-8deg);
  }

  55%{
    opacity:1;
    transform:translateY(-4px) scale(1.04) rotate(3deg);
  }

  100%{
    opacity:1;
    transform:translateY(0) scale(1) rotate(0deg);
  }
}

@keyframes muhiStudentWorkTeamFade{
  from{
    opacity:0;
    transform:translateX(-50%) translateY(24px);
  }

  to{
    opacity:1;
    transform:translateX(-50%) translateY(0);
  }
}

.p-muhi-final.is-active .p-muhi-final__photo{
  animation:muhiFinalPhotoFade 1.6s ease forwards;
}

@keyframes muhiFinalPhotoFade{
  0%{
    opacity:0;
    filter:blur(10px);
    transform:scale(1.08);
  }

  40%{
    opacity:1;
    filter:blur(4px);
  }

  70%{
    filter:blur(1px);
  }

  100%{
    opacity:1;
    filter:blur(0);
    transform:scale(0.9);
  }
}