body{
    background-color: #E4979B;
    margin: 0;

    
}
p{
    margin: 0;
}
h1{
    margin: 0;
}
.font{
    font-family: corporate-logo-ver2,
  sans-serif;
  font-style: normal;
  font-weight: 500;

}
  

.background_top{
    background-color: rgb(240, 201, 203);
    width: 100vw;
    height: 50vh;
    top: 0;
    left: 0;
    line-height: 0;
    margin: 0;
    padding: 0;
}
.header{
    display: flex;
    /* position: relative; */
     height: 80px;
     justify-content: space-between;
     width: 100%;
}


header {
    
    width: 100%;
    
    display: flex;
    
    justify-content: center;
    align-items: center;
    /* justify-content: space-between; */
    /* margin-top: 8px; */
    height: 80px;
}

.festival_logo {
    /* margin-left: 50px; */
    margin-top: 17px;
    width: 40px;
    margin-left: 50px;
    width: 40px;
}

.committee_logo {
    width: 400px;
    margin: 0 auto;
    max-width: 100%;
    /* 要素の幅を指定 */
    max-height: 100%;
    /* 要素の高さを指定 */
    margin-top: 25.5px;
}



/* 上のコードの形だとSafariで動かないから、下のコードの形にする。 */

@media screen and (max-width: 814px) {
    .committee_logo {
        display: none;
    }
}

.rightspace {
    margin-right: 50px;
    width: 40px;
}


/* photo_change */
/* text_flow */
.text_flow {
    position: absolute;
    top: 46.5%;
    -webkit-display: flex;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    width: 100vw;
    height: auto;
    font-family: corporate-logo-ver2, sans-serif;
    font-style: bold;
    font-weight: 800;
    color: #71B9C0;
    overflow: hidden;
}

.text_flow div {
    flex: 0 0 auto;
    font-size: 40px;
    white-space: nowrap;
    will-change: transform;
}

@media screen and (min-width: 900px) {
    .text_flow div {
        font-size: 40px;
    }
}

.text_flow div:nth-child(odd) {
    -webkit-animation: loop 50s -25s linear infinite;
    animation: loop 50s -25s linear infinite;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
}

.text_flow div:nth-child(even) {
    -webkit-animation: loop2 50s linear infinite;
    animation: loop2 50s linear infinite;
}

  
 @-webkit-keyframes loop {
     0% {
         -webkit-transform: translateX(100%);
         -ms-transform: translateX(100%);
         transform: translateX(100%);
     }

     to {
         -webkit-transform: translateX(-100%);
         -ms-transform: translateX(-100%);
         transform: translateX(-100%);
     }
 }

 @keyframes loop {
     0% {
         -webkit-transform: translateX(100%);
         -ms-transform: translateX(100%);
         transform: translateX(100%);
     }

     to {
         -webkit-transform: translateX(-100%);
         -ms-transform: translateX(-100%);
         transform: translateX(-100%);
     }
 }

 @-webkit-keyframes loop2 {
     0% {
         -webkit-transform: translateX(0);
         -ms-transform: translateX(0);
         transform: translateX(0);
     }

     to {
         -webkit-transform: translateX(-200%);
         -ms-transform: translateX(-200%);
         transform: translateX(-200%);
     }
 }

 @keyframes loop2 {
     0% {
         -webkit-transform: translateX(0);
         -ms-transform: translateX(0);
         transform: translateX(0);
     }

     to {
         -webkit-transform: translateX(-200%);
         -ms-transform: translateX(-200%);
         transform: translateX(-200%);
     }
 }

 /* five_photo */
 .five_photo{
    width: 70%;
    margin: 0 auto;
    padding-top: 2vw;
 }
 .photo-container {
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .photo {
     display: flex;
     flex-direction: column;
     align-items: center;
 }

 .photo img {
     width: 10vw;
 }

 .photo p {
     margin-top: 10px;
     text-align: center;
 }

 /*news box  */
.round-box {
    width: 70%;
    /* height: 200px; */
    border: 5px solid #000;
    /* 枠の色を黒にする */
    border-radius: 2vw;
    /* 丸みを100pxにする */
    margin: 0 auto;
    margin-top: 100px;
display: flex;
justify-content: left;
/* テキストを中央に配置する */
align-items: left;
/* テキストを中央に配置する */
text-align: left;
/* テキストを中央に配置する */
/* padding-bottom: 60px; */
}

.round-box-text {
    color: #fff;
    /* テキストの色を白にする */
    padding-bottom: 20px;
    padding-top: 20px;
}


/* ここから下層 */
/* footer */
.background_sub {
    background-color: white;
    width: 100vw;
    height: 80px;
    top: 0;
    left: 0;
    line-height: 0;
    margin: 0;
    padding: 0;
}
/* 応募はこちら */
.cFixed {
    position: fixed;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: var(--z-fixed-btn);
    opacity: 0;
    transition: opacity .4s cubic-bezier(0.165, 0.84, 0.44, 1)
}


.cFixed__search {
    border-radius: 30px;
    background-color: #3AB1BB;
    /* color: var(--white); */
    font-size: calc(14rem / 16);
    font-weight: 700;
    /* letter-spacing: .05em; */
    padding: calc(15rem / 16) 25px;
    /* box-shadow: 0 1px 6px rgba(0, 0, 0, .16); */
    pointer-events: none
}


.cFixed__observer {
    position: absolute;
    top: 0;
    left: 0;
    height: 60vh
}
 .cFixed {
     top: 1vw;
     right: 2.2vw;
     left: auto;
     width: -moz-fit-content;
     width: fit-content;
     height: -moz-fit-content;
     height: fit-content;
     transform: translateX(0);
     opacity: 1
 }

 .cFixed__search {
     position: relative;
     font-size: max(14rem / 16, 1.02vw);
     border-radius: 2.2vw;
     padding: max(9rem / 16, .66vw) 2.2vw;
     overflow: hidden;
     isolation: isolate;
     pointer-events: auto
 }

 .cFixed__search::before {
     position: absolute;
     top: 0;
     left: 0;
     content: "";
     width: 100%;
     height: 100%;
     background-color: #88D0D6;
     transform: translateX(-100%);
     transition: transform .4s cubic-bezier(0.165, 0.84, 0.44, 1);
     z-index: 0
 }

 .cFixed__search:hover::before {
     transform: translateX(0)
 }



 .cFixed__search_text {
     position: relative;
     color: white;
     z-index: 1
    
 }
/* メインコンテンツ */
.main_content{
    width: 70%;
    margin: 0 auto;
}
/* メインタイトル */
.main_title{
    display: flex;
    
}
.main_title p{
    color: white;
    font-size: 50px;
    margin-top: 40px;
    font-family: corporate-logo-ver2,
    sans-serif;
    font-style: bold;
    font-weight: 800;
}

.main_title .committee {
    color: white;
    font-size: 30px;
    margin-top: 45px;
    font-family: corporate-logo-ver2,
    sans-serif;
    font-style: bold;
    font-weight: 800;
}
/* ドット */
.dots {
    display: flex;
    margin-top: 70px;
}
.first_dot{
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: #39B1BB;
    margin-right: 5px;
}
.dot {
    width: 10px;
    height: 10px;
    margin-top: 2.5px;
    border-radius: 50%;
    background-color: #39B1BB;
    margin-right: 5px;
}
/* 明大祭とは　写真 */
.about_meidaisai-image {
    max-width: 400px;
    height: auto;

    border-radius: 2vw;
    border: 5px solid #fff;
    box-shadow: 0px 0px 0px 2px #fff;
    display: block;
    margin: 0 auto;
    margin-top: 50px;
    margin-bottom: 200px;

}







 /*テキストボックス */
 .round-box {
     width: 100%;
     /* height: 500px; */
     border: 10px solid #3AB1BB;
     background-color: white;
     /* 枠の色を黒にする */
     border-radius: 2vw;
     /* 丸みを100pxにする */
     margin: 0 auto;
     margin-top: 100px;
     display: flex;
     /* flex-wrap: wrap; */
     justify-content: left;
     /* テキストを中央に配置する */
     align-items: left;
     /* テキストを中央に配置する */
     text-align: left;
     /* テキストを中央に配置する */
 }
.round-box-intro{
    /* height: 300px; */
}
 .round-box-text {
    /* flex-grow: 1; */
    /* margin: 10px; */
     color: black;
     /* テキストの色を白にする */
     width: 100%;
     margin: 0 auto;
     margin-top: px;
  
     padding-left: 100px;
     padding-right: 100px;
    
        font-size: 0,5vw;
        min-width: 500px;
        /* font-size: calc(20px + (26 - 20) * ((100vw - 500px) / (1600 - 500))); */
    

     font-family: corporate-logo-ver2,
     sans-serif;
     font-style: normal;
     font-weight: 500;
     }
 .round-box-text h1{
    font-size: 1.3rem;
    color: #3AB1BB;
    font-weight: 800;
    padding-bottom: 10px;
 }

 /* about_meidaisai-photo */
  .round-box-about_meidaisai-photo {
      /* width: 70%; */
      height: 200px;
      border: 5px solid #000;
      /* 枠の色を黒にする */
      border-radius: 2vw;
      /* 丸みを100pxにする */
      margin: 0 auto;
      margin-top: 100px;
      display: flex;
      justify-content: left;
      /* テキストを中央に配置する */
      align-items: left;
      /* テキストを中央に配置する */
      text-align: left;
      /* テキストを中央に配置する */
  }

  .text-about_meidaisai-photo {
      color: #fff;
      /* テキストの色を白にする */
  }



  .memory_one{
    width: 300px;
  }
.memory_one-up{
    width: 600px;
}


/* 各局紹介 */
.intro_photo {
    display: flex;
    flex-wrap: wrap;
    margin-top: 100px;
}

.intro_photo .row {
    width: 80%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.intro_photo .row .col {
    flex: 0 0 calc(30% - 10px);
    margin-bottom: 20px;
    text-align: center;
    justify-content: center;
    position: relative;
    
}
.intro_photo .row .col .text_box p {
    color: #3AB1BB;
    margin: auto;
    text-align: center;
    justify-content: center;
}
.intro_photo .row .col img {
   
    max-width: 100%;
    height: auto;
    border-radius: 2vw;
    border: 0.8vw solid white;
    margin: auto;
}
.intro_photo .row .col .text_box {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translate(-50%, 0);
    background-color: white;
    /* ボックスの色 */
    border-radius: 2vw;
    display: inline-block;
   
    font-size: 1.3vw;
       font-family: corporate-logo-ver2,
       sans-serif;
       font-style: normal;
       font-weight: 500;
       
}
.intro_photo .row .col .intro{
     padding: 5px 20px 5px 20px;
}
body {
    background-color: #E4979B;
    margin: 0;
}

.background_top {
    background-color: rgb(240, 201, 203);
    width: 100vw;
    height: 50vh;
    top: 0;
    left: 0;
    line-height: 0;
    margin: 0;
    padding: 0;
}

.header {
    display: flex;
    position: relative;
}

.fes_logo {
    width: 52px;
    height: 59px;
    margin-left: 48px;
    margin-top: 10px;
}



/* concept */
.concept {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 40px;
    max-height: 150px;
    height: 18vh;
}

.concept p {
    text-align: center;
    font-family: serif;
    color: #D86B70;
    font-size: 40px;
    margin-left: 31px;
    
}
@media screen and (min-width: 768px){
.concept p {
    text-align: center;
    font-family: serif;
    color: #D86B70;
    font-size: 50px;
    margin-left: 30px;

}
}


/* photo_change */
/* text_flow */
.text_flow {
    position: absolute;
    top: 46.4%;
    -webkit-display: flex;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    width: 100vw;
    height: auto;
    font-family: corporate-logo-ver2, sans-serif;
    font-style: bold;
    font-weight: 700;
    color: #71B9C0;
    overflow: hidden;
}

.text_flow div {
    flex: 0 0 auto;
    font-size: 40px;
    white-space: nowrap;
    will-change: transform;
}

@media screen and (min-width: 900px) {
    .text_flow div {
        font-size: 40px;
    }
}

.text_flow div:nth-child(odd) {
    -webkit-animation: loop 50s -25s linear infinite;
    animation: loop 50s -25s linear infinite;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
}

.text_flow div:nth-child(even) {
    -webkit-animation: loop2 50s linear infinite;
    animation: loop2 50s linear infinite;
}


@-webkit-keyframes loop {
    0% {
        -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
        transform: translateX(100%);
    }

    to {
        -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}

@keyframes loop {
    0% {
        -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
        transform: translateX(100%);
    }

    to {
        -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}

@-webkit-keyframes loop2 {
    0% {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }

    to {
        -webkit-transform: translateX(-200%);
        -ms-transform: translateX(-200%);
        transform: translateX(-200%);
    }
}

@keyframes loop2 {
    0% {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }

    to {
        -webkit-transform: translateX(-200%);
        -ms-transform: translateX(-200%);
        transform: translateX(-200%);
    }
}

.cFixed {
    position: fixed;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: var(--z-fixed-btn);
    opacity: 0;
    transition: opacity .4s cubic-bezier(0.165, 0.84, 0.44, 1)
}

.cFixed.is-active {
    opacity: 1
}

.cFixed.is-active .cFixed__search {
    pointer-events: auto
}

.cFixed.is-active.is-hide {
    opacity: 0
}

.cFixed.is-active.is-hide .cFixed__search {
    pointer-events: none
}

.cFixed__search {
    border-radius: 30px;
    background-color: #3AB1BB;
    color: var(--white);
    font-size: calc(14rem / 16);
    font-weight: 700;
    letter-spacing: .05em;
    padding: calc(15rem / 16) 25px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .16);
    pointer-events: none
}

.cFixed__search_icon {
    --icon-color: var(--green);
    margin-right: 6px
}

.cFixed__observer {
    position: absolute;
    top: 0;
    left: 0;
    height: 60vh
}

@media screen and (min-width: 768px) {
    .cFixed {
        top: 2.2vw;
        right: 2.2vw;
        left: auto;
        width: -moz-fit-content;
        width: fit-content;
        height: -moz-fit-content;
        height: fit-content;
        transform: translateX(0);
        opacity: 1
    }

    .cFixed__search {
        position: relative;
        font-size: max(14rem / 16, 1.02vw);
        border-radius: 2.2vw;
        padding: max(9rem / 16, .66vw) 2.2vw;
        overflow: hidden;
        isolation: isolate;
        pointer-events: auto
    }

    .cFixed__search::before {
        position: absolute;
        top: 0;
        left: 0;
        content: "";
        width: 100%;
        height: 100%;
        background-color: #88D0D6;
        transform: translateX(-100%);
        transition: transform .4s cubic-bezier(0.165, 0.84, 0.44, 1);
        z-index: 0
    }

    .cFixed__search:hover::before {
        transform: translateX(0)
    }

    .cFixed__search_icon {
        position: relative;
        z-index: 1;
        margin-right: max(6px, .44vw)
    }

    .cFixed__search_text {
        position: relative;
        z-index: 1
    }
}

/* next Btn */
.cArrowBtn {
    width: 24.27vw;
    height: 24.27vw;
    border-radius: 50%;
    background-color: var(--white);
    /*  */
    border: solid 5px rgb(57, 177, 187);
}

.cArrowBtn__text {
    display: block;
    font-family: var(--en-font);
    font-size: max(11rem / 16, 2.93vw);
    font-weight: 700;
    letter-spacing: .03em;
    text-align: center;
    margin-bottom: max(5rem / 16, 1.33vw)
}

/* pcOnly */
.cArrowBtn__text.pcOnly {
    display: none
}

.cArrowBtn.prev .cArrowBtn__arrow {
    transform: rotate(-180deg)
}

.cArrowBtn__arrow {
    position: relative;
    display: block;
    width: 12px;
    height: 12px;
    margin: 0 auto
}

.cArrowBtn__arrow span {
    position: absolute;
    right: 0;
    display: inline-block;
    width: 9px;
    height: 3px;
    /* next矢印 */
    background-color: rgb(57, 177, 187);
    border-radius: 0 2px 2px 0
}

.cArrowBtn__arrow span:first-of-type {
    top: 2px;
    transform: rotate(45deg)
}

.cArrowBtn__arrow span:last-of-type {
    bottom: 2px;
    transform: rotate(-45deg)
}

@media screen and (min-width: 768px) {
    .cArrowBtn {

        width: 6vw;
        height: 6vw;
        /* next枠 */
        border: solid 5px rgb(57, 177, 187);
        transition: transform .6s cubic-bezier(0.165, 0.84, 0.44, 1)
    }

    .cArrowBtn:hover {
        transform: scale(1.06)
    }

    .cArrowBtn__inner {
        margin-top: max(6rem / 16, .44vw)
    }

    .cArrowBtn__text {
        font-size: max(12rem / 16, .88vw);
        margin-bottom: max(10rem / 16, .73vw)
    }

    .cArrowBtn__arrow {
        position: relative;
        width: .88vw;
        height: .88vw;
        margin: 0 auto
    }

    .cArrowBtn__arrow span {
        right: 0;
        width: .81vw;
        height: .22vw;
        border-radius: 0 .15vw .15vw 0
    }

    .cArrowBtn__arrow span:first-of-type {
        top: .15vw;
        transform: rotate(45deg)
    }

    .cArrowBtn__arrow span:last-of-type {
        bottom: 0vw;
        transform: rotate(-45deg)
    }
}




















@keyframes swiperStarted {
    0% {
        transform: translate(0, 0)
    }

    50% {
        transform: translate(500px, -200px) rotate(5deg)
    }

    100% {
        transform: translate(0, 0) rotate(0deg)
    }
}

@keyframes dotPoint {
    0% {
        transform: scale(0)
    }

    100% {
        transform: scale(1)
    }
}

@keyframes dotLine {
    0% {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
        clip-path: polygon(0 0, 100% 0, 100% 0, 0 0)
    }

    100% {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)
    }
}

@keyframes dotLinePC {
    0% {
        -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
        clip-path: polygon(0 0, 0 0, 0 100%, 0 100%)
    }

    100% {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)
    }
}

@keyframes fadeScaleUp {
    0% {
        opacity: 0;
        transform: scale(0.7)
    }

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

@keyframes fadeScaleUpPC {
    0% {
        opacity: 0;
        transform: scale(0.7)
    }

    60% {
        opacity: 1;
        transform: scale(1.06)
    }

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

.lMV .swiper {
    position: relative;
    display: flex;
    justify-content: center;
    /* margin-bottom: 6.4vw; */
    overflow: visible !important;
    opacity: 0;
    transform: scale(0.7);
    animation: fadeScaleUp .6s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 1.3s
}

.lMV .swiper.visited {
    animation: none;
    opacity: 1;
    transform: scale(1)
}



.lMV .swiper-slide {
    position: relative;
    overflow: visible !important
}

.lMV .swiper-slide .lMV__swiper_image {

    /* position: absolute; */
    /* margin-top: 1000px; */
    /* width: 50%; */
    /* margin: 0 auto; */
    /* top: -10vw; */
    /* left: 40vw; */
    /* transform: translate(-50%, -50%); */
    width: 22vw;
    min-width: 300px;
    height: 22vw;
    
    border-radius: 2vw;
    border: solid 10px var(--white);
    overflow: hidden;
   
    

    display: block;
    margin: 0 auto;
    max-width: 100%;
    /* height: auto; */
    min-height: 300px;
    margin-top: -27vw;
     object-fit: cover;
}

.lMV .swiper-slide .lMV__swiper_image a {
    width: 100%;
    height: 100%
}

.lMV .swiper-slide .lMV__swiper_image img {
    -o-object-fit: cover;
    object-fit: cover;
    height: 100%
}

.lMV .swiper-slide .lMV__swiper_text {
    position: absolute;
    top: 100px;
    left: 50%;
    transform: translate(-50%,50%);
   
    flex-direction: column;
    justify-content: center;
    align-items: center;

}

.lMV .swiper-slide .lMV__swiper_text_title {
    font-weight: 700;
    margin-bottom: calc(14rem / 16)
}

.lMV .swiper-slide .lMV__swiper_text_title--sub {
    position: relative;
    font-size: calc(15rem / 16);
    line-height: calc(22rem / 16);
    letter-spacing: .08em;
    margin-bottom: calc(4rem / 16)
}

.lMV .swiper-slide .lMV__swiper_text_title--sub span {
    display: inline-block;
    opacity: 0;
    transform: translateY(70%);
    transition: transform .3s cubic-bezier(0.02, 0.59, 0.59, 1.5), opacity .3s cubic-bezier(0.02, 0.59, 0.59, 1.5)
}

.lMV .swiper-slide .lMV__swiper_text_title--main {
    font-size: calc(22rem / 16);
    line-height: calc(31rem / 16);
    letter-spacing: .08em;
    opacity: 0;
    transform: translateY(20%);
    transition: transform .3s cubic-bezier(0.165, 0.84, 0.44, 1), opacity .3s cubic-bezier(0.165, 0.84, 0.44, 1)
}

/* 明大祭とは　位置 */
.lMV .swiper-slide .lMV__swiper_text_link {
    /* position: absolute; */
    top: 30px;
    /* margin-bottom: 100px; */
    width: fit-content;
    /* width: 100%; */
    /* border-radius: 30px; */
    /* font-size: calc(13rem / 16); */
    font-weight: 700;
    color: white;
    letter-spacing: .05em;
    /* border: solid 2px var(--green); */
    opacity: 0;
    /* transition: opacity .3s cubic-bezier(0.165, 0.84, 0.44, 1) */
     font-size: 30px;
     margin: 0 0 0 auto
}
.lMV .swiper-slide .lMV__swiper_text_link {
    position: relative;
    /* border-radius: 2.2vw; */
    margin-top: -100px;
    font-size: 25px;
    margin: 0 0 0 auto
}

.lMV .swiper-slide .lMV__swiper_text_link a {
    /* padding: max(7rem / 16, .51vw) 1.1vw max(8rem / 16, .59vw) 2.12vw; */
    /* border-radius: 2.2vw; */
    overflow: hidden;
    isolation: isolate
}

.lMV .swiper-slide .lMV__swiper_text_link a::before {
    /* top: calc(50% - max(15rem / 16, 1.1vw) /2); */
    /* left: 1.1vw; */
    width: max(12rem / 16, .88vw);
    height: max(15rem / 16, 1.1vw)
}

.lMV .swiper-slide .lMV__swiper_text_link a::after {
    position: absolute;
    top: 50%;
    left: 0;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    /* background-color: var(--hover-light-green); */
    /* transform: translateX(-100%); */
    transition: transform .4s cubic-bezier(0.165, 0.84, 0.44, 1);
    z-index: -1
}

.lMV .swiper-slide .lMV__swiper_text_link a:hover::after {
    transform: translateX(0)
}
.lMV .swiper-slide.swiper-slide-visible .lMV__swiper_text_link {
    opacity: 1;
    transition: opacity .3s cubic-bezier(0.39, 0.575, 0.565, 1) 1s
}










.lMV .swiper-slide-prev,
.lMV .swiper-slide-duplicate-prev {
    opacity: 1 !important
}

.lMV .swiper-slide-next,
.lMV .swiper-slide-duplicate-next {
    z-index: 2 !important;
    opacity: 1 !important
}

.lMV .swiper-slide.is-prev .lMV__swiper_image {
    animation: swiperStarted 1s forwards
}

.lMV .swiper-slide.swiper-slide-visible {
    z-index: 3 !important
}

.lMV .swiper-slide.swiper-slide-visible .lMV__swiper_image {
    box-shadow: 3px 10px 20px rgba(0, 0, 0, .2)
}

.lMV .swiper-slide.swiper-slide-visible .lMV__swiper_text_title--sub span {
    transition: transform .3s cubic-bezier(0, 0.78, 0.57, 1.66) 1s, opacity .3s cubic-bezier(0, 0.78, 0.57, 1.66) 1s;
    opacity: 1;
    transform: translateY(0)
}

.lMV .swiper-slide.swiper-slide-visible .lMV__swiper_text_title--main {
    transition: transform .3s cubic-bezier(0, 0.78, 0.57, 1.66) 1s, opacity .3s cubic-bezier(0, 0.78, 0.57, 1.66) 1s;
    opacity: 1;
    transform: translateY(0)
}

.lMV .swiper-slide.swiper-slide-visible .lMV__swiper_text_time {
    opacity: 1;
    transition: opacity .3s cubic-bezier(0.39, 0.575, 0.565, 1) 1.4s
}

.lMV .swiper-slide.swiper-slide-visible .lMV__swiper_text_link {
    opacity: 1;
    transition: opacity .3s cubic-bezier(0.39, 0.575, 0.565, 1) 1.4s
}

/* メイン説明　dot */
.lMV .swiper-slide.swiper-slide-visible .lMV__swiper_dotLine--dot {
    position: absolute;
    top: -8vw;
    left: 50%;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: #39B1BB;
    transform: scale(0);
    animation: dotPoint .3s cubic-bezier(0.28, -0.37, 0.15, 1.4) forwards;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    margin-left: -5.5px;

}

.lMV .swiper-slide.swiper-slide-visible .lMV__swiper_dotLine--line {
    position: absolute;
    top: -8vw;
    left: 50%;
    width: 1px;
    height: 100px;
    border-left: dotted 4px #39B1BB;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    animation: dotLine .4s forwards linear .3s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
   

}

.lMV .swiper .lMV__swiper_btn {
    position: absolute;
    top: 2vw;
    left: 60vw;
    right: 5.33vw;
    z-index: 1;
    width: 100px;
    height: 100px
}

.lMV .swiper .lMV__swiper_btn .cArrowBtn__text {
    font-size: min(15rem / 16, max(11rem / 16, 2.93vw))
}

@media screen and (min-width: 768px) {
    .lMV .swiper {
        position: absolute;
        top: 0;
        left: 0;
        width: 100vw;


        margin-bottom: 0;
        transform-origin: 30% 50%;
        animation: fadeScaleUpPC .6s cubic-bezier(0.27, -0.64, 0.16, 1.49) forwards 2.5s
    }

    /* 修正　裏写真位置 */


    /* コメント　修正 */
    .lMV .swiper-slide {
        /* display: flex; */
        align-items: center;
        gap: 4.03vw
    }

    /* 写真スライド　修正 */
    .lMV .swiper-slide .lMV__swiper_image {
        /* 写真　縦横幅 */
        width: 22vw;
        height: 22vw;
        /* 外枠の丸み */
        border-radius: 1vw;
        /* 外枠の色 */
        border: solid .73vw var(--white);
        /* margin: 0; */
            /* 説明　autoがあるとズレる */

             display: block;
             margin: 0 auto;
             max-width: 100%;
             min-width: 300px;
             min-height: 300px;
             
             margin-top: -150px;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              /* margin-bottom: 1000px; */

              
    }


  

   

    .lMV .swiper-slide .lMV__swiper_text_link {
        position: relative;
        /* border-radius: 2.2vw; */
        
        font-size: 30px;
        margin: 0 0 0 auto;
        
    }
.lMV .swiper-slide .lMV__swiper_text_link {
    /* position: absolute; */
    top: 110px;
    /* margin-bottom: 100px; */
    /* width: fit-content; */
    /* width: 100%; */
    /* border-radius: 30px; */
    /* font-size: calc(13rem / 16); */
    /* font-weight: 700; */
    /* color: white; */
    /* letter-spacing: .05em; */
    /* border: solid 2px var(--green); */
    /* opacity: 0; */
    /* transition: opacity .3s cubic-bezier(0.165, 0.84, 0.44, 1) */
    font-size: 30px;
    margin: 0 0 0 auto;
    /* margin-bottom: -200px; */
    
}
    .lMV .swiper-slide .lMV__swiper_text_link a {
        /* padding: max(7rem / 16, .51vw) 1.1vw max(8rem / 16, .59vw) 2.12vw; */
        /* border-radius: 2.2vw; */
        overflow: hidden;
        isolation: isolate
    }

    .lMV .swiper-slide .lMV__swiper_text_link a::before {
        /* top: calc(50% - max(15rem / 16, 1.1vw) /2); */
        /* left: 1.1vw; */
        width: max(12rem / 16, .88vw);
        height: max(15rem / 16, 1.1vw)
    }

    .lMV .swiper-slide .lMV__swiper_text_link a::after {
        position: absolute;
        top: 50%;
        left: 0;
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        /* background-color: var(--hover-light-green); */
        /* transform: translateX(-100%); */
        transition: transform .4s cubic-bezier(0.165, 0.84, 0.44, 1);
        z-index: -1
    }

    .lMV .swiper-slide .lMV__swiper_text_link a:hover::after {
        transform: translateX(0)
    }

    .lMV .swiper-slide.swiper-slide-visible .lMV__swiper_image {
        box-shadow: 3px 10px 20px rgba(0, 0, 0, .2)
    }

    .lMV .swiper-slide.swiper-slide-visible .lMV__swiper_text_title--sub span {
        transition: transform .3s cubic-bezier(0, 0.78, 0.57, 1.66) 1.5s, opacity .3s cubic-bezier(0, 0.78, 0.57, 1.66) 1.5s
    }

    .lMV .swiper-slide.swiper-slide-visible .lMV__swiper_text_title--main {
        transition: transform .3s cubic-bezier(0, 0.78, 0.57, 1.66) 1.5s, opacity .3s cubic-bezier(0, 0.78, 0.57, 1.66) 1.5s
    }

    .lMV .swiper-slide.swiper-slide-visible .lMV__swiper_text_time {
        transition: opacity .3s cubic-bezier(0.39, 0.575, 0.565, 1) 1.9s
    }

    .lMV .swiper-slide.swiper-slide-visible .lMV__swiper_text_link {
        transition: opacity .4s cubic-bezier(0.39, 0.575, 0.565, 1) 1s
    }
    .lMV .swiper-slide.swiper-slide-visible .lMV__swiper_text_link {
        opacity: 1;
        transition: opacity .4s cubic-bezier(0.39, 0.575, 0.565, 1) 1s
    }
    .lMV .swiper-slide.swiper-slide-visible .lMV__swiper_dotLine--dot {
        position: absolute;
        top: 0vw;
        left: 50%;
        width: 15px;
        height: 15px;
        border-radius: 50%;
        background-color: #39B1BB;
        transform: scale(0);
        animation: dotPoint .3s cubic-bezier(0.28, -0.37, 0.15, 1.4) forwards;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        margin-left: -5.5px;

    }

    .lMV .swiper-slide.swiper-slide-visible .lMV__swiper_dotLine--line {
        position: absolute;
        top: 1.2vw;
        left: 50%;
        width: 1px;
        height: 100px;
        border-left: dotted 4px #39B1BB;
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
        clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
        animation: dotLine .4s forwards linear .3s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;


    }

    .Btn{
        position: relative;
    }
    .lMV .swiper .lMV__swiper_btn {
        position: absolute;
        top: 90px;
        left: -43vw;
        
        
        width: 6vw;
        min-width: 100px;
        height: 6vw;
        min-height: 100px;
        
    }

    .lMV .swiper .lMV__swiper_btn .cArrowBtn__text {
        font-size: max(12rem / 16, .88vw)
    }
}
















@keyframes shake {
    0% {
        transform: rotate(0)
    }

    6%,
    18%,
    30%,
    42% {
        transform: rotate(15deg)
    }

    12%,
    24%,
    36% {
        transform: rotate(-15deg)
    }

    48% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(0)
    }
}





@keyframes loopAboutNegi01 {
    0% {
        transform: translateY(100%)
    }

    100% {
        transform: translateY(-100%)
    }
}

@keyframes loopAboutNegi02 {
    0% {
        transform: translateY(0%)
    }

    100% {
        transform: translateY(-200%)
    }
}

@keyframes loopMV01 {
    0% {
        transform: translateX(100%)
    }

    100% {
        transform: translateX(-100%)
    }
}

@keyframes loopMV02 {
    0% {
        transform: translateX(0%)
    }

    100% {
        transform: translateX(-200%)
    }
}

@keyframes textAnime {
    0% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-0.3em)
    }

    100% {
        transform: translateY(0)
    }
}

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

    50% {
        opacity: 1;
        transform: translateY(-0.3em)
    }

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

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes scaleUp {
    0% {
        transform: scale(0)
    }

    100% {
        transform: scale(1)
    }
}

@keyframes jump {
    0% {
        opacity: 0;
        transform: scale(1, 1) translateY(10%)
    }

    30% {
        opacity: 1;
        transform: scale(0.8, 1.1) translateY(-10%)
    }

    60% {
        opacity: 1;
        transform: scale(1.1, 0.8) translateY(0)
    }

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

@keyframes slide {
    0% {
        transform: translateX(33.82vw)
    }

    100% {
        transform: translateX(0)
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(100%)
    }

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

@keyframes slideFadeIn {
    0% {
        opacity: 0;
        transform: translateX(-100%)
    }

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

body {
    /* トップページ上の色 */
    /* background-color: rgb(246, 187, 193); */
}

.lMV {
    position: relative;
    padding-top: 4.8vw
}

/* .lMV::before {
    position: absolute;
    top: min(598px, 113.87vw);
    left: 0;
    content: "";
    width: 100%;
    height: 197.07vw;
    トップページ下の色
    background-color: rgb(229, 96, 106);
    z-index: -1
} */





.lMV__lead {
    position: absolute;
    top: min(574px, 111.17vw);
    left: 0;
    display: flex;
    width: 100vw;
    height: -moz-fit-content;
    height: fit-content;
    font-family: var(--en-font);
    font-size: min(29px, 5.6vw);
    font-weight: 700;
    letter-spacing: .05em;
    overflow: hidden
}





.lMV__title {
    margin-bottom: 7.47vw
}

.lMV__title_image {
    position: relative;
    width: min(525px, 100%);
    height: min(228px, 43.47vw);
    margin: 0 auto
}

.lMV__title_image_item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}

.lMV__title_image--sisters {
    opacity: 0;
    animation: fadeIn 1s cubic-bezier(0.445, 0.05, 0.55, 0.95) forwards
}

.lMV__title_image--sisters.visited {
    opacity: 1;
    animation: none
}

.lMV__title_image--negi01 {
    transform: scale(0);
    animation: scaleUp .6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards 1s
}

.lMV__title_image--negi01.visited {
    transform: scale(1);
    animation: none
}

.lMV__title_image--negi02 {
    transform: scale(0);
    animation: scaleUp .6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards 1.2s
}

.lMV__title_image--negi02.visited {
    transform: scale(1);
    animation: none
}

.lMV__title_negilabo {
    width: min(525px, 100%);
    margin: 0 auto;
    opacity: 0;
    transform: scale(0) translateY(10%);
    transform-origin: bottom;
    animation: jump .8s forwards 1s
}

.lMV__title_negilabo.visited {
    animation: none;
    opacity: 1;
    transform: scale(1) translateY(0)
}

.lMV__negi {
    position: relative;
    width: 100%;
    height: 13.87vw
}

.lMV__negi_item {
    position: absolute;
    opacity: 0;
    transform: translateY(100%);
    transition: transform .6s cubic-bezier(0.165, 0.84, 0.44, 1), opacity .6s cubic-bezier(0.165, 0.84, 0.44, 1)
}


.lMV__negi.is-active .lMV__negi_item {
    opacity: 1;
    transform: translateY(0)
}

.lNegi {
    margin: 40px 5.33vw 16vw;
    transform: scaleX(0);
    transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1)
}

.lNegi__dots_item {
    transform: scaleX(0);
    transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) .2s
}

.lNegi__title,
.lNegi__text,
.lNegi__link {
    opacity: 0;
    transform: translateY(5%);
    transition: opacity .5s cubic-bezier(0.39, 0.575, 0.565, 1) .6s, transform .5s cubic-bezier(0.39, 0.575, 0.565, 1) .6s
}

.lNegi__title {
    width: -moz-max-content;
    width: max-content
}

.lNegi__link {
    position: relative;
    z-index: 1;
    transform: translateY(30%)
}

.lNegi__side {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 100%;
    padding: 19.2vw 4.53vw 0 4.53vw;
    opacity: 0;
    transition: opacity .4s .3s
}

.lNegi__side_inner {
    width: 13px;
    height: calc(100% - 40vw);
    overflow: hidden
}

.lNegi__side_right {
    transform: rotate(-180deg)
}

.lNegi__side_item {
    width: 13px;
    flex-shrink: 0
}

.lNegi__side_item span {
    display: inline-block;
    margin-bottom: 8px
}

.lNegi__image {
    position: relative
}

.lNegi__image_item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.lNegi__image_item:first-of-type {
    transform: scale(0);
    transform-origin: 50% 75%;
    transition: transform .4s cubic-bezier(0.39, 0.575, 0.565, 1) .6s
}

.lNegi__image_item:nth-of-type(2) {
    transform: scale(0);
    transition: transform .4s cubic-bezier(0.28, -0.37, 0.15, 1.4) 1s
}

.lNegi__image_item:nth-of-type(3) {
    opacity: 0;
    transform: translateY(5%);
    transition: transform .5s cubic-bezier(0.28, -0.37, 0.15, 1.4) 1.3s, opacity .5s cubic-bezier(0.28, -0.37, 0.15, 1.4) 1.3s
}

.lNegi__image_item:last-of-type {
    opacity: 0;
    transform: translateY(5%);
    transition: transform .5s cubic-bezier(0.28, -0.37, 0.15, 1.4) 1.5s, opacity .5s cubic-bezier(0.28, -0.37, 0.15, 1.4) 1.5s
}

.lNegi__text {
    padding: 0 8vw
}

.lNegi.is-active {
    transform: scaleX(1)
}

.lNegi.is-active .lNegi__dots_item {
    transform: scaleX(1)
}

.lNegi.is-active .lNegi__title,
.lNegi.is-active .lNegi__text,
.lNegi.is-active .lNegi__link {
    opacity: 1;
    transform: translateY(0)
}

.lNegi.is-active .lNegi__image_item:first-of-type,
.lNegi.is-active .lNegi__image_item:nth-of-type(2) {
    transform: scale(1)
}

.lNegi.is-active .lNegi__image_item:nth-of-type(3),
.lNegi.is-active .lNegi__image_item:last-of-type {
    opacity: 1;
    transform: translateY(0)
}

.lNegi.is-active .lNegi__side {
    opacity: 1
}

.lNegi.is-active .lNegi__side_item01 {
    animation: loopAboutNegi01 50s -25s linear infinite
}

.lNegi.is-active .lNegi__side_item02 {
    animation: loopAboutNegi02 50s linear infinite
}

.lRecipe {
    margin-bottom: 60px
}

.lRecipe__title {
    position: relative;
    margin-bottom: 8.8vw
}

.lRecipe__title_main_item {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    height: -moz-fit-content;
    height: fit-content;
    font-size: calc(32rem / 16);
    font-weight: 700;
    letter-spacing: .08em;
    line-height: calc(47rem / 16);
    text-align: center;
    background-color: var(--white);
    border: solid 3px var(--green);
    border-radius: 31px;
    margin: 0 auto calc(18rem / 16);
    transform: scaleX(0)
}

.lRecipe__title_main_top {
    padding: 0 28px 0 30px;
    margin-bottom: calc(7rem / 16)
}

.lRecipe__title_main_top.is-active .char {
    display: inline-block;
    animation: textAnime .3s cubic-bezier(0.445, 0.05, 0.55, 0.95)
}

.lRecipe__title_main_bottom {
    padding: 0 35px 0 37px
}

.lRecipe__title_main_bottom.is-active .char {
    display: inline-block;
    animation: textAnime .3s cubic-bezier(0.445, 0.05, 0.55, 0.95)
}

.lRecipe__title_main.is-active .lRecipe__title_main_item {
    transform: scaleX(1);
    transition: transform .6s cubic-bezier(0.165, 0.84, 0.44, 1)
}

.lRecipe__title_sub {
    font-family: var(--en-font);
    font-size: calc(17rem / 16);
    font-weight: 700;
    letter-spacing: .2em;
    text-align: center;
    margin-left: -6px
}

.lRecipe__title_negi {
    position: absolute;
    top: -7.2vw;
    left: 50%;
    width: max(375px, 70%);
    height: 46.13vw;
    transform: translateX(-50%)
}

.lRecipe__title_negi_image {
    position: absolute;
    top: 0;
    width: 100%;
    opacity: 0;
    transform: scale(0.7);
    transition: transform .8s cubic-bezier(0.12, 0.64, 0.17, 1.16) .6s, opacity .8s cubic-bezier(0.12, 0.64, 0.17, 1.16) .6s
}

.lRecipe__title_negi_left {
    left: 0;
    transform-origin: 30% 50%
}

.lRecipe__title_negi_right {
    right: 0;
    transform-origin: 70% 50%
}

.lRecipe__title_negi.is-active .lRecipe__title_negi_image {
    opacity: 1;
    transform: scale(1)
}

.lRecipe__category_item {
    margin-bottom: 50px
}

.lRecipe__category_title {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0 5.33vw 28px
}

.lRecipe__category_title_image {
    width: 80px;
    height: 100px;
    transform: scale(0)
}

.lRecipe__category_title_image img {
    -o-object-fit: contain;
    object-fit: contain
}

.lRecipe__category_title--main {
    font-size: calc(30rem / 16);
    font-weight: 700;
    letter-spacing: .08em;
    line-height: calc(46rem / 16);
    margin-top: calc(-10rem / 16);
    margin-bottom: calc(7rem / 16)
}

.lRecipe__category_title--sub {
    font-family: var(--en-font);
    font-size: calc(12rem / 16);
    font-weight: 700;
    letter-spacing: .08em
}

.lRecipe__category_title .char {
    opacity: 0;
    display: inline-block
}

.lRecipe__category_title.is-active .lRecipe__category_title_image {
    animation: scaleUp .6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards
}

.lRecipe__category_title.is-active .lRecipe__category_title_text .char {
    animation: textFadeUp .3s forwards .4s
}

.lGrandprix__inner {
    background-color: var(--light-green)
}

.lNegiLine {
    margin-top: -5.87vw;
    margin-bottom: 5.6vw
}

@media screen and (min-width: 768px) {
    .lMV {
        padding-top: 6.22vw
    }

    .lMV::before {
        top: 27.82vw;
        height: 54.1vw
    }



    .lMV__header {
        position: absolute;
        top: 2.86vw;
        right: max(246px, 18.01vw);
        font-size: max(14rem / 16, 1.02vw);
        font-weight: 500;
        line-height: max(30rem / 16, 2.2vw);
        transition: color .3s;
        z-index: var(--z-fixed-btn);
        opacity: 0;
        animation: fadeIn .6s cubic-bezier(0.445, 0.05, 0.55, 0.95) forwards 3s
    }

    .lMV__header.visited {
        opacity: 1;
        animation: none
    }

    .lMV__header:hover {
        color: var(--hover-green)
    }

    .lMV__lead {
        top: 22.14vh;
        left: 2.2vw;
        width: auto;
        font-size: max(13rem / 16, .95vw);
        letter-spacing: .2em;
        writing-mode: vertical-rl
    }

    .lMV__lead_text01 {
        animation: none
    }

    .lMV__lead_text01.visited {
        animation: none
    }

    .lMV__inner {
        display: flex;
        gap: 2.56vw
    }

    .lMV__title {
        width: 1vw;
        margin-top: 2.78vw;
        margin-left: 6.66vw;
        transform: translateX(36.6vw);
        animation: slide 1.4s cubic-bezier(0.075, 0.82, 0.165, 1) 1.8s forwards
    }

    .lMV__title.visited {
        animation: none;
        transform: translateX(0)
    }

    .lMV__title_image {
        height: -moz-fit-content;
        height: fit-content;
        margin-bottom: 1.32vw
    }

    .lMV__title_image--sisters {
        position: static
    }

    .lMV__title_text_title {
        font-size: max(16rem / 16, 1.17vw)
    }

    .lMV__negi {
        height: 20.5vw;
        margin-top: -10.76vw;
        margin-bottom: .73vw
    }

    .lMV__negi.visited .lMV__negi_item {
        opacity: 1;
        transform: translateY(0);
        animation: none
    }

   

  

    .lMV__banner {
        position: absolute;
        top: calc(100vh - 14.93vw);
        left: 0;
        display: block;
        width: 32.8vw;
        height: 13.47vw;
        border-radius: 0 2.2vw 2.2vw 0;
        overflow: hidden;
        z-index: 1;
        opacity: 0;
        transform: translateX(-100%);
        animation: slideFadeIn .5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 3.5s
    }

    .lMV__banner img {
        -o-object-fit: cover;
        object-fit: cover;
        transition: transform .4s cubic-bezier(0.215, 0.61, 0.355, 1)
    }

    .lMV__banner:hover img {
        transform: scale(1.04)
    }

    .lMV__banner.visited {
        opacity: 1;
        transform: translateX(0);
        animation: none
    }

    .lNegi {
        margin: 0 2.2vw 10.18vw
    }

    .lNegi__image {
        position: absolute;
        top: calc(50% - 13.25vw);
        width: 26.5vw
    }

    .lNegi__side {
        padding: 8.57vw 2.71vw 0
    }

    .lNegi__side_inner {
        width: .95vw;
        height: -moz-fit-content;
        height: fit-content;
        font-size: max(13rem / 16, .95vw)
    }

    .lNegi__side_item span {
        width: .95vw;
        margin-bottom: 0
    }

    .lNegi__side_item span.spOnly {
        display: none
    }

    .lNegi__text {
        padding: 0
    }

    .lNegi.is-active .lNegi__side_item01,
    .lNegi.is-active .lNegi__side_item02 {
        animation: none
    }

    .lRecipe {
        margin-bottom: 8.05vw
    }

    .lRecipe__title {
        margin-bottom: 5.2vw
    }

    .lRecipe__title_main_item {
        font-size: max(38rem / 16, 2.78vw);
        line-height: max(52rem / 16, 3.81vw);
        border-radius: 2.27vw;
        border: solid .22vw var(--green)
    }

    .lRecipe__title_main_top {
        padding: 0 1.98vw .15vw 2.2vw;
        margin-bottom: max(8rem / 16, .59vw)
    }

    .lRecipe__title_main_bottom {
        padding: 0 2.49vw .15vw 2.71vw;
        margin-bottom: max(18rem / 16, 1.32vw)
    }

    .lRecipe__title_sub {
        font-size: max(17rem / 16, 1.24vw);
        padding-left: .66vw
    }

    .lRecipe__title_negi {
        top: -3.22vw;
        width: 100%;
        height: 14.42vw
    }

    .lRecipe__title_negi_image {
        opacity: 1;
        transform: scale(1)
    }

    .lRecipe__title_negi_left,
    .lRecipe__title_negi_right {
        -webkit-clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%);
        clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%);
        transition: -webkit-clip-path 1.2s cubic-bezier(0.445, 0.05, 0.55, 0.95) .1s;
        transition: clip-path 1.2s cubic-bezier(0.445, 0.05, 0.55, 0.95) .1s;
        transition: clip-path 1.2s cubic-bezier(0.445, 0.05, 0.55, 0.95) .1s, -webkit-clip-path 1.2s cubic-bezier(0.445, 0.05, 0.55, 0.95) .1s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .lRecipe__title_negi.is-active .lRecipe__title_negi_left {
        -webkit-clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%);
        clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%)
    }

    .lRecipe__title_negi.is-active .lRecipe__title_negi_right {
        -webkit-clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%);
        clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%)
    }

    .lRecipe__category_title {
        width: 76.06vw;
        gap: 7px;
        margin: 0 auto 2.12vw
    }

    .lRecipe__category_title_image {
        width: 5.86vw;
        height: 7.32vw
    }

    .lRecipe__category_title_text {
        transition: opacity .4s cubic-bezier(0.165, 0.84, 0.44, 1)
    }

    .lRecipe__category_title_text:hover {
        opacity: .6
    }

    .lRecipe__category_title--main {
        font-size: max(40rem / 16, 2.93vw);
        line-height: max(60rem / 16, 4.39vw);
        margin: -0.29vw auto max(11rem / 16, .81vw) .29vw;
        margin-bottom: max(11rem / 16, .81vw)
    }

    .lRecipe__category_title--sub {
        font-size: max(13rem / 16, .95vw);
        letter-spacing: .1em;
        margin-left: .44vw
    }

    .lRecipe__category_item {
        width: 76.06vw;
        margin: 0 auto 8.93vw
    }

    .lRecipe__category_item:last-of-type {
        margin-bottom: 0
    }

    .lGrandprix__link a::before {
        background-color: var(--yellow)
    }

    .lNegiLine {
        margin-top: -5.12vw;
        margin-bottom: 2.49vw
    }

    .cFixed {
        opacity: 0;
        animation: fadeIn .6s cubic-bezier(0.445, 0.05, 0.55, 0.95) forwards 3s
    }

    .cFixed.visited {
        opacity: 1;
        animation: none
    }
}

.five_photo {
    width: 100%;
    margin: 0 auto;
    margin-top: 150px;
}

.photo-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.container {
    
    
    justify-content: center;
    
    height: 100vh;
}
.photo-container .row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    /* width: 100%; */
    margin-bottom: 20px;
}
.photo-4 {
    /* flex: 0 0 calc(33.33% - 20px); */
    margin-right: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;

}

.photo-6 {
    /* flex: 0 0 calc(33.33% - 20px); */
    margin-right: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.photo-4 img {
    width: 150px;
    height: 150px;
    border-radius: 1vw;
    border: 5px solid #fff;
    object-fit: cover;
    transition: .5s all;
}
.photo-4 img:hover{
    width: 150px;
    height: 150px;
    border-radius: 1vw;
    border: 5px solid #3AB1BB;
    object-fit: cover;
}
.photo-6 img {
    width: 150px;
    height: 150px;
    border-radius: 1vw;
    border: 5px solid #fff;
    object-fit: cover;
    transition: .5s all;
}
.photo-6 img:hover{
    width: 150px;
    height: 150px;
    border-radius: 1vw;
    border: 5px solid #3AB1BB;
    object-fit: cover;
}
.photo {
    display: flex;
    flex-direction: column;
    align-items: center;

}


.photo-4 p {
    margin-top: 10px;
    text-align: center;
    color: white;
    font-weight: 600;
    font-size: ;
}
.photo-6 p {
    margin-top: 10px;
    text-align: center;
    color: white;
    font-weight: 600;
    font-size: ;
}
.five_photo .photo-container .committee {
    /* font-size: 1vw; */
}

/*news box  */
.round-box {
    width: 70%;
    /* height: 200px; */
    border: 5px solid #3AB1BB;
    background-color: white;
    /* 枠の色を黒にする */
    border-radius: 2vw;
    /* 丸みを100pxにする */
    margin: 0 auto;
    margin-top: 100px;
    display: flex;
    justify-content: left;
    /* テキストを中央に配置する */
    align-items: left;
    /* テキストを中央に配置する */
    text-align: left;
    /* テキストを中央に配置する */
    /* padding-bottom: 60px; */
}

.round-box-text {
    color: #fff;
    /* テキストの色を白にする */
    padding-bottom: 20px;
    padding-top: 20px;
}

.textbox {
    border-radius: 25px;
    background-color: #fff;
    padding: 40px 7%;
    padding-bottom: 15px;
}

.text_content {
    line-height: 1.8;
    color: black;
    display: flex;

}

.text_content p:first-child {
    margin-right: 30px;
}

.textbox h6 {
    color: #3ab1bb;
    font-weight: 600;
    margin-bottom: 5px;
    margin-top: -20px;
    letter-spacing: -1px;
}

.textbox_frame-index {
    background-color: #39b1bb;
    border: 5px solid #39b1bb;
    border-radius: 30px;
}

.main_content {
    width: 70%;
    margin: 0 auto;
    margin-top: 100px;
    margin-bottom: 150px;
}

.view_more {
    text-align: right;
    margin-top: 10px;
    color: black;
}