@charset "UTF-8";
/* ================================
   FAQページ（Cafe FAQ）
================================ */
/* ヘッダー調整 */
.l-cafe-header .c-cafe-logo__img,
.l-cafe-header .c-cafe-icon-link__img {
  /* ターゲットカラー #9d9d9e を再現する精密なフィルター設定 */
  filter: brightness(0) saturate(100%) invert(65%) sepia(2%) saturate(100%) hue-rotate(202deg) brightness(88%) contrast(95%) !important;
  transition:
    filter 0.3s ease,
    opacity 0.3s ease;
}

.l-cafe-header .p-cafe-nav__link {
  color: var(--cafe-gray-main);
}

.l-cafe-header .c-cafe-hamburger__line::before,
.l-cafe-header .c-cafe-hamburger__line::after {
  background-color: var(--cafe-gray-main);
}

.l-cafe-header .c-cafe-btn-reserve {
  background-color: var(--cafe-green);
}

/* --- FAQページ（Cafe FAQ） --- */
.p-cafe-faq__faq {
  padding: 32vw 0 30vw;
}

.p-cafe-faq__head {
  margin-bottom: 1.7em;
}

.p-cafe-faq__faq .c-cafe-normal-text {
  letter-spacing: 0.28em;
}

@media (min-width: 768px) {
  .p-cafe-faq__faq {
    padding: 15vw 0 10vw;
  }

  .p-cafe-faq__faq .c-cafe-normal-text {
    padding: 1.2em 0 2.7em;
  }
}

/* --- アコーディオンアイテム --- */
.p-cafe-faq-item {
  background: #fff;
  margin-bottom: 1em;
  /* 複数の影を組み合わせて指定 */
  box-shadow:
            /* 1つ目：右と下に伸びる、少し濃くて広がる「太めの影」 */
    5px 6px 12px rgba(0, 0, 0, 0.06),
    /* 2つ目：左側にわずかにはみ出る、薄くてシャープな「超細い影」 */ -1px 1px 2px rgba(0, 0, 0, 0.03);
  border-radius: 3px;
  overflow: hidden;
}

.p-cafe-faq-item.is-open {
  margin-bottom: 2.5em;
}

@media (min-width: 768px) {
  .p-cafe-faq__main {
    width: 95%;
    margin: 0 auto;
  }

  .p-cafe-faq-item {
    border-radius: 6px;
    margin-bottom: 2em;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
  }
}

/* 質問エリア（ボタン） */
.p-cafe-faq-item__head {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 14.5vw;
  padding: 0 5vw;
  background-color: #777777;
  color: #fff;
  border: none;
  cursor: pointer;
  text-align: left;
  outline: none;
  transition: background-color 0.3s ease;
}

@media (min-width: 768px) {
  .p-cafe-faq-item__head {
    height: 6.5vw;
    padding: 0 3vw;
  }
}

/* Q.1 などの番号 */
.p-cafe-faq-item__number {
  flex-shrink: 0;
  font-family: 'EB Garamond', serif;
  font-size: 1em;
  margin-right: 0.8em;
  font-weight: 400;
  letter-spacing: 0.13em;
}

/* 質問テキスト */
.p-cafe-faq-item__q-text {
  font-family: 'Shippori Mincho', 'Noto Sans JP', sans-serif;
  font-size: 3.8vw;
  font-weight: 400;
  letter-spacing: 0.15em;
  display: flex;
  align-items: center;
}

@media (min-width: 768px) {
  .p-cafe-faq-item__q-text {
    font-size: 1.7vw;
    letter-spacing: 0.2em;
  }
}

/* --- アイコン演出（＋とーの切り替え） --- */
.p-cafe-faq-item__icon {
  position: relative;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  margin-left: 10px;
}

.p-cafe-faq-item__icon::before,
.p-cafe-faq-item__icon::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 1px;
  background-color: #fff;
  transform: translate(-50%, -50%);
  transition:
    transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
    opacity 0.3s;
}

/* 縦棒を回転させて「＋」にする */
.p-cafe-faq-item__icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

/* 開いた時（is-open）の変形 */
.p-cafe-faq-item.is-open .p-cafe-faq-item__icon::after {
  transform: translate(-50%, -50%) rotate(0deg);
  opacity: 0;
  /* 縦棒を消して「ー」にする */
}

/* --- 回答エリア（中身） --- */
.p-cafe-faq-item__body {
  display: none;
  /* jQueryのslideToggleで制御 */
  background-color: #fff;
}

.p-cafe-faq-item__content {
  padding: 8vw 6vw 5vw;
  border-top: 1px solid #eee;
}

.p-cafe-faq-item__answer {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 2.9vw;
  font-weight: normal;
  color: var(--cafe-gray-dark);
  text-align: left;
  line-height: 1.6;
  letter-spacing: 0.08em;
  margin-bottom: 1.2em;
}

@media (min-width: 768px) {
  .p-cafe-faq-item__content {
    padding: 3vw 5vw;
  }

  .p-cafe-faq-item__icon {
    width: 28px;
    height: 28px;
    margin-left: 16px;
  }

  .p-cafe-faq-item__icon::before,
  .p-cafe-faq-item__icon::after {
    box-shadow: 0 0 1px 0 rgba(255, 255, 255, 1);
  }

  .p-cafe-faq-item__answer {
    font-size: 1.25vw;
  }

  /* 無理やりだが打ち消し */
  .p-cafe-faq-item__text.u-fs-0-5 {
    font-size: inherit !important;
  }

  .p-cafe-faq-item__text.u-fs-0-6 {
    font-size: inherit !important;
  }

  .p-cafe-faq-item__text.u-fs-0-7 {
    font-size: inherit !important;
  }

  .p-cafe-faq-item__text.u-fs-0-75 {
    font-size: inherit !important;
  }
}
