@charset "UTF-8";

.section_title {
  text-align: center;
}

.section_title > h2 {
  font-size: 1.3em;
  margin-bottom: 0.5em;
}

.section_title > p {
  font-family: "Lato", sans-serif;
  font-size: 0.9em;
  font-weight: 500;
}

#greeting {
  padding-top: 4rem;
}

#greeting .content {
  margin-top: 2rem;

  background: url(../image/greeting.png);
  background-size: cover;
  background-position: center left -300px;

  width: calc(100% - max(4vw, 1em));
  max-width: 1340px;

  padding-top: 4rem;
  padding-bottom: 4rem;
  padding-left: max(6vw, 1em);
  padding-right: clamp(1em, 4vw, 5em);
}

#greeting .content > p {
  color: #ffffff;
  max-width: 30em;
  margin-left: auto;
}

#greeting .content > .jp {
  margin-bottom: 2rem;
}

#greeting .content > .en:not(:last-child) {
  margin-bottom: 3rem;
}

/* ----  Tablet/PC ---- */
@media screen and (min-width: 768px) {
  #greeting {
    padding-top: 7rem;
  }

  #greeting .content {
    background-position: center center;

    margin-top: 3rem;

    padding-top: 7rem;
    padding-bottom: 7rem;
  }
} /* ---- Tablet/PC ---- */

#menu {
  margin-top: 4rem;
}

#menu .cover {
  z-index: 0;
  width: 100%;
  height: 20rem;
  background: url(../image/menu_cover.png);
  background-size: cover;
  background-position: center right;
}

#menu .overview {
  box-sizing: border-box;
  background: #fff;
  max-width: 570px;
  width: calc(100% - 3rem);
  z-index: 1;
  padding: 3rem 1.5rem 0 1.5rem;
  margin-top: -1.5rem;
  margin-left: auto;
  margin-right: auto;
}

#menu .overview > .section_title_tate {
  padding-bottom: 3rem;
}

#menu .overview > .section_title_tate > h2 {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  font-feature-settings: "pkna";

  font-size: 1.3em;
  padding-bottom: 1rem;
  margin-bottom: 1rem;

  border-bottom: solid 1px #000000;
  margin: 0 auto;
  padding: 0 0.8em 1em 0.8em;
}

#menu .overview > .section_title_tate > p {
  font-family: "Lato", sans-serif;
  font-size: 0.9em;
  font-weight: 500;
  text-align: center;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

#menu .overview > .title {
  margin-bottom: 4rem;
}

#menu .overview > .title > h3 {
  font-size: 1.8em;
  margin-bottom: 1rem;
}

#menu .overview > .title > p {
  font-size: 1.4em;
}

#menu .overview > p {
}

#menu .overview > .jp {
  margin-bottom: 4rem;
}

#menu .overview > .en {
  margin-bottom: 0;
}

.menu_time_title {
  box-sizing: border-box;
  margin: 6rem auto 0;
  padding: 0 1.5rem;
  max-width: 570px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  text-align: center;
}

.menu_time_title span:first-child {
  font-size: 1.35rem;
  font-weight: 500;
  letter-spacing: 0.2em;
}

.menu_time_title span:last-child {
  font-family: "Lato", sans-serif;
  font-size: 0.85rem;
  font-weight: 500;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #5c5c5c;
}

.menu_time_title::after {
  content: "";
  display: block;
  width: 2.25rem;
  height: 1px;
  margin-top: 0.65rem;
  background: currentColor;
  opacity: 0.22;
}

/* ----  Tablet/PC ---- */
@media screen and (min-width: 768px) {
  #menu {
    margin-top: 7rem;
    margin-bottom: 7rem;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
  }

  #menu .cover {
    z-index: 0;
    width: 100%;
    height: 600px;
    background-position: center left;
  }

  #menu .overview {
    padding: 6rem 4rem 0 4rem;
    margin-top: -500px;
    margin-left: min(140px, 7vw);
    margin-right: min(140px, 7vw);
  }
} /* ---- Tablet/PC ---- */

.set_menu {
  position: relative;
  box-sizing: border-box;
  margin-top: 4rem;
}

.set_menu > .image {
  text-align: center;
  width: calc(100% - 2rem);
}

.set_menu > .price_list {
  padding: 3rem 2rem 0;
  max-width: 570px;
  margin: 0 auto;
}

.set_menu > .price_list .stack_jp {
  margin-bottom: 3rem;
}

.set_menu > .price_list .stack_jp:has(+ .price_list_annotation) {
  margin-bottom: 1rem;
}

.set_menu > .price_list .stack_en {
  margin-bottom: 3rem;
}

.set_menu > .price_list .stack_en:has(+ .price_list_annotation) {
  margin-bottom: 1rem;
}

.set_menu > .price_list .stack h3 {
  font-size: 1.8rem;
  margin-bottom: 1rem;
}

.set_menu > .price_list .stack .price {
  font-size: 1.1rem;
  border-bottom: solid 0.5px #cccccc;
  padding-bottom: 0.5rem;
}

.set_menu > .price_list .stack .note {
  font-size: 0.9rem;
  margin-bottom: 1.5rem;
}

.price_list_annotation {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-size: 0.88rem;
  line-height: 1.85;
  color: #555;
}

.stack_jp + .price_list_annotation {
  margin-bottom: 4rem;
}

.stack_en + .price_list_annotation {
  padding-bottom: 0;
  font-family: "Lato", sans-serif;
  letter-spacing: 0.03em;
  color: #5c5c5c;
}

/* ----  Tablet/PC ---- */
@media screen and (min-width: 768px) {
  .set_menu {
    container-type: inline-size;
    container-name: set_menu;

    margin-top: 3rem;
  }

  .set_menu .bg {
    z-index: -10;
    width: 30vw;
    height: 600px;
    position: absolute;
    top: 100px;
    right: 0;
    background: #f9fbfa;
  }

  .set_menu > .image {
    text-align: right;
  }

  .set_menu > .price_list {
    width: 470px;
    margin-left: min(140px, 7vw);
    padding-left: 4rem;
  }
} /* ---- Tablet/PC ---- */

@container set_menu (min-width: 1240px) {
  .set_menu > .image {
    width: 540px;
    position: absolute;
    top: 0;
    right: 7vw;
  }
} /* ---- @container ---- */

#information {
  padding-top: 4rem;
  padding-bottom: 4rem;
  background: #f9fbfa;
}

#information > .overview {
  margin-top: 4rem;
  max-width: calc(100% - 4rem);
  margin-left: auto;
  margin-right: auto;
}

#information > .overview > .jp {
  margin-bottom: 4rem;
}

#information > .photo_gallery {
  margin-top: 4rem;
}

#information > .photo_gallery > .stack_l {
  text-align: left;
  padding-right: 20vw;
}

#information > .photo_gallery > .stack_r {
  text-align: right;
  padding-left: 40vw;
}

/* ----  Tablet/PC ---- */
@media screen and (min-width: 768px) {
  #information {
    padding-top: 7rem;
    padding-bottom: 5rem;
  }

  #information > .overview {
    margin-top: 5rem;
    max-width: 50em;
  }

  #information > .photo_gallery {
    max-width: 1440px;
    margin: 0 auto;
    margin-top: 7rem;
    display: flex;
  }
  #information > .photo_gallery > .stack_l {
    padding-right: 0;
  }

  #information > .photo_gallery > .stack_r {
    padding-left: 0;
    padding-top: 5em;
  }
} /* ---- Tablet/PC ---- */

#specialty {
  padding-top: 4rem;
  padding-bottom: 4rem;
  background: #f9fbfa;
}

#specialty > .overview {
  margin-top: 4rem;
  max-width: calc(100% - 4rem);
  margin-left: auto;
  margin-right: auto;
}

#specialty > .overview > .jp {
  margin-bottom: 4rem;
}

#specialty > .photo_gallery {
  margin-top: 4rem;
}

#specialty > .photo_gallery > .stack_l {
  text-align: left;
  padding-right: 20vw;
}

#specialty > .photo_gallery > .stack_r {
  text-align: right;
  padding-left: 40vw;
  padding-top: 5em;
}

/* ----  Tablet/PC ---- */
@media screen and (min-width: 768px) {
  #specialty {
    padding-top: 7rem;
    padding-bottom: 5rem;
  }

  #specialty > .overview {
    margin-top: 5rem;
    max-width: 50em;
  }

  #specialty > .photo_gallery {
    max-width: 910px;
    margin: 0 auto;
    margin-top: 7rem;
    display: flex;
  }
  #specialty > .photo_gallery > .stack_l {
    padding-right: 0;
  }

  #specialty > .photo_gallery > .stack_r {
    padding-left: 0;
    padding-top: 5em;
  }
} /* ---- Tablet/PC ---- */

#reservation {
  color: #f6f6f6;

  padding: 4rem 2rem 4rem 2rem;

  background: url(../image/reservation.png);
  background-size: cover;
  background-position: center center;
}

#reservation > .tel {
  box-sizing: border-box;

  width: 100%;
  max-width: 520px;
  text-align: center;

  margin: 4rem auto;
  padding: 0.7rem 1rem;
  border: solid 0.5px #787878;

  font-size: 1.8em;
  letter-spacing: 0.15em;
}

#reservation > .tel span {
  font-size: 0.7em;
}

#reservation > .tel a:link {
  text-decoration: none;
}
#reservation > .tel a:visited {
  text-decoration: none;
}
#reservation > .tel a:hover {
  text-decoration: none;
}

#reservation > .note {
  max-width: 480px;
  margin: 4rem auto;
}

#reservation > .note .jp {
  margin-bottom: 2rem;
}

#reservation > .note span {
  font-size: 0.9em;
}

/* ----  Tablet/PC ---- */
@media screen and (min-width: 768px) {
  #reservation {
    padding-top: 7rem;
  }
} /* ---- Tablet/PC ---- */

#access {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

#access > .stack {
  text-align: center;
  margin-top: 4rem;
  width: calc(100% - 3rem);
  margin-left: auto;
  margin-right: auto;
}

#access > .stack .shop_name_jp {
  font-size: 1.6em;
  letter-spacing: 0.15em;
}

#access > .stack .shop_name_en {
  font-size: 0.8em;
  margin-bottom: 2rem;
}

#access > .stack .address_jp {
  font-size: 0.9em;
}

#access > .stack .address_en {
  font-size: 0.9em;
  margin-bottom: 2rem;
}

#access > .stack .route_jp {
  font-size: 0.9em;
  margin-bottom: 1rem;
}

#access > .stack .route_en {
  font-size: 0.9em;
  margin-bottom: 2rem;
}

#access > .map {
  width: calc(100% - 3rem);
  max-width: 700px;
  margin-top: 3rem;
  margin-bottom: 3rem;
  margin-left: auto;
  margin-right: auto;
}

#access > .info_jp {
  width: calc(100% - 4rem);
  max-width: 400px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 3rem;

  container-type: inline-size;
  container-name: access_info_jp;
}

#access > .info_en {
  width: calc(100% - 4rem);
  max-width: 400px;
  margin-left: auto;
  margin-right: auto;
  font-size: 0.9em;
}

#access > .info_jp > dl {
  font-size: 0.9em;
}

#access > .info_jp > dl dt {
}

#access > .info_jp > dl dd {
  margin-bottom: 1rem;
}

@container access_info_jp (min-width: 340px) {
  #access > .info_jp > dl {
    display: grid;
    grid-template-columns: 6em 1fr;
    gap: 0.5rem 1rem;
  }

  #access > .info_jp > dl dd {
    margin-bottom: 0;
  }
} /* ---- @container ---- */

/* ----  Tablet/PC ---- */
@media screen and (min-width: 768px) {
  #access {
    padding-top: 7rem;
    padding-bottom: 7rem;
  }
} /* ---- Tablet/PC ---- */