@charset "UTF-8";
/* CSS Document */


.top_section {
    margin: 5rem 6.777vw;
  }
.top_wrapper {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-top: 3rem;
  }
.top_wrapper h1 {

  }
.top_wrapper h1 img {
    width: 428px;
  }
.top-lead {
    width: 100%;
    padding: 0 20px;
  }
.top-lead p {
    font-size: clamp(20px, 1.59722vw, 23px);
    padding-left: 0.5vw;
    max-inline-size: max-content;
    margin-inline: auto;
  }
.top-lead p span {
    font-size: clamp(20px, 1.73611vw, 25px);
    font-family: "Kaisei Decol", serif;
    font-weight: 400;
  }
  .green {
  color: #47A581;
  font-size: 1.7rem;
  font-weight: 600;
  }
  .pink {
  color: #E04F91;
  }
  .blue {
  color: #208FCC;
  }
  .yellow {
  color: #F0C818;
  }

@media screen and (max-width: 1010px) {
   .top_section {
    margin: 5rem 6.20833vw 0;
  }
  .top_wrapper {
    width: 100%;
    padding-top: 1.5rem;
  }
  .lunchtime_title {
    text-align: center;
  }
  .lunchtime_title h1 img {
    width: 70%;
  }
  .insta-lead {
    position: absolute;
    top: 22.5854vw;
    left: 41.4vw;
  }
 .top-lead {
    width: 100%;
    margin-top: 7rem;
    margin-bottom: 3rem;
    padding: 0;
  }
  .top-lead p {
    padding: 0;
  }
 .top_wrapper {
    display: block;
    position: relative;
    }
  .top_wrapper h1 {
    
  }
  
  .top_insta-icon img {
    width: 6.5104166vw;
    padding-top: 1rem;
  } 
} 
/*ブレイクポイント：タブレット768px*/
@media screen and (max-width: 768px) {
    .top-lead {
     margin-top: 6rem;
    }
    .top-lead p {
      font-size: clamp(15.3px, 2.60416vw, 20px);
    }
    .insta-lead {
     top: 23.5854vw;
    }
}
/*ブレイクポイント：スマホ428px*/
@media screen and (max-width: 428px) {
  .lunchtime_title h1 img {
    width: 100%;
  }
  .insta-lead {
    top: 35.8854vw;
    left: 38.3vw;
  }
 .top_insta-icon img {
    width: 10.51401vw;
  }
}


/*______PC用ランチセット：section切り替え________*/

@media screen and (min-width: 771px) {
  .sp-lunch_section {
    display: none;
  }
   .lunch_section {
    display: block;
  }
}

/*______PC用ランチセット________*/
.lunch_section {
    max-width: 1440px;
    width: 100%;
    height: auto;
  }

.mobile-lunch_title {
    display: none;
  }
.border {
    display: inherit;
    position: relative;
    padding: 5px;
    padding-bottom: 5rem;     
    border: solid 5px #91C6B4;
    border-radius: 10px;
    margin: 0 2rem;
  }
.border::before {
    content: "";
    position: absolute;
    top: -12px;
    bottom: -12px;
    left: -12px;
    right: -12px;
    border: solid 10px rgba(255,255,255,0.80); /* 外枠のスタイル */
    border-radius: 10px;
    z-index: -1;
  }
.item {
    padding: 2rem 0;
  }
.item_wrapper {
    width: fit-content;
    display: flex;
    justify-content: space-around;
    padding-top: 3rem;
    flex-wrap: wrap;
  }
.item_wrapper img {
    width: 28.222vw;
  }
.item p {
    max-inline-size: max-content;
    margin-inline: auto;
    font-size: clamp(20px, 1.59722vw, 23px);
    width: 24.033vw;
  }
  img.tacoeice {
    width: 24.222vw;
  }
  img.sandwich {
    width: 24.222vw;
  }
  img.coconut {
    width: 24.222vw;
  }
  img.gochisouchikin {
    width: 24.222vw;
  }
.item5 img {
    width: 27.777vw;
    min-width: 305px;
  }
.mobile-item2 {
  display: none;
  }

/*SP用ランチメニュー：section切り替え*/
@media screen and (max-width: 768px) {
   .lunch_section {
    display: none;
  }
   .sp-lunch_section {
    display: block;
  }   
}

/*SP用ランチメニュー*/
  .sp-lunch_section {
        text-align: center;
  }
  .sp-mobile-lunch_title {
    text-align: center;
  }
  .sp-mobile-lunch_title img {
    width: 70%;
    margin-top: 2rem;
  } 
  .mobile-lunch_title {
    width: 100%;
    text-align: center;
  } 
  .mobile-lunch_title img {
    width: 39.713541vw;
  } 
  .sp-border {
    display: inherit;
    position: relative;
    padding: 5px;
    padding-bottom: 5rem;     
    border: solid 5px #91C6B4;
    border-radius: 10px;
    margin: 0 2rem;
  }
  .sp-border::before {
    content: "";
    position: absolute;
    top: -12px;
    bottom: -12px;
    left: -12px;
    right: -12px;
    border: solid 10px rgba(255,255,255,0.80); /* 外枠のスタイル */
    border-radius: 10px;
    z-index: -1;
  }

  .sp-lunch_section {
    max-width: 1440px;
    width: 100%;
    height: auto;
    margin-top: 4rem;
  }
/*画像*/
  .sp-item {
    padding: 3rem;
    margin-top: -5rem;
  }
  .sp-item_wrapper {
    width: fit-content;
    display: flex;
    justify-content: space-around;
    padding-top: 3rem;
    flex-wrap: wrap;
  }
  .sp-item_wrapper img {
    width: 22.222vw;
  }
  .sp-item p {
    max-inline-size: max-content;
    margin-inline: auto;
    font-size: clamp(16px, 2.99479vw, 23px);
    text-align: left;
    width: 63.033vw ;
  }
  .sp-item.item1 {
    margin: 0;
    padding: 5vw 34vw 5vw 0;
  }
  .sp-item.item1 img {
    width: 51.282vw;
  }
  .sp-item.item2  {
    
  }
  .sp-item.item2 img {
    width: 70.687vw;;
  }
  .sp-item.item3  {
    margin: 0;
    padding: 5vw 0 5vw 34vw;
  }
  .sp-item.item3 img {
    width: 51.282vw;
  }
 .sp-item.item4  {
   
  }
  .sp-item.item4 img {
    width: 70.687vw;
  }
  .sp-item.item6 {
    margin: 0;
    padding: 5vw 34vw 5vw 0;
  }
  .sp-item.item6 img {
    width: 51.282vw;
  }
  .sp-item.item7  {

  }
  .sp-item.item7 img {
    width: 70.687vw;
  }
  .sp-item.item8 {
    margin: 0;
    padding: 5vw 0 5vw 34vw;
  }
  .sp-item.item8 img {
    width: 51.282vw;
  }
  .sp-item.item9  {
    margin-top: -2rem;
  }
  .sp-item.item9 img {
    width: 70.687vw;
  }

/*ブレイクポイント：スマホ428px*/
@media screen and (max-width: 428px) {
/* ランチセクション */
  .sp-lunch_section {
    text-align: center;
    width: 100%;
  }
  .sp-border {
    margin: 0 1.5rem;
  }
  .sp-mobile-lunch_title img {
    width: 80%;
}
  .sp-item {
    padding: 0;
  }
  .sp-item p {
    text-align: left;
    width: 69vw;
  }
  .sp-item.item1 {
    padding-right: 117px;
    padding-bottom: 0rem;   
  }
  .sp-item.item2 {
    width: 79.487vw;
    margin: 0 auto;
  }
  .sp-item.item3 {
    padding-left: 65px;
    padding-top: 3rem;
    padding-bottom: 0rem;
  }
  .sp-item.item4 {
    width: 79.487vw;
     margin: 0 auto;
  }
  .sp-item.item6 {
    padding-right: 117px;
    padding-top: 3rem;
    padding-bottom: 0rem;
  }
  .sp-item.item7 {
    width: 79.487vw;
    margin: 0 auto;    
  }
  .sp-item.item8 {
    padding-left: 65px;
    padding-top: 3rem;
    padding-bottom: 2rem;
  }
  .sp-item.item9 {
    width: 79.487vw;
    margin: 0 auto;
    padding-bottom: 0rem;
  }  
}
/*ーーーーーーーーーdrinkーーーーーーーーーーーーー*/

  .drink {
    max-width: 1440px;
    text-align: center;
    position: relative;
  }
  .drink ul {
  display: flex;
  list-style: none;
  }

  .drink_content {
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center;
    flex-direction: row;
    margin: 12rem 4vw;
    gap: 6vw;
  }
  .drink_content img {
    width: 100%;
  }
  .drink_title__wrapper {
    position: relative;
    top: 90px;
    z-index: 9999;
  }

  .drink_title__wrapper img {
    width: 35%;
    min-width: 300px;
  }
  .scroll-infinity {
    margin-top: -10rem;
  }
/*------------右から無限ループ-----------------*/
@keyframes infinity-scroll-left {
    from {
      transform: translateX(0);
    }
      to {
      transform: translateX(-100%);
    }
    }
    .scroll-infinity__wrap {
      display: flex;
      overflow: hidden;
    }
    .scroll-infinity__list {
      display: flex;
      list-style: none;
      padding: 0
    }
    .scroll-infinity__list--left {
      animation: infinity-scroll-left 80s infinite linear 0.5s both;
    }
    .scroll-infinity__item {
      width: calc(100vw / 6);
      padding-left: 1.24166vw;
    }
    .scroll-infinity__item>img {
      width: 12vw;
    }

/*-------------------------------------*/
@media screen and (max-width:1060px){

  .drink_content {
    display: block;
    margin-top: 5rem;
    margin-bottom: 0rem;
  }
  .drink_title__wrapper img {
    width: 27.777vw;
    min-width: 308px;
  }
  .drink {

  }
  .specialdrink {
    margin-top: 5rem;
    margin-bottom: 6rem;
  }
  .scroll-infinity {
    margin: 0;
    padding-top: 12rem;
  }
  .scroll-infinity__item>img {
    width: 14vw;
  }
  .drink_content img {
    width: 70%;
  }
}
/*ブレイクポイント：スマホ428px*/
@media screen and (max-width: 428px) {
/* ドリンク */
 .scroll-infinity {
    padding-top: 9rem;
  }
  .drink_content {
    margin-top: 1rem;
  }
  .specialdrink {
    margin-top: 2rem;
    margin-bottom: 1rem;
 }
}

/*------------左から無限ループ-----------------*/
    @keyframes infinity-scroll-right {
    from {
      transform: translateX(-100%);
    }
      to {
      transform: translateX(0%);
    }
    }
    .scroll-infinity__list--right{
      animation :infinity-scroll-right 80s infinite linear 0.5s both;
    }


/*-------------------甘いもの-------------------*/

.sweets-menu {
    max-width: 1440px;
    height: auto;
    text-align: center;
    margin: 15rem 5vw 20rem;
    position: relative;
}
.hoshi_deco1 {
    position: absolute;
    top: -124px;
    right: 9rem;
}
.hoshi_deco1 img {
    width: 110%;
}
.hoshi_deco2 {
    position: absolute;
    bottom: -13.9rem;
    left: -5.8rem;
}
.hoshi_deco2 img {
    width: 110%;
}
.sweets_title__wrapper {
    width: 100%;
    padding-top: 7rem;
    padding-bottom: 10rem;  
    background-image: url("../images/lunchtime/sweets/Halloween.png"), url("../images/lunchtime/sweets/parfait.png"), url("../images/lunchtime/sweets/milcrepe.png"), url("../images/lunchtime/sweets/chiffoncake.png");
    background-repeat: no-repeat;
    background-size: 13%, 13%, 16%, 10%;
    background-position: top 23rem left 10vw, top 23rem right 14vw, top 37.4rem left 25.1vw, top 40rem right 25vw;
}
.sweets_title__wrapper p {
    text-align: left;
    max-inline-size: max-content;
    margin-inline: auto;
    font-size: clamp(16px, 2.60416vw, 20px);
}
.sweets_title img {
    width: 27.777vw;
    min-width: 308px;
}
.sweets_selection {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    margin: 25rem auto 10rem auto;
}
.sweets_selection p {
    text-align: center;
    max-inline-size: max-content;
    margin-inline: auto;
    font-size: clamp(16px, 2.60416vw, 20px);
}
.sweets_select1 {
    padding-right: 1vw;
}
.sweets_select3 {
    padding-left: 1vw;
}
.sweets_selection img {
    width: 80%;
}
.box {
    margin: 0 auto;
/*    width: 86.8055vw;*/
    height: auto;
    background: #F9F9EAff;
    border-top-left-radius: 41.666vw;
    border-top-right-radius: 41.666vw;
}

  img.hana-hr {
    width: 60%;
  }
  .sweets-text p {
    padding: 0 2.777vw;
    max-inline-size: max-content;
    margin-inline: auto;
    text-align: left;
    font-size: clamp(16px, 2.60416vw, 20px);
}

@media screen and (max-width: 955px) {
  .hoshi_deco1 {
    top: -123px;
    right: 0;
  }
  .hoshi_deco1 img {
     width: 80%;
     transform: rotate(-25deg);
  }
  
  .sweets_title__wrapper {
    background-size: 17%, 19%, 23%, 15%;
    background-position: top 6rem left 10vw, top 7rem right 7vw, top 44rem left 0vw, top 45rem right 0vw;
    padding-bottom: 8rem;
  }
  .sweets_title__wrapper p {
    font-size: clamp(16px, 2.0942vw, 20px);
  }  
  .sweets_title {
    width: 100%;
    padding-top: 9rem;
  }
  .sweets_title img {
    width: 70%;
  }
  
  .sweets_selection {
    display: block;
    position: relative;
    margin-top: 7rem;    
  }
    .sweets_selection img {
    width: 22.942vw;
  }  
  .sweets_selection p {
    width: 32.942vw;
  } 
  .sweets_selection p span {
    font-size: 1.4rem;
  }   
  .sweets_select1 {
    padding: 0;
    width: 26.442vw; 
    margin: 0 auto;    
  }
  .sweets_select2 {
    position: absolute;
    top: 26rem;
    left: 7vw;
    width: 22.942vw; 
  }
  .sweets_select3 {
    padding: 0;
    position: absolute;
    top: 26rem;
    right: 7vw;
    width: 22.942vw;    
  }
  p.sweets-text {
    padding: 1rem 8vw;
    text-align: left;
  }
  img.hana-hr {
    width: 80%;
    padding-top: 19rem;
  }  
  .hoshi_deco2 {
    bottom: -9.9rem;
    left: -8.8rem;
  }
  .hoshi_deco2 img {
    width: 80%;
  }
}

@media screen and (max-width:612px){
  .hoshi_deco1 {
    top: -83px;
    right: -18px;
  }
  .hoshi_deco1 img {
    width: 50%;
    transform: rotate(-45deg);    
  }
  .sweets_title__wrapper {
    background-size: 17%, 18%, 23%, 14%;
    background-position: top 4rem left 11vw, top 4rem right 8vw, top 25.2rem left 0vw, top 27rem right 0.1vw;
    font-size: clamp(14px, 2.6143vw, 16px);
  }
  .sweets_title__wrapper p {
    font-size: clamp(13px, 2.6143vw, 16px);
  }  
  .sweets_title {
    width: 100%;
    padding-top: 3rem;
  }
  .sweets_title img {
    width: 70%;
  }
  .sweets_selection {
    margin: 5rem auto 13rem auto;
  } 
    .sweets_selection img {
    width: 25.942vw;
  }  
  .sweets_selection p {
    width: 40.442vw;
  } 
  .sweets_selection p span {
    font-size: 1.4rem;
  }   
  .sweets_select1 {
    padding: 0;
    width: 40.442vw; 
    margin: 0 auto;    
  }
  .sweets_select2 {
    position: absolute;
    top: 21rem;
    left: 1vw;
    width: 40.442vw; 
  }
  .sweets_select3 {
    padding: 0;
    position: absolute;
    top: 21rem;
    right: 1vw;
    width: 40.442vw;    
  }  
  img.hana-hr {
    width: 80%;
    padding-top: 12rem;
  }
  .hoshi_deco2 {
    bottom: -6.9rem;
    left: -10.8rem;
}
  .hoshi_deco2 img {
    width: 50%;
  }
 .footer_logo img {
    padding-bottom: 1.3rem;
    width: 30.512vw;
    }  
}