@charset "utf-8";
/* ---------------------
  - root

  - html
  - body

  - inner

  - logo
    - --copyright

  - img

  - btn
  - btns
    - btns__item

  - title
    - title__item
      - --text
      - --bubble
      - --label

  - featherModal
    - --restaurant
  - featherlight
    - featherlight-content

  - header
    - header__logo
    - header__btn

  - main
  - section

  - --mv

  - --appeal
  - appeal
    - appeal__item
  - appealLead
    - appealLead__item
  - appealText
    - appealText__item
  - appealTitle
    - appealTitle__item
      - --text
      - --figure
  - appealPoint
    - appealPoint__list
    - appealPoint__figure
    - appealPoint__lead
  - appealCheck
    - appealCheck__item

  - --quality
  - quality
    - quality__item
      - --location
      - --timetable
      - --photo
      - --dish

  - tabContainer
    - tabContainer__switch
    - tabContainer__target
  - --isFixed

  - tabSwitch
    - tabSwitch__item
  - tabSwitchLabel

  - JS-tabSwitch
      - --isSelect
  - JS-tabTarget
    - --isVisible

  - --restaurant
  - restaurant
    - restaurant__about
    - restaurant__access
  - restaurantAbout
    - restaurantAbout__title
    - restaurantAbout__desc
    - restaurantAbout__btn

  - restaurantName
    - restaurantName__text
  - restaurantCatch
    - restaurantCatch__item
  - restaurantDesc
    - restaurantDesc__item

  - restaurantAccess
    - restaurantAccess__map
    - restaurantAccess__address
  - restaurantAddress
    - restaurantAddress__title
    - restaurantAddress__body
  - restaurantAddressText
    - restaurantAddressText__item
      - --note

  - --intro
  - intro
    - intro__item

  - --points
  - points
    - points__title
    - points__large
    - points__small
  - pointsImgs
    - pointsImgs__item

  - --testimonials
  - testimonials
    - testimonials__text
    - testimonials__figure
  - testimonialsTitle
    - testimonialsTitle__text
  - testimonialsComment
    - testimonialsComment__text
    - testimonialsComment__name
  - testimonialsText
    - testimonialsText__item
  - testimonialsName
  - testimonialsImg
    - testimonialsImg__top
    - testimonialsImg__bottom

   - --harmonie
   - --sud
   - --reims
   - --terakoya

  - --planner
  - planner
    - planner__item
      - --title
      - --comment
  - plannerComments
    - plannerComments__item
  - plannerComment

  - --faq
  - faqs
    - faqs__item
  - faq
    - faq__item
  - faqItem
    - faqItem__text
      - --que
      - --ans
  - faqText
    - faqText__category
    - faqText__title
    - faqText__item
  - JS-faqTrigger
    - --isOpen
  - JS-faqTarget

  - footer

  --message
  - message
    - message__figure
    - message__text
  - messageText
    - messageText__item

  - copyright

  - --form

  - floating
    - --isHide
--------------------- */



/* -----------------------------------
  root
----------------------------------- */
:root {
  --color: #333;

  --color-bg: #f0f1f5;
  --color-bg-rgb: 240, 241, 245;

  --color-gold: #9b9073;
  --color-gold-rgb: 155, 144, 115;

  --color-white: #fff;
  --color-white-rgb: 255, 255, 255;

  --color-faq: #565863;

  --font-family: 'Noto Serif JP', serif;
}



/* -----------------------------------
  html
----------------------------------- */
html {
  -webkit-text-size-adjust: 100%;
          text-size-adjust: 100%;
}
@media screen and (min-width:670px) {
  html {
    font-size: clamp( 10px, 1.40625vw, 18px ); /* 18/12.8 */
  }
}
@media screen and (max-width:669.9px) {
  html {
    font-size: clamp( 12px, 2.092675635276532vw, 14px ); /* 14/6.69 */
  }
}



/* -----------------------------------
  body
----------------------------------- */
body {
  color: var(--color);
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  font-family: var(--font-family);
  word-wrap: break-word;
  overflow-wrap: anywhere;
  -webkit-font-smoothing: antialiased;
}

body:before ,
body:after {
  position: fixed;
  inset: 0;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin-inline: auto;
  /*content: " ";*/
}

body:before {
  width: 2px;
  background-color: rgb( 204 0 0 / 50% );
}

body:after {
  max-width: 1440px;
  border-inline: min(5vw, 80px) solid rgb( 204 0 0 / 25% );
  box-sizing: border-box;
  z-index: -1;
}



/* -----------------------------------
  inner
----------------------------------- */
.inner {
  max-width: 1440px;
  margin-inline: auto;
  padding-inline: min( 5vw, 80px ); /* 80/16 */
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}



/* -----------------------------------
  logo
----------------------------------- */
.logo {
  position: relative;
  aspect-ratio: 13 / 2;
  overflow: hidden;
  background-image: url("../../img/reserve/logo.svg");
  background-position: 50%;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
}

.logo span {
  position: absolute;
  top: 0;
  left: 200%;
  white-space: nowrap;
}


/*  --copyright
------------------------ */
.logo#--copyright {
  width: min( 14rem, 252px ); /* 252/18 */
}
@media screen and (max-width:669.9px) {
  .logo#--copyright {
    margin-inline: auto;
  }
}



/* -----------------------------------
  img
----------------------------------- */
.img {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background-position: 50%;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
}

.img :is( div, p, span ) {
  position: absolute;
  top: 0;
  left: 200%;
  white-space: nowrap;
}



/* -----------------------------------
  btn
----------------------------------- */
.btn > :is( a, span ) {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: center;
  -ms-align-items: center;
      align-items: center;
  gap: .75em;
  padding-block: .5em;
  padding-inline: calc( 1.5em + .5em ) .75em;
  border-radius: 3lh;
  background-color: var(--color);
  color: var(--color-white);
  text-decoration: none;
}


.btn a:after {
  display: block;
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
  -webkit-transform: rotate( 45deg );
      -ms-transform: rotate( 45deg );
       -o-transform: rotate( 45deg );
          transform: rotate( 45deg );
  aspect-ratio: 1 / 1;
  width: .5em;
  border-top: .15em solid var(--color-white);
  border-right: .15em solid var(--color-white);
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  content: " ";
}

.btn span {
  display: block;
  margin-inline: auto;
}



/* -----------------------------------
  btns
----------------------------------- */
/*  btns__item
------------------------ */
.btns__item + .btns__item {
  margin-top: 10px;
}



/* -----------------------------------
  title
----------------------------------- */
.title {
  position: relative;
  inline-size: fit-content;
  margin-bottom: .6730769241em; /* 35/52 */
}
@media screen and (min-width:670px) {
  .title {
    font-size: 2.88888889rem; /* 52/18 */
  }
}
@media screen and (max-width:669.9px) {
  .title {
    font-size: 2rem; /* 28/14 */
  }
}

.title:before ,
.title:after {
  display: block;
  font-weight: 600;
}

.title[data-bubble]:before {
  overflow: hidden;
  background-position: 50%;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
  text-indent: 200%;
  white-space: nowrap;
  content: attr(data-bubble);
}

.title[data-text]:before {
  content: attr(data-text);
}

.title[data-sub]:after {
  content: attr(data-sub);
}


/*  title__item
------------------------ */
.title__item {
  display: block;
  inline-size: fit-content;
  position: relative;
}

.title__item span {
  display: block;
  inline-size: fit-content;
}

.title__item span > span {
  display: inline-block;
}


/*  --text  */
.title__item.--text {
  overflow: hidden;
  font-weight: 600;
  letter-spacing: .02em;
}

.title__item.--text[data-text]:before {
  content: attr(data-text);
}

.title__item.--text[data-text] span {
  position: absolute;
  top: 0;
  left: 200%;
  white-space: nowrap;
}


/*  --bubble  */
.title__item.--bubble {
  overflow: hidden;
  font-weight: 500;
  font-size: max( 10px, .3913043487em ); /* 18/46 */
}

.title__item.--bubble:before ,
.title__item.--bubble:after {
  display: block;
  clip-path: polygon( 100% 0, 0 0, 100% 100% );
  aspect-ratio: 8 / 11;
  width: .44444444em; /* 8/18 */
  margin-top: -1px;
  content: " ";
}

.title__item.--bubble:before {
  position: absolute;
  bottom: 0;
  z-index: 9;
  margin-left: 1px;
  background-color: var(--color-white);
}

.title__item.--bubble:after {
  position: relative;
  background-color: var(--color);
}

.title__item.--bubble > span {
  padding: .6em 1.4em;
  border: 1px solid var(--color);
  background-color: var(--color-white);
}


/*  --label  */
.title__item.--label {
  padding-inline: 1em;
  border: 1px solid var(--color);
  border-radius: 3lh;
  font-weight: 400;
  font-size: .4210526324em; /* 16/38 */
  line-height: 1.75;
}



/* -----------------------------------
  featherModal
----------------------------------- */
.featherModal {
  display: none;
}

.featherModal .img {
  aspect-ratio: 425 / 2699;
}


/*  --restaurant
------------------------ */
.featherModal.--restaurant .img {
  width: min( 90vw, 600px );
}



/* -----------------------------------
  featherlight
----------------------------------- */
/*  featherlight-content
------------------------ */
.featherlight .featherlight-content {
  padding: 0;
}



/* -----------------------------------
  header
----------------------------------- */
#header {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: space-between;
  -ms-align-items: center;
      align-items: center;
  gap: min( 1.875vw, 30px ); /* 30/16 */
  margin-bottom: min( 6.25vw, 100px ); /* 100/16 */;
  padding-block: 2.5em 10px; /* 45/18 */
  padding-inline: min( 3.75vw, 60px ); /* 60/16 */
}


/*  header__logo
------------------------ */
#header__logo {
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
  width: min( 11.44444444em, 206px ); /* 206/18 */
}


/*  header__btn
------------------------ */
#header__btn .btn {
  font-size: max( .88888889rem, 10px ); /* 16/18 */
}

#header__btn .btn > span {
  padding: .25em 1.5em;
  border-radius: 0;
  background-color: var(--color-gold);
}



/* -----------------------------------
  main
----------------------------------- */



/* -----------------------------------
  section
----------------------------------- */



/* -----------------------------------
    - --mv
----------------------------------- */
.section#--mv .title__item.--text {
  font-weight: 500;
  letter-spacing: .2em;
}

@media screen and (max-width:540px) {
  .section#--mv .title {
    margin-inline: auto;
    font-size: min( 5vw, 2rem ); /* 16/3.2 */
  }
}

@media screen and (max-width:540px) {
  .section#--mv .title__item.--text span {
    margin-inline: auto;
  }
}

@media screen and (max-width:540px) {
  .section#--mv .title__item.--text span > span {
    display: block;
  }
}

.section#--mv .img {
  background-position: 50%;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
}
@media screen and (min-width:425.1px) {
  .section#--mv .img {
    aspect-ratio: 16 / 9;
    background-image: url("../../img/reserve/mv-pc.jpg");
  }
}
@media screen and (max-width:425px) {
  .section#--mv .img {
    aspect-ratio: 8 / 9;
    background-image: url("../../img/reserve/mv-sp.jpg");
  }
}



/* -----------------------------------
  --appeal
----------------------------------- */
.section#--appeal {
  margin-top: max( -5.9375vw, -95px ); /* 95/16 */
  overflow: hidden;
}



/* -----------------------------------
  appeal
----------------------------------- */
#appeal {
  padding-bottom: min( 9.765625%, 125px ); /* 125/12.8 */
}


/*  appeal__item
------------------------ */
.appeal__item + .appeal__item {
  margin-top: 7.8125%; /* 100/12.8 */
}



/* -----------------------------------
  appealLead
----------------------------------- */
.appealLead {
  font-size: 1.22222222rem; /* 22/18 */
  line-height: 1.9;
  letter-spacing: .02em;
}


/*  appealLead__item
------------------------ */
.appealLead__item {
  display: block;
  inline-size: fit-content;
}



/* -----------------------------------
  appealText
----------------------------------- */
.appealText {
  font-size: 1.22222222rem; /* 22/18 */
  line-height: 1.9;
  letter-spacing: .02em;
  text-indent: .02em;
}


/*  appealText__item
------------------------ */
.appealText__item {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
  justify-content: center;
  -ms-align-items: stretch;
      align-items: stretch;
  inline-size: fit-content;
  margin-inline: auto;
}



/* -----------------------------------
  appealTitle
----------------------------------- */
@media screen and (min-width:670px) {
  #appealTitle {
    display: -webkit-flex;
    display:    -moz-flex;
    display:     -ms-flex;
    display:      -o-flex;
    display:         flex;
    justify-content: flex-start;
    -ms-align-items: flex-end;
        align-items: flex-end;
  }
}


/*  appealTitle__item
------------------------ */
.appealTitle__item {
  position: relative;
}
@media screen and (min-width:670px) {
  .appealTitle__item {
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
  }
}


/*  --text  */
.appealTitle__item.--text {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding-right: 7.8125%; /* 100/12.8 */
}
@media screen and (min-width:670px) {
  .appealTitle__item.--text {
    width: 62.5%; /* 800/12.8 */
    margin-bottom: 4.6875%; /* 60/12.8 */
    padding-bottom: 5.859375%; /* 75/12.8 */
  }
}
@media screen and (max-width:669.9px) {
  .appealTitle__item.--text {
    width: min( 450px, 80vw );
    padding-bottom: 12.5%; /* 160/12.8 */
  }
}
@media screen and (min-width:375.1px) {
  .appealTitle__item.--text {
    padding-top: 23.046875%; /* 295/12 */
  }
}
@media screen and (max-width:375px) {
  .appealTitle__item.--text {
    padding-top: 17.5%;
  }
}

.appealTitle__item .title[data-bubble]:before {
  margin-left: 5em;
  aspect-ratio: 197 / 94;
  width: 3.7884615398em; /* 197/52 */
  background-image: url("../../img/reserve/appeal/data-bubble.png");
}

.appealTitle__item .title:after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  aspect-ratio: 39 / 28;
  width: 1.5em; /* 78/52 */
  background-image: url("../../img/reserve/appeal/icon-title.svg");
  background-position: 50%;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
  content: " ";
}

.appealTitle__item.--text:after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  width: 100vw;
  background-color: var(--color-bg);
  content: " ";
}

@media screen and (max-width:360px) {
  .appealTitle__item.--text .appealLead__item {
    display: inline;
  }
}


/*  --figure  */
@media screen and (min-width:670px) {
  .appealTitle__item.--figure {
    width: 32.578125%; /* 417/12.8 */
    margin-left: -7.8125%; /* 100/12.8 */
  }
}
@media screen and (max-width:669.9px) {
  .appealTitle__item.--figure {
    margin-top: -7.8125%;
  }
}
@media screen and (min-width:390.1px) and (max-width:669.9px) {
  .appealTitle__item.--figure {
    width: 35%;
    margin-left: 55%;
  }
}
@media screen and (max-width:390px) {
  .appealTitle__item.--figure {
    width: 60%;
    margin-inline: auto;
  }
}

.appealTitle__item.--figure:after {
  position: absolute;
  width: 85%;
  height: 80%;
  right: -26.3788968834%; /* 110/4.17 */
  bottom: -6.3897763586%; /* 40/6.26 */
  z-index: -1;
  background-color: var(--color-bg);
  content: " ";
}

.appealTitle__item.--figure .img {
  aspect-ratio: 417 / 626;
  background-image: url("../../img/reserve/appeal/figure-title.jpg");
}



/* -----------------------------------
  appealPoint
----------------------------------- */
#appealPoint {
  position: relative;
}
@media screen and (min-width:670px) {
  #appealPoint {
    padding-left: 50%;
  }
}


/*  appealPoint__list
------------------------ */
#appealPoint__list {
  padding-block: 3.5em; /* 70/20 */
  background-color: var(--color-bg);
  font-size: 1.1111111111rem; /* 20/18 */
}
@media screen and (min-width:670px) {
  #appealPoint__list {
    margin-bottom: 8.28125%; /* 53/6.4 */
    margin-left: -12.5%; /* 80/6.4 */
    padding-inline: calc( 12.5% + 2.75em ) 2em; /* 55/20 40/20 */
  }
}
@media screen and (max-width:669.9px) {
  #appealPoint__list {
    padding-inline: 2.5em;
  }
}


/*  appealPoint__figure
------------------------ */
@media screen and (min-width:670px) {
  #appealPoint__figure {
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY( -47.5% );
        -ms-transform: translateY( -47.5% );
         -o-transform: translateY( -47.5% );
            transform: translateY( -47.5% );
    width: 50%;
  }
}
@media screen and (max-width:669.9px) {
  #appealPoint__figure {
    margin-block: 8.28125%;
  }
}

#appealPoint__figure .img {
  aspect-ratio: 64 / 53;
  background-image: url("../../img/reserve/appeal/figure-point.png?r=20260128");
}


/*  appealPoint__lead
------------------------ */
@media screen and (min-width:670px) {
  #appealPoint__lead {
    padding-left: 9.375%; /* 60/6.4 */
  }
}

#appealPoint__lead .appealLead {
  font-size: 1.94444444444rem; /* 35/18 */
  line-height: 1.7;
}
@media screen and (max-width:669.9px) {
  #appealPoint__lead .appealLead {
    inline-size: fit-content;
    margin-inline: auto;
  }
}



/* -----------------------------------
  #appealCheck
----------------------------------- */
#appealCheck {
  list-style: none;
}


/*  appealCheck__item
------------------------ */
.appealCheck__item {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: center;
      align-items: center;
  gap: 1em;
}

.appealCheck__item:before {
  display: block;
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
  aspect-ratio: 39 / 37;
  width: 1.95em; /* 39/20 */
  background-image: url("../../img/reserve/appeal/icon-check.svg");
  background-position: 50%;
  -webkit-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  content: " ";
}

.appealCheck__item span {
  -webkit-flex: 1;
     -moz-flex: 1;
      -ms-flex: 1;
       -o-flex: 1;
          flex: 1;
}

.appealCheck__item + .appealCheck__item {
  margin-top: 1em;
}



/* -----------------------------------
  --quality
----------------------------------- */
.section#--quality {
  padding-block: min( 5.625vw, 90px ) min( 6.25vw, 100px ); /* 90/16 100/16 */
  background-color: var(--color-bg);
}

.section#--quality .title {
  margin-inline: auto;
}
@media screen and (min-width:670px) {
  .section#--quality .title {
    font-size: 2.55555556rem; /* 46/18 */
  }
}
@media screen and (max-width:669.9px) {
  .section#--quality .title {
    font-size: 1.7142857154rem; /* 24/14 */
  }
}

.section#--quality .title__item {
  margin-inline: auto;
}

.section#--quality .title__item.--bubble {
  letter-spacing: .3em;
  text-indent: .3em;
}

.section#--quality .title__item.--bubble:before ,
.section#--quality .title__item.--bubble:after {
  left: 50%;
  -webkit-transform: translateX( -100% );
      -ms-transform: translateX( -100% );
       -o-transform: translateX( -100% );
          transform: translateX( -100% );
}

.section#--quality .title__item.--bubble:before {
  background-color: var(--color-bg);
}

.section#--quality .title__item.--bubble > span {
  background-color: var(--color-bg);
}

.section#--quality .title__item.--text {
  text-indent: .02em;
}

.section#--quality .title__item.--text > span {
  margin-inline: auto;
}



/* -----------------------------------
  quality
----------------------------------- */
.quality {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  gap: 8px;
}

@media screen and (max-width:669.9px) {
  .quality:has( .quality ) {
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
  }
}


/*  quality__item
------------------------ */
.quality__item {
  -webkit-flex: 1;
     -moz-flex: 1;
      -ms-flex: 1;
       -o-flex: 1;
          flex: 1;
  position: relative;
}

.quality__item:before {
  position: absolute;
  top: -6px;
  left: -8px;
  z-index: 9;
  aspect-ratio: 50 / 23;
  width: 15.7232704417%; /* 100/6.36 */
  background-position: 50%;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
}

/*  --location  */
.quality__item.--location:before {
  background-image: url("../../img/reserve/quality/label-location.png?r=20260128");
  content: " ";
}

.quality__item.--location .img {
  aspect-ratio: 53 / 21;
  background-image: url("../../img/reserve/quality/img-location.png?r=20260128");
}


/*  --timetable  */
.quality__item.--timetable:before {
  background-image: url("../../img/reserve/quality/label-timetable.png?r=20260128");
  content: " ";
}


/*  --photo  */
.quality__item.--photo .img {
  aspect-ratio: 157 / 126;
  background-image: url("../../img/reserve/quality/img-photo.png?r=20260128");
}


/*  --dish  */
.quality__item.--dish .img {
  aspect-ratio: 157 / 126;
  background-image: url("../../img/reserve/quality/img-dish.png?r=20260128");
}



/* -----------------------------------
  tabContainer
----------------------------------- */
/*  tabContainer__switch
------------------------ */
.tabContainer__switch {
  background: linear-gradient( 180deg, rgba( 255, 255, 255, .8 ) 25%, rgba( 255, 255, 255, 0 ) );
}
@media screen and (min-width:670px) {
  .tabContainer__switch {
    padding-block: 10px;
  }
}


/*  tabContainer__target
------------------------ */
.tabContainer__target {
  margin-top: min( 6.25vw, 100px ); /* 100/16 */
}

.tabContainer__switch.--isFixed {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 9999;
}



/* -----------------------------------
  tabSwitch
----------------------------------- */
.tabSwitch {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: center;
  -ms-align-items: stretch;
      align-items: stretch;
}
@media screen and (min-width:670px) {
  .tabSwitch {
    gap: .5882352951em; /* 10/17 */
    font-size: max( 11px, .94444444rem ); /* 17/18 */
  }
}
@media screen and (max-width:669.9px) {
  .tabSwitch {
    gap: 1px;
    background-color: var(--color-white);
    font-size: max( 11px, .92857156rem ); /* 13/14 */
  }
}

@media screen and (min-width:670px) {
  .tabSwitch:has( .tabSwitch ) {
    -webkit-flex-wrap: wrap;
       -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
         -o-flex-wrap: wrap;
            flex-wrap: wrap;
  }
}
@media screen and (max-width:669.9px) {
  .tabSwitch:has( .tabSwitch ) {
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
  }
}


/*  tabSwitch__item
------------------------ */
@media screen and (max-width:669.9px) {
  .tabSwitch__item .tabSwitch__item {
    -webkit-flex: 1;
       -moz-flex: 1;
        -ms-flex: 1;
         -o-flex: 1;
            flex: 1;
  }
}
.tabSwitch__item a {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: space-between;
  -ms-align-items: center;
      align-items: center;
  gap: .8235294129em; /* 14/17 */
  position: relative;
  min-height: 100%;
  padding-block: .5882352951em; /* 10/17 */
  padding-inline: .8235294129em; /* 14/17 34/17 */
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  overflow: hidden;
  background-color: var(--color-gold);
  color: var(--color-white);
  text-decoration: none;
}
@media screen and (min-width:670px) {
  .tabSwitch__item a {
    border-radius: 2lh;
  }
}

.tabSwitch__item a:after {
  display: block;
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
  -webkit-transform: rotate( 45deg );
      -ms-transform: rotate( 45deg );
       -o-transform: rotate( 45deg );
          transform: rotate( 45deg );
  aspect-ratio: 1 / 1;
  width: .4705882366em; /* 8/17 */
  border-right: 1px solid var(--color-white);
  border-bottom: 1px solid var(--color-white);
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  content: " ";
}



/* -----------------------------------
  tabSwitchLabel
----------------------------------- */
.tabSwitchLabel {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: center;
      align-items: center;
  gap: .8235294129em; /* 14/17 */
}
@media screen and (max-width:425px) {
  .tabSwitchLabel {
    height: 3em;
  }
}

.tabSwitchLabel:before ,
.tabSwitchLabel:after {
  display: block;
}

.tabSwitchLabel:before {
  padding-inline: .7692307692em; /* 10/13 */
  background-color: var(--color-white);
  color: var(--color-gold);
  font-weight: 500;
  font-size: .7647058832em; /* 13/17 */
  white-space: nowrap;
  content: attr(data-place);
}
@media screen and (min-width:670px) {
  .tabSwitchLabel:before {
    border-radius: 2lh;
  }
}

.tabSwitchLabel:after {
  content: attr(data-name);
}

.tabSwitchLabel span {
  position: absolute;
  top: 0;
  left: 200%;
  white-space: nowrap;
}



/* -----------------------------------
  JS-tabSwitch
----------------------------------- */
/*  --isSelect
------------------------ */
.JS-tabSwitch.--isSelect a {
  background-color: var(--color);
}

.JS-tabSwitch.--isSelect .tabSwitchLabel:before {
  color: var(--color);
}



/* -----------------------------------
  JS-tabTarget
----------------------------------- */
.JS-tabTarget {
  display: none;
}


/*  --isVisible
------------------------ */
.JS-tabTarget.--isVisible {
  display: block;
}



/* -----------------------------------
  --restaurant
----------------------------------- */
.section#--restaurant {
  padding-block: min( 25px, 1.5625vw ) min( 225px, 14.0625vw ); /* 25/16 225/16 */
}

.section#--restaurant .title ,
.section#--restaurant .title__item {
  margin-inline: auto;
}

.section#--restaurant > .title {
  padding-inline: min( 5vw, 80px ); /* 8/16 */
}

.section#--restaurant > .title[data-bubble]:before {
  aspect-ratio: 99 / 47;
  width: 3.8076923088em; /* 198/52 */
  margin-left: calc( ( clamp( 0px, calc( 0px + ( 100 - 0 ) * ( 100vw - 425px ) / ( 1600 - 425 ) ), 100px ) ) * -1 ); /* 100/16 */
  background-image: url("../../img/reserve/restaurant/data-bubble.png");
}

.section#--restaurant > .title .title__item.--text {
  text-indent: .02em;
}


@media screen and (min-width:670px) {
  .section#--restaurant .section .title__item.--text {
    font-size: .7307692318em; /* 38/52 */
  }
}
@media screen and (max-width:669.9px) {
 .section#--restaurant .section .title__item.--text {
    font-size: .8571428581em; /* 24/28 */
  }
}

.section#--restaurant .section .title__item.--label {
  margin-bottom: .625em; /* 10/16 */
  font-size: max( 10px, .3076923087em ); /* 16/52 */
}


/* -----------------------------------
  restaurant
----------------------------------- */
/*  restaurant__about
------------------------ */
.restaurant__about {
  position: relative;
}

.restaurant__about:before {
  display: block;
  background-position: 50%;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
  content: " ";
}
@media screen and (min-width:670px) {
  .restaurant__about:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
  }
}
@media screen and (max-width:669.9px) {
  .restaurant__about:before {
    aspect-ratio: 160 / 129;
  }
}

@media screen and (max-width:669.9px) {
  .restaurant__about .inner {
    padding-inline: 0;
  }
}


/*  restaurant__access
------------------------ */
@media screen and (min-width:670px) {
  .restaurant__access {
    margin-top: min( 80px, 5vw ); /* 80/16 */
  }
}



/* -----------------------------------
  restaurantAbout
----------------------------------- */
.restaurantAbout {
  margin-left: auto;
  /*padding-block: 3.88888889em;  70/18 */
  padding-block: 3.611111111em; /* 65/18 */
  padding-inline: 3.055555556em; /* 55/18 */
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  background-color: rgba( var(--color-white-rgb), .9 );
}
@media screen and (min-width:670px) {
  .restaurantAbout {
    width: min( 480px, 26.66666667em ); /* 480/18 */
    height: min( 890px, calc( 48.8888889em + 10px ) ); /* 880/18 */
  }
}
@media screen and (max-width:669.9px) {
  .restaurantAbout {
    width: 90vw;
    margin-top: -25vw;
  }
}


/*  restaurantAbout__title
------------------------ */


/*  restaurantAbout__desc
------------------------ */
.restaurantAbout__desc {
  margin-top: 1.94444444em; /* 35/18 */
}


/*  restaurantAbout__btn
------------------------ */
.restaurantAbout__btn {
  margin-top: 1.66666667em; /* 30/18 */
}

@media screen and (min-width:425.1px) {
  .restaurantAbout__btn .btns {
    max-width: 86.48648648648649%; /* 320/3.7 */
    margin-inline: auto;
  }
}

@media screen and (max-width:669.9px) {
  .restaurantAbout__btn .btn a {
    padding-block: .75em;
    font-size: 14px;
  }
}



/* -----------------------------------
  restaurantName
----------------------------------- */
.restaurantName {
  font-weight: 600;
  line-height: 1.66666667; /* 40/24 */
}
@media screen and (min-width:670px) {
  .restaurantName {
    font-size: 1.33333333rem; /* 24/18 */
  }
}
@media screen and (max-width:669.9px) {
  .restaurantName {
    font-size: 1.2857142866rem; /* 18/14 */
  }
}

.restaurantName[data-cap] {
  margin-top: -1lh;
}

.restaurantName[data-cap]:before {
  display: block;
  content: attr(data-cap);
}


/*  restaurantName__text
------------------------ */
.restaurantName__text {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
}
@media screen and (min-width:670px) {
  .restaurantName__text {
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
    -ms-align-items: stretch;
        align-items: stretch;
  }
}
@media screen and (max-width:669.9px) {
  .restaurantName__text {
    -webkit-flex-wrap: wrap;
       -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
         -o-flex-wrap: wrap;
            flex-wrap: wrap;
    -ms-align-items: baseline;
        align-items: baseline;
    column-gap: .5em;
  }
}

.restaurantName__text:before ,
.restaurantName__text:after {
  display: block;
  font-weight: 800;
  line-height: 1.2280701766; /* 70/57 */
  letter-spacing: .02em;
}
@media screen and (min-width:670px) {
  .restaurantName__text:before ,
  .restaurantName__text:after {
    font-size: 2.375em; /* 57/24 */
  }
}
@media screen and (max-width:669.9px) {
  .restaurantName__text:before ,
  .restaurantName__text:after {
    font-size: 1.66666667em; /* 30/18 */
  }
}

.restaurantName__text[data-before]:before {
  content: attr(data-before);
}

.restaurantName__text[data-after]:after {
  content: attr(data-after);
}

.restaurantName__text span {
  display: block;
  -webkit-order: 1;
     -moz-order: 1;
      -ms-order: 1;
       -o-order: 1;
          order: 1;
  margin-top: 1.25em; /* 20/16 */
  font-weight: 500;
  font-size: .66666667em; /* 16/24 */
}
@media screen and (max-width:669.9px) {
  .restaurantName__text span {
    flex-basis: 100%;
  }
}



/* -----------------------------------
  restaurantCatch
----------------------------------- */
.restaurantCatch {
  margin-top: .9210526324em; /* 35/38 */
  font-weight: 600;
  line-height: 1.4210526327;
}
@media screen and (min-width:670px) {
  .restaurantCatch {
    font-size: 2.11111111rem; /* 38/18 */
  }
}
@media screen and (max-width:669.9px) {
  .restaurantCatch {
    font-size: 1.4285714299rem; /* 20/14 */
  }
}


/*  restaurantCatch__item
------------------------ */
.restaurantCatch__item {
  display: block;
  inline-size: fit-content;
}



/* -----------------------------------
  restaurantDesc
----------------------------------- */
.restaurantDesc {
  line-height: 2;
}


/*  restaurantDesc__item
------------------------ */



/* -----------------------------------
  restaurantAccess
----------------------------------- */
.restaurantAccess {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  gap: 1.33333333em 4.66666667em; /* 20/15 70/15 */
  padding: 1.33333333em; /*  */
  background-color: var(--color-bg);
}
@media screen and (min-width:670px) {
  .restaurantAccess {
    font-size: .83333333rem; /* 15/18 */
  }
}
@media screen and (max-width:669.9px) {
  .restaurantAccess {
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
    font-size: .9285714296rem; /* 13/14 */
  }
}


.restaurantAccess .restaurantName {
  margin-bottom: .5em; /* 12/24 */
}


/*  restaurantAccess__map
------------------------ */
.restaurantAccess__map {
  line-height: 1;
}
@media screen and (min-width:670px) {
  .restaurantAccess__map {
    -webkit-flex: none;
       -moz-flex: none;
        -ms-flex: none;
         -o-flex: none;
            flex: none;
    width: clamp( 210px, 40.856031128404678%, 425px ); /* 210/5.14 */
  }
}

.restaurantAccess__map iframe {
  aspect-ratio: 85 / 39;
  width: 100%;
  height: auto;
  border: .33333333em solid var(--color-white); /* 6/18 */
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}


/*  restaurantAccess__address
------------------------ */
.restaurantAccess__address {
  -webkit-flex: 1;
     -moz-flex: 1;
      -ms-flex: 1;
       -o-flex: 1;
          flex: 1;
  font-style: normal;
}
@media screen and (min-width:670px) {
  .restaurantAccess__address {
    -ms-align-self: center;
        align-self: center;
  }
}



/* -----------------------------------
  restaurantAddress
----------------------------------- */
.restaurantAddress {
  display: grid;
  justify-content: start;
  -ms-align-items: stretch;
      align-items: stretch;
  grid-template-columns: 4em 1fr;
  gap: .5em 1.75em;
  line-height: 2;
}


/*  restaurantAddress__title
------------------------ */
.restaurantAddress__title {
  white-space: nowrap;
}

.restaurantAddress__title:has( + .restaurantAddress__body .btn ) {
  -ms-align-self: center;
      align-self: center;
}


/*  restaurantAddress__body
------------------------ */
.restaurantAddress__body .btn {
  inline-size: fit-content;
}

.restaurantAddress__body .btn a {
  padding-block: 0;
  padding-inline: 1em;
}



/* -----------------------------------
  restaurantAddressText
----------------------------------- */
.restaurantAddressText {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
  justify-content: flex-start;
  -ms-align-items: center;
      align-items: center;
   column-gap: 1em;
}


/*  restaurantAddressText__item
------------------------ */
/*  --note  */
.restaurantAddressText__item.--note {
  flex-basis: 100%;
}



/* -----------------------------------
  --intro
----------------------------------- */
@media screen and (min-width:670px) {
  .section.--intro {
    margin-top: min( 80px, 5vw ); /* 80/16 */
  }
}
@media screen and (max-width:669.9px) {
  .section.--intro {
    margin-top: min( 120px, 7.5vw );
  }
}



/* -----------------------------------
  intro
----------------------------------- */
.intro {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  gap: 8px;
}


/*  intro__item
------------------------ */
.intro__item {
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
}
@media screen and (min-width:670px) {
  .intro__item {
    width: calc( ( 100% - ( 8px * 4 ) ) / 5 );
  }
}
@media screen and (max-width:669.9px) {
  .intro__item:nth-of-type(-n+2) {
    width: calc( ( 100% - ( 8px * 1 ) ) / 2 );
  }
  .intro__item:nth-of-type(n+3) {
    width: calc( ( 100% - ( 8px * 3 ) ) / 4 );
  }
}



/* -----------------------------------
  --points
----------------------------------- */
.section.--points {
  margin-top: min( 120px, 7.5vw ); /* 120/16 */
}

@media screen and (max-width:425px) {
  .section.--points .inner {
    padding-inline: 0;
  }
}



/* -----------------------------------
  points
----------------------------------- */
.points {
  position: relative;
  padding-top: 3.125%; /* 40/12.8 */
}
@media screen and (min-width:670px) {
  .points {
    padding-left: 37.5%; /* 480/12.8 */
  }
}


/*  points__title
------------------------ */


/*  points__large
------------------------ */
@media screen and (min-width:670px) {
  .points__large {
    position: absolute;
    top: 0;
    left: 0;
    width: 33.4375%; /* 428/12.8 */
  }
}
@media screen and (max-width:669.9px) {
  .points__large {
    width: 55%;
    margin-inline: auto;
  }
}

.points__large .img {
  aspect-ratio: 428 / 655;
}


/*  points__small
------------------------ */
@media screen and (max-width:669.9px) {
  .points__small {
    margin-top: 6.25%;
  }
}

.points__small .img {
  aspect-ratio: 262 / 315;
}



/* -----------------------------------
  pointsImgs
----------------------------------- */
.pointsImgs {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  gap: 7px;
}


/*  pointsImgs__item
------------------------ */
.pointsImgs__item {
  -webkit-flex: 1;
     -moz-flex: 1;
      -ms-flex: 1;
       -o-flex: 1;
          flex: 1;
}



/* -----------------------------------
  --testimonials
----------------------------------- */
.section.--testimonials {
  margin-top: min( 40px, 2.5vw ); /* 40/16 */
  padding-block: min( 160px, 10vw ) min( 120px, 7.5vw ); /* 160/16 120/16 */
  background-color: var(--color-bg);
}
@media screen and (min-width:670px) {
  .section.--testimonials {
    margin-top: min( 40px, 2.5vw ); /* 40/16 */
  }
}
@media screen and (max-width:669.9px) {
  .section.--testimonials {
    margin-top: min( 120px, 7.5vw );
  }
}



/* -----------------------------------
  testimonials
----------------------------------- */
.testimonials {
  position: relative;
}
@media screen and (min-width:670px) {
  .testimonials {
    padding-top: 7.8125%; /* 100/12.8 */
    padding-right: 71.875%; /* 920/12.8 */
  }
}


/*  testimonials__text
------------------------ */


/*  testimonials__figure
------------------------ */
@media screen and (min-width:670px) {
  .testimonials__figure {
    position: absolute;
    top: 0;
    right: 0;
    width: 62.5%; /* 800/12.8 */
  }
}
@media screen and (max-width:669.9px) {
  .testimonials__figure {
    padding-top: 19.9292511592%; /* 120/6.0213 */
  }
}



/* -----------------------------------
  testimonialsTitle
----------------------------------- */
.testimonialsTitle {
  inline-size: fit-content;
  position: relative;
  margin-bottom: .7894736853em; /* 30/38 */
  font-weight: 600;
  font-size: 2.11111111rem; /* 38/18 */
  line-height: 1.236842105263158;
}
@media screen and (max-width:669.9px) {
  .testimonialsTitle {
    margin-inline: auto;
  }
}


.testimonialsTitle:before {
  display: block;
  aspect-ratio: 23 / 17;
  width: .6052631588em; /* 23/38 */
  position: absolute;
  top: 0;
  left: 100%;
  -webkit-transform: translate( -30%, -100% );
      -ms-transform: translate( -30%, -100% );
       -o-transform: translate( -30%, -100% );
          transform: translate( -30%, -100% );
  background-image: url("../../img/reserve/restaurant/icon-deco.svg");
  background-position: 50%;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
  content: " ";
}


/*  testimonialsTitle__text
------------------------ */
.testimonialsTitle__text {
  position: relative;
  font-weight: inherit;
  filter: drop-shadow( 7px 7px 0 #d4d6db );
}

.testimonialsTitle__text:after {
  display: block;
  clip-path: polygon( 0 0, 100% 0, 0 100% );
  aspect-ratio: 1 / 1;
  width: .4473684226em; /* 17/38 */
  margin-top: -1px;
  margin-inline: 1.2368421068em auto; /* 47/38 */
  background-color: var(--color-white);
  content: " ";
}

.testimonialsTitle__text span {
  display: block;
  padding: .8421052647em; /* 32/38 */
  border-radius: 15px;
  background-color: var(--color-white);
}

.testimonialsTitle__text span:before {
  display: block;
  font-weight: 500;
  font-size: .4210526324em; /* 16/38 */
  line-height: 1.5;
  content: attr(data-text);
}



/* -----------------------------------
  testimonialsComment
----------------------------------- */
/*  testimonialsComment__text
------------------------ */
/*  testimonialsComment__name
------------------------ */
.testimonialsComment__name {
  margin-top: 2.66666667em; /* 48/18 */
}



/* -----------------------------------
  testimonialsText
----------------------------------- */
.testimonialsText {
  line-height: 2;
}


/*  testimonialsText__item
------------------------ */



/* -----------------------------------
  testimonialsName
----------------------------------- */
.testimonialsName {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: center;
      align-items: center;
  gap: .5em;
  inline-size: fit-content;
  margin-left: auto;
  padding-right: 1em;
  border: 3px solid var(--color-white);
  border-radius: 2lh;
  background-color: var(--color-white);
  font-weight: 600;
  font-size: .72222222rem; /* 13/18 */
}

.testimonialsName:before {
  display: block;
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
  border-radius: 50%;
  aspect-ratio: 1 / 1;
  width: 2.6153846165em; /* 34/13 */
  background-image: url("../../img/reserve/restaurant/icon-name.svg");
  background-position: 50%;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
  content: " ";
}

.testimonialsName span {
  -webkit-flex: 1;
     -moz-flex: 1;
      -ms-flex: 1;
       -o-flex: 1;
          flex: 1;
}



/* -----------------------------------
  testimonialsImg
----------------------------------- */
.testimonialsImg {
  position: relative;
  z-index: 0;
}

.testimonialsImg:after {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
  -webkit-transform: translateY( -81% );
      -ms-transform: translateY( -81% );
       -o-transform: translateY( -81% );
          transform: translateY( -81% );
  aspect-ratio: 64 / 23;
  width: 56%; /* 48/80 */
  background-image: url("../../img/reserve/restaurant/figure-deco.png");
  background-position: 50%;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
  content: " ";
}


/*  testimonialsImg__top
------------------------ */
.testimonialsImg__top .img {
  aspect-ratio: 800 / 427;
}


/*  testimonialsImg__bottom
------------------------ */
.testimonialsImg__bottom {
  margin-top: 6.25%; /* 50/8 */
}



/* -----------------------------------
  --harmonie
----------------------------------- */
.section#--harmonie .restaurant__about:before {
  background-image: url("../../img/reserve/restaurant/harmonie/bg.jpg");
}

.section#--harmonie .testimonialsImg__bottom .img {
  aspect-ratio: 400 / 157;
}



/* -----------------------------------
  --sud
----------------------------------- */
.section#--sud .restaurant__about:before {
  background-image: url("../../img/reserve/restaurant/sud/bg.jpg");
}

@media screen and (max-width:669.9px) {
  .section#--sud .restaurantName__text {
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
    -webkit-flex-wrap: nowrap;
       -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
         -o-flex-wrap: nowrap;
            flex-wrap: nowrap;
    -ms-align-items: stretch;
        align-items: stretch;
  }
}

.section#--sud .restaurantName__text[data-after]:after {
  font-weight: 600;
  font-size: 1em;
  line-height: 2.083333333; /* 45/24 */
}

.section#--sud .testimonialsTitle__text span:before {
  font-size: .3947368432em; /* 15/38 */
  line-height: 1.6; /* 24/15 */
}

.section#--sud .testimonialsImg__bottom .img {
  aspect-ratio: 80 / 49;
}



/* -----------------------------------
  --reims
----------------------------------- */
.section#--reims .restaurant__about:before {
  background-image: url("../../img/reserve/restaurant/reims/bg.jpg");
}

@media screen and (min-width:670px) {
  .section#--reims .restaurantName__text:before ,
  .section#--reims .restaurantName__text:after {
    font-size: 2.16666667em; /* 52/24 */
    line-height: 1.346153846153846;
  }
}

.section#--reims .testimonialsImg__bottom .img {
  aspect-ratio: 160 / 69;
}



/* -----------------------------------
  --terakoya
----------------------------------- */
.section#--terakoya .restaurant__about:before {
  background-image: url("../../img/reserve/restaurant/terakoya/bg.jpg");
}

.section#--terakoya .testimonialsImg__bottom .img {
  aspect-ratio: 400 / 169;
}



/* -----------------------------------
  --planner
----------------------------------- */
.section#--planner {
  overflow: hidden;
}
@media screen and (max-width:669.9px) {
  .section#--planner {
    background-color: var(--color-bg);
  }
}



/* -----------------------------------
  planner
----------------------------------- */
#planner {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  padding-block: min( 13.671875%, 175px ) min( 14.84375%, 190px ); /* 175/12.8 190/12.8 */
}
@media screen and (min-width:670px) {
  #planner {
    position: relative;
  }
}
@media screen and (max-width:669.9px) {
  #planner {
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
  }
}
@media screen and (min-width:425.1px) and (max-width:669.9px) {
  #planner {
    max-width: 70%;
    margin-inline: auto;
  }
}

@media screen and (min-width:670px) {
  #planner:before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: min( 20vw, 320px ); /* 320/16 */
    width: 80vw;
    background-color: var(--color-bg);
    content: " ";
  }
}

#planner:after {
  display: block;
  aspect-ratio: 118 / 95;
  background-image: url("../../img/reserve/planner/img-illust.png"), url("../../img/reserve/planner/img-photo.jpg");
  background-position: top right, left bottom;
  -webkit-background-size: 36.10169491525424% auto, 81.35593220338983% auto; /* 213/5.9 480/5.9 */
          background-size: 36.10169491525424% auto, 81.35593220338983% auto;
  background-repeat: no-repeat;
  content: " ";
}
@media screen and (min-width:670px) {
  #planner:after {
    position: absolute;
    top: 50%;
    left: 0;
    width: 46.09375%; /* 590/12.8 */
    margin-top: -7.421875%; /* 95/12.8 */
  }
}
@media screen and (max-width:669.9px) {
  #planner:after {
    width: 100%;
    margin-top: 7.421875%; /* 95/12.8 */
  }
}
@media screen and (max-width:425px) {
  #planner:after {
    max-width: 70%;
    margin-inline: auto;
  }
}


/*  planner__item
------------------------ */
  @media screen and (min-width:670px) {
    .planner__item {
      width: 50%;
    }
  }


/*  --title  */
@media screen and (min-width:670px) {
  .planner__item.--title .title {
    font-size: 2.55555556rem; /* 46/18 */
  }
}
@media screen and (max-width:669.9px) {
  .planner__item.--title .title {
    margin-inline: auto;
    font-size: 1.8571428587rem; /* 26/14 */
  }
}

.planner__item.--title .title__item span > span {
  display: inline;
  margin-left: -.25em;
  font-style: italic;
}

.planner__item.--title .title__item.--bubble {
  margin-bottom: 1.38888889em; /* 25/18 */
  letter-spacing: .18em;
  text-indent: .18em;
}
@media screen and (max-width:669.9px) {
  .planner__item.--title .title__item.--bubble {
    margin-inline: auto;
  }
}

.planner__item.--title .title__item.--bubble:before ,
.planner__item.--title .title__item.--bubble:after {
  left: 3.55555556em; /* 64/18 */
}

@media screen and (max-width:669.9px) {
  .planner__item.--title .title__item.--bubble:before {
    background-color: var(--color-bg);
  }
}

.planner__item.--title .title__item.--bubble > span {
  padding-block: .75em;
  background-color: transparent;
}


/*  --comment  */
@media screen and (min-width:670px) {
  .planner__item.--comment {
    margin-top: -6.25%; /* 80/12.8 */
  }
}



/* -----------------------------------
  plannerComments
----------------------------------- */
#plannerComments {
  font-size: 1.05555556rem; /* 19/18 */
  line-height: 1.75;
  letter-spacing: .02em;
}


/*  plannerComments__item
------------------------ */
@media screen and (min-width:670px) {
  .plannerComments__item:nth-of-type(2n) {
    position: relative;
    right: -7.8125%; /* 50/6.4 */
  }
}

.plannerComments__item + .plannerComments__item {
  margin-top: 1.4210526327em; /* 27/19 */
}



/* -----------------------------------
  plannerComment
----------------------------------- */
.plannerComment {
  position: relative;
  border-radius: 1em;
  padding: 1.5789473693em 2.1052631587em; /* 30/19 40/19 */
  background-color: var(--color-white);
}

.plannerComment:before {
  clip-path: polygon( 100% 0, 0% 100%, 100% 100% );
  position: absolute;
  right: calc( 100% - 5px );
  bottom: 1.5789473693em; /* 30/19 */
  z-index: 0;
  aspect-ratio: 32 / 27;
  width: 1.6842105279em; /* 32/19 */
  background-color: var(--color-white);
  content: " ";
}



/* -----------------------------------
  --faq
----------------------------------- */
.section#--faq {
  padding-block: min( 5vw, 80px ) min( 7.5vw, 120px ); /* 80/16 120/16 */
  background-image: url("../../img/reserve/faq/bg.png");
  background-position: 50% 100%;
  -webkit-background-size: 100% auto;
          background-size: 100% auto;
  background-repeat: no-repeat;
  background-color: var(--color-faq);
  background-blend-mode: multiply;
}

.section#--faq .title {
  margin-bottom: 0;
  margin-inline: auto;
  font-size: 3.44444444rem; /* 62/18 */
}

.section#--faq .title[data-text]:before {
  inline-size: fit-content;
  margin-bottom: 8px;
  margin-inline: auto;
  color: var(--color-white);
  line-height: 1.3;
  letter-spacing: .02em;
  text-indent: .02em;
}

.section#--faq .title__item.--label {
  margin-bottom: calc( ( .5lh + 2px ) * -1 );
  padding-inline: 1.75em;
  border: 2px solid var(--color-faq);
  background-color: var(--color-bg);
  font-weight: 600;
  font-size: .2903225813em; /* 18/62 */
  line-height: 1.85;
  letter-spacing: .12em;
  text-indent: .12em;
}



/* -----------------------------------
  faqs
----------------------------------- */
#faqs {
  padding: max( 15px, 3.90625% ) max( 24px, 6.25% ); /* 50/12.8 80/12.8 */
  border-radius: 15px;
  background-color: var(--color-bg);
  color: var(--color-faq);
  font-size: 1.27777778rem; /* 23/18 */
}


/*  faqs__item
------------------------ */
.faqs__item + .faqs__item {
  border-top: 1px solid var(--color-faq);
}


/* -----------------------------------
  faq
----------------------------------- */
/*  faq__item
------------------------ */
.faq__item {
  padding-block: 1.7391304359em; /* 40/23 */
  padding-inline: .6521739143em; /* 15/23 */
}

.faq__item + .faq__item {
  padding-top: 0;
}



/* -----------------------------------
  faqItem
----------------------------------- */
.faqItem {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: flex-start;
      align-items: flex-start;
  column-gap: 15px;
  letter-spacing: .02em;
}

.faqItem:before ,
.faqItem:after {
  display: block;
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
}

.faqItem:before {
  width: 1.136363636363636em; /* 50/44 */
  margin-top: calc( ( 1em - 1lh ) / 2 );
  font-size: 1.9130434797em; /* 44/23 */
  text-align: center;
  text-transform: uppercase;
}

.faqItem:after {
  -ms-align-self: center;
      align-self: center;
  -webkit-transform: rotate( 45deg );
      -ms-transform: rotate( 45deg );
       -o-transform: rotate( 45deg );
          transform: rotate( 45deg );
  aspect-ratio: 1 / 1;
  width: max( 10px, .6086956533em ); /* 14/23 */
  border-right: 2px solid var(--color-faq);
  border-bottom: 2px solid var(--color-faq);
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: all .25s;
       -o-transition: all .25s;
          transition: all .25s;
}


/*  faqItem__text
------------------------ */
.faqItem__text {
  -webkit-flex: 1;
     -moz-flex: 1;
      -ms-flex: 1;
       -o-flex: 1;
          flex: 1;
}


/*  --que  */
.faqItem.--que:before {
  content: "q";
}


/*  --ans  */
.faqItem.--ans:before {
  content: "a";
}


/* -----------------------------------
  faqText
----------------------------------- */
/*  faqText__category
------------------------ */
.faqText__category {
  inline-size: fit-content;
  width: 11em;
  margin-bottom: 5px;
  background-color: var(--color-faq);
  color: var(--color-white);
  font-size: max( .5217391316em, 10px ); /* 12/23 */
  line-height: 2;
  text-indent: .02em;
  text-align: center;
}


/*  faqText__title
------------------------ */
.faqText__title {
  font-weight: 600;
}


/*  faqText__item
------------------------ */
.faqText__item {
  line-height: 1.75;
}



/* -----------------------------------
  JS-faqTrigger
----------------------------------- */
.JS-faqTrigger {
  cursor: pointer;
}

.JS-faqTrigger .faqItem.--que:after {
  content: " ";
}


/*  --isOpen
------------------------ */
.JS-faqTrigger.--isOpen .faqItem.--que:after {
  -webkit-transform: rotate( -135deg );
      -ms-transform: rotate( -135deg );
       -o-transform: rotate( -135deg );
          transform: rotate( -135deg );
}



/* -----------------------------------
  JS-faqTarget
----------------------------------- */
.JS-faqTarget {
  display: none;
}



/* -----------------------------------
  footer
----------------------------------- */



/* -----------------------------------
  --message
----------------------------------- */
.section#--message {
  overflow: hidden;
}

.section#--message .inner {
  max-width: 1600px;
  padding-inline: min( 10vw, 160px ); /* 160/16 */
}
@media screen and (min-width:670px) {
  .section#--message .inner {
    padding-inline: min( 10vw, 160px ); /* 160/16 */
  }
}
@media screen and (max-width:669.9px) {
  .section#--message .inner {
    padding-inline: 0;
  }
}



/* -----------------------------------
  message
----------------------------------- */
#message {
  position: relative;
}
@media screen and (min-width:670px) {
  #message {
    display: -webkit-flex;
    display:    -moz-flex;
    display:     -ms-flex;
    display:      -o-flex;
    display:         flex;
    -webkit-flex-direction: row-reverse;
       -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
         -o-flex-direction: row-reverse;
            flex-direction: row-reverse;
    justify-content: flex-start;
    -ms-align-items: stretch;
        align-items: stretch;
    padding-top: 17.1875%; /* 220/12.8 */
  }
}

#message:before {
  display: block;
  background-image: url("../../img/reserve/message/bg.jpg");
  background-position: 50% 0;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
  content: " ";
}
@media screen and (min-width:670px) {
  #message:before {
    position: absolute;
    top: 0;
    right: min( 20vw, 320px ); /* 320/16 */
    bottom: 0;
    z-index: -1;
    width: 70vw; /* 1120/16 */
  }
}
@media screen and (max-width:669.9px) {
  #message:before {
    aspect-ratio: 560 / 317;
  }
}

@media screen and (min-width:670px) {
  #message:after {
    display: block;
    -webkit-flex: 1;
       -moz-flex: 1;
        -ms-flex: 1;
         -o-flex: 1;
            flex: 1;
    content: " ";
  }
}


/*  message__text
------------------------ */
#message__text {
  position: relative;
  padding-block: 9.765625% 7.03125%; /* 125/12.8 90/12.8 */
  padding-inline: 4.296875%; /* 55/12.8 */
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
  background-color: var(--color-white);
}
@media screen and (min-width:670px) {
  #message__text {
    -webkit-flex: none;
       -moz-flex: none;
        -ms-flex: none;
         -o-flex: none;
            flex: none;
    width: 37.5%; /* 480/12.8 */
    padding-inline: 4.296875%; /* 55/12.8 */
  }
}
@media screen and (max-width:669.9px) {
  #message__text {
    padding-inline: 5vw;
  }
}

#message__text .title {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: baseline;
      align-items: baseline;
  gap: .4193548394em; /* 26/62 */
  font-size: 3.44444444rem; /* 62/18 */
  white-space: nowrap;
}
@media screen and (min-width:670px) {
  #message__text .title {
    position: absolute;
    top: -1.5em;
    left: 100%;
    -webkit-transform-origin: left top;
       -moz-transform-origin: left top;
        -ms-transform-origin: left top;
         -o-transform-origin: left top;
            transform-origin: left top;
    -webkit-transform: rotate( 90deg ) translateY( -80% );
        -ms-transform: rotate( 90deg ) translateY( -80% );
         -o-transform: rotate( 90deg ) translateY( -80% );
            transform: rotate( 90deg ) translateY( -80% );
  }
}

#message__text .title[data-sub]:after {
  font-size: .3387096788em; /* 21/62 */
}

#message__text .title__item.--text {
  font-weight: 900;
}



/* -----------------------------------
  messageText
----------------------------------- */
#messageText {
  line-height: 2;
}


/*  messageText__item
------------------------ */
.messageText__item + .messageText__item {
  margin-top: 2em;
}

.messageText__item + .messageText__item:has( .logo#--copyright ) {
  margin-top: 4.44444444em; /* 80/18 */
}



/* -----------------------------------
  --form
----------------------------------- */
.section#--form {
  min-height: 50svh;
}



/* -----------------------------------
  floating
----------------------------------- */
#floating {
  position: fixed;
  right: 0;
  bottom: 0;
  z-index: 99999;
  /*background-image: linear-gradient( 180deg, rgba( 40, 74, 72, 0 ) 10%, rgba( 40, 74, 72, 1 ) 100% );*/
  -webkit-transform: translateY( 0 );
      -ms-transform: translateY( 0 );
       -o-transform: translateY( 0 );
          transform: translateY( 0 );
  -webkit-transition: all .5s;
       -o-transition: all .5s;
          transition: all .5s;
}

#floating {
  display: block;
  line-height: 0;
}

#floating .img {
  aspect-ratio: 32 / 7;
  width: min( 100vw, 425px );
  background-image: url("../../img/reserve/floating.png");
  background-position: 50%;
  -webkit-background-size: cover;
          background-size: cover;
  background-repeat: no-repeat;
}


/*  --isHide
------------------------ */
#floating.--isHide {
  -webkit-transform: translateY( 100% );
      -ms-transform: translateY( 100% );
       -o-transform: translateY( 100% );
          transform: translateY( 100% );
}