@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=BIZ+UDPGothic&family=Lusitana&family=Noto+Sans+JP&family=Noto+Serif+JP:wght@200..900&family=Zen+Old+Mincho:wght@400;500&display=swap");

/*================================================================
# reset
================================================================*/
* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
dl,
li,
dt,
dd,
p,
div,
span,
img,
a,
table,
tr,
th,
td,
figure {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: normal;
  font-size: 99.6%;
  vertical-align: baseline;
  line-height: 1;
  border-collapse: collapse;
}

header,
footer,
nav,
section,
article,
aside,
figure,
figcaption {
  display: block;
}

body {
  line-height: 1;
}

ol,
ul {
  list-style: none;
  list-style-type: none;
}

img {
  display: block;
}

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

button {
  padding: 0;
  border: none;
  outline: none;
  font: inherit;
  color: inherit;
  background: none;
}

/*================================================================
# 変数
================================================================*/
/* フォント
=================================*/
:root {
  --font-ja-mincho-default: "Noto Serif JP", serif;
  --font-ja-mincho-priority: "Zen Old Mincho", serif;
  --font-ja-gothic-default: "Noto Sans JP", sans-serif;
  --font-ja-gothic-priority: "BIZ UDPGothic", sans-serif;
  --font-en-mincho: "Lusitana", serif;
}

/* フォントサイズ
=================================*/
:root {
  --font31: clamp(23px, calc(19.050632911392405px + 1.0126582278481013vw), 31px);
  --font28: clamp(22px, calc(19.037974683544306px + 0.7594936708860759vw), 28px);
  --font27: clamp(21px, calc(18.037974683544306px + 0.7594936708860759vw), 27px);
  --font26: clamp(21px, calc(18.531645569620252px + 0.6329113924050633vw), 26px);
  --font24: clamp(20px, calc(18.025316455696203px + 0.5063291139240507vw), 24px);
  --font23: clamp(19px, calc(17.025316455696203px + 0.5063291139240507vw), 23px);
  --font22: clamp(18px, calc(16.025316455696203px + 0.5063291139240507vw), 22px);
  --font21: clamp(18px, calc(16.518987341772153px + 0.37974683544303794vw), 21px);
  --font20: clamp(17px, calc(15.518987341772153px + 0.37974683544303794vw), 20px);
  --font19: clamp(16px, calc(14.518987341772153px + 0.37974683544303794vw), 19px);
  --font18: clamp(15px, calc(13.518987341772153px + 0.37974683544303794vw), 18px);
  --font17: clamp(15px, calc(14.012658227848101px + 0.25316455696202533vw), 17px);
  --font16: clamp(14px, calc(13.012658227848101px + 0.25316455696202533vw), 16px);
  --font15: clamp(13.5px, calc(12.759493670886076px + 0.18987341772151897vw), 15px);
  --font14: clamp(13px, calc(12.50632911392405px + 0.12658227848101267vw), 14px);
  --font13: clamp(12.5px, calc(12.253164556962025px + 0.06329113924050633vw), 13px);
  --font12: 12px;
  --font11: 11px;
  --font10: 10px;
}

/* カラー
=================================*/
:root {
  --color-white: #ffffff;
  --color-black: #000000;
  --color-light-gray: #afafaf;
  --color-gray: #606060;
  --color-dark-gray: #404040;
  --color-mid-gray: #7e7e7e;
  --color-red: #c9341c;
  --color-light-yellow: #f8f6de;
}

/* レイアウト
=================================*/
:root {
  --container: min(100% - 3rem, 1180px); /* contentSize */
  --container-wide: min(100%, 1400px); /* wideSize */
  --container-full: min(100%, 1750px); /* 最大幅 */
}

/* 余白
=================================*/
:root {
  --space10: clamp(8px, calc(7.012658227848101px + 0.25316455696202533vw), 10px);
  --space12: clamp(10px, calc(9.012658227848101px + 0.25316455696202533vw), 12px);
  --space16: clamp(12px, calc(10.025316455696203px + 0.5063291139240507vw), 16px);
  --space20: clamp(16px, calc(14.025316455696203px + 0.5063291139240507vw), 20px);
  --space24: clamp(20px, calc(18.025316455696203px + 0.5063291139240507vw), 24px);
  --space30: clamp(24px, calc(21.037974683544306px + 0.7594936708860759vw), 30px);
  --space40: clamp(30px, calc(25.063291139240505px + 1.2658227848101267vw), 40px);
  --space50: clamp(40px, calc(35.063291139240505px + 1.2658227848101267vw), 50px);
  --space60: clamp(40px, calc(30.126582278481013px + 2.5316455696202533vw), 60px);
  --space70: clamp(50px, calc(40.12658227848101px + 2.5316455696202533vw), 70px);
  --space80: clamp(60px, calc(50.12658227848101px + 2.5316455696202533vw), 80px);
  --space90: clamp(70px, calc(60.12658227848101px + 2.5316455696202533vw), 90px);
  --space100: clamp(80px, calc(70.12658227848101px + 2.5316455696202533vw), 100px);
}

/* ロゴサイズ
=================================*/
:root {
  /* ロゴサイズ PC */
  --logo-min: 330px;
  --logo-max: 640px;
  --logo-vw: 31.568vw;
  --logo-top: 50%; /* 縦位置中央 */

  /* ロゴサイズ SP */
  --logo-sp-min: 154px;
  --logo-sp-max: 194px;
  --logo-sp-vw: 10.61vw;
}

/*================================================================
# 表示・非表示
================================================================*/
@media (min-width: 960px) {
  .is_tab {
    display: none;
  }

  .is_sp {
    display: none;
  }

  .is_tab-sp {
    display: none;
  }
}

@media (min-width: 768px) and (max-width: 1253px) {
  .is_pc {
    display: none;
  }

  .is_sp {
    display: none;
  }
}

@media (max-width: 767px) {
  .is_pc {
    display: none;
  }

  .is_tab {
    display: none;
  }

  .is_pc-tab {
    display: none;
  }
}

/*================================================================
# 基本設定　~　共通クラス
================================================================*/
html {
  scroll-behavior: smooth;
}

[id] {
  scroll-margin-top: var(--header-height);
}

body {
  font-family: var(--font-ja-mincho-default);
  font-size: 100%;
  line-height: 2;
  color: var(--color-black);
  position: relative;
  z-index: -10;
}

img {
  width: 100%;
  height: auto;
}

a {
  &:hover {
    opacity: 0.5;
  }

  &:active {
    opacity: 0.5;
  }
}
/* 共通クラス */

/* layout
=================================*/
.ly_wrapper {
  overflow: hidden;
}

/* ボタン
==================================*/
.btn {
  font-weight: 700;
  letter-spacing: 0.48px;
  padding: calc(10px - 2px) calc(30px - 2px);
  display: inline-block;
  border-radius: 60px;
  border: 2px solid currentColor;
  background: #fff;
  font-size: 16px;
  line-height: 1.7;
  color: #000;
  min-width: 150px;
  text-align: center;
  transition: background-color 0.3s, color 0.3s;

  &:hover {
    background-color: #fabe00;
  }

  &--type2 {
    background-color: #111;
    color: #fff;

    &:hover {
      background-color: #fff;
      color: #111;
    }
  }
}

/* フェードインアニメーション
==================================*/
/* 初期状態 */
.fade-in {
  opacity: 0;
  filter: blur(10px);
  transition: opacity 1s ease-out, filter 1s ease-out;
}

/* アクティブ状態 */
.fade-in.active {
  opacity: 1;
  filter: blur(0);
}

/* 個別に遅延を設定 */
.commitment__card:nth-child(1) {
  transition-delay: 0s;
}
.commitment__card:nth-child(2) {
  transition-delay: 0.3s;
}
.commitment__card:nth-child(3) {
  transition-delay: 0.6s;
}

/*====================================
# ロゴオープニング
=====================================*/
body.loading {
  overflow: hidden; /* ローディング中スクロール禁止 */
}

.logo-open {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh; /* 画面高さいっぱいに */
  background: url(../img/bg_default.jpg) no-repeat center / cover;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 100;
  opacity: 1;
  transition: opacity 0.5s ease;
}

.logo-open--hide {
  opacity: 0;
  pointer-events: none;
}

.logo-open__img {
  position: absolute;
  top: var(--logo-top);
  left: 50%;
  transform: translate(-50%, -50%);
  width: clamp(var(--logo-min), calc(87.556px + var(--logo-vw)), var(--logo-max));
  height: auto;
}

@media (max-width: 767px) {
  .logo-open__img {
    width: clamp(var(--logo-sp-min), calc(112.621px + var(--logo-sp-vw)), var(--logo-sp-max));
  }
}

/*====================================
# First View
=====================================*/
.fv {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

/* fv のロゴ（logo-open と同じ位置・サイズ） */
.fv::after {
  content: "";
  position: absolute;
  top: var(--logo-top);
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 50;
  width: clamp(var(--logo-min), calc(87.556px + var(--logo-vw)), var(--logo-max));
  height: 100%; /* auto → 100% に変更 */
  background: url(../img/logo_inline.webp) no-repeat center / contain;
  pointer-events: none; /* ロゴの上でクリックを邪魔しない */
}

@media (max-width: 767px) {
  .fv::after {
    width: clamp(var(--logo-sp-min), calc(112.621px + var(--logo-sp-vw)), var(--logo-sp-max));
    background: url(../img/sp/logo_stacked.webp) no-repeat center / contain;
  }
}

/* fv 内画像 */
.fv__slide .fv__img,
.fv__slide .fv__img picture,
.fv__slide .fv__img img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 比率維持しつつ画面いっぱい */
}

/* swiperアニメーション */
@keyframes zoomUp {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15);
  }
}

.swiper-slide-active .fv__img,
.swiper-slide-duplicate-active .fv__img,
.swiper-slide-prev .fv__img {
  animation: zoomUp 12s linear 0s normal both;
}

/* pagination */
.fv__pagination {
  z-index: 60;
}

/*================================================================
# header
================================================================*/
.header {
  padding: var(--space10) 0;
  transition: padding 0.3s ease;
  background-color: var(--color-white);
}

.header__inner {
  width: var(--container-wide);
  margin-inline: auto;
  display: flex;
  align-items: center;
  gap: clamp(39px, calc(-258.84615384615387px + 31.025641025641026vw), 160px);
  position: relative;
  z-index: 100;

  @media (max-width: 959px) {
    justify-content: space-between;
  }
}

.header__logo {
  width: clamp(280px, calc(165px + 16.666666666666664vw), 390px);
  padding-left: 1.5rem;

  @media (max-width: 767px) {
    padding-left: 1rem;
  }
}

.js-header-fixed {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  padding: 0;
}

/*================================================================
# ナビメニュー
================================================================*/
.header__nav {
  flex: 1 1 auto;
  order: 2;
  z-index: 45;
  padding-right: 0.7rem;
  display: flex;
}

.header__nav-list {
  display: flex;
  gap: clamp(27px, calc(-54.23076923076924px + 8.461538461538462vw), 60px);
}

.header__nav-item a {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
}

.header__nav-jp {
  font-size: var(--font19);
  letter-spacing: 0.1em;
}

.header__nav-en {
  font-family: var(--font-en-mincho);
  font-size: var(--font10);
  color: var(--color-light-gray);
  letter-spacing: 0.2em;
  margin-top: var(--space12);
}

.header__nav-tel {
  position: relative;
  margin-top: 10px;
  padding-left: 37px;

  &::before {
    position: absolute;
    content: "";
    background: url(../img/icon_tel-BLK.webp) no-repeat center/ contain;
    width: 30px;
    height: 30px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }
}

.header__nav-instagram {
  position: relative;
  padding-left: 37px;
  margin-top: 10px;

  &::before {
    position: absolute;
    content: "";
    background: url(../img/icon_instagram-BLK.webp) no-repeat center/ contain;
    width: 30px;
    height: 30px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }
}

.header__nav-logo {
  width: clamp(115px, calc(91.01054481546572px + 6.151142355008787vw), 150px);
  margin: var(--space20) auto;
}

/* ナビメニューの開閉用 */
.header__nav.open {
  right: 0;
}

/*================================================================
# ハンバーガーボタン
================================================================*/
.header__hamburger {
  display: none;
  width: 35px;
  height: 18px;
  position: relative;
  border: none;
  background: none;
  cursor: pointer;
  z-index: 50;
}

.header__hamburger span,
.header__hamburger span::before,
.header__hamburger span::after {
  content: "";
  display: block;
  height: 1px;
  background: var(--color-light-gray);
  width: 100%;
  position: absolute;
  transition: 0.3s;
}

.header__hamburger span::before {
  top: -8px;
}

.header__hamburger span::after {
  bottom: -8px;
}

.header__hamburger.open span {
  background: transparent;
}

.header__hamburger.open span::before {
  top: 0;
  transform: rotate(45deg);
}

.header__hamburger.open span::after {
  bottom: 0;
  transform: rotate(-45deg);
}

/*================================================================
# オーバーレイ
================================================================*/
.header__overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 40;
}

/*================================================================
# スマホ対応 (max-width:959px)
================================================================*/
@media (max-width: 959px) {
  .header__hamburger {
    display: block;
    margin-right: 1rem;
    margin-top: 0.3em;
  }

  .header__hamburger::after {
    content: "メニュー";
    display: block;
    text-align: center;
    font-family: var(--font-ja-gothic-default);
    font-size: 9px;
    color: var(--color-light-gray);
    white-space: nowrap;
    margin-top: 17px;
  }

  .header__nav {
    position: fixed;
    top: 0;
    right: -100%;
    width: 80%;
    height: 100vh;
    background-color: #fff;
    padding: 50px 20px;
    flex-direction: column;
    transition: 0.5s;
  }

  .header__nav-list {
    flex-direction: column;
    gap: 30px;
  }

  .header__nav-item a {
    font-size: 18px;
    color: #000;
    text-align: left;
  }

  /* オーバーレイ表示 */
  .header__overlay.open {
    display: block;
  }
}

/*================================================================
# headLine
================================================================*/
.section-headLine {
}

.section-headLine__main {
  font-family: var(--font-ja-mincho-priority);
  font-size: var(--font26);
  letter-spacing: 0.18em;
  writing-mode: vertical-rl;
  padding-bottom: clamp(28px, calc(25.99264705882353px + 0.5147058823529411vw), 35px);
  position: relative;

  &::after {
    content: "";
    position: absolute;
    background: var(--color-black);
    width: clamp(130px, calc(121.3970588235294px + 2.2058823529411766vw), 160px);
    height: 1px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
  }
}

.section-headLine__sub {
  font-family: var(--font-en-mincho);
  font-size: var(--font11);
  color: var(--color-gray);
  letter-spacing: 0.14em;
  display: block;
  margin-top: clamp(25px, calc(23.566176470588236px + 0.3676470588235294vw), 30px);
}

/*================================================================
# about
================================================================*/
.about {
  padding-bottom: clamp(70px, calc(58.415841584158414px + 2.9702970297029703vw), 100px);
}

.about__inner {
  width: var(--container-full);
  margin-inline: auto;
}

/* Hero
=================================*/
.about__hero {
  display: flex;
  align-items: center;
  gap: 6.68%;
  overflow: hidden;

  @media (max-width: 767px) {
    flex-direction: column;
  }
}

.about__hero-img {
  flex: 1 1 53.1%;
  margin-top: -30px;

  @media (max-width: 767px) {
    flex: 1 1 auto;
    width: 90%;
    margin-right: auto;
  }
}

.about__hero-img img {
  width: min(100%, 756px);

  @media (max-width: 767px) {
    margin-right: auto;
  }
}

.about__hero-content {
  flex: 1 1 43.7%;
  margin-top: 73px;

  @media (max-width: 767px) {
    padding: 0 2rem;
    position: relative;

    &::after {
      position: absolute;
      content: "";
      background: url(../img/logo-icon.webp) no-repeat center / contain;
      width: clamp(108px, calc(66.62068965517241px + 10.610079575596817vw), 148px);
      height: clamp(108px, calc(66.62068965517241px + 10.610079575596817vw), 148px);
      top: -40px;
      right: -27px;
    }
  }
}

.about__section-headLine {
  font-family: var(--font-en-mincho);
  font-size: var(--font12);
  color: var(--color-gray);
  letter-spacing: 0.2em;
  padding-left: 19px;
  position: relative;
}

.about__section-headLine::before {
  content: "";
  position: absolute;
  background: var(--color-gray);
  width: 12.5px;
  height: 1px;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.about__hero-title {
  font-family: var(--font-ja-mincho-priority);
  font-weight: 500;
  font-size: var(--font28);
  line-height: 1.7;
  letter-spacing: 0.14em;
  margin-top: 39px;
}

.about__hero-description {
  font-size: clamp(15px, calc(14.713235294117647px + 0.07352941176470588vw), 16px);
  line-height: 2;
  letter-spacing: 0.1em;
  margin-top: clamp(30px, calc(22.277227722772277px + 1.9801980198019802vw), 50px);
}

.about__hero-logo {
  flex: 1 1 17.8%;
  padding: 0 1rem;
  margin-top: clamp(38px, calc(23.661764705882355px + 3.6764705882352944vw), 88px);
  overflow: hidden;

  @media (max-width: 767px) {
    display: none;
  }
}

.about__hero-logo-type {
  max-width: 103px;
}

.about__hero-logo-icon {
  margin-top: clamp(41px, calc(17.537678207739308px + 3.054989816700611vw), 71px);

  img {
    width: clamp(105px, calc(10.368635437881878px + 12.321792260692463vw), 226px);
    margin-left: clamp(0px, calc(-25.80855397148676px + 3.360488798370672vw), 33px);
  }
}

/* Feature
=================================*/
.about__feature {
  display: flex;
  margin-top: clamp(72px, calc(60.529411764705884px + 2.941176470588235vw), 112px);

  @media (max-width: 767px) {
    flex-direction: column;
  }
}

.about__feature-img {
  flex: 0 1 57.5%;
  margin-top: clamp(0px, calc(-58.78676470588235px + 15.073529411764705vw), 205px);
}

.about__feature-img img {
  width: min(100%, 859px);
  margin-left: auto;
}

.about__feature-content {
  flex: 1 1 calc(41.2% - 35px);
  display: flex;
  flex-direction: column;
}

.about__feature-img02 {
  @media (max-width: 767px) {
    order: 2;
    flex: 1 1 auto;
    width: 60%;
    margin-inline: auto;
    margin-top: 66px;
  }
}

.about__feature-text {
  flex: 1 1 auto;
  width: min(100%, 442px);
  padding: 0 1rem;
  padding-left: 35px;

  @media (max-width: 767px) {
    width: 100%;
  }
}

.about__feature-text p + p {
  margin-top: clamp(46px, calc(43.419117647058826px + 0.6617647058823529vw), 55px);
}

.about__feature-title {
  font-family: var(--font-ja-mincho-priority);
  font-weight: 500;
  font-size: var(--font28);
  line-height: 1.7;
  letter-spacing: 0.14em;
  margin-top: clamp(63px, calc(47.22794117647059px + 4.044117647058823vw), 118px);
}

.about__feature-description {
  line-height: 2;
  letter-spacing: 0.1em;
  margin-top: clamp(40px, calc(32.27722772277228px + 1.9801980198019802vw), 60px);
}

/*================================================================
# commitment -　こだわり
================================================================*/
.commitment {
  padding: clamp(70px, calc(58.415841584158414px + 2.9702970297029703vw), 100px) 0 var(--space100);
  position: relative;

  &::after {
    content: "";
    position: absolute;
    background: url(../img/bg_default.jpg) no-repeat top center / cover;
    width: 100%;
    height: 561px;
    top: auto;
    bottom: 0;
    left: 0;
    z-index: -1;
  }

  @media (max-width: 767px) {
    &::after {
      display: none;
    }
  }
}

.commitment__inner {
  width: var(--container-full);
  margin-inline: auto;
}

.commitment__section-headLine {
  text-align: center;
}

.commitment__cards {
  display: flex;
  gap: clamp(28px, calc(-7.193482688391036px + 4.582484725050916vw), 73px);
  align-items: stretch;
  margin-top: clamp(43px, calc(18.91176470588235px + 6.176470588235294vw), 127px);
  padding: 0 clamp(2rem, calc(-0.6391752577319587rem + 5.498281786941581vw), 4rem);

  @media (max-width: 767px) {
    flex-direction: column;
    padding: 0;
    gap: 70px;
  }
}

.commitment__card {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.commitment__card-title,
.commitment__card-description {
  padding: 0 clamp(0rem, calc(-1.9793814432989691rem + 4.123711340206185vw), 1.5rem);

  @media (max-width: 767px) {
    padding: 0 1.5rem;
  }
}

.commitment__card-title {
  font-family: var(--font-ja-mincho-priority);
  font-size: var(--font23);
  line-height: 1.75;
  letter-spacing: 0.14em;
  margin-top: var(--space40);
}

.commitment__card-description {
  font-size: var(--font16);
  line-height: 1.88;
  letter-spacing: 0.1em;
  margin-top: var(--space40);
}

/*================================================================
# Menu
================================================================*/
.menu {
  width: var(--container-full);
  margin-inline: auto;
  padding: var(--space100) 0;
  position: relative;

  &::after {
    position: absolute;
    content: "";
    background: url(../img/bg_circle.png) no-repeat center / contain;
    width: clamp(541px, calc(476.7647058823529px + 16.470588235294116vw), 765px);
    height: clamp(541px, calc(476.7647058823529px + 16.470588235294116vw), 765px);
    bottom: -13%;
    left: -180px;
    z-index: -1;
  }

  @media (max-width: 767px) {
    &::after {
      bottom: 5%;
      left: -300px;
    }
  }
}

.menu__inner {
  width: var(--container-full);
  margin-inline: auto;
}

/* Hero
=================================*/
.menu__hero {
  display: flex;
  gap: var(--space100);

  @media (max-width: 767px) {
    flex-direction: column;
  }
}

.menu__section-headLine {
  flex: 0 0 clamp(130px, 20.6%, 335px);
  padding: 0 2rem;
  margin-top: clamp(51px, calc(-42.84928716904277px + 12.219959266802444vw), 171px);
  text-align: center;

  @media (max-width: 767px) {
    margin-top: 0;
  }
}

.menu__hero-img {
  width: min(73%, 1285px);

  @media (max-width: 767px) {
    width: 100%;
    padding-left: 2rem;
  }
}

/* Nav
=================================*/
.menu__nav {
  margin-top: clamp(52px, calc(42.536764705882355px + 2.4264705882352944vw), 85px);
  padding: 0 4rem;

  @media (max-width: 1110px) {
    padding: 0 2rem;
  }
}

.menu__nav-list {
  display: flex;
  justify-content: center;
  gap: clamp(13px, calc(-9.432989690721648px + 2.9209621993127146vw), 30px);

  @media (max-width: 767px) {
    flex-direction: column;
  }
}

.menu__nav-item {
  flex: 1 1 clamp(162px, 22.9%, 289px);
  text-align: center;
  border: 1px solid var(--color-mid-gray);
  background-color: var(--color-white);

  @media (max-width: 767px) {
    flex: 1 1 auto;
    width: max(65%, 180px);
    margin-inline: auto;
    border-radius: 50px;
  }

  a {
    font-family: var(--font-ja-mincho-priority);
    font-size: var(--font22);
    font-size: clamp( 14px, calc( 3.443298969072165px + 1.3745704467353952vw ), 22px );
    letter-spacing: 0.14em;
    padding: 2rem 2rem 2rem 1rem;
    display: block;
    position: relative;

    &::after {
      content: "";
      position: absolute;
      background: url(../img/icon_arrow-bottom.webp) no-repeat center/ contain;
      width: 21px;
      height: 21px;
      top: 50%;
      right: clamp(0.4rem, calc(-0.46028513238289204rem + 1.7922606924643585vw), 1.5rem);
      transform: translateY(-50%);
    }

    @media (max-width: 767px) {
      padding: 1rem;

      &::after {
        display: none;
      }
    }
  }
}

/* Note
=================================*/
.menu__note {
  font-size: var(--font17);
  line-height: 1.76;
  letter-spacing: 0.1em;
  text-align: center;
  margin-top: clamp(53px, calc(47.838235294117645px + 1.3235294117647058vw), 71px);
  padding: 0 1rem;

  @media (max-width: 767px) {
    font-size: var(--font15);
  }
}

/*================================================================
# Menu__list
================================================================*/
.menu__list {
  width: var(--container-full);
  margin-inline: auto;
  padding: var(--space100) 0;
}

/* Side
=================================*/
.menu__side-nav__container {
  width: 250px;
  height: auto;
  position: sticky;
  top: 100px;
}

.menu__side {
  width: 100%;
  height: auto;
  z-index: 1;

  @media (max-width: 767px) {
    display: none;
  }
}

.menu__side-nav {
  width: 100%;
  height: 83vh;
  position: relative;
}

.menu__scrollside-item {
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: 0.5s ease-out;
  filter: blur(10px);
  transition-delay: 0s;
  pointer-events: none;
}

.menu__scrollside-item.on {
  opacity: 1;
  filter: blur(0px);
  pointer-events: auto;
}

.menu__side-headLine {
  display: flex;
  justify-content: center;
}

.menu__side-headLine-main {
  font-family: var(--font-ja-mincho-priority);
  font-size: var(--font31);
  letter-spacing: 0.14em;
  writing-mode: vertical-rl;
  margin: 0 20px;
  padding-top: 26px;
  padding-bottom: 110px;
  position: relative;

  &::after {
    position: absolute;
    content: "";
    background: var(--color-black);
    width: 1px;
    height: 85px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
  }

  @media (max-width: 767px) {
    padding-bottom: 0;
    margin: 0 15px 0 0;

    &::after {
      display: none;
    }
  }
}

.menu__side-headLine-sub {
  font-family: var(--font-en-mincho);
  font-size: var(--font13);
  letter-spacing: 0.16em;
  writing-mode: vertical-rl;
}

.menu__side-note {
  font-size: var(--font14);
  line-height: 2;
  letter-spacing: 0.1em;
  margin-top: var(--space20);
  width: min(100%, 217px);
  margin-inline: auto;

  @media (max-width: 767px) {
    width: max(190px, 100%);
    margin: 0 0 0 2rem;
  }
}

.menu__side-subNav {
  margin-top: var(--space50);
  display: flex;
  flex-direction: column;
  gap: 12px;

  @media (max-width: 767px) {
    display: none;
  }
}

.menu__side-subNavItem {
  width: 162px;
  margin-inline: auto;
  font-family: var(--font-ja-mincho-priority);
  font-size: var(--font15);
  letter-spacing: 0.05em;
  padding: 0.8em 2em;
  text-align: center;
  border: 1px solid var(--color-mid-gray);
  border-radius: 50px;
  background-color: var(--color-white);

  a {
    cursor: pointer;
  }
}

/* Main
=================================*/
.menu__main {
  margin-top: -83vh;

  @media (max-width: 767px) {
    flex: 1 1 auto;
    width: 100%;
    padding-right: 0;
    margin-top: 0;
  }
}

.menu__section {
  width: var(--container-full);
  margin-inline: auto;
}

.menu__side-item {
  display: none;

  @media (max-width: 767px) {
    display: flex;
    align-items: center;
    padding: 60px 1.5rem 59px 3.5rem;
  }
}

/* Dish
=================================*/
.menu__dish {
  max-width: 1750px;
  width: calc(100% - 275px);
  margin-left: auto;
  padding-right: 2rem;

  @media (max-width: 767px) {
    width: 100%;
    padding-right: 0;
  }
}

/* Recommend */
.menu__recommend {
  display: flex;
  align-items: center;
  gap: clamp(30px, calc(-55.063291139240505px + 8.860759493670885vw), 100px);

  @media (max-width: 959px) {
    flex-direction: column;
    gap: 26px;
  }
}

.menu__recommend.reverse {
  flex-direction: row-reverse;
  margin-top: 100px;

  @media (max-width: 959px) {
    flex-direction: column;
    gap: 26px;
  }
}

.menu__recommend-img {
  width: min(49%, 553px);

  figcaption {
    font-family: var(--font-ja-gothic-priority);
    font-size: var(--font13);
    color: var(--color-gray);
    letter-spacing: 0.22em;
    margin-top: 15px;
    padding-left: 14px;

    @media (max-width: 959px) {
      display: none;
    }
  }

  @media (max-width: 959px) {
    flex: 0 0 auto;
    width: 100%;

    img {
      width: 100%;
    }
  }
}

.menu__recommend-body {
  width: min(48%, 451px);
  display: flex;
  flex-direction: column;

  @media (max-width: 959px) {
    width: 100%;
  }

  @media (max-width: 767px) {
    padding: 0 1.5rem;
  }
}

.menu__recommend-tags {
  display: flex;
  gap: 10px;
  order: 1;
}

.menu__recommend-tag__default,
.menu__recommend-tag__priority {
  font-size: var(--font11);
  letter-spacing: 0.18em;
  border: 1px solid var(--color-red);
  padding: 0.8em 2em;
}

.menu__recommend-tag__default {
  color: var(--color-red);
}

.menu__recommend-tag__priority {
  color: var(--color-white);
  background-color: var(--color-red);
}

.menu__recommend-title {
  font-size: var(--font27);
  line-height: 1.1;
  letter-spacing: 0.1em;
  margin-top: var(--space30);
  order: 2;
}

.menu__recommend-description {
  flex: 0 0 66.6%;
  font-size: clamp(15px, calc(14.713235294117647px + 0.07352941176470588vw), 16px);
  line-height: 2;
  letter-spacing: 0.1em;
  margin-top: 37px;
  order: 4;
}

.menu__recommend-detail {
  display: flex;
  align-items: center;
  gap: 0 26px;
  margin-top: clamp(14px, calc(5.6838235294117645px + 2.1323529411764706vw), 43px);
  order: 3;
}

.menu__recommend-weight {
  font-size: clamp(16px, calc(15.69029411764706px + 0.07941176470588224vw), 17.08px);
  letter-spacing: 0.1em;
}

.menu__recommend-price {
  font-size: clamp(27px, calc(25.566176470588236px + 0.3676470588235294vw), 32px);
  letter-spacing: 0.06em;
}

.menu__recommend-price__unit {
  font-size: var(--font16);
}

.menu__recommend-price__tax {
  font-size: var(--font15);
  letter-spacing: 0.18em;
}

/* Dish__cards */
.menu__dish__cards {
  width: min(100%, 1015px);
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(17px, calc(-1.169442433019551px + 4.9239681390296886vw), 85px);
  margin: clamp(70px, calc(34.99710354815351px + 9.485879797248371vw), 201px) auto clamp(144px, calc(118.47794117647058px + 6.544117647058824vw), 233px);
  padding: 0 2rem;

  @media (max-width: 767px) {
    padding: 0 1rem;
    gap: 35px 18px;
  }
}

.menu__dish__card {
  flex: 1 1 50%;
}

.menu__dish-title {
  font-size: clamp(13px, calc(9.181818181818182px + 1.0181818181818183vw), 27px);
  line-height: 1.1;
  letter-spacing: 0.1em;
  margin-top: clamp(11px, calc(7.526430123099203px + 0.9413468501086171vw), 24px);
}

.menu__dish-detail {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0 16px;
  margin-top: clamp(8px, calc(2.545454545454546px + 1.4545454545454546vw), 28px);

  @media (max-width: 767px) {
    justify-content: flex-start;
  }
}

.menu__dish-weight {
  font-size: clamp(13px, calc(11.852941176470589px + 0.29411764705882354vw), 17px);
  letter-spacing: 0.1em;

  @media (max-width: 767px) {
    display: none;
  }
}

.menu__dish-price {
  font-size: clamp(18px, calc(13.985294117647058px + 1.0294117647058822vw), 32px);
  letter-spacing: 0.06em;
}

.menu__dish-price__unit {
  font-size: clamp(8px, calc(5.705882352941177px + 0.5882352941176471vw), 16px);
  font-weight: 600;
  margin-left: -5px;
}

.menu__dish-price__tax {
  font-size: clamp(6.5px, calc(4.0625px + 0.625vw), 15px);
}

/* Course
=================================*/
.menu__course {
  padding-bottom: clamp(85px, calc(64.066px + 5.368vw), 158px);
  position: relative;
  background: url(../img/bg_priority.webp) no-repeat top center / cover;
  margin: 0 calc(50% - 50vw);
  width: 100vw;
  z-index: -1;
}

.menu__course-inner {
  max-width: 1750px;
  width: calc(100% - 300px);
  padding-right: 2rem;
  margin-left: auto;

  @media (max-width: 767px) {
    width: 100%;
    padding-right: 0;
  }
}

/* Hero */
.menu__course-hero__img {
  width: 78.2%;

  img {
    width: min(100%, 1040px);
    margin-right: auto;

    @media (max-width: 767px) {
      width: 90%;
      margin-right: 0;
      margin-left: auto;
    }
  }
}

/* Feature */
.menu__course-feature {
  display: flex;
  padding: var(--space90) 0 182px;
  gap: clamp(32px, calc(-12.578411405295313px + 5.8044806517311605vw), 89px);

  @media (max-width: 959px) {
    flex-direction: column;
    gap: 0;
  }

  @media (max-width: 767px) {
    padding: 0 2rem;
  }
}

.menu__course-feature__body {
  flex: 0 0 42.7%;
  padding-top: clamp(0px, calc(-64.40506329113924px + 6.70886075949367vw), 53px);

  @media (max-width: 959px) {
    display: contents;
  }
}

.menu__course-feature__title {
  font-family: var(--font-ja-mincho-priority);
  font-size: var(--font28);
  line-height: 1.7;
  letter-spacing: 0.14em;

  @media (max-width: 959px) {
    order: 1;
  }

  @media (max-width: 767px) {
    margin-top: 43px;
  }
}

.menu__course-feature__text {
  width: 76%;
  line-height: 2;
  letter-spacing: 0.1em;
  margin-top: clamp(42px, calc(41.4264705882353px + 0.14705882352941177vw), 44px);
  margin-top: var(--space40);

  @media (max-width: 959px) {
    width: 100%;
    order: 2;
  }

  @media (max-width: 767px) {
    width: 100%;
  }
}

.menu__course-reserve {
  margin-top: clamp(55px, calc(43.529411764705884px + 2.941176470588235vw), 95px);
  margin-top: var(--space90);
  border-bottom: 1px solid var(--color-mid-gray);

  @media (max-width: 959px) {
    order: 4;
    margin-bottom: 55px;
  }
}

.menu__course-reserve__title {
  font-family: var(--font-ja-mincho-priority);
  font-size: var(--font19);
  line-height: 1.2;
  letter-spacing: 0.14em;
  position: relative;

  /* &::after {
    position: absolute;
    content: "";
    background: var(--color-mid-gray);
    width: clamp( 276px, calc( 198px + 16.666666666666664vw ), 299px );
    height: 1px;
    top: 50%;
    right: 0;
  } */
  /* 
  @media (max-width: 959px) {
    &::after {
      width: clamp(160px, calc(-121.0193321616872px + 72.05623901581723vw), 570px);
    }
  } */
}

.menu__course-reserve__lists {
  padding: var(--space50) 0;
}

.menu__course-reserve__list {
  display: grid;
  grid-template-columns: 112px 1fr;

  span {
    font-size: var(--font12);
  }

  dt,
  dd {
    font-family: var(--font-ja-gothic-priority);
    font-size: var(--font17);
    line-height: 1.2;
  }

  dt {
    grid-column: 1;
  }

  dd {
    grid-column: 2;
  }

  dd + dd {
    margin-top: 11px;
  }
}

.menu__course-reserve__list:not(:first-child) {
  margin-top: var(--space24);
}

.menu__course-feature__img {
  width: 57.2%;

  img {
    width: min(100%, 575px);
    margin-inline: auto;
  }

  @media (max-width: 959px) {
    order: 3;
    margin-inline: auto;
    margin-top: 46px;
  }

  @media (max-width: 767px) {
    width: 100%;
  }
}

/* Food
=================================*/
.menu__food {
  padding: clamp(80px, calc(22.073529411764703px + 14.852941176470589vw), 282px) 2rem 130px;
  max-width: 1750px;
  width: calc(100% - 300px);
  margin-left: auto;

  @media (max-width: 767px) {
    width: 100%;
    padding: 0;
  }
}

.menu__food-inner {
  width: min(100%, 643px);
  margin-inline: auto;

  @media (max-width: 767px) {
    width: 100%;
    padding: 0;
  }
}

.menu__list-items {
  display: flex;
  flex-direction: column;
  gap: clamp(30px, calc(22.830882352941178px + 1.8382352941176472vw), 55px);
  flex: 1 1 50%;

  @media (max-width: 767px) {
    width: 80%;
    margin-inline: auto;
  }
}

.menu__list-item {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--color-mid-gray);
  padding-bottom: 13px;

  dt {
    font-size: clamp(16px, calc(13.705882352941178px + 0.5882352941176471vw), 24px);
    line-height: 1.26;
    letter-spacing: 0.1em;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5em;
  }

  dd {
    font-family: var(--font-ja-gothic-default);
    font-size: clamp(16px, calc(13.705882352941178px + 0.5882352941176471vw), 24px);
    letter-spacing: 0.06em;
    text-align: right;
    margin-left: 0.5em;

    span {
      font-size: clamp( 10px, calc( 9.1875px + 0.20833333333333334vw ), 12px );
    }
  }
}

.menu__list-item-note {
  display: inline-block;
  font-size: clamp(15.5px, calc(14.783088235294118px + 0.1838235294117647vw), 18px);
  letter-spacing: 0.04em;
}

.menu__list-item-label {
  display: inline-block;
  min-width: 7.2em;
  font-family: var(--font-ja-gothic-priority);
  font-weight: 600;
  font-size: clamp(11px, calc(9.279411764705882px + 0.4411764705882353vw), 17px);
  letter-spacing: 0.06em;

  @media (max-width: 767px) {
    min-width: 6em;
  }
}

.menu__list-item-label.blank {
  min-width: 7.2em;

  @media (max-width: 767px) {
    min-width: 6em;
  }
}

.menu__list-note {
  font-size: var(--font17);
  letter-spacing: 0.1em;
  margin-top: 3em;
  text-align: center;
}

/* Drink
=================================*/
#drink {
  @media (max-width: 767px) {
    padding-top: 3em;
  }
}

.menu__drink {
  padding: clamp(80px, calc(-12.285132382892058px + 12.016293279022404vw), 198px) 2rem clamp(0px, calc(-201.77596741344195px + 26.272912423625254vw), 258px);
  max-width: 1750px;
  width: calc(100% - 300px);
  margin-left: auto;

  @media (max-width: 767px) {
    width: 100%;
    padding: 0;
  }
}
.menu__drinklist-items {
  width: min(100%, 1216px);
  display: flex;
  gap: clamp(40px, calc(-20.75949367088608px + 6.329113924050633vw), 90px);
  padding: 0 2rem;
  margin-inline: auto;

  @media (max-width: 959px) {
    width: min(100%, 643px);
    flex-direction: column;
    padding: 0;
  }

  @media (max-width: 767px) {
    width: 100%;
  }
}

/*================================================================
# Dessert
================================================================*/
.dessert {
  background-color: var(--color-light-yellow);
  padding: var(--space100) 0;
  margin-top: var(--space80);
}

.dessert__inner {
  width: min(100% - 4rem, 1017px);
  margin-inline: auto;
  display: flex;
  align-items: center;
  gap: var(--space100);

  @media (max-width: 1110px) {
    gap: var(--space60);
  }

  @media (max-width: 767px) {
    gap: var(--space40);
  }

  @media (max-width: 767px) {
    flex-direction: column;
  }
}

.dessert__img {
  width: min(43%, 470px);

  @media (max-width: 767px) {
    width: 100%;
  }
}

.dessert__body {
  width: min(100%, 460px);
  display: flex;
  flex-direction: column;
}

.dessert__title {
  font-family: var(--font-ja-mincho-priority);
  font-size: var(--font28);
  line-height: 1.7;
  letter-spacing: 0.1em;

  @media (max-width: 767px) {
    letter-spacing: 0.01em;
  }
}

.dessert__description {
  font-size: var(--font16);
  padding-right: 2rem;
  line-height: 2;
  letter-spacing: 0.1em;
  margin-top: var(--space40);

  @media (max-width: 767px) {
    width: 100%;
    padding-right: 0;
  }
}

/*================================================================
# ShopInfo
================================================================*/
.shopInfo {
  padding-top: var(--space100);
  width: var(--container-full);
  margin-inline: auto;

  @media (max-width: 767px) {
    padding-top: 0;
  }
}

.shopInfo__inner {
  display: flex;
  gap: var(--space90);

  @media (max-width: 767px) {
    flex-direction: column;
    gap: 73px;
  }
}

.shopInfo__img {
  width: min(47%, 821px);

  @media (max-width: 767px) {
    width: 100%;
  }
}

.shopInfo__body {
  width: min(50%, 650px);
  padding-right: 4rem;

  @media (max-width: 1110px) {
    padding-right: 2rem;
  }

  @media (max-width: 767px) {
    width: 100%;
    padding-left: 2rem;
  }
}

.shopInfo__description {
  margin-top: var(--space50);
}

.shopInfo__lists {
  display: grid;
  grid-template-columns: clamp(87px, calc(82.125px + 1.25vw), 104px) 1fr;
  margin-top: var(--space20);

  dt,
  dd {
    font-family: var(--font-ja-gothic-priority);
    font-size: var(--font17);
  }

  dt {
    grid-column: 1;
  }

  dd {
    grid-column: 2;
    line-height: 1.2;
  }

  dd + dd {
    margin-top: 9px;
  }
}

/* Map */
.shopInfo__map {
  margin-top: var(--space70);
  width: 100%;
  margin-inline: auto;
  overflow: hidden;
  padding-bottom: calc(358 / 635 * 100%);
  position: relative;

  @media (max-width: 767px) {
    padding-bottom: calc(350 / 339 * 100%);
  }
}

.shopInfo__map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.shopInfo__map-link {
  font-size: var(--font16);
  text-align: right;
  margin-top: 10px;

  a {
    display: inline-block;
    text-align: right;
    font-family: var(--font-ja-gothic-priority);
    padding-left: 20px;
    position: relative;

    &::before {
      position: absolute;
      content: "";
      background: url(../img/icon_map-BLK.webp) no-repeat center / contain;
      width: 11px;
      height: 16px;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
    }
  }
}

/* access */
.shopInfo__access {
  margin-top: var(--space30);
  padding-bottom: 34px;
  border-bottom: 3px dotted #646464;
  list-style-type: disc;
  padding-left: clamp(24px, calc(20.558823529411764px + 0.8823529411764706vw), 36px);

  li {
    font-family: var(--font-ja-gothic-priority);
    font-size: var(--font16);
  }

  li + li {
    margin-top: 15px;
  }
}

/*================================================================
# Reserve
================================================================*/
.reserve {
  width: var(--container-full);
  margin-inline: auto;
  padding: var(--space100) 0 clamp(118px, calc(89.84521384928718px + 3.6659877800407332vw), 154px);
}

.reserve__inner {
  display: flex;
  gap: var(--space90);
  padding-left: 4rem;

  @media (max-width: 1110px) {
    padding-left: 2rem;
  }

  @media (max-width: 767px) {
    flex-direction: column;
    gap: var(--space70);
  }
}

.reserve__body {
  width: min(50%, 600px);

  @media (max-width: 767px) {
    width: 100%;
    margin: 0;
    padding-right: 2rem;
    order: 2;
  }
}

.reserve__contact {
  width: min(100%, 312px);
  margin-inline: auto;
  padding-top: var(--space50);

  @media (max-width: 767px) {
    width: 85%;
  }
}

.reserve__contact-lists {
  font-family: var(--font-ja-gothic-priority);
  display: flex;
  flex-direction: column;
  gap: var(--space20);
}

.reserve__contact-list {
  position: relative;
  padding-left: 52px;

  &::after {
    position: absolute;
    content: "";
  }
}

.reserve__tel {
  font-size: var(--font27);
  letter-spacing: 0.04em;

  &::after {
    background: url(../img/icon_tel-BLK.webp) no-repeat center / contain;
    width: 34px;
    height: 34px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }
}

.reserve__instagram {
  font-size: var(--font20);
  letter-spacing: 0.18em;
  margin-top: 23px;

  &::after {
    background: url(../img/icon_instagram-BLK.webp) no-repeat center / contain;
    width: 34px;
    height: 34px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }
}

.reserve__contact-note {
  font-family: var(--font-ja-gothic-priority);
  font-size: var(--font11);
  color: var(--color-gray);
  margin-top: 16px;
  padding-left: 52px;
}

.reserve__notice {
  display: flex;
  align-items: center;
  gap: var(--space40);
  margin-top: var(--space40);

  @media (max-width: 1110px) {
    flex-direction: column;
    align-items: flex-start;
  }

  @media (max-width: 767px) {
    width: 85%;
    margin-inline: auto;
    margin-top: 70px;
  }
}

.reserve__notice-note {
  width: 45%;
  font-size: var(--font14);
  line-height: 1.8;
  border: 1px solid var(--color-gray);
  padding: var(--space30);

  @media (max-width: 1110px) {
    width: 100%;
  }

  @media (max-width: 767px) {
    order: 2;
  }
}

.reserve__notice-info {
  font-family: var(--font-ja-gothic-priority);
  font-size: var(--font14);

  dl {
    display: grid;
    grid-template-columns: 84px 1fr;

    @media (max-width: 767px) {
      grid-template-columns: 74px 1fr;
    }
  }

  dl + dl {
    margin-top: 33px;
  }

  dt {
    grid-column: 1;
    line-height: 1.2;
  }

  dd {
    grid-column: 2;
    line-height: 1.2;
  }

  dd + dd {
    margin-top: 13px;
  }

  @media (max-width: 1110px) {
    flex: 1 1 auto;
    width: 100%;
  }

  @media (max-width: 767px) {
    order: 1;
  }
}

.reserve__img {
  flex-grow: 1;
  width: min(52%, 920px);

  @media (max-width: 767px) {
    width: 100%;
    order: 1;
    margin-left: auto;
  }
}

/*  ShopInfo Reserve 共通タイトル */
.shop__headLine {
  display: flex;
  align-items: center;
  gap: var(--space24);
  padding-bottom: var(--space20);
  border-bottom: 1px solid var(--color-mid-gray);
}

.shop__headLine__main {
  font-family: var(--font-ja-mincho-priority);
  font-size: var(--font26);
  letter-spacing: 0.12em;
}

.shop__headLine__sub {
  font-family: var(--font-en-mincho);
  font-size: var(--font11);
  letter-spacing: 0.12em;
  color: var(--color-gray);
  margin-top: 5px;
}

/*================================================================
# footer
================================================================*/
.footer {
  background-color: var(--color-black);
  color: var(--color-white);
}

.footer__inner {
  width: min(100% - 4rem, 1240px);
  margin-inline: auto;
  padding: var(--space70) 0 var(--space100);
  display: flex;
  gap: clamp(65px, calc(-56.22199592668025px + 15.784114052953157vw), 220px);

  @media (max-width: 767px) {
    flex-direction: column;
  }
}

.footer__logo {
  width: 168px;
  margin-inline: auto;

  img {
    display: block;
  }
}

.footer__contents {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  gap: var(--space80);
}

.footer__nav {
  @media (max-width: 767px) {
    display: none;
  }
}

.footer__nav-list {
  display: flex;
  gap: clamp(18px, calc(-7.026476578411405px + 3.2586558044806515vw), 50px);
}

.footer__nav-item a {
  font-size: clamp(14px, calc(8.525458248472505px + 0.7128309572301426vw), 21px);
  letter-spacing: 0.14em;
}

.footer__shopInfo {
  font-size: var(--font14);
  letter-spacing: 0.02em;

  @media (max-width: 767px) {
    width: 100%;
    max-width: 334px;
    margin-inline: auto;
  }
}

.footer__shopInfo-tel {
  display: flex;
  align-items: center;
  gap: 18px;
}

.footer__shopInfo-tel .footer__icon {
  display: block;
  width: 11px;

  img {
    width: 11px;
  }
}

.footer__shopInfo-address {
  display: flex;
  gap: 20px;
  margin-top: var(--space20);
}

.footer__shopInfo-address .footer__icon {
  display: block;
  width: 12px;

  img {
    width: 11px;
    margin-top: 3px;
  }
}

.footer__shopInfo-address .footer__text {
  line-height: 1.2;

  .footer__text-note {
    display: inline-block;

    @media (max-width: 767px) {
      display: block;
      text-align: right;
      margin-top: 0.25em;
    }
  }
}

.footer__shopInfo-time {
  display: grid;
  grid-template-columns: 92px 1fr;
  margin-top: 25px;

  dt {
    grid-column: 1;
  }

  dd {
    grid-column: 2;
  }

  dd + dd {
    margin-top: 12px;
  }
}

.footer__shopInfo-holiday {
  display: flex;
  margin-top: 15px;

  dt {
    width: 92px;
  }

  dd {
    line-height: 1.2;
  }
}

.footer__instagram {
  text-align: right;

  a {
    display: inline-block;
    margin-top: -5px;

    > .footer__icon {
      display: inline-block;
      vertical-align: middle;
      width: 15px;
    }

    > .footer__user-id {
      font-family: var(--font-ja-gothic-priority);
      font-size: 9.5px;
      letter-spacing: 0.18em;
      vertical-align: middle;
      padding-left: 8.6px;
    }
  }

  @media (max-width: 767px) {
    margin-top: 50px;
    text-align: center;
  }
}

/*================================================================
# footer コピーライト
================================================================*/
.footer__copyright-wrap {
  background-color: var(--color-dark-gray);
  height: 20px;
}

.footer__copyright {
  font-size: clamp(10px, calc(9.538461538461538px + 0.1282051282051282vw), 12px);
  text-align: center;
  padding-top: 5px;
}