/* =========================================================
   FluxCore Pro Generated Custom CSS
   Auto generated from fc_pages.layout_json advanced.custom_css
   Last updated: 2026-09-07 15:42:07
========================================================= */

/* =========================================================
   Page: header / HEADER ページ
========================================================= */

/* Block: global_header / sec_1782112078518 */
/* =========================================================
   bar Booty / global_header 追加CSS
   貼り付け先: 管理画面 > HEADERページ > 共通ヘッダー > セクション個別CSS
   既存CSSの末尾に追加（既存CSSを削除しなくてよい）
========================================================= */

:root {
  --booty-header-bg: rgba(18, 13, 10, .94);
  --booty-header-bg-soft: rgba(31, 19, 14, .88);
  --booty-gold: #d8b56b;
  --booty-gold-light: #f3d99b;
  --booty-red: #a92d35;
  --booty-cream: #fff4d9;
}

/* PC: 参考サイトの二段構成を、既存の共通ヘッダーDOMで再現 */
.global-header {
  min-height: 104px !important;
  padding: 12px clamp(20px, 4vw, 56px) !important;
  grid-template-columns: 86px minmax(0, 1fr) !important;
  grid-template-rows: 30px minmax(46px, 1fr) !important;
  column-gap: clamp(24px, 3vw, 48px) !important;
  row-gap: 0 !important;
  background:
    linear-gradient(180deg, var(--booty-header-bg), var(--booty-header-bg-soft)) !important;
  border-bottom: 1px solid rgba(216, 181, 107, .38) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .2) !important;
  backdrop-filter: blur(14px) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.15) !important;
}

.header-logo {
  grid-column: 1 !important;
  grid-row: 1 / 3 !important;
  align-self: center !important;
  justify-self: start !important;
  display: inline-flex !important;
  align-items: center !important;
  color: var(--booty-gold-light) !important;
}

.header-logo img {
  width: 78px !important;
  height: 78px !important;
  max-height: none !important;
  object-fit: contain !important;
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .4));
}

.header-page-eyebrow {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  align-self: start !important;
  max-width: min(62vw, 720px) !important;
  margin: 0 !important;
  color: rgba(255, 244, 217, .72) !important;
  font-family: var(--font-serif) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  letter-spacing: .08em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.desktop-nav {
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-self: end !important;
  justify-content: flex-end !important;
  gap: clamp(16px, 2.1vw, 32px) !important;
  min-width: 0 !important;
}

.desktop-nav a {
  min-height: 44px !important;
  padding: 10px 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  color: var(--booty-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: .12em !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
}

.desktop-nav a::after {
  bottom: 4px !important;
  height: 2px !important;
  background: linear-gradient(90deg, var(--booty-red), var(--booty-gold)) !important;
}

.desktop-nav a:hover,
.desktop-nav a.active {
  color: var(--booty-gold-light) !important;
}

/* 管理画面の「外部リンク」にInstagramを入れると、自動でCTA表示 */
.desktop-nav a[href*="instagram.com"] {
  min-height: 42px !important;
  padding: 8px 14px !important;
  gap: 8px !important;
  border: 1px solid rgba(216, 181, 107, .78) !important;
  background: rgba(169, 45, 53, .24) !important;
  color: var(--booty-gold-light) !important;
}

.desktop-nav a[href*="instagram.com"]::before {
  content: "\f16d";
  font-family: "Font Awesome 6 Brands";
  font-size: 17px;
  line-height: 1;
}

.desktop-nav a[href*="instagram.com"]::after {
  display: none !important;
}

.desktop-nav a[href*="instagram.com"]:hover {
  background: var(--booty-red) !important;
  border-color: var(--booty-red) !important;
  color: #fff !important;
}

.header-btns {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: start !important;
}

/* 将来TEL・予約・言語切替を表示しても14px未満にしない */
.btn-header-tel,
.btn-header-reserve,
.fc-language-switcher,
.fc-language-switcher a,
#liveWaitStatus {
  font-size: 14px !important;
}

.fc-language-switcher a {
  min-height: 38px !important;
}

.menu-trigger {
  min-width: 48px !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 0 !important;
  border-color: rgba(216, 181, 107, .55) !important;
  background: rgba(0, 0, 0, .2) !important;
  color: var(--booty-gold-light) !important;
  font-size: 20px !important;
}

/* スマホメニュー */
.mobile-nav-overlay {
  padding: 92px 24px 96px !important;
  gap: 6px !important;
  overflow-y: auto !important;
  background:
    radial-gradient(circle at 18% 14%, rgba(169, 45, 53, .2), transparent 34%),
    linear-gradient(145deg, rgba(20, 12, 9, .98), rgba(8, 10, 10, .98)) !important;
  border: 1px solid rgba(216, 181, 107, .24) !important;
}

.mobile-nav-overlay > a {
  width: min(100%, 320px) !important;
  min-height: 48px !important;
  padding: 10px 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--booty-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  letter-spacing: .14em !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
}

.mobile-nav-overlay > a + a {
  border-top: 1px solid rgba(216, 181, 107, .14) !important;
}

.mobile-nav-overlay > a[href*="instagram.com"] {
  margin-top: 10px !important;
  border: 1px solid rgba(216, 181, 107, .62) !important;
  background: rgba(169, 45, 53, .2) !important;
}

body:has(.mobile-nav-overlay.active) {
  overflow: hidden !important;
}

/* メニュー中も管理画面指定のロゴを表示。ヘッダー自体はクリックを遮らない */
body:has(.mobile-nav-overlay.active) .global-header {
  z-index: 2100 !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  pointer-events: none !important;
}

body:has(.mobile-nav-overlay.active) .global-header .header-logo {
  pointer-events: auto !important;
}

body:has(.mobile-nav-overlay.active) .global-header .menu-trigger {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* global_header.php に追加するスマホ下部固定導線 */
.mobile-quick-actions {
  display: none;
}

@media (max-width: 1120px) {
  .global-header {
    min-height: 72px !important;
    padding: 10px 16px !important;
    display: flex !important;
  }

  .header-logo img {
    width: 52px !important;
    height: 52px !important;
  }

  .header-page-eyebrow,
  .desktop-nav,
  .header-btns {
    display: none !important;
  }

  .menu-trigger {
    display: inline-flex !important;
    margin-left: auto !important;
  }
}

@media (max-width: 768px) {
  body {
    padding-bottom: calc(68px + env(safe-area-inset-bottom)) !important;
  }

  .mobile-quick-actions {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1900;
    min-height: calc(68px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
    display: grid;
    grid-template-columns: 1fr 1fr;
    background: rgba(16, 11, 9, .96);
    border-top: 1px solid rgba(216, 181, 107, .4);
    box-shadow: 0 -10px 26px rgba(0, 0, 0, .28);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }

  .mobile-quick-actions a {
    min-width: 0;
    min-height: 68px;
    padding: 8px 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--booty-cream);
    font-family: var(--font-serif);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .08em;
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;
  }

  .mobile-quick-actions a + a {
    border-left: 1px solid rgba(216, 181, 107, .28);
  }

  .mobile-quick-actions i {
    flex: 0 0 auto;
    color: var(--booty-gold-light);
    font-size: 19px;
  }

  .mobile-quick-actions__instagram {
    background: linear-gradient(135deg, rgba(169, 45, 53, .48), rgba(73, 23, 25, .42));
  }
}

@media (max-width: 360px) {
  .global-header {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  .mobile-nav-overlay {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }

  .mobile-quick-actions a {
    padding-right: 6px;
    padding-left: 6px;
    letter-spacing: .04em;
  }
}

@media (prefers-reduced-motion: reduce) {
  .global-header *,
  .mobile-nav-overlay * {
    transition: none !important;
  }
}
/* =========================================================
   bar Booty / global_header 追加CSS（PHP変更なし版）
   貼り付け先: 管理画面 > HEADERページ > 共通ヘッダー > セクション個別CSS
   既存CSSの末尾に追加（既存CSSを削除しなくてよい）
========================================================= */

:root {
  --booty-header-bg: rgba(18, 13, 10, .94);
  --booty-header-bg-soft: rgba(31, 19, 14, .88);
  --booty-gold: #d8b56b;
  --booty-gold-light: #f3d99b;
  --booty-red: #a92d35;
  --booty-cream: #fff4d9;
}

/* PC: 参考サイトの二段構成を、既存の共通ヘッダーDOMで再現 */
.global-header {
  min-height: 104px !important;
  padding: 12px clamp(20px, 4vw, 56px) !important;
  grid-template-columns: 86px minmax(0, 1fr) !important;
  grid-template-rows: 30px minmax(46px, 1fr) !important;
  column-gap: clamp(24px, 3vw, 48px) !important;
  row-gap: 0 !important;
  background:
    linear-gradient(180deg, var(--booty-header-bg), var(--booty-header-bg-soft)) !important;
  border-bottom: 1px solid rgba(216, 181, 107, .38) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .2) !important;
  backdrop-filter: blur(14px) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.15) !important;
}

.header-logo {
  grid-column: 1 !important;
  grid-row: 1 / 3 !important;
  align-self: center !important;
  justify-self: start !important;
  display: inline-flex !important;
  align-items: center !important;
  color: var(--booty-gold-light) !important;
}

.header-logo img {
  width: 78px !important;
  height: 78px !important;
  max-height: none !important;
  object-fit: contain !important;
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .4));
}

.header-page-eyebrow {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  align-self: start !important;
  max-width: min(62vw, 720px) !important;
  margin: 0 !important;
  color: rgba(255, 244, 217, .72) !important;
  font-family: var(--font-serif) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  letter-spacing: .08em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.desktop-nav {
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-self: end !important;
  justify-content: flex-end !important;
  gap: clamp(16px, 2.1vw, 32px) !important;
  min-width: 0 !important;
}

.desktop-nav a {
  min-height: 44px !important;
  padding: 10px 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  color: var(--booty-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: .12em !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
}

.desktop-nav a::after {
  bottom: 4px !important;
  height: 2px !important;
  background: linear-gradient(90deg, var(--booty-red), var(--booty-gold)) !important;
}

.desktop-nav a:hover,
.desktop-nav a.active {
  color: var(--booty-gold-light) !important;
}

/* 管理画面の「外部リンク」にInstagramを入れると、自動でCTA表示 */
.desktop-nav a[href*="instagram.com"] {
  min-height: 42px !important;
  padding: 8px 14px !important;
  gap: 8px !important;
  border: 1px solid rgba(216, 181, 107, .78) !important;
  background: rgba(169, 45, 53, .24) !important;
  color: var(--booty-gold-light) !important;
}

.desktop-nav a[href*="instagram.com"]::before {
  content: "\f16d";
  font-family: "Font Awesome 6 Brands";
  font-size: 17px;
  line-height: 1;
}

.desktop-nav a[href*="instagram.com"]::after {
  display: none !important;
}

.desktop-nav a[href*="instagram.com"]:hover {
  background: var(--booty-red) !important;
  border-color: var(--booty-red) !important;
  color: #fff !important;
}

.header-btns {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: start !important;
}

/* 将来TEL・予約・言語切替を表示しても14px未満にしない */
.btn-header-tel,
.btn-header-reserve,
.fc-language-switcher,
.fc-language-switcher a,
#liveWaitStatus {
  font-size: 14px !important;
}

.fc-language-switcher a {
  min-height: 38px !important;
}

.menu-trigger {
  min-width: 48px !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 0 !important;
  border-color: rgba(216, 181, 107, .55) !important;
  background: rgba(0, 0, 0, .2) !important;
  color: var(--booty-gold-light) !important;
  font-size: 20px !important;
}

/* スマホメニュー */
.mobile-nav-overlay {
  padding: 92px 24px 96px !important;
  gap: 6px !important;
  overflow-y: auto !important;
  background:
    radial-gradient(circle at 18% 14%, rgba(169, 45, 53, .2), transparent 34%),
    linear-gradient(145deg, rgba(20, 12, 9, .98), rgba(8, 10, 10, .98)) !important;
  border: 1px solid rgba(216, 181, 107, .24) !important;
}

.mobile-nav-overlay > a {
  width: min(100%, 320px) !important;
  min-height: 48px !important;
  padding: 10px 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--booty-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  letter-spacing: .14em !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
}

.mobile-nav-overlay > a + a {
  border-top: 1px solid rgba(216, 181, 107, .14) !important;
}

.mobile-nav-overlay > a[href*="instagram.com"] {
  margin-top: 10px !important;
  border: 1px solid rgba(216, 181, 107, .62) !important;
  background: rgba(169, 45, 53, .2) !important;
}

body:has(.mobile-nav-overlay.active) {
  overflow: hidden !important;
}

/* メニュー中も管理画面指定のロゴを表示。ヘッダー自体はクリックを遮らない */
body:has(.mobile-nav-overlay.active) .global-header {
  z-index: 2100 !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  pointer-events: none !important;
}

body:has(.mobile-nav-overlay.active) .global-header .header-logo {
  pointer-events: auto !important;
}

body:has(.mobile-nav-overlay.active) .global-header .menu-trigger {
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 1120px) {
  .global-header {
    min-height: 72px !important;
    padding: 10px 16px !important;
    display: flex !important;
  }

  .header-logo img {
    width: 52px !important;
    height: 52px !important;
  }

  .header-page-eyebrow,
  .desktop-nav,
  .header-btns {
    display: none !important;
  }

  .menu-trigger {
    display: inline-flex !important;
    margin-left: auto !important;
  }
}

@media (max-width: 768px) {
  /* 固定ボタンは既存フッターブロックの管理機能を使用 */
}

@media (max-width: 360px) {
  .global-header {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  .mobile-nav-overlay {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .global-header *,
  .mobile-nav-overlay * {
    transition: none !important;
  }
}


/* =========================================================
   Page: index / bar Booty（バーブーティー）｜静内・新ひだか町のバー｜静内駅徒歩7分｜TOP
========================================================= */

/* Block: hero_main / sec_1782110119323 */
/* =========================================================
   bar Booty / TOP ファーストビュー追加CSS（PHP・HTML変更なし）
   貼り付け先: TOPページ > 3枚スライダーのヒーローブロック > セクション個別CSS
   既存CSSの末尾に追加
   対象ブロックID: sec_1782110119323
========================================================= */

#sec_1782110119323 {
  --booty-fv-gold: #e7c77b;
  --booty-fv-gold-light: #fff0be;
  --booty-fv-red: #a92d35;
  --booty-fv-cream: #fff7e8;
  position: relative !important;
  width: 100% !important;
  height: clamp(580px, calc(100svh - 104px), 840px) !important;
  min-height: 580px !important;
  overflow: hidden !important;
  isolation: isolate !important;
  background: #100b09 !important;
}

/* 既存の3枚スライダーを画面いっぱいに使用 */
#sec_1782110119323 .hero-slider,
#sec_1782110119323 .hero-slide,
#sec_1782110119323 .hero-slide-img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
}

#sec_1782110119323 .hero-slider {
  z-index: 0 !important;
  overflow: hidden !important;
}

#sec_1782110119323 .hero-slide {
  overflow: hidden !important;
}

#sec_1782110119323 .hero-slide-img {
  z-index: 0 !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  filter: saturate(.92) contrast(1.04) brightness(.96) !important;
  transform: scale(1.015);
}

/* 写真を暗く潰さず、コピー周辺だけ読みやすくする */
#sec_1782110119323 .hero-slide::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg,
      rgba(12, 8, 7, .38) 0%,
      rgba(12, 8, 7, .06) 28%,
      rgba(12, 8, 7, .16) 62%,
      rgba(12, 8, 7, .58) 100%),
    radial-gradient(ellipse at center,
      rgba(101, 37, 40, .04) 0%,
      rgba(10, 7, 6, .5) 100%) !important;
}

/* 3枚それぞれの主役が隠れない位置 */
#sec_1782110119323 .hero-slide:nth-child(1) .hero-slide-img {
  background-position: center 52% !important;
}

#sec_1782110119323 .hero-slide:nth-child(2) .hero-slide-img {
  background-position: center 46% !important;
}

#sec_1782110119323 .hero-slide:nth-child(3) .hero-slide-img {
  background-position: center 50% !important;
}

/* キャッチコピー */
#sec_1782110119323 .hero-slide-caption {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 30px clamp(34px, 7vw, 110px) 78px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  transform: none !important;
  pointer-events: none !important;
}

#sec_1782110119323 .hero-slide-catch {
  position: relative !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 46px 0 20px !important;
  color: var(--booty-fv-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: clamp(32px, 3.6vw, 52px) !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;
  letter-spacing: .12em !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  text-shadow:
    0 3px 18px rgba(0, 0, 0, .72),
    0 1px 2px rgba(0, 0, 0, .9) !important;
}

#sec_1782110119323 .hero-slide-catch::before {
  content: "MUSIC BAR  /  SHIZUNAI" !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  color: var(--booty-fv-gold-light) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .24em !important;
  white-space: nowrap !important;
}

#sec_1782110119323 .hero-slide-catch::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: 0 !important;
  width: 74px !important;
  height: 2px !important;
  transform: translateX(-50%) !important;
  background: linear-gradient(90deg,
    transparent,
    var(--booty-fv-red) 22%,
    var(--booty-fv-gold) 78%,
    transparent) !important;
}

/* 見本サイトの縦方向の誘導を、HTML追加なしで再現 */
#sec_1782110119323::after {
  content: "SCROLL DOWN" !important;
  position: absolute !important;
  right: clamp(14px, 2vw, 30px) !important;
  bottom: 34px !important;
  z-index: 5 !important;
  color: rgba(255, 247, 232, .86) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .22em !important;
  writing-mode: vertical-rl !important;
  white-space: nowrap !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .7) !important;
  pointer-events: none !important;
}

/* スライド切替ドット */
#sec_1782110119323 .hero-slider-dots {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  bottom: 30px !important;
  z-index: 5 !important;
  width: auto !important;
  min-height: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  transform: translateX(-50%) !important;
}

#sec_1782110119323 .hero-slider-dot {
  width: 11px !important;
  height: 11px !important;
  min-width: 11px !important;
  min-height: 11px !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 240, 190, .9) !important;
  border-radius: 50% !important;
  background: rgba(17, 11, 9, .36) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .45) !important;
  opacity: 1 !important;
  transition: transform .25s ease, background-color .25s ease !important;
}

#sec_1782110119323 .hero-slider-dot.is-active {
  background: var(--booty-fv-gold) !important;
  border-color: var(--booty-fv-gold-light) !important;
  transform: scale(1.18) !important;
}

@media (max-width: 1120px) {
  #sec_1782110119323 {
    height: calc(100svh - 72px) !important;
    min-height: 600px !important;
    max-height: 820px !important;
  }
}

@media (max-width: 768px) {
  #sec_1782110119323 {
    height: calc(100svh - 72px) !important;
    min-height: 560px !important;
    max-height: 760px !important;
  }

  #sec_1782110119323 .hero-slide-img {
    filter: saturate(.94) contrast(1.03) brightness(.92) !important;
    transform: scale(1.01);
  }

  #sec_1782110119323 .hero-slide:nth-child(1) .hero-slide-img {
    background-position: 48% center !important;
  }

  #sec_1782110119323 .hero-slide:nth-child(2) .hero-slide-img {
    background-position: 52% center !important;
  }

  #sec_1782110119323 .hero-slide:nth-child(3) .hero-slide-img {
    background-position: 42% center !important;
  }

  #sec_1782110119323 .hero-slide::after {
    background:
      linear-gradient(180deg,
        rgba(12, 8, 7, .34) 0%,
        rgba(12, 8, 7, .1) 28%,
        rgba(12, 8, 7, .18) 58%,
        rgba(12, 8, 7, .66) 100%),
      radial-gradient(ellipse at center,
        rgba(101, 37, 40, .02) 0%,
        rgba(10, 7, 6, .4) 100%) !important;
  }

  #sec_1782110119323 .hero-slide-caption {
    padding: 24px 22px 88px !important;
  }

  #sec_1782110119323 .hero-slide-catch {
    /* 9em幅で「静内で見つける、／大人の隠れ家。」の2行に整える */
    width: 9em !important;
    max-width: calc(100vw - 48px) !important;
    padding: 42px 0 18px !important;
    font-size: clamp(24px, 7.2vw, 29px) !important;
    line-height: 1.62 !important;
    letter-spacing: .07em !important;
    white-space: normal !important;
    word-break: normal !important;
    line-break: strict !important;
    overflow-wrap: normal !important;
    text-wrap: balance !important;
  }

  #sec_1782110119323 .hero-slide-catch::before {
    font-size: 14px !important;
    letter-spacing: .15em !important;
  }

  #sec_1782110119323 .hero-slider-dots {
    bottom: 94px !important;
  }

  #sec_1782110119323::after {
    right: 10px !important;
    bottom: 94px !important;
    font-size: 14px !important;
    letter-spacing: .14em !important;
  }
}

@media (max-width: 360px) {
  #sec_1782110119323 .hero-slide-caption {
    padding-right: 18px !important;
    padding-left: 18px !important;
  }

  #sec_1782110119323 .hero-slide-catch {
    font-size: 24px !important;
  }

  #sec_1782110119323 .hero-slide-catch::before {
    letter-spacing: .1em !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #sec_1782110119323 .hero-slide-img,
  #sec_1782110119323 .hero-slider-dot {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
}
/* =========================================================
   TOPページ 修正まとめ（チェックバック対応）
   bar Booty  2026-09-04
   置き場所：TOPページのいずれかのブロックの「ブロック個別CSS」欄の末尾
             （1か所にまとめて貼ればOK。おすすめは店舗概要ブロック）
========================================================= */

/* ---- 1) MV右側の隙間 ---------------------------------------------------
   原因：ひとつの擬似要素（::after）に2つの役割が重なっています。
     ・style.css の .hero-wrapper::after … 全面にかける暗幕（inset: 0）
     ・TOPのブロックCSS #sec_1782110119323::after … 「SCROLL DOWN」の縦書きラベル
       （right: clamp(14px,2vw,30px) / bottom: 34px）
   擬似要素は1つしかないため両方が合成され、暗幕の箱が
   「右28px・下34pxだけ足りない大きな四角」になって隙間に見えていました。

   対処：::after は SCROLL DOWN ラベル専用にして、暗幕を外します。
   （MVの暗さは各スライドの .hero-slide::after が受け持っているので変わりません） */
#sec_1782110119323::after{
  top: auto !important;
  left: auto !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
}

/* ---- 2) 店舗概要の文字サイズ（15px → 16px） --------------------------- */
#sec_1785931790498 .store-info-table th,
#sec_1785931790498 .store-info-table td{
  font-size: 16px !important;
  line-height: 1.95 !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;  /* 指示書：明朝体 */
}
@media (max-width: 900px){
  #sec_1785931790498 .store-info-table th,
  #sec_1785931790498 .store-info-table td{ font-size: 16px !important; }
}

/* ---- 3) GALLERYの背景が粗い問題 ---------------------------------------
   PC：cover 指定で画面幅いっぱいまで約3倍に引き伸ばされていたのが原因。
   スマホ：拡大は直っても、タイルが1倍サイズのままだと
           Retina（2〜3倍密度）の画面で1ドットが2〜3ドットに引き伸ばされ、
           まだ少しにじんで見えます。→ 2倍サイズのタイルに差し替えます。 */
#sec_1788238305680.image-grid-section{
  --fc-bg-overlay: rgba(0,0,0,0);
  /* ▼ 2倍サイズのタイル（bg_gold_pattern@2x.webp／1280×852）を
     デザイン設定の背景画像に指定したうえで、表示は640px幅に縮めます。
     こうするとスマホ（Retina）でも1ドットずつ描かれ、にじみません。
     1倍のタイル（640×426）のままなら、この行を auto に戻してください。 */
  background-size: 640px auto !important;
  background-repeat: repeat !important;   /* 柄として敷き詰める */
  background-position: center top !important;
  background-color: #c8a05c !important;
}
@media (min-width: 901px){
  #sec_1788238305680.image-grid-section{ background-attachment: fixed !important; }
}

/* ---- 4) 改行位置（当店のご案内／CONCEPT／SYSTEM／RECRUIT） --------------
   現在は禁則処理だけが効いている状態です。
   文節で折り返す指定と、端数1文字の行を作らない指定を足します。 */
.booty-intro__body p,
.booty-feature__body p,
.booty-access-cta p,
.booty-top-content p:not(.booty-kicker):not(.booty-feature__number){
  word-break: auto-phrase !important;   /* 文節で折り返す */
  line-break: strict !important;        /* 禁則処理 */
  text-wrap: pretty !important;         /* 最終行が1〜2文字にならないようにする */
}
/* 見出しは単語の途中で折らない */
.booty-intro__body h2,
.booty-feature__body h2,
.booty-feature__body h3,
.booty-access-cta h2{
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

/* ---- 5) 中央揃えの英字ラベルが少し左右にズレる問題 ----------------------
   字間（letter-spacing）は最後の1文字の後ろにも入るため、
   中央揃えだとその分だけ文字が寄ります。半分を戻して中央に合わせます。 */
.fc-instagram-embed-label,
.booty-access-cta__label{
  text-indent: .15em !important;
}

/* ---- 6) 追従バーの色をフッターに合わせる -------------------------------
   バーだけ赤にすると、上のフッター（ローズ系）から色が急に変わって浮きます。
   フッターと完全に同じ配色（#70414d → #9a5d68 → #bf7d84）にそろえています。 */
.fc-floating-actions{
  background:
    radial-gradient(circle at 18% 0%, rgba(255, 228, 190, .34), transparent 36%),
    linear-gradient(145deg, #70414d 0%, #9a5d68 58%, #bf7d84 100%) !important;
}

/* Instagramボタンだけ、指示書のポイントカラー（赤）のままにしています。
   バーの色に馴染ませたい場合は、下の1行を
   linear-gradient(135deg, #b23d56, #7d3549) に戻してください。 */
.fc-floating-instagram{
  background: linear-gradient(135deg, #c03a44, #8d232b) !important;
  border: 1px solid rgba(255, 229, 186, .62) !important;
}

/* ---- 7) 「当店のご案内」の2段落目を2行に収める（2026-09-05 追加） -------
   文章側の列が493pxしかなく、
   「ゆっくりとした二次会まで、思い思いの時間を過ごしていただけます。」（532px必要）
   が収まらずに3行になっていました。左右の列を同じ幅にして余白を詰めます。
   ※ 列幅を広げるだけだと、今度は1行目が「…ゆっくりと」まで伸びて
     「ゆっくりと／した」で割れるため、原稿側に改行を1つ入れる必要があります
     （下の .br-pc と、HTMLの追記をセットで使ってください）。 */
/* ★PC・タブレットのみ。901px未満はTOP側の1カラム指定をそのまま使います。
   （メディアクエリを付けないと、スマホでも2カラムのままになり
     右側にはみ出して文字が切れます） */
@media (min-width: 901px){
  .booty-intro{
    grid-template-columns: minmax(0, 1fr) minmax(360px, 1fr) !important;
    gap: clamp(34px, 4.6vw, 72px) !important;
  }
}

/* PC・タブレットだけ有効になる改行。スマホでは無視されます */
.br-pc{ display: inline; }
@media (max-width: 900px){
  .br-pc{ display: none; }
}

/* ---- 8) Instagramセクションの背景を拡大しない（2026-09-05 追加） -------
   このブロックは「デザイン設定の背景画像」を、ブロック自身が
   <style id="bg-fc-instagram-embed-○○">#fc-instagram-embed-○○{ … cover … }</style>
   という形（ID指定・!important）で body 内に書き出します。
   ID指定にはクラス指定では勝てないため、次のどちらかで対応してください。

   【推奨】デザイン設定の「背景画像」を空にして、下のCSSで直接指定する
           （IDに依存しないので、InstagramのURLを変えても崩れません）        */
section.fc-instagram-embed-section{
  background-image: url("/image/assets/asset_20260901172722_6a968c6a55b9f.webp") !important;
  background-size: auto !important;          /* 原寸のまま＝拡大しない */
  background-repeat: no-repeat !important;   /* 1枚だけ置く（柄ではないため） */
  background-position: center top !important;
  background-color: #161e2a !important;      /* 画像の端と同じ色。左右の余白がなじみます */
}

/* 【簡易】デザイン設定の背景画像を残したまま直す場合は、こちらを使ってください。
   ※ InstagramのURLを変更するとIDが変わるので、その都度差し替えが必要です。
section#fc-instagram-embed-ff948a7d{
  background-size: auto !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-color: #161e2a !important;
}
*/

/* Block: latest_news_bar / sec_1788238215484 */
/* =========================================================
   bar Booty / TOP NEWSブロック追加CSS（CMSブロックをそのまま使用）
   貼り付け先: TOPページ > NEWSブロック > セクション個別CSS
   対象ブロックID: sec_1788238215484
   PHP・HTML変更なし
========================================================= */

#sec_1788238215484 {
  --booty-news-ink: #241815;
  --booty-news-cream: #fff7e8;
  --booty-news-paper: #f3e6cd;
  --booty-news-gold: #c99c45;
  --booty-news-red: #a92d35;
  position: relative !important;
  padding: clamp(30px, 4vw, 54px) 22px clamp(42px, 5vw, 68px) !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(169, 45, 53, .14), transparent 28%),
    linear-gradient(180deg, #101716 0%, #131b19 100%) !important;
}

#sec_1788238215484 .news-bar-container {
  position: relative !important;
  width: min(100%, 1120px) !important;
  margin: 0 auto !important;
  padding-top: 32px !important;
}

#sec_1788238215484 .news-bar-container::before {
  content: "LATEST NEWS" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  color: #e7c77b !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: .2em !important;
  white-space: nowrap !important;
}

#sec_1788238215484 .news-bar-link {
  position: relative !important;
  width: 100% !important;
  min-height: 86px !important;
  padding: 18px 24px 18px 28px !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) 32px !important;
  align-items: center !important;
  gap: 18px clamp(20px, 3vw, 44px) !important;
  overflow: hidden !important;
  color: var(--booty-news-ink) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(201, 156, 69, .2), transparent 34%),
    linear-gradient(115deg, #fffaf0 0%, var(--booty-news-paper) 100%) !important;
  border: 1px solid rgba(231, 199, 123, .78) !important;
  border-left: 5px solid var(--booty-news-red) !important;
  border-radius: 0 10px 10px 0 !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, .22) !important;
  text-decoration: none !important;
  transition: transform .25s ease, box-shadow .25s ease !important;
}

#sec_1788238215484 .news-bar-link:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 22px 48px rgba(0, 0, 0, .3) !important;
}

#sec_1788238215484 .news-bar-left {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  white-space: nowrap !important;
}

#sec_1788238215484 .news-badge {
  min-height: 34px !important;
  padding: 7px 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  background: var(--booty-news-red) !important;
  border-radius: 4px !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: .12em !important;
}

#sec_1788238215484 .news-date {
  color: #765526 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .06em !important;
  white-space: nowrap !important;
}

#sec_1788238215484 .news-title {
  min-width: 0 !important;
  margin: 0 !important;
  color: var(--booty-news-ink) !important;
  font-family: var(--font-serif) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.7 !important;
  letter-spacing: .04em !important;
  word-break: normal !important;
  line-break: strict !important;
  overflow-wrap: anywhere !important;
  text-wrap: balance !important;
}

#sec_1788238215484 .news-arrow {
  width: 32px !important;
  height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--booty-news-red) !important;
  border: 1px solid rgba(169, 45, 53, .34) !important;
  border-radius: 50% !important;
  font-size: 14px !important;
  transition: color .25s ease, background-color .25s ease !important;
}

#sec_1788238215484 .news-bar-link:hover .news-arrow {
  color: #fff !important;
  background: var(--booty-news-red) !important;
}

@media (max-width: 768px) {
  #sec_1788238215484 {
    padding: 28px 16px 44px !important;
  }

  #sec_1788238215484 .news-bar-container {
    padding-top: 30px !important;
  }

  #sec_1788238215484 .news-bar-link {
    min-height: 0 !important;
    padding: 18px 54px 18px 18px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  #sec_1788238215484 .news-bar-left {
    flex-wrap: wrap !important;
    gap: 8px 12px !important;
  }

  #sec_1788238215484 .news-title {
    font-size: 15px !important;
    line-height: 1.75 !important;
  }

  #sec_1788238215484 .news-arrow {
    position: absolute !important;
    top: 50% !important;
    right: 14px !important;
    transform: translateY(-50%) !important;
  }
}

@media (max-width: 360px) {
  #sec_1788238215484 {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  #sec_1788238215484 .news-bar-link {
    padding-left: 14px !important;
  }

  #sec_1788238215484 .news-title {
    font-size: 14px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #sec_1788238215484 .news-bar-link,
  #sec_1788238215484 .news-arrow {
    transition: none !important;
  }
}

/* Block: custom_html / sec_1788238266831 */
/* =========================================================
   【完全版】TOPページ カスタムHTMLブロック（sec_1788238266831）
   このファイルの中身が、このブロックのCSS欄の「すべて」です。
   欄の中身を全部消してから、これを貼り付けてください。
   bar Booty  2026-09-05
========================================================= */

/* ---- カスタムHTMLブロックの標準リセット（元から入っていたもの） ---- */
.custom-html-wrapper {padding: 0 !important; margin: 0 !important; max-width: none !important; background: transparent !important; color: inherit !important;}
.custom-html-inner {width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important;}
.custom-html-inner > *:first-child {margin-top: 0;}
.custom-html-inner > *:last-child {margin-bottom: 0;}
.custom-html-inner img,
.custom-html-inner video,
.custom-html-inner iframe {max-width: 100%;}


/* =========================================================
   TOPページ 修正まとめ（チェックバック対応）
   bar Booty  2026-09-04
   置き場所：TOPページのいずれかのブロックの「ブロック個別CSS」欄の末尾
             （1か所にまとめて貼ればOK。おすすめは店舗概要ブロック）
========================================================= */

/* ---- 1) MV右側の隙間 ---------------------------------------------------
   原因：ひとつの擬似要素（::after）に2つの役割が重なっています。
     ・style.css の .hero-wrapper::after … 全面にかける暗幕（inset: 0）
     ・TOPのブロックCSS #sec_1782110119323::after … 「SCROLL DOWN」の縦書きラベル
       （right: clamp(14px,2vw,30px) / bottom: 34px）
   擬似要素は1つしかないため両方が合成され、暗幕の箱が
   「右28px・下34pxだけ足りない大きな四角」になって隙間に見えていました。

   対処：::after は SCROLL DOWN ラベル専用にして、暗幕を外します。
   （MVの暗さは各スライドの .hero-slide::after が受け持っているので変わりません） */
#sec_1782110119323::after{
  top: auto !important;
  left: auto !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
}

/* ---- 2) 店舗概要の文字サイズ（15px → 16px） --------------------------- */
#sec_1785931790498 .store-info-table th,
#sec_1785931790498 .store-info-table td{
  font-size: 16px !important;
  line-height: 1.95 !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;  /* 指示書：明朝体 */
}
@media (max-width: 900px){
  #sec_1785931790498 .store-info-table th,
  #sec_1785931790498 .store-info-table td{ font-size: 16px !important; }
}

/* ---- 3) GALLERYの背景が粗い問題 ---------------------------------------
   PC：cover 指定で画面幅いっぱいまで約3倍に引き伸ばされていたのが原因。
   スマホ：拡大は直っても、タイルが1倍サイズのままだと
           Retina（2〜3倍密度）の画面で1ドットが2〜3ドットに引き伸ばされ、
           まだ少しにじんで見えます。→ 2倍サイズのタイルに差し替えます。 */
#sec_1788238305680.image-grid-section{
  --fc-bg-overlay: rgba(0,0,0,0);
  /* ▼ 2倍サイズのタイル（bg_gold_pattern@2x.webp／1280×852）を
     デザイン設定の背景画像に指定したうえで、表示は640px幅に縮めます。
     こうするとスマホ（Retina）でも1ドットずつ描かれ、にじみません。
     1倍のタイル（640×426）のままなら、この行を auto に戻してください。 */
  background-size: 640px auto !important;
  background-repeat: repeat !important;   /* 柄として敷き詰める */
  background-position: center top !important;
  background-color: #c8a05c !important;
}
@media (min-width: 901px){
  #sec_1788238305680.image-grid-section{ background-attachment: fixed !important; }
}

/* ---- 4) 改行位置（当店のご案内／CONCEPT／SYSTEM／RECRUIT） --------------
   現在は禁則処理だけが効いている状態です。
   文節で折り返す指定と、端数1文字の行を作らない指定を足します。 */
.booty-intro__body p,
.booty-feature__body p,
.booty-access-cta p,
.booty-top-content p:not(.booty-kicker):not(.booty-feature__number){
  word-break: auto-phrase !important;   /* 文節で折り返す */
  line-break: strict !important;        /* 禁則処理 */
  text-wrap: pretty !important;         /* 最終行が1〜2文字にならないようにする */
}
/* 見出しは単語の途中で折らない */
.booty-intro__body h2,
.booty-feature__body h2,
.booty-feature__body h3,
.booty-access-cta h2{
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

/* ---- 5) 中央揃えの英字ラベルが少し左右にズレる問題 ----------------------
   字間（letter-spacing）は最後の1文字の後ろにも入るため、
   中央揃えだとその分だけ文字が寄ります。半分を戻して中央に合わせます。 */
.fc-instagram-embed-label,
.booty-access-cta__label{
  text-indent: .15em !important;
}

/* ---- 6) 追従バーの色をフッターに合わせる -------------------------------
   バーだけ赤にすると、上のフッター（ローズ系）から色が急に変わって浮きます。
   フッターと完全に同じ配色（#70414d → #9a5d68 → #bf7d84）にそろえています。 */
.fc-floating-actions{
  background:
    radial-gradient(circle at 18% 0%, rgba(255, 228, 190, .34), transparent 36%),
    linear-gradient(145deg, #70414d 0%, #9a5d68 58%, #bf7d84 100%) !important;
}

/* Instagramボタンだけ、指示書のポイントカラー（赤）のままにしています。
   バーの色に馴染ませたい場合は、下の1行を
   linear-gradient(135deg, #b23d56, #7d3549) に戻してください。 */
.fc-floating-instagram{
  background: linear-gradient(135deg, #c03a44, #8d232b) !important;
  border: 1px solid rgba(255, 229, 186, .62) !important;
}

/* ---- 7) 「当店のご案内」の2段落目を2行に収める（2026-09-05 追加） -------
   文章側の列が493pxしかなく、
   「ゆっくりとした二次会まで、思い思いの時間を過ごしていただけます。」（532px必要）
   が収まらずに3行になっていました。左右の列を同じ幅にして余白を詰めます。
   ※ 列幅を広げるだけだと、今度は1行目が「…ゆっくりと」まで伸びて
     「ゆっくりと／した」で割れるため、原稿側に改行を1つ入れる必要があります
     （下の .br-pc と、HTMLの追記をセットで使ってください）。 */
/* ★PC・タブレットのみ。901px未満はTOP側の1カラム指定をそのまま使います。
   （メディアクエリを付けないと、スマホでも2カラムのままになり
     右側にはみ出して文字が切れます） */
@media (min-width: 901px){
  .booty-intro{
    grid-template-columns: minmax(0, 1fr) minmax(360px, 1fr) !important;
    gap: clamp(34px, 4.6vw, 72px) !important;
  }
}

/* PC・タブレットだけ有効になる改行。スマホでは無視されます */
.br-pc{ display: inline; }
@media (max-width: 900px){
  .br-pc{ display: none; }
}

/* ---- 8) Instagramセクションの背景を拡大しない（2026-09-05 追加） -------
   このブロックは「デザイン設定の背景画像」を、ブロック自身が
   <style id="bg-fc-instagram-embed-○○">#fc-instagram-embed-○○{ … cover … }</style>
   という形（ID指定・!important）で body 内に書き出します。
   ID指定にはクラス指定では勝てないため、次のどちらかで対応してください。

   【推奨】デザイン設定の「背景画像」を空にして、下のCSSで直接指定する
           （IDに依存しないので、InstagramのURLを変えても崩れません）        */
section.fc-instagram-embed-section{
  background-image: url("/image/assets/asset_20260901172722_6a968c6a55b9f.webp") !important;
  background-size: auto !important;          /* 原寸のまま＝拡大しない */
  background-repeat: no-repeat !important;   /* 1枚だけ置く（柄ではないため） */
  background-position: center top !important;
  background-color: #161e2a !important;      /* 画像の端と同じ色。左右の余白がなじみます */
}

/* 【簡易】デザイン設定の背景画像を残したまま直す場合は、こちらを使ってください。
   ※ InstagramのURLを変更するとIDが変わるので、その都度差し替えが必要です。
section#fc-instagram-embed-ff948a7d{
  background-size: auto !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-color: #161e2a !important;
}
*/

/* Block: image_grid / sec_1788238305680 */
/* =========================================================
   bar Booty / TOP 画像グリッド追加CSS
   貼り付け先: TOPページ > 画像グリッドブロック > セクション個別CSS
   対象ブロックID: sec_1788238305680
   既存のPC4列・スマホ2列・管理画面画像設定をそのまま使用

   背景画像URLはCSSへ書きません。
   管理画面で指定した背景画像を、暗幕・ズームなしで表示します。
========================================================= */

#sec_1788238305680 {
  --fc-bg-overlay: rgba(0, 0, 0, 0) !important;
  --booty-gallery-bg: #111817;
  --booty-gallery-cream: #fff7e8;
  --booty-gallery-gold: #d9b666;
  --booty-gallery-gold-light: #f4d995;
  --booty-gallery-red: #a92d35;
  position: relative !important;
  padding: clamp(72px, 8vw, 118px) 22px clamp(88px, 10vw, 142px) !important;
  overflow: hidden !important;

  /* 画像URLは管理画面側の出力を維持 */
  background-color: var(--booty-gallery-bg) !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-attachment: scroll !important;
}

/* 背景の格子・暗幕・色被せを作らない */
#sec_1788238305680::before {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
}

#sec_1788238305680 .image-grid-container {
  position: relative !important;
  z-index: 1 !important;
  width: min(100%, 1180px) !important;
  margin: 0 auto !important;
  padding-top: clamp(76px, 8vw, 108px) !important;
}

/* HTMLを追加せず、CSSだけでGALLERY見出しを表示 */
#sec_1788238305680 .image-grid-container::before {
  content: "GALLERY" !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  color: var(--booty-gallery-cream) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(34px, 4.5vw, 54px) !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: .16em !important;
  white-space: nowrap !important;
  text-shadow: 0 3px 18px rgba(0, 0, 0, .45) !important;
}

#sec_1788238305680 .image-grid-container::after {
  content: "" !important;
  position: absolute !important;
  top: clamp(54px, 5.7vw, 70px) !important;
  left: 50% !important;
  width: 82px !important;
  height: 2px !important;
  transform: translateX(-50%) !important;
  background: linear-gradient(90deg,
    transparent,
    var(--booty-gallery-red) 22%,
    var(--booty-gallery-gold) 78%,
    transparent) !important;
}

#sec_1788238305680 .image-grid {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: clamp(12px, 1.5vw, 20px) !important;
}

#sec_1788238305680 .image-grid-item {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  margin: 0 !important;
  overflow: hidden !important;
  background-color: #241916 !important;
  border: 1px solid rgba(217, 182, 102, .48) !important;
  border-radius: 0 !important;
  box-shadow: 12px 14px 0 rgba(0, 0, 0, .2) !important;
  isolation: isolate !important;
}

#sec_1788238305680 .image-grid-item:nth-child(even) {
  margin-top: 28px !important;
}

#sec_1788238305680 .image-grid-item::before {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
}

#sec_1788238305680 .image-grid-item::after {
  position: absolute !important;
  right: 14px !important;
  bottom: 12px !important;
  z-index: 2 !important;
  color: var(--booty-gallery-gold-light) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .12em !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .8) !important;
}

#sec_1788238305680 .image-grid-item:nth-child(1)::after {
  content: "01" !important;
}

#sec_1788238305680 .image-grid-item:nth-child(2)::after {
  content: "02" !important;
}

#sec_1788238305680 .image-grid-item:nth-child(3)::after {
  content: "03" !important;
}

#sec_1788238305680 .image-grid-item:nth-child(4)::after {
  content: "04" !important;
}

#sec_1788238305680 .image-grid-item img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center center !important;
  filter: none !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

#sec_1788238305680 .image-grid-item:nth-child(3) img {
  object-position: center 42% !important;
}

#sec_1788238305680 .image-grid-item:hover img {
  filter: none !important;
  transform: none !important;
}

@media (max-width: 768px) {
  #sec_1788238305680 {
    padding: 64px 16px 104px !important;
  }

  #sec_1788238305680 .image-grid-container {
    padding-top: 74px !important;
  }

  #sec_1788238305680 .image-grid-container::before {
    font-size: clamp(32px, 10vw, 42px) !important;
    letter-spacing: .12em !important;
  }

  #sec_1788238305680 .image-grid-container::after {
    top: 50px !important;
  }

  #sec_1788238305680 .image-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  #sec_1788238305680 .image-grid-item {
    box-shadow: 6px 8px 0 rgba(0, 0, 0, .2) !important;
  }

  #sec_1788238305680 .image-grid-item:nth-child(even) {
    margin-top: 18px !important;
  }

  #sec_1788238305680 .image-grid-item::after {
    right: 10px !important;
    bottom: 9px !important;
    font-size: 14px !important;
  }
}

@media (max-width: 360px) {
  #sec_1788238305680 {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  #sec_1788238305680 .image-grid {
    gap: 8px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #sec_1788238305680 .image-grid-item img {
    transition: none !important;
  }

  #sec_1788238305680 .image-grid-item:hover img {
    transform: none !important;
  }
}

/* ---- 3) GALLERYの背景が粗い問題 ---------------------------------------
   背景に使われているのは 640×426 の金色タイルです。
   cover 指定で画面幅いっぱいまで約3倍に引き伸ばされていたため粗く見えていました。
   タイルは繰り返し用なので、拡大せず並べる指定に変更します。 */
#sec_1788238305680.image-grid-section{
  --fc-bg-overlay: rgba(0,0,0,0);
  background-size: auto !important;       /* 原寸のまま＝拡大しない */
  background-repeat: repeat !important;   /* 柄として敷き詰める */
  background-position: center top !important;
  background-color: #c8a05c !important;
}
@media (min-width: 901px){
  #sec_1788238305680.image-grid-section{ background-attachment: fixed !important; }
}

/* Block: instagram_feed / sec_1788238365230 */
/* =========================================================
   bar Booty / TOP Instagramブロック追加CSS
   貼り付け先: TOPページ > Instagram埋め込みブロック > セクション個別CSS
   対象: Instagram埋め込みブロック共通クラス（URL変更でIDが変わっても有効）

   重要:
   background-imageはここでは指定しません。
   管理画面で指定した背景画像の出力をそのまま使用します。
   背景のズーム・オーバーレイ・グラデーションは使用しません。
========================================================= */

section.fc-instagram-embed-section {
  /* CMSが自動生成する背景画像の暗幕色だけを完全透明にする */
  --fc-bg-overlay: rgba(0, 0, 0, 0) !important;
  --booty-insta-cream: #fff7e8;
  --booty-insta-gold: #d9b666;
  --booty-insta-gold-light: #f4d995;
  --booty-insta-red: #a92d35;
  --booty-insta-ink: #271a16;
  position: relative !important;
  padding: clamp(74px, 8vw, 112px) 22px !important;
  overflow: hidden !important;
  color: var(--booty-insta-cream) !important;

  /* 画像URLは管理画面側の指定を維持 */
  background-color: #111817 !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-attachment: scroll !important;

  /* 背景を拡大・移動させない */
  transform: none !important;
  animation: none !important;
}

/* 暗幕・色被せ・グラデーションを作らない */
section.fc-instagram-embed-section::before,
section.fc-instagram-embed-section::after {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
}

/* 管理画面の背景機能が背景用要素を出力する場合も、加工せずそのまま表示 */
section.fc-instagram-embed-section > [style*="background-image"] {
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  filter: none !important;
  transform: none !important;
  animation: none !important;
}

section.fc-instagram-embed-section > .fc-section-overlay,
section.fc-instagram-embed-section > .section-overlay,
section.fc-instagram-embed-section > [class*="background-overlay"],
section.fc-instagram-embed-section > [class*="bg-overlay"] {
  display: none !important;
  background: none !important;
  opacity: 0 !important;
}

section.fc-instagram-embed-section .fc-instagram-embed-inner {
  position: relative !important;
  z-index: 1 !important;
  width: min(100%, 1080px) !important;
  max-width: 1080px !important;
  margin: 0 auto !important;
  text-align: center !important;
}

section.fc-instagram-embed-section .fc-instagram-embed-heading {
  margin: 0 0 clamp(30px, 4vw, 46px) !important;
}

section.fc-instagram-embed-section .fc-instagram-embed-label {
  margin: 0 0 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--booty-insta-gold-light) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .2em !important;
  white-space: nowrap !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .82) !important;
}

section.fc-instagram-embed-section .fc-instagram-embed-heading h2 {
  margin: 0 0 14px !important;
  color: var(--booty-insta-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: clamp(34px, 4.6vw, 54px) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  letter-spacing: .1em !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  text-shadow:
    0 3px 14px rgba(0, 0, 0, .86),
    0 1px 2px rgba(0, 0, 0, .9) !important;
}

section.fc-instagram-embed-section .fc-instagram-embed-heading p {
  max-width: 680px !important;
  margin: 0 auto !important;
  color: var(--booty-insta-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.9 !important;
  letter-spacing: .04em !important;
  word-break: normal !important;
  line-break: strict !important;
  overflow-wrap: anywhere !important;
  text-shadow:
    0 2px 10px rgba(0, 0, 0, .92),
    0 1px 2px rgba(0, 0, 0, .9) !important;
}

/* Instagram本体にはズーム・色加工を加えない */
section.fc-instagram-embed-section .fc-instagram-embed-card,
section.fc-instagram-embed-section .fc-instagram-embed-card--legacy,
section.fc-instagram-embed-section .instagram-media,
section.fc-instagram-embed-section blockquote,
section.fc-instagram-embed-section img {
  filter: none !important;
  animation: none !important;
}

section.fc-instagram-embed-section .fc-instagram-embed-card--legacy {
  width: min(100%, 900px) !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

section.fc-instagram-embed-section .fc-instagram-embed-card--legacy .instagram-media,
section.fc-instagram-embed-section .fc-instagram-embed-card--legacy iframe,
section.fc-instagram-embed-section .fc-instagram-embed-card--legacy blockquote {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 900px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

section.fc-instagram-embed-section .fc-instagram-embed-action {
  margin-top: 30px !important;
}

section.fc-instagram-embed-section .fc-instagram-embed-action a {
  min-width: 240px !important;
  min-height: 54px !important;
  padding: 12px 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--booty-insta-ink) !important;
  background-color: var(--booty-insta-gold-light) !important;
  border: 1px solid #f7dfa0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: var(--font-serif) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .08em !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transform: none !important;
  transition: color .25s ease, background-color .25s ease !important;
}

section.fc-instagram-embed-section .fc-instagram-embed-action a:hover {
  color: #fff !important;
  background-color: var(--booty-insta-red) !important;
  border-color: #ca6269 !important;
  transform: none !important;
  opacity: 1 !important;
}

@media (max-width: 768px) {
  section.fc-instagram-embed-section {
    padding: 64px 16px 96px !important;
    background-position: center center !important;
    background-size: cover !important;
  }

  section.fc-instagram-embed-section .fc-instagram-embed-heading {
    margin-bottom: 28px !important;
  }

  section.fc-instagram-embed-section .fc-instagram-embed-heading h2 {
    font-size: clamp(32px, 10vw, 42px) !important;
    letter-spacing: .07em !important;
  }

  section.fc-instagram-embed-section .fc-instagram-embed-heading p {
    font-size: 15px !important;
    line-height: 1.9 !important;
  }

  section.fc-instagram-embed-section .fc-instagram-embed-card,
  section.fc-instagram-embed-section .fc-instagram-embed-card--legacy {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  section.fc-instagram-embed-section .fc-instagram-embed-action a {
    width: 100% !important;
    max-width: 320px !important;
    min-height: 56px !important;
    font-size: 15px !important;
  }
}

@media (max-width: 360px) {
  section.fc-instagram-embed-section {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  section.fc-instagram-embed-section .fc-instagram-embed-heading p,
  section.fc-instagram-embed-section .fc-instagram-embed-action a {
    font-size: 14px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  section.fc-instagram-embed-section,
  section.fc-instagram-embed-section *,
  section.fc-instagram-embed-section *::before,
  section.fc-instagram-embed-section *::after {
    animation: none !important;
    transition: none !important;
  }
}
section.fc-instagram-embed-section{
  background-image: url("") !important;
  background-size: auto !important;          /* 拡大しない */
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-color: #161e2a !important;      /* 画像の端と同じ色 */
}

/* Block: store_info / sec_1785931790498 */
/* =========================================================
   bar Booty / TOP 店舗案内ブロック追加CSS
   貼り付け先: TOPページ > 店舗概要ブロック > セクション個別CSS
   対象: 既存の store-info ブロック（PHP・HTML変更なし）

   背景画像URLはCSSへ書きません。
   管理画面「デザイン設定 > 背景画像」の指定をそのまま使用します。
========================================================= */

section.store-info-section {
  --booty-shop-cream: #fff7e8;
  --booty-shop-paper: rgba(255, 247, 232, .94);
  --booty-shop-ink: #2b1d19;
  --booty-shop-muted: #725e55;
  --booty-shop-gold: #c89b45;
  --booty-shop-gold-light: #efd18a;
  --booty-shop-red: #9f3841;
  position: relative !important;
  padding: clamp(80px, 9vw, 126px) 22px !important;
  overflow: hidden !important;
  isolation: isolate !important;
  color: var(--booty-shop-cream) !important;

  /* 画像URLは管理画面側の出力を維持 */
  background-color: #8c5c63 !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-attachment: scroll !important;
}

/* ブロック既定の暗幕を使わず、管理画面画像をそのまま表示 */
section.store-info-section::before,
section.store-info-section::after {
  content: none !important;
  display: none !important;
}

section.store-info-section > .fc-section-overlay,
section.store-info-section > .section-overlay,
section.store-info-section > [class*="background-overlay"],
section.store-info-section > [class*="bg-overlay"] {
  display: none !important;
  opacity: 0 !important;
}

section.store-info-section .store-info-container {
  position: relative !important;
  z-index: 1 !important;
  width: min(100%, 1080px) !important;
  max-width: 1080px !important;
  margin: 0 auto !important;
}

section.store-info-section .store-info-header {
  max-width: 760px !important;
  margin: 0 auto clamp(30px, 4vw, 46px) !important;
  text-align: center !important;
}

section.store-info-section .store-info-header::before {
  content: "SHOP INFORMATION" !important;
  display: block !important;
  margin-bottom: 12px !important;
  color: var(--booty-shop-gold-light) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .18em !important;
  white-space: nowrap !important;
  text-shadow: 0 2px 10px rgba(24, 12, 10, .72) !important;
}

section.store-info-section .store-info-title {
  margin: 0 0 14px !important;
  color: var(--booty-shop-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: clamp(32px, 4.5vw, 52px) !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  letter-spacing: .1em !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  text-shadow: 0 3px 16px rgba(30, 13, 12, .76) !important;
}

section.store-info-section .store-info-desc {
  max-width: 680px !important;
  margin: 0 auto !important;
  color: var(--booty-shop-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.95 !important;
  letter-spacing: .035em !important;
  word-break: normal !important;
  line-break: strict !important;
  overflow-wrap: anywhere !important;
  text-wrap: pretty !important;
  text-shadow: 0 2px 10px rgba(30, 13, 12, .8) !important;
}

section.store-info-section .store-info-layout {
  width: 100% !important;
  gap: clamp(24px, 4vw, 44px) !important;
  align-items: center !important;
}

section.store-info-section .store-info-table-wrap {
  position: relative !important;
  width: 100% !important;
  padding: 18px clamp(26px, 4vw, 54px) 22px !important;
  overflow: hidden !important;
  background-color: var(--booty-shop-paper) !important;
  border: 1px solid rgba(255, 229, 165, .9) !important;
  border-radius: 2px !important;
  box-shadow: 18px 22px 0 rgba(73, 32, 34, .22), 0 26px 70px rgba(40, 17, 17, .28) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
}

section.store-info-section .store-info-table-wrap::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 7px !important;
  height: 100% !important;
  background-color: var(--booty-shop-red) !important;
}

section.store-info-section .store-info-table {
  width: 100% !important;
  table-layout: fixed !important;
  border-collapse: collapse !important;
}

/* TOPで必要な5項目を、指示書どおりの順番で表示 */
section.store-info-section .store-info-table tbody {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

section.store-info-section .store-info-table tr {
  display: grid !important;
  grid-template-columns: 150px minmax(0, 1fr) !important;
  align-items: start !important;
  border-bottom: 1px solid rgba(84, 58, 48, .18) !important;
}

section.store-info-section .store-info-table tr:nth-child(1) { order: 1 !important; } /* 店名 */
section.store-info-section .store-info-table tr:nth-child(2) { order: 2 !important; } /* 住所 */
section.store-info-section .store-info-table tr:nth-child(7) { order: 3 !important; } /* アクセス */
section.store-info-section .store-info-table tr:nth-child(3) { order: 4 !important; } /* 営業時間 */
section.store-info-section .store-info-table tr:nth-child(4) { order: 5 !important; } /* 定休日 */

/* TOPでは非表示。基本情報は消さないため、ACCESSページには影響しません。 */
section.store-info-section .store-info-table tr:nth-child(5),
section.store-info-section .store-info-table tr:nth-child(6) {
  display: none !important; /* 座席数・駐車場 */
}

/* アクセスはHTML上の最終行なので、並び替え後も営業時間との間に線を残す */
section.store-info-section .store-info-table tr:last-child {
  border-bottom: 1px solid rgba(84, 58, 48, .18) !important;
}

section.store-info-section .store-info-table th,
section.store-info-section .store-info-table td {
  padding: 18px 0 !important;
  border: 0 !important;
  font-family: var(--font-serif) !important;
  font-size: 15px !important;
  line-height: 1.85 !important;
  letter-spacing: .025em !important;
  text-align: left !important;
  vertical-align: top !important;
  word-break: normal !important;
  line-break: strict !important;
  overflow-wrap: anywhere !important;
}

section.store-info-section .store-info-table th {
  width: 150px !important;
  padding-right: 26px !important;
  color: var(--booty-shop-red) !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}

section.store-info-section .store-info-table td {
  color: var(--booty-shop-ink) !important;
  font-weight: 600 !important;
}

section.store-info-section .store-info-image img {
  width: 100% !important;
  display: block !important;
  border: 1px solid rgba(255, 229, 165, .76) !important;
  border-radius: 2px !important;
  box-shadow: 14px 18px 0 rgba(73, 32, 34, .2) !important;
}

@media (max-width: 768px) {
  section.store-info-section {
    padding: 64px 16px 78px !important;
    background-position: center center !important;
  }

  section.store-info-section .store-info-header {
    margin-bottom: 28px !important;
  }

  section.store-info-section .store-info-title {
    font-size: clamp(30px, 9.5vw, 40px) !important;
    letter-spacing: .07em !important;
  }

  section.store-info-section .store-info-desc {
    font-size: 15px !important;
    line-height: 1.9 !important;
  }

  section.store-info-section .store-info-table-wrap {
    padding: 8px 22px 12px 26px !important;
    box-shadow: 8px 10px 0 rgba(73, 32, 34, .2), 0 18px 44px rgba(40, 17, 17, .24) !important;
  }

  section.store-info-section .store-info-table,
  section.store-info-section .store-info-table tr,
  section.store-info-section .store-info-table th,
  section.store-info-section .store-info-table td {
    display: block !important;
    width: 100% !important;
  }

  section.store-info-section .store-info-table tr {
    grid-template-columns: minmax(0, 1fr) !important;
    padding: 14px 0 !important;
  }

  section.store-info-section .store-info-table th {
    padding: 0 0 4px !important;
    font-size: 14px !important;
    white-space: normal !important;
  }

  section.store-info-section .store-info-table td {
    padding: 0 !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
  }
}

@media (max-width: 360px) {
  section.store-info-section {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  section.store-info-section .store-info-table-wrap {
    padding-right: 16px !important;
    padding-left: 20px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  section.store-info-section,
  section.store-info-section * {
    animation: none !important;
    transition: none !important;
  }
}

/* Block: custom_html / sec_1788238395644 */
/* =========================================================
   bar Booty / TOP 最下部 ACCESS・お問い合わせ導線CSS
   貼り付け先: Googleマップ直後のカスタムHTMLブロック > セクション個別CSS
   対象: .booty-access-cta（PHP変更なし）
========================================================= */

.booty-access-cta,
.booty-access-cta * {
  box-sizing: border-box !important;
}

.booty-access-cta {
  --booty-cta-cream: #fff7e8;
  --booty-cta-ink: #2d1e1a;
  --booty-cta-gold: #d8ad58;
  --booty-cta-gold-light: #f3d893;
  --booty-cta-red: #9f3841;
  position: relative !important;
  width: 100% !important;
  padding: clamp(76px, 8vw, 108px) 22px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 12% 20%, rgba(255, 239, 203, .24), transparent 30%),
    radial-gradient(circle at 88% 76%, rgba(120, 37, 47, .24), transparent 34%),
    linear-gradient(135deg, #b47a7d 0%, #a66770 48%, #8c515d 100%) !important;
  color: var(--booty-cta-cream) !important;
}

.booty-access-cta::before {
  content: "" !important;
  position: absolute !important;
  inset: 14px !important;
  border: 1px solid rgba(255, 238, 198, .36) !important;
  pointer-events: none !important;
}

.booty-access-cta::after {
  content: "Booty" !important;
  position: absolute !important;
  right: clamp(16px, 5vw, 72px) !important;
  bottom: -22px !important;
  color: rgba(255, 247, 232, .09) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(78px, 15vw, 190px) !important;
  font-style: italic !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  pointer-events: none !important;
}

.booty-access-cta__inner {
  position: relative !important;
  z-index: 1 !important;
  width: min(100%, 980px) !important;
  margin: 0 auto !important;
  text-align: center !important;
}

.booty-access-cta__label {
  margin: 0 0 14px !important;
  color: var(--booty-cta-gold-light) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .2em !important;
  white-space: nowrap !important;
}

.booty-access-cta__title {
  margin: 0 !important;
  color: var(--booty-cta-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: clamp(32px, 4.6vw, 52px) !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;
  letter-spacing: .08em !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  text-shadow: 0 3px 16px rgba(69, 27, 31, .35) !important;
}

.booty-access-cta__text {
  max-width: 680px !important;
  margin: 22px auto 0 !important;
  color: var(--booty-cta-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 2 !important;
  letter-spacing: .035em !important;
  word-break: normal !important;
  line-break: strict !important;
  overflow-wrap: anywhere !important;
  text-wrap: pretty !important;
}

.booty-access-cta__actions {
  margin-top: clamp(30px, 4vw, 42px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
}

.booty-access-cta__button {
  width: min(100%, 280px) !important;
  min-height: 56px !important;
  padding: 13px 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  border: 1px solid var(--booty-cta-gold-light) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: var(--font-serif) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .07em !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: color .25s ease, background-color .25s ease, border-color .25s ease !important;
}

.booty-access-cta__button--primary {
  color: var(--booty-cta-ink) !important;
  background-color: var(--booty-cta-gold-light) !important;
}

.booty-access-cta__button--outline {
  color: var(--booty-cta-cream) !important;
  background-color: rgba(103, 43, 50, .16) !important;
}

.booty-access-cta__button:hover {
  color: #fff !important;
  background-color: var(--booty-cta-red) !important;
  border-color: var(--booty-cta-red) !important;
  opacity: 1 !important;
}

.booty-access-cta__arrow {
  font-size: 18px !important;
  line-height: 1 !important;
}

@media (max-width: 768px) {
  .booty-access-cta {
    padding: 62px 16px 90px !important;
  }

  .booty-access-cta::before {
    inset: 9px !important;
  }

  .booty-access-cta__title {
    font-size: clamp(29px, 9.5vw, 40px) !important;
    letter-spacing: .055em !important;
  }

  .booty-access-cta__pc-break {
    display: none !important;
  }

  .booty-access-cta__text {
    margin-top: 18px !important;
    font-size: 15px !important;
    line-height: 1.9 !important;
  }

  .booty-access-cta__text br {
    display: none !important;
  }

  .booty-access-cta__actions {
    margin-top: 28px !important;
    flex-direction: column !important;
  }

  .booty-access-cta__button {
    width: 100% !important;
    max-width: 330px !important;
    min-height: 58px !important;
    font-size: 15px !important;
  }
}

@media (max-width: 360px) {
  .booty-access-cta {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  .booty-access-cta__label,
  .booty-access-cta__text,
  .booty-access-cta__button {
    font-size: 14px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .booty-access-cta,
  .booty-access-cta * {
    animation: none !important;
    transition: none !important;
  }
}

/* Block: gmap / sec_1788238377544 */
/* =========================================================
   bar Booty / TOP Googleマップブロック追加CSS
   貼り付け先: TOPページ > Googleマップブロック > セクション個別CSS
   対象: 既存の gmap ブロック（PHP・HTML変更なし）
========================================================= */

section.gmap-section {
  --booty-map-bg: #fff3df;
  --booty-map-ink: #31211d;
  --booty-map-muted: #755e54;
  --booty-map-gold: #c89b45;
  --booty-map-red: #9f3841;
  position: relative !important;
  padding: clamp(74px, 8vw, 112px) 22px clamp(84px, 9vw, 126px) !important;
  overflow: hidden !important;
  background:
    linear-gradient(90deg, rgba(159, 56, 65, .055) 1px, transparent 1px),
    linear-gradient(0deg, rgba(159, 56, 65, .04) 1px, transparent 1px),
    var(--booty-map-bg) !important;
  background-size: 72px 72px, 72px 72px, auto !important;
  color: var(--booty-map-ink) !important;
}

section.gmap-section .gmap-container {
  position: relative !important;
  z-index: 1 !important;
  width: min(100%, 1080px) !important;
  max-width: 1080px !important;
  margin: 0 auto !important;
}

section.gmap-section .gmap-header {
  max-width: 760px !important;
  margin: 0 auto clamp(28px, 4vw, 42px) !important;
  text-align: center !important;
}

section.gmap-section .gmap-header::before {
  content: "ACCESS MAP" !important;
  display: block !important;
  margin-bottom: 12px !important;
  color: var(--booty-map-red) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .2em !important;
  white-space: nowrap !important;
}

section.gmap-section .gmap-title {
  margin: 0 0 14px !important;
  color: var(--booty-map-ink) !important;
  font-family: var(--font-serif) !important;
  font-size: clamp(30px, 4vw, 46px) !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  letter-spacing: .1em !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
}

section.gmap-section .gmap-desc {
  margin: 0 !important;
  color: var(--booty-map-muted) !important;
  font-family: var(--font-serif) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.9 !important;
  letter-spacing: .035em !important;
  word-break: normal !important;
  line-break: strict !important;
  overflow-wrap: anywhere !important;
  text-wrap: pretty !important;
}

section.gmap-section .gmap-frame-wrap {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 16 / 8.5 !important;
  min-height: 380px !important;
  overflow: hidden !important;
  background-color: #e8dac5 !important;
  border: 1px solid rgba(159, 56, 65, .36) !important;
  border-radius: 2px !important;
  box-shadow: 16px 18px 0 rgba(159, 56, 65, .13), 0 24px 60px rgba(76, 47, 37, .18) !important;
}

section.gmap-section .gmap-frame-wrap::before {
  content: "" !important;
  position: absolute !important;
  inset: 10px !important;
  z-index: 2 !important;
  border: 1px solid rgba(255, 247, 232, .72) !important;
  pointer-events: none !important;
}

section.gmap-section .gmap-frame-wrap iframe {
  width: 100% !important;
  height: 100% !important;
  min-height: 380px !important;
  display: block !important;
  border: 0 !important;
  filter: none !important;
  transform: none !important;
}

@media (max-width: 768px) {
  section.gmap-section {
    padding: 62px 16px 84px !important;
    background-size: 44px 44px, 44px 44px, auto !important;
  }

  section.gmap-section .gmap-header {
    margin-bottom: 26px !important;
  }

  section.gmap-section .gmap-title {
    font-size: clamp(29px, 9vw, 38px) !important;
    letter-spacing: .07em !important;
  }

  section.gmap-section .gmap-desc {
    font-size: 15px !important;
    line-height: 1.9 !important;
  }

  section.gmap-section .gmap-frame-wrap {
    aspect-ratio: 4 / 3 !important;
    min-height: 300px !important;
    box-shadow: 8px 10px 0 rgba(159, 56, 65, .12), 0 16px 38px rgba(76, 47, 37, .16) !important;
  }

  section.gmap-section .gmap-frame-wrap iframe {
    min-height: 300px !important;
  }
}

@media (max-width: 360px) {
  section.gmap-section {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  section.gmap-section,
  section.gmap-section * {
    animation: none !important;
    transition: none !important;
  }
}


/* =========================================================
   Page: courses / bar Booty（バーブーティー）｜静内・新ひだか町のバー｜静内駅徒歩7分｜SYSTEM
========================================================= */

/* Block: hero_page / sec_1788238453147 */
.page-hero-wrapper {
  position: relative;
  min-height: 360px;
  padding: 150px 20px 90px;
  text-align: center;
  color: var(--text-main);
  background-size: cover;
  background-position: center;
}
.page-hero-wrapper::after, .ph-overlay {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(16,23,24,.82), rgba(31,47,48,.46));
}
.ph-container { position: relative; z-index: 1; max-width: 820px; margin: 0 auto; }
.ph-title { font-family: var(--font-serif); font-size: clamp(2rem, 5vw, 3.4rem); color: var(--gold-light); letter-spacing: .16em; }
.ph-desc { margin-top: 16px; color: var(--text-sub); font-size: 14px; line-height: 2; }
/* =========================================================
   共通ヒーロー（hero_page ブロック / .page-hero-wrapper）
   bar Booty  ver.1  2026-09-01
   置き場所：ダッシュボード → 共通CSS編集（style.css）の末尾に1回だけ
   ※ このCSSだけで、下層ページ全部の hero_page ブロックに効きます
========================================================= */

/* ---- 0) サイト共通の文字色（ここを変えると下層ページ全体の文字色が変わります） ---- */
:root{
  --fc-title: #fff7ea;                 /* 見出しの色（TOPページと同じ白） */
  --fc-body:  #fff7ea;                 /* 本文の色 */
  --fc-muted: rgba(255,247,232,.66);   /* 補足・表の項目名など、少し弱める文字 */
  --fc-label: #f4d995;                 /* 英字ラベルだけゴールド（TOPのキッカーと同色） */
}

/* ---- 1) 調整用の変数（数値の変更はここだけでOK） ---- */
.page-hero-wrapper{
  --ph-min-pc: 460px;               /* PCの最低の高さ */
  --ph-header-pc: 78px;             /* 固定ヘッダーの高さ（PC） */
  --ph-veil-top:    rgba(10,7,5,.60);   /* 上の暗幕 */
  --ph-veil-mid:    rgba(10,7,5,.44);   /* 中央の暗幕（薄いほど写真が見える） */
  --ph-veil-bottom: rgba(10,7,5,.92);   /* 下の暗幕（次のセクションへの繋ぎ） */
  --ph-focus: rgba(6,4,3,.60);          /* 文字の後ろだけを落とす影（読みやすさ用） */
  --ph-glow: rgba(214,168,88,.20);      /* 全体にかける暖かいゴールドの色味 */
  --ph-en: "BAR BOOTY";                 /* 英字ラベルの初期値（ページ別に上書き） */
}

/* ---- 2) 土台 ---- */
.page-hero-wrapper{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--ph-min-pc);
  padding: calc(var(--ph-header-pc) + 62px) 24px 78px;
  margin: 0;
  overflow: hidden;
  isolation: isolate;
  text-align: center;
  color: var(--text-main, #fff7ea);
  background-color: #0d0b0a;        /* 画像が無い時／読込前の保険 */
  background-position: center 40%;
  background-size: cover;
  background-repeat: no-repeat;
}

/* ---- 3) 写真の上に重ねる色（暖色の暗幕＋中央の光＋四隅の締め） ---- */
.page-hero-wrapper .ph-overlay{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(66% 58% at 50% 48%, var(--ph-focus) 0%, rgba(0,0,0,0) 72%),
    linear-gradient(180deg, var(--ph-veil-top) 0%, var(--ph-veil-mid) 44%, var(--ph-veil-bottom) 100%),
    radial-gradient(135% 105% at 50% 46%, rgba(0,0,0,0) 38%, rgba(0,0,0,.55) 100%),
    radial-gradient(120% 82% at 50% 30%, var(--ph-glow) 0%, rgba(0,0,0,0) 68%);
}

/* 下端をページ背景色へ溶かす（切れ目を消してスクロールを促す） */
.page-hero-wrapper::before{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 130px;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(16,23,24,0) 0%, var(--bg-base, #101718) 100%);
}

/* スクロール誘導の細いゴールドの線 */
.page-hero-wrapper::after{
  content: "";
  position: absolute;
  left: 50%;
  margin-left: -1px;
  bottom: 24px;
  width: 2px;
  height: 52px;
  z-index: 3;
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(246,207,122,0) 0%, rgba(246,207,122,.95) 100%);
  box-shadow: 0 0 14px rgba(246,207,122,.45);
  animation: ph-scroll-line 2.6s cubic-bezier(.25,1,.5,1) infinite;
}
@keyframes ph-scroll-line{
  0%   { transform: scaleY(.15); transform-origin: top;    opacity: .25; }
  48%  { transform: scaleY(1);   transform-origin: top;    opacity: 1;   }
  52%  { transform: scaleY(1);   transform-origin: bottom; opacity: 1;   }
  100% { transform: scaleY(0);   transform-origin: bottom; opacity: .25; }
}

/* ---- 4) 文字まわり ---- */
.page-hero-wrapper .ph-container{
  position: relative;
  z-index: 4;
  max-width: 780px;
  margin: 0 auto;
  padding: 0;
}

/* 英字ラベル（CONCEPT など。ページ別に文字を差し替え） */
.page-hero-wrapper .ph-container::before{
  content: var(--ph-en);
  display: block;
  margin: 0 0 18px;
  font-family: var(--font-en, "Montserrat", sans-serif);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .34em;
  text-indent: .17em;               /* 字間の分だけ左にズレるのを中央へ戻す */
  color: var(--fc-label, #f4d995);
  text-shadow: 0 1px 14px rgba(0,0,0,.7);
  opacity: .95;
  white-space: nowrap;
}

.page-hero-wrapper .ph-title{
  margin: 0;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: clamp(28px, 4.4vw, 46px);
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: .14em;
  text-indent: .07em;
  color: var(--fc-title, #fff7ea);
  text-shadow: 0 2px 18px rgba(0,0,0,.75), 0 0 46px rgba(0,0,0,.5);
  /* 改行の暴れ止め：単語の途中で折らない／禁則処理／端数1文字の行を作らない */
  word-break: keep-all;
  line-break: strict;
  text-wrap: balance;
}

/* タイトル下の細い飾り線 */
.page-hero-wrapper .ph-title::after{
  content: "";
  display: block;
  width: 54px;
  height: 1px;
  margin: 22px auto 0;
  background: linear-gradient(90deg, rgba(197,162,90,0), rgba(246,207,122,.9), rgba(197,162,90,0));
}

.page-hero-wrapper .ph-desc{
  max-width: 34em;
  margin: 20px auto 0;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: 16px;
  line-height: 2.1;
  letter-spacing: .04em;
  color: var(--fc-body, #fff7ea);
  text-shadow: 0 1px 12px rgba(0,0,0,.7);
  /* 日本語の改行整形：文節で折る（対応ブラウザ）／禁則処理／ぶら下がり1文字を防ぐ */
  word-break: auto-phrase;
  line-break: strict;
  text-wrap: pretty;
  overflow-wrap: anywhere;
}

/* 途中で折りたくない語に使う共通クラス（カスタムHTML用） */
.fc-nw{ display: inline-block; white-space: nowrap; }

/* ---- 5) タブレット ---- */
@media (max-width: 992px){
  .page-hero-wrapper{
    --ph-min-pc: 380px;
    --ph-header-pc: 68px;
    padding: calc(var(--ph-header-pc) + 52px) 22px 64px;
  }
}

/* ---- 6) スマートフォン ---- */
@media (max-width: 600px){
  .page-hero-wrapper{
    --ph-min-pc: 320px;
    --ph-header-pc: 68px;
    /* 画面が小さいほど写真が文字の背後に来るので、暗幕を少し濃くする */
    --ph-veil-mid: rgba(10,7,5,.54);
    --ph-focus: rgba(6,4,3,.66);
    padding: calc(var(--ph-header-pc) + 44px) 18px 58px;
    background-position: center 42%;
  }
  .page-hero-wrapper .ph-container{ max-width: 100%; }
  .page-hero-wrapper .ph-container::before{
    margin-bottom: 14px;
    font-size: 14px;
    letter-spacing: .26em;
    text-indent: .13em;
  }
  .page-hero-wrapper .ph-title{
    font-size: clamp(26px, 7.2vw, 32px);
    line-height: 1.5;
    letter-spacing: .08em;          /* 字間を詰めて不自然な折返しを防ぐ */
    text-indent: .04em;
  }
  .page-hero-wrapper .ph-title::after{ width: 44px; margin-top: 18px; }
  .page-hero-wrapper .ph-desc{
    margin-top: 16px;
    font-size: 15px;
    line-height: 2;
    text-align: left;               /* 長文は左揃えの方が読みやすい */
  }
  .page-hero-wrapper::before{ height: 100px; }
  .page-hero-wrapper::after{ bottom: 16px; height: 40px; }
}

/* ---- 7) 動きを減らす設定の端末への配慮 ---- */
@media (prefers-reduced-motion: reduce){
  .page-hero-wrapper::after{ animation: none; opacity: .8; }
}

/* =========================================================
   ページ別の英字ラベル（sec_id 指定）
========================================================= */
#sec_1785932055215{ --ph-en: "CONCEPT"; }   /* CONCEPT ページ */
#sec_1788238453147{ --ph-en: "SYSTEM";  }   /* SYSTEM（courses）ページ */
#sec_1788237735393{ --ph-en: "RECRUIT"; }   /* RECRUIT ページ */
#sec_1788238560234{ --ph-en: "NEWS";    }   /* NEWS ページ */
#sec_1785932329448{ --ph-en: "ACCESS";  }   /* ACCESS ページ */
#sec_1785932170350{ --ph-en: "GALLERY"; }   /* ギャラリー（seats）ページ */

/* =========================================================
   共通ヒーローの背景写真（1か所で全ページに反映）
========================================================= */
.page-hero-wrapper{
  background-image: url("/image/assets/asset_20260821142342_6a87e0de3d5f5.webp") !important;
}
/* =========================================================
   TOPページ 修正まとめ（チェックバック対応）
   bar Booty  2026-09-04
   置き場所：TOPページのいずれかのブロックの「ブロック個別CSS」欄の末尾
             （1か所にまとめて貼ればOK。おすすめは店舗概要ブロック）
========================================================= */

/* ---- 1) MV右側の隙間 ---------------------------------------------------
   原因：ひとつの擬似要素（::after）に2つの役割が重なっています。
     ・style.css の .hero-wrapper::after … 全面にかける暗幕（inset: 0）
     ・TOPのブロックCSS #sec_1782110119323::after … 「SCROLL DOWN」の縦書きラベル
       （right: clamp(14px,2vw,30px) / bottom: 34px）
   擬似要素は1つしかないため両方が合成され、暗幕の箱が
   「右28px・下34pxだけ足りない大きな四角」になって隙間に見えていました。

   対処：::after は SCROLL DOWN ラベル専用にして、暗幕を外します。
   （MVの暗さは各スライドの .hero-slide::after が受け持っているので変わりません） */
#sec_1782110119323::after{
  top: auto !important;
  left: auto !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
}

/* ---- 2) 店舗概要の文字サイズ（15px → 16px） --------------------------- */
#sec_1785931790498 .store-info-table th,
#sec_1785931790498 .store-info-table td{
  font-size: 16px !important;
  line-height: 1.95 !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;  /* 指示書：明朝体 */
}
@media (max-width: 900px){
  #sec_1785931790498 .store-info-table th,
  #sec_1785931790498 .store-info-table td{ font-size: 16px !important; }
}

/* ---- 3) GALLERYの背景が粗い問題 ---------------------------------------
   PC：cover 指定で画面幅いっぱいまで約3倍に引き伸ばされていたのが原因。
   スマホ：拡大は直っても、タイルが1倍サイズのままだと
           Retina（2〜3倍密度）の画面で1ドットが2〜3ドットに引き伸ばされ、
           まだ少しにじんで見えます。→ 2倍サイズのタイルに差し替えます。 */
#sec_1788238305680.image-grid-section{
  --fc-bg-overlay: rgba(0,0,0,0);
  /* ▼ 2倍サイズのタイル（bg_gold_pattern@2x.webp／1280×852）を
     デザイン設定の背景画像に指定したうえで、表示は640px幅に縮めます。
     こうするとスマホ（Retina）でも1ドットずつ描かれ、にじみません。
     1倍のタイル（640×426）のままなら、この行を auto に戻してください。 */
  background-size: 640px auto !important;
  background-repeat: repeat !important;   /* 柄として敷き詰める */
  background-position: center top !important;
  background-color: #c8a05c !important;
}
@media (min-width: 901px){
  #sec_1788238305680.image-grid-section{ background-attachment: fixed !important; }
}

/* ---- 4) 改行位置（当店のご案内／CONCEPT／SYSTEM／RECRUIT） --------------
   現在は禁則処理だけが効いている状態です。
   文節で折り返す指定と、端数1文字の行を作らない指定を足します。 */
.booty-intro__body p,
.booty-feature__body p,
.booty-access-cta p,
.booty-top-content p:not(.booty-kicker):not(.booty-feature__number){
  word-break: auto-phrase !important;   /* 文節で折り返す */
  line-break: strict !important;        /* 禁則処理 */
  text-wrap: pretty !important;         /* 最終行が1〜2文字にならないようにする */
}
/* 見出しは単語の途中で折らない */
.booty-intro__body h2,
.booty-feature__body h2,
.booty-feature__body h3,
.booty-access-cta h2{
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

/* ---- 5) 中央揃えの英字ラベルが少し左右にズレる問題 ----------------------
   字間（letter-spacing）は最後の1文字の後ろにも入るため、
   中央揃えだとその分だけ文字が寄ります。半分を戻して中央に合わせます。 */
.fc-instagram-embed-label,
.booty-access-cta__label{
  text-indent: .15em !important;
}

/* ---- 6) 追従バーの色をフッターに合わせる -------------------------------
   バーだけ赤にすると、上のフッター（ローズ系）から色が急に変わって浮きます。
   フッターと完全に同じ配色（#70414d → #9a5d68 → #bf7d84）にそろえています。 */
.fc-floating-actions{
  background:
    radial-gradient(circle at 18% 0%, rgba(255, 228, 190, .34), transparent 36%),
    linear-gradient(145deg, #70414d 0%, #9a5d68 58%, #bf7d84 100%) !important;
}

/* Instagramボタンだけ、指示書のポイントカラー（赤）のままにしています。
   バーの色に馴染ませたい場合は、下の1行を
   linear-gradient(135deg, #b23d56, #7d3549) に戻してください。 */
.fc-floating-instagram{
  background: linear-gradient(135deg, #c03a44, #8d232b) !important;
  border: 1px solid rgba(255, 229, 186, .62) !important;
}

/* ---- 7) 「当店のご案内」の2段落目を2行に収める（2026-09-05 追加） -------
   文章側の列が493pxしかなく、
   「ゆっくりとした二次会まで、思い思いの時間を過ごしていただけます。」（532px必要）
   が収まらずに3行になっていました。左右の列を同じ幅にして余白を詰めます。
   ※ 列幅を広げるだけだと、今度は1行目が「…ゆっくりと」まで伸びて
     「ゆっくりと／した」で割れるため、原稿側に改行を1つ入れる必要があります
     （下の .br-pc と、HTMLの追記をセットで使ってください）。 */
/* ★PC・タブレットのみ。901px未満はTOP側の1カラム指定をそのまま使います。
   （メディアクエリを付けないと、スマホでも2カラムのままになり
     右側にはみ出して文字が切れます） */
@media (min-width: 901px){
  .booty-intro{
    grid-template-columns: minmax(0, 1fr) minmax(360px, 1fr) !important;
    gap: clamp(34px, 4.6vw, 72px) !important;
  }
}

/* PC・タブレットだけ有効になる改行。スマホでは無視されます */
.br-pc{ display: inline; }
@media (max-width: 900px){
  .br-pc{ display: none; }
}

/* ---- 8) Instagramセクションの背景を拡大しない（2026-09-05 追加） -------
   このブロックは「デザイン設定の背景画像」を、ブロック自身が
   <style id="bg-fc-instagram-embed-○○">#fc-instagram-embed-○○{ … cover … }</style>
   という形（ID指定・!important）で body 内に書き出します。
   ID指定にはクラス指定では勝てないため、次のどちらかで対応してください。

   【推奨】デザイン設定の「背景画像」を空にして、下のCSSで直接指定する
           （IDに依存しないので、InstagramのURLを変えても崩れません）        */
section.fc-instagram-embed-section{
  background-image: url("/image/assets/asset_20260901172722_6a968c6a55b9f.webp") !important;
  background-size: auto !important;          /* 原寸のまま＝拡大しない */
  background-repeat: no-repeat !important;   /* 1枚だけ置く（柄ではないため） */
  background-position: center top !important;
  background-color: #161e2a !important;      /* 画像の端と同じ色。左右の余白がなじみます */
}

/* 【簡易】デザイン設定の背景画像を残したまま直す場合は、こちらを使ってください。
   ※ InstagramのURLを変更するとIDが変わるので、その都度差し替えが必要です。
section#fc-instagram-embed-ff948a7d{
  background-size: auto !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-color: #161e2a !important;
}
*/

/* Block: custom_html / sec_1788238459814 */
/* =========================================================
   SYSTEMページ リード（カスタムHTMLブロック）
   bar Booty  ver.1  2026-09-01
   置き場所：料金カードの前にあるカスタムHTMLブロックの
             「ブロック個別CSS」欄（中身は全部消して置き換え）
   ※ 今入っている .custom-html-wrapper のリセットCSSは、
     ブロック側が自動で出力しているので消して大丈夫です
========================================================= */

.sys-lead-section{
  background: #0f1516;
  padding: 104px 20px 0;
}
.sys-lead{
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr);
  gap: 60px;
  align-items: center;
}

/* ---- 写真（大きい写真＋右下に小さい写真を重ねる） ---- */
.sys-lead-media{
  position: relative;
  padding-bottom: 54px;
}
.sys-lead-photo{
  margin: 0;
  overflow: hidden;
  border-radius: 4px;
  background: #0b1011;
  box-shadow: 0 30px 70px rgba(0,0,0,.5);
}
.sys-lead-photo img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.04) contrast(1.03) brightness(.97);
}
.sys-lead-photo.is-main{
  position: relative;
  aspect-ratio: 4 / 3;
}
/* 大きい写真の内側に細いゴールドの枠 */
.sys-lead-photo.is-main::after{
  content: "";
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(246,207,122,.34);
  pointer-events: none;
}
.sys-lead-photo.is-sub{
  position: absolute;
  right: -10px;
  bottom: 0;
  width: 46%;
  aspect-ratio: 3 / 2;
  border: 4px solid #0f1516;
  border-radius: 4px;
}

/* ---- 文章 ---- */
.sys-lead-en{
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 20px;
  font-family: var(--font-en, "Montserrat", sans-serif);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .3em;
  color: var(--fc-label, #f4d995);
  white-space: nowrap;
}
.sys-lead-en::after{
  content: "";
  flex: 1 1 auto;
  max-width: 110px;
  height: 1px;
  background: linear-gradient(90deg, rgba(197,162,90,.65), rgba(197,162,90,0));
}
.sys-lead-title{
  margin: 0 0 22px;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: clamp(21px, 2.1vw, 30px);
  font-weight: 800;
  line-height: 1.75;
  letter-spacing: .08em;
  color: var(--fc-title, #fff7ea);
  /* 見出しが単語の途中で折れないように */
  word-break: keep-all;
  line-break: strict;
  text-wrap: balance;
}
.sys-lead-text{
  margin: 0;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: 16px;
  line-height: 2.15;
  letter-spacing: .04em;
  color: var(--fc-body, #fff7ea);
  /* 日本語の改行整形：文節で折る／禁則処理／端数1文字の行を作らない */
  word-break: auto-phrase;
  line-break: strict;
  text-wrap: pretty;
}

/* ---- タブレット・スマートフォン ---- */
@media (max-width: 900px){
  .sys-lead-section{ padding: 74px 18px 0; }
  .sys-lead{
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .sys-lead-media{ padding-bottom: 40px; }
  .sys-lead-photo.is-sub{ width: 44%; right: -4px; border-width: 3px; }
  .sys-lead-photo.is-main::after{ inset: 9px; }
  .sys-lead-en{ margin-bottom: 14px; gap: 12px; letter-spacing: .24em; }
  .sys-lead-en::after{ max-width: 70px; }
  .sys-lead-title{
    font-size: 20px;
    line-height: 1.8;
    letter-spacing: .04em;
    margin-bottom: 16px;
  }
  .sys-lead-text{ font-size: 15px; line-height: 2.05; }
}

/* Block: course_list / sec_1788238456449 */
/* =========================================================
   SYSTEM（料金）ページ／完全版
   bar Booty  2026-09-05

   置き場所：SYSTEMページ「コース・飲み放題一覧」ブロック
             （sec_1788238456449）のブロック個別CSS欄
   入れ方　：現在のCSSをすべて削除し、このファイルへ丸ごと置き換え
   PHP・HTML：変更不要
========================================================= */

/* ---- 1) セクション ---- */
.course-list-section{
  position: relative !important;
  padding: 104px 20px 112px !important;
  background: #0f1516 !important;
  color: var(--fc-title, #fff7ea) !important;
  overflow: hidden !important;
  --fc-bg-overlay: rgba(0,0,0,0);
}

.course-list-section::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: radial-gradient(
    70% 46% at 50% 0%,
    rgba(214,168,88,.14),
    rgba(0,0,0,0) 62%
  ) !important;
}

.course-list-header,
.course-list-grid{
  position: relative !important;
  z-index: 1 !important;
}

/* ---- 2) 見出し・リード文 ---- */
.course-list-header{
  max-width: 760px !important;
  margin: 0 auto 54px !important;
  text-align: center !important;
}

.course-list-title{
  margin: 0 0 18px !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: clamp(24px, 3vw, 34px) !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
  letter-spacing: .14em !important;
  text-indent: .07em !important;
  color: var(--fc-title, #fff7ea) !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

.course-list-title::after{
  content: "" !important;
  display: block !important;
  width: 54px !important;
  height: 1px !important;
  margin: 20px auto 0 !important;
  background: linear-gradient(
    90deg,
    rgba(197,162,90,0),
    rgba(246,207,122,.9),
    rgba(197,162,90,0)
  ) !important;
}

.course-list-desc{
  margin: 0 !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: 16px !important;
  line-height: 2.15 !important;
  letter-spacing: .04em !important;
  color: var(--fc-body, #fff7ea) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

/* ---- 3) 料金カード ---- */
.course-list-grid{
  max-width: 1080px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)) !important;
  gap: 26px !important;
}

.course-list-card{
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border: 1px solid rgba(246,207,122,.24) !important;
  border-radius: 6px !important;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.06),
    rgba(255,255,255,.02)
  ) !important;
  transition:
    transform .4s cubic-bezier(.25,1,.5,1),
    border-color .4s ease,
    box-shadow .4s ease !important;
}

.course-list-card:hover{
  transform: translateY(-5px) !important;
  border-color: rgba(246,207,122,.6) !important;
  box-shadow: 0 26px 58px rgba(0,0,0,.5) !important;
}

/* 写真 */
.course-list-img{
  aspect-ratio: 3 / 2 !important;
  background: #131b1c !important;
  overflow: hidden !important;
  color: rgba(197,162,90,.5) !important;
  font-size: 34px !important;
}

.course-list-img img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  filter: saturate(1.04) contrast(1.03) brightness(.97) !important;
  transition: transform 1s cubic-bezier(.25,1,.5,1) !important;
}

@media (hover: hover){
  .course-list-card:hover .course-list-img img{
    transform: scale(1.06) !important;
  }
}

/* カード本文 */
.course-list-body{
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  padding: 26px 24px 28px !important;
  text-align: center !important;
}

/* 「○名様より」は予約機能用の値のため非表示 */
.course-list-kicker{
  display: none !important;
}

.course-list-body h3{
  margin: 0 0 14px !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  line-height: 1.7 !important;
  letter-spacing: .06em !important;
  color: var(--fc-title, #fff7ea) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

.course-list-text{
  margin: 0 0 18px !important;
  min-height: 0 !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: 14px !important;
  line-height: 1.95 !important;
  letter-spacing: .02em !important;
  color: var(--fc-body, #fff7ea) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

/*
  金額・税込表記を明朝体へ統一。
  セクションIDも併記し、共通CSS側のMontserrat指定より確実に優先する。
*/
#sec_1788238456449 .course-list-price{
  margin: auto 0 0 !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(246,207,122,.18) !important;
  font-family: "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif !important;
  font-size: 30px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: .02em !important;
  color: var(--fc-title, #fff7ea) !important;
  white-space: nowrap !important;
}

#sec_1788238456449 .course-list-price small{
  margin-left: 8px !important;
  font-family: "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--fc-muted, rgba(255,247,232,.66)) !important;
  white-space: nowrap !important;
}

/* ---- 4) 注意書き用フリーテキストブロック ---- */
.free-text-section{
  padding: 96px 20px 112px !important;
  background: #0f1516 !important;
  color: var(--fc-title, #fff7ea) !important;
  text-align: center !important;
}

.course-list-section + .free-text-section{
  padding-top: 0 !important;
}

.free-text-container{
  max-width: 860px !important;
  margin: 0 auto !important;
  padding: 36px 40px 38px !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(246,207,122,.2) !important;
  border-left: 3px solid var(--gold, #c5a25a) !important;
  border-radius: 6px !important;
  box-shadow: 0 22px 54px rgba(0,0,0,.4) !important;
  text-align: left !important;
}

.free-text-title{
  margin: 0 0 18px !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 1.6 !important;
  letter-spacing: .1em !important;
  color: var(--fc-title, #fff7ea) !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

.free-text-desc{
  margin: 0 !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: 15px !important;
  line-height: 2.15 !important;
  letter-spacing: .04em !important;
  color: var(--fc-body, #fff7ea) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

.free-text-container .fc-block-btn-wrap{
  margin-top: 26px !important;
  text-align: center !important;
}

/* ---- 5) 写真未登録の料金カード ---- */
.course-list-card:not(:has(.course-list-img img)) .course-list-img{
  display: none !important;
}

.course-list-card:not(:has(.course-list-img img)){
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.075),
    rgba(255,255,255,.025)
  ) !important;
}

.course-list-card:not(:has(.course-list-img img))::before{
  content: "" !important;
  display: block !important;
  height: 2px !important;
  background: linear-gradient(
    90deg,
    rgba(197,162,90,0),
    rgba(246,207,122,.85),
    rgba(197,162,90,0)
  ) !important;
}

.course-list-card:not(:has(.course-list-img img)) .course-list-body{
  padding: 38px 26px 34px !important;
}

/* ---- 6) 管理画面で指定した背景画像 ---- */
#sec_1788238456449.course-list-section{
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-color: #0f1516 !important;
}

/* 背景画像のみを明るくし、文字やカードの明るさは維持 */
#sec_1788238456449.course-list-section::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  backdrop-filter: brightness(1.6) saturate(1.05) !important;
  -webkit-backdrop-filter: brightness(1.6) saturate(1.05) !important;
  background:
    linear-gradient(180deg, rgba(15,21,22,.9) 0%, rgba(15,21,22,0) 22%),
    linear-gradient(0deg, rgba(15,21,22,.9) 0%, rgba(15,21,22,0) 22%) !important;
}

#sec_1788238456449 .course-list-header{
  padding: 10px 24px 14px !important;
  background: radial-gradient(
    70% 150% at 50% 46%,
    rgba(8,11,12,.72) 0%,
    rgba(8,11,12,0) 74%
  ) !important;
}

#sec_1788238456449 .course-list-card,
#sec_1788238456449 .course-list-card:not(:has(.course-list-img img)){
  background: rgba(9,13,14,.72) !important;
  border-color: rgba(246,207,122,.34) !important;
  backdrop-filter: blur(8px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.08) !important;
}

/* ---- 7) タブレット・スマートフォン ---- */
@media (max-width: 900px){
  .course-list-section{
    padding: 74px 18px 80px !important;
  }

  .course-list-header{
    margin-bottom: 38px !important;
  }

  #sec_1788238456449 .course-list-header{
    padding: 8px 12px 12px !important;
  }

  .course-list-desc{
    font-size: 15px !important;
    line-height: 2.05 !important;
    text-align: left !important;
  }

  .course-list-grid{
    grid-template-columns: minmax(0, 1fr) !important;
    max-width: 440px !important;
    gap: 20px !important;
  }

  .course-list-img{
    aspect-ratio: 16 / 9 !important;
  }

  .course-list-body{
    min-width: 0 !important;
    padding: 22px 20px 24px !important;
  }

  .course-list-body h3{
    font-size: 18px !important;
  }

  #sec_1788238456449 .course-list-price{
    padding-top: 15px !important;
    font-size: 27px !important;
  }

  .free-text-section{
    padding: 70px 18px 80px !important;
  }

  .course-list-section + .free-text-section{
    padding-top: 0 !important;
  }

  .free-text-container{
    padding: 28px 22px 30px !important;
  }

  .free-text-title{
    font-size: 18px !important;
    letter-spacing: .06em !important;
  }

  .free-text-desc{
    font-size: 15px !important;
    line-height: 2.05 !important;
  }

  .free-text-container .fc-block-btn-wrap .fc-block-btn{
    width: 100% !important;
    max-width: 320px !important;
  }

  .course-list-card:not(:has(.course-list-img img)) .course-list-body{
    padding: 30px 22px 28px !important;
  }
}

@media (max-width: 380px){
  .course-list-section{
    padding-inline: 14px !important;
  }

  .course-list-body,
  .course-list-card:not(:has(.course-list-img img)) .course-list-body{
    padding-inline: 18px !important;
  }

  .course-list-body h3{
    font-size: 17px !important;
    letter-spacing: .035em !important;
  }

  #sec_1788238456449 .course-list-price{
    font-size: 25px !important;
  }
}


/* =========================================================
   Page: recruit / bar Booty（バーブーティー）｜静内・新ひだか町のバー｜静内駅徒歩7分｜RECRUIT
========================================================= */

/* Block: custom_html / sec_1788237738293 */
/* =========================================================
   RECRUITページ リード（カスタムHTMLブロック）
   bar Booty  ver.1  2026-09-01
   置き場所：募集要項一覧の前にあるカスタムHTMLブロックの
             「ブロック個別CSS」欄（中身は全部消して置き換え）
   ※ .custom-html-wrapper のリセットCSSはブロック側が自動出力するので不要です
========================================================= */

.rec-lead-section{
  background: #0f1516;
  padding: 104px 20px 96px;
}
.rec-lead{
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, .98fr) minmax(0, 1.02fr);
  gap: 60px;
  align-items: center;
}

/* ---- 文章（PCでは左） ---- */
.rec-lead-en{
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 20px;
  font-family: var(--font-en, "Montserrat", sans-serif);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .3em;
  color: var(--fc-label, #f4d995);
  white-space: nowrap;
}
.rec-lead-en::after{
  content: "";
  flex: 1 1 auto;
  max-width: 110px;
  height: 1px;
  background: linear-gradient(90deg, rgba(197,162,90,.65), rgba(197,162,90,0));
}
.rec-lead-title{
  margin: 0 0 22px;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: clamp(21px, 2.1vw, 30px);
  font-weight: 800;
  line-height: 1.75;
  letter-spacing: .08em;
  color: var(--fc-title, #fff7ea);
  /* 見出しが単語の途中で折れないように */
  word-break: keep-all;
  line-break: strict;
  text-wrap: balance;
}
.rec-lead-text{
  margin: 0;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: 16px;
  line-height: 2.15;
  letter-spacing: .04em;
  color: var(--fc-body, #fff7ea);
  /* 日本語の改行整形：文節で折る／禁則処理／端数1文字の行を作らない */
  word-break: auto-phrase;
  line-break: strict;
  text-wrap: pretty;
}

/* ---- 写真（PCでは右／大きい写真の左下に小さい写真を重ねる） ---- */
.rec-lead-media{
  position: relative;
  padding-bottom: 54px;
}
.rec-lead-photo{
  margin: 0;
  overflow: hidden;
  border-radius: 4px;
  background: #0b1011;
  box-shadow: 0 30px 70px rgba(0,0,0,.5);
}
.rec-lead-photo img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.04) contrast(1.03) brightness(.97);
}
.rec-lead-photo.is-main{
  position: relative;
  aspect-ratio: 4 / 3;
}
/* 大きい写真の内側に細いゴールドの枠 */
.rec-lead-photo.is-main::after{
  content: "";
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(246,207,122,.34);
  pointer-events: none;
}
.rec-lead-photo.is-sub{
  position: absolute;
  left: -10px;
  bottom: 0;
  width: 46%;
  aspect-ratio: 3 / 2;
  border: 4px solid #0f1516;
  border-radius: 4px;
}

/* ---- タブレット・スマートフォン ---- */
@media (max-width: 900px){
  .rec-lead-section{ padding: 74px 18px 70px; }
  .rec-lead{
    grid-template-columns: 1fr;
    gap: 28px;
  }
  /* スマホでは写真を先に見せる */
  .rec-lead-media{ order: 1; padding-bottom: 40px; }
  .rec-lead-body{ order: 2; }
  .rec-lead-photo.is-sub{ width: 44%; left: -4px; border-width: 3px; }
  .rec-lead-photo.is-main::after{ inset: 9px; }
  .rec-lead-en{ margin-bottom: 14px; gap: 12px; letter-spacing: .24em; }
  .rec-lead-en::after{ max-width: 70px; }
  .rec-lead-title{
    font-size: 20px;
    line-height: 1.8;
    letter-spacing: .04em;
    margin-bottom: 16px;
  }
  .rec-lead-text{ font-size: 15px; line-height: 2.05; }
}

/* Block: recruit_job_list / sec_1788238505564 */
/* =========================================================
   RECRUITページ 募集要項一覧（recruit_job_list）完全版
   bar Booty  2026-09-05
   修正: 募集要項の項目・本文・給与を明朝体へ統一
   置き場所：「募集要項・求人一覧」ブロックのブロック個別CSS欄
             （今入っているCSSは全部消して置き換え）
   ※ 背景写真は管理画面の「デザイン設定 → 背景画像」から指定します。
     このCSSは、その写真に暗幕をかけずそのまま見せる前提で作っています。
========================================================= */

/* ---- 1) 背景写真を暗幕なしで表示する ---- */
/* デザイン設定の背景画像は #sec_id{background-image: linear-gradient(暗幕), url(写真)} の形で
   出力されます。その暗幕の色を透明にすると、写真がそのままの明るさで出ます。 */
.job-list-section{
  --fc-bg-overlay: rgba(0,0,0,0);
  position: relative !important;
  padding: 108px 20px 116px !important;
  background-color: #0f1516 !important;   /* 背景画像を未設定のときの色 */
  color: var(--fc-title, #fff7ea) !important;
  overflow: hidden !important;
}

/* 上下の端だけページ背景へ溶かして、前後のセクションと自然につなぐ。
   写真の中央は覆わないので、写真の見え方は変わりません。
   ※ 完全に写真だけを出したい場合は、この ::before のかたまりごと削除してください。 */
.job-list-section::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(15,21,22,.95) 0%, rgba(15,21,22,0) 24%),
    linear-gradient(0deg,   rgba(15,21,22,.95) 0%, rgba(15,21,22,0) 24%) !important;
}
.job-section-header,
.job-container{ position: relative !important; z-index: 1 !important; }

/* ---- 2) 見出し（写真の上に乗るので影で可読性を確保） ---- */
.job-section-header{
  max-width: 760px !important;
  margin: 0 auto 48px !important;
  padding: 10px 24px 14px !important;
  text-align: center !important;
  /* 見出しの後ろだけ、ふちが見えない丸いぼかしで少し落とす（写真は隠しません） */
  background: radial-gradient(70% 150% at 50% 46%, rgba(8,11,12,.82) 0%, rgba(8,11,12,0) 74%) !important;
}
.job-main-title{
  margin: 0 0 18px !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;
  font-size: clamp(24px, 3vw, 34px) !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
  letter-spacing: .14em !important;
  text-indent: .07em !important;
  color: var(--fc-title, #fff7ea) !important;
  text-shadow: 0 2px 18px rgba(0,0,0,.8), 0 0 40px rgba(0,0,0,.6) !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}
.job-main-title::after{
  content: "" !important;
  display: block !important;
  width: 54px !important;
  height: 1px !important;
  margin: 20px auto 0 !important;
  background: linear-gradient(90deg, rgba(197,162,90,0), rgba(246,207,122,.9), rgba(197,162,90,0)) !important;
}
.job-sub-text{
  margin: 0 !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;
  font-size: 16px !important;
  line-height: 2.1 !important;
  letter-spacing: .04em !important;
  color: var(--fc-body, #fff7ea) !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.95), 0 0 26px rgba(0,0,0,.8) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

/* ---- 3) 募集カード（写真の上に置く半透明パネル） ---- */
.job-container{
  max-width: 900px !important;
  margin: 0 auto !important;
}
.job-card{
  overflow: hidden !important;
  background: rgba(9,13,14,.74) !important;
  border: 1px solid rgba(246,207,122,.32) !important;
  border-radius: 6px !important;
  box-shadow: 0 30px 70px rgba(0,0,0,.55) !important;
  backdrop-filter: blur(8px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.08) !important;
}
.job-card-header{
  padding: 26px 32px !important;
  background: rgba(0,0,0,.3) !important;
  border-bottom: 1px solid rgba(246,207,122,.2) !important;
}
.job-type-badge{
  margin-bottom: 12px !important;
  padding: 6px 14px !important;
  background: rgba(179,52,61,.9) !important;
  border-radius: 3px !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
}
.job-title{
  margin: 0 !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1.6 !important;
  letter-spacing: .08em !important;
  color: var(--fc-title, #fff7ea) !important;
  word-break: keep-all !important;
  line-break: strict !important;
}

/* 画像を登録していない求人は、表を1カラムで横いっぱいに使う */
.job-card-body{ padding: 30px 32px 32px !important; }
.job-card-body:not(:has(.job-img-box)){ grid-template-columns: minmax(0, 1fr) !important; }

/* 募集要項内は、基本CSS側のゴシック指定より確実に優先して明朝体へ統一 */
.job-card,
.job-card-header,
.job-card-body,
.job-type-badge,
.job-title,
.job-table,
.job-table th,
.job-table td,
.job-salary{
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
}

/*
  現行の共通CSSは、このブロックより後ろでNoto Sans JP・Montserratを
  !important指定しているため、現行セクションIDを併記して確実に上書きする。
*/
#sec_1788238505564 .job-type-badge,
#sec_1788238505564 .job-title,
#sec_1788238505564 .job-table th,
#sec_1788238505564 .job-table td,
#sec_1788238505564 .job-salary{
  font-family: "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif !important;
}

/* ---- 4) 募集要項の表 ---- */
.job-table{
  width: 100% !important;
  max-width: 100% !important;
}

.job-table th,
.job-table td{
  padding: 15px 0 !important;
  border-bottom: 1px solid rgba(246,207,122,.16) !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;   /* 指示書：詳細文は明朝体 */
  font-size: 15px !important;
  line-height: 1.95 !important;
  color: var(--fc-body, #fff7ea) !important;
  vertical-align: top !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}
.job-table th{
  width: 124px !important;
  padding-right: 20px !important;
  color: var(--fc-muted, rgba(255,247,232,.66)) !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  text-align: left !important;
  white-space: nowrap !important;
}
.job-table tr:last-child th,
.job-table tr:last-child td{ border-bottom: none !important; }
.job-salary{
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;   /* 指示書：明朝体 */
  font-size: 20px !important;
  font-weight: 900 !important;
  letter-spacing: .02em !important;
  color: var(--fc-title, #fff7ea) !important;
}

/* 入力が空の項目は行ごと非表示（管理画面で未入力でも表が崩れない） */
.job-table tr:has(td:empty){ display: none !important; }

/* 表の見出し語を、指示書の募集要項に合わせて表示上だけ差し替える。
   3行目「業務内容」→「応募資格」／4行目「待遇・福利厚生」→「その他」
   ※元のラベルに戻したいときは、この2かたまりを削除してください。 */
.job-table tr:nth-child(3) th,
.job-table tr:nth-child(4) th{
  visibility: hidden !important;   /* 元のラベルを消す（読み上げにも出ません） */
  font-size: 0 !important;
}
.job-table tr:nth-child(3) th::before,
.job-table tr:nth-child(4) th::before{
  visibility: visible !important;
  font-size: 15px !important;
  line-height: 1.95 !important;
}
.job-table tr:nth-child(3) th::before{ content: "応募資格" !important; }
.job-table tr:nth-child(4) th::before{ content: "その他" !important; }

/* ---- 5) タブレット・スマートフォン ---- */
@media (max-width: 900px){
  .job-list-section{ padding: 74px 18px 80px !important; }
  .job-section-header{ margin-bottom: 32px !important; }
  .job-sub-text{ font-size: 15px !important; line-height: 2 !important; }
  .job-container,
  .job-card,
  .job-card-body,
  .job-table{
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .job-card-header{ padding: 22px 22px !important; }
  .job-title{ font-size: 19px !important; }
  .job-card-body{ padding: 8px 22px 24px !important; }
  .job-table,
  .job-table tbody,
  .job-table tr,
  .job-table th,
  .job-table td{
    display: block !important;
    width: 100% !important;
  }
  .job-table th,
  .job-table td{ padding: 10px 0 !important; }
  .job-table th{
    width: 100% !important;
    padding: 16px 0 2px !important;
    border-bottom: none !important;
    font-size: 14px !important;
  }
  .job-table td{
    padding: 0 0 14px !important;
    font-size: 15px !important;
    overflow-wrap: anywhere !important;
  }
  .job-salary{ font-size: 19px !important; }
  .job-table tr:nth-child(3) th::before,
  .job-table tr:nth-child(4) th::before{ font-size: 14px !important; }
}


/* =========================================================
   Page: news / bar Booty（バーブーティー）｜静内・新ひだか町のバー｜静内駅徒歩7分｜NEWS
========================================================= */

/* Block: news_list_grid / sec_1788238565553 */
/* =========================================================
   NEWSページ お知らせ一覧（news_list_grid）
   bar Booty  ver.1  2026-09-01
   置き場所：「お知らせ一覧グリッド」ブロックのブロック個別CSS欄
             （今入っているCSSは全部消して置き換え）
========================================================= */

/* ---- 1) セクション ---- */
.news-list-grid-section{
  position: relative !important;
  padding: 86px 20px 112px !important;
  background: #0f1516 !important;
  color: var(--fc-title, #fff7ea) !important;
  overflow: hidden !important;
}
.news-list-grid-section::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: radial-gradient(70% 44% at 50% 0%, rgba(214,168,88,.12), rgba(0,0,0,0) 62%) !important;
}
.news-section-header,
.nlg-grid{ position: relative !important; z-index: 1 !important; }

/* ---- 2) 見出し ---- */
.news-section-header{
  max-width: 760px !important;
  margin: 0 auto 46px !important;
  text-align: center !important;
}
.news-main-title{
  margin: 0 0 18px !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;
  font-size: clamp(24px, 3vw, 32px) !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
  letter-spacing: .14em !important;
  text-indent: .07em !important;
  color: var(--fc-title, #fff7ea) !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}
.news-main-title::after{
  content: "" !important;
  display: block !important;
  width: 54px !important;
  height: 1px !important;
  margin: 20px auto 0 !important;
  background: linear-gradient(90deg, rgba(197,162,90,0), rgba(246,207,122,.9), rgba(197,162,90,0)) !important;
}
.news-sub-text{
  margin: 0 !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;
  font-size: 16px !important;
  line-height: 2.1 !important;
  letter-spacing: .04em !important;
  color: var(--fc-body, #fff7ea) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

/* ---- 3) 記事カード ---- */
/* auto-fill：記事が1件のときにカードが横いっぱいに伸びないようにする */
.nlg-grid{
  max-width: 1080px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap: 26px !important;
}
.nlg-card{
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025)) !important;
  border: 1px solid rgba(246,207,122,.24) !important;
  border-radius: 6px !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.4) !important;
  color: var(--fc-title, #fff7ea) !important;
  transition: transform .4s cubic-bezier(.25,1,.5,1), border-color .4s ease, box-shadow .4s ease !important;
}
a.nlg-card:hover{
  transform: translateY(-5px) !important;
  border-color: rgba(246,207,122,.6) !important;
  box-shadow: 0 26px 58px rgba(0,0,0,.5) !important;
}

.nlg-img{
  aspect-ratio: 4 / 3 !important;
  background: #131b1c !important;
  overflow: hidden !important;
}
.nlg-img img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  filter: saturate(1.04) contrast(1.02) brightness(.97) !important;
  transition: transform 1s cubic-bezier(.25,1,.5,1) !important;
}
@media (hover: hover){
  a.nlg-card:hover .nlg-img img{ transform: scale(1.06) !important; }
}
/* 写真を登録していない記事のプレースホルダー */
.nlg-no-img{
  aspect-ratio: 4 / 3 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #131b1c !important;
  color: rgba(197,162,90,.45) !important;
  font-size: 30px !important;
}

.nlg-body{
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  padding: 22px 22px 24px !important;
}
.nlg-meta{ margin-bottom: 12px !important; }
.nlg-date{
  padding: 6px 12px !important;
  background: rgba(197,162,90,.14) !important;
  border: 1px solid rgba(246,207,122,.26) !important;
  border-radius: 3px !important;
  font-family: var(--font-en, "Montserrat", sans-serif) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  color: var(--fc-label, #f4d995) !important;
}
.nlg-title{
  margin: 0 !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  line-height: 1.75 !important;
  letter-spacing: .04em !important;
  color: var(--fc-title, #fff7ea) !important;
  /* タイトルが長くても3行までにそろえる（カードの高さが揃います） */
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
}

/* ---- 4) タブレット・スマートフォン ---- */
@media (max-width: 900px){
  .news-list-grid-section{ padding: 60px 18px 80px !important; }
  .news-section-header{ margin-bottom: 32px !important; }
  .news-sub-text{ font-size: 15px !important; line-height: 2 !important; }
  .nlg-grid{
    grid-template-columns: 1fr !important;
    max-width: 440px !important;
    gap: 18px !important;
  }
  .nlg-img,
  .nlg-no-img{ aspect-ratio: 16 / 9 !important; }
  .nlg-body{ padding: 20px !important; }
  .nlg-title{ font-size: 16px !important; }
}

/* =========================================================
   5) 背景画像（金色タイル）を入れたときの調整
   2026-09-01 更新：黒いぼかし・黒いフェード・文字の影をすべて廃止し、
   金色の上は「文字色を濃くする」方式に変更しました。
   ※ sec_1788238565553 はお知らせ一覧ブロックのID。
========================================================= */

/* 金色の背景に乗せる文字色（ここを変えると見出し・説明文の色が変わります） */
#sec_1788238565553.news-list-grid-section{
  --gold-ink:      #2b1d10;              /* 見出し */
  --gold-ink-sub:  rgba(43,29,16,.86);   /* 説明文 */
  --gold-line:     rgba(43,29,16,.45);   /* 飾り線 */
}

/* 暗幕を無しにする */
.news-list-grid-section{ --fc-bg-overlay: rgba(0,0,0,0); }

/* 拡大しない（原寸で敷く） */
#sec_1788238565553.news-list-grid-section{
  background-size: auto !important;        /* 原寸のまま（拡大しない） */
  background-repeat: repeat !important;    /* 柄として敷き詰める */
  background-position: center top !important;
  background-color: #c8a05c !important;    /* 画像と同系の金色（読み込み前の色） */
}

/* 上下のフェード（黒い影）を無しにする */
#sec_1788238565553.news-list-grid-section::before{
  display: none !important;
}

/* 見出し・説明文：黒いぼかしと影をやめて、濃い文字色で読ませる */
#sec_1788238565553 .news-section-header{
  padding: 0 !important;
  background: none !important;
}
#sec_1788238565553 .news-main-title{
  color: var(--gold-ink) !important;
  text-shadow: none !important;
}
#sec_1788238565553 .news-main-title::after{
  background: linear-gradient(90deg, rgba(43,29,16,0), var(--gold-line), rgba(43,29,16,0)) !important;
}
#sec_1788238565553 .news-sub-text{
  color: var(--gold-ink-sub) !important;
  text-shadow: none !important;
}

/* 記事カードは金色の上でも読めるよう、濃いめの半透明に */
#sec_1788238565553 .nlg-card{
  background: rgba(9,13,14,.82) !important;
  border-color: rgba(246,207,122,.4) !important;
  backdrop-filter: blur(6px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(6px) saturate(1.05) !important;
}

/* PCのみ：柄を画面基準で固定して、上のブロックと柄の位置をそろえる（境目対策）。
   スマホは iOS の不具合を避けるため通常スクロールのままにします */
@media (min-width: 901px){
  #sec_1788238565553.news-list-grid-section{ background-attachment: fixed !important; }
}


/* =========================================================
   Page: news_detail / NEWS_DETAIL ページ
========================================================= */

/* Block: hero_page / sec_1788251270312 */
.page-hero-wrapper {
  position: relative;
  min-height: 360px;
  padding: 150px 20px 90px;
  text-align: center;
  color: var(--text-main);
  background-size: cover;
  background-position: center;
}
.page-hero-wrapper::after, .ph-overlay {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(16,23,24,.82), rgba(31,47,48,.46));
}
.ph-container { position: relative; z-index: 1; max-width: 820px; margin: 0 auto; }
.ph-title { font-family: var(--font-serif); font-size: clamp(2rem, 5vw, 3.4rem); color: var(--gold-light); letter-spacing: .16em; }
.ph-desc { margin-top: 16px; color: var(--text-sub); font-size: 14px; line-height: 2; }

/* Block: custom_html / sec_1788251279262 */
/* =========================================================
   NEWS詳細ページ リード（カスタムHTMLブロック）
   bar Booty  ver.1  2026-09-01
   置き場所：NEWS_DETAILページ ヒーローと記事本文の“間”に置いた
             カスタムHTMLブロックの「ブロック個別CSS」欄
   ※ ヒーローがある前提の余白にしています。
     ヒーローを外す場合は padding の 1行目を 130px に変えてください。
========================================================= */

.nd-lead-section{
  background: #0f1516;
  padding: 52px 20px 46px;
}
.nd-lead{
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}
.nd-lead-text{
  margin: 0;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: 16px;
  line-height: 2.1;
  letter-spacing: .04em;
  color: var(--fc-body, #fff7ea);
  /* 日本語の改行整形：文節で折る／禁則処理／端数1文字の行を作らない */
  word-break: auto-phrase;
  line-break: strict;
  text-wrap: pretty;
}
.nd-lead-back{
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 13px 26px;
  border: 1px solid rgba(246,207,122,.5);
  border-radius: 4px;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .08em;
  white-space: nowrap;
  color: var(--fc-label, #f4d995);
  text-decoration: none;
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}
.nd-lead-back::before{ content: "←"; font-size: 15px; }
.nd-lead-back:hover{
  background: var(--gold, #c5a25a);
  border-color: var(--gold, #c5a25a);
  color: #111;
}

/* ---- タブレット・スマートフォン ---- */
@media (max-width: 900px){
  .nd-lead-section{ padding: 40px 18px 34px; }
  .nd-lead{
    flex-direction: column;
    align-items: stretch;
    gap: 20px;
  }
  .nd-lead-text{ font-size: 15px; line-height: 2.05; }
  .nd-lead-back{ width: 100%; max-width: 320px; margin: 0 auto; justify-content: center; }
}

/* Block: news_article_body / sec_1788245820163 */
/* =========================================================
   NEWS詳細ページ 記事本文（news_article_body）
   bar Booty  ver.1  2026-09-01
   置き場所：NEWS_DETAILページ「お知らせ記事本文」ブロックの
             ブロック個別CSS欄（今入っているCSSは全部消して置き換え）
   ※ このページにはヒーローがないので、上の余白を広めに取っています
========================================================= */

/* ---- 1) セクション ---- */
.news-article-body-section{
  position: relative !important;
  padding: 150px 20px 112px !important;   /* 固定ヘッダー分を含む上余白 */
  /* ※ 上にカスタムHTMLのリードを置く場合は、下の 8) で 0 に変更しています */
  background: #0f1516 !important;
  color: var(--fc-title, #fff7ea) !important;
  overflow: hidden !important;
}
.news-article-body-section::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: radial-gradient(74% 40% at 50% 0%, rgba(214,168,88,.14), rgba(0,0,0,0) 60%) !important;
}

/* ---- 2) 記事パネル ---- */
.nab-container{
  position: relative !important;
  z-index: 1 !important;
  max-width: 880px !important;
  margin: 0 auto !important;
  padding: 48px 52px 44px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025)) !important;
  border: 1px solid rgba(246,207,122,.24) !important;
  border-radius: 6px !important;
  box-shadow: 0 30px 70px rgba(0,0,0,.5) !important;
  color: var(--fc-title, #fff7ea) !important;
}

/* ---- 3) 記事の見出し ---- */
.nab-header{
  margin-bottom: 34px !important;
  padding-bottom: 26px !important;
  border-bottom: 1px solid rgba(246,207,122,.22) !important;
}
/* 見出しの上に英字ラベルを表示（HTMLの変更なしで出しています） */
.nab-header::before{
  content: "NEWS" !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin-bottom: 16px !important;
  font-family: var(--font-en, "Montserrat", sans-serif) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: .3em !important;
  color: var(--fc-label, #f4d995) !important;
}
.nab-meta{ margin-bottom: 14px !important; }
.nab-date{
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 6px 12px !important;
  background: rgba(197,162,90,.14) !important;
  border: 1px solid rgba(246,207,122,.26) !important;
  border-radius: 3px !important;
  font-family: var(--font-en, "Montserrat", sans-serif) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  color: var(--fc-label, #f4d995) !important;
}
.nab-title{
  margin: 0 !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;
  font-size: clamp(22px, 2.6vw, 32px) !important;
  font-weight: 800 !important;
  line-height: 1.7 !important;
  letter-spacing: .06em !important;
  color: var(--fc-title, #fff7ea) !important;
  /* 見出しが単語の途中で折れないように */
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

/* ---- 4) 記事のメイン画像 ---- */
/* インスタの縦長写真でも切り取られないよう、元の縦横比のまま表示します */
.nab-main-img-box{
  display: flex !important;
  justify-content: center !important;
  aspect-ratio: auto !important;
  max-height: 620px !important;
  margin: 0 auto 34px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #0b1011 !important;
  border: 1px solid rgba(246,207,122,.2) !important;
  border-radius: 4px !important;
}
.nab-main-img-box img{
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 620px !important;
  object-fit: contain !important;
}

/* ---- 5) 本文 ---- */
.nab-body-text{
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;
  font-size: 16px !important;
  line-height: 2.25 !important;
  letter-spacing: .04em !important;
  color: var(--fc-body, #fff7ea) !important;
  /* 日本語の改行整形：文節で折る／禁則処理／端数1文字の行を作らない */
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
  overflow-wrap: anywhere !important;
}
.nab-body-text a{
  color: var(--fc-label, #f4d995) !important;
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
}
.nab-body-text img{
  max-width: 100% !important;
  height: auto !important;
  margin: 20px 0 !important;
  border-radius: 4px !important;
}

/* ---- 6) 一覧へ戻るボタン ---- */
.nab-footer-nav{
  margin-top: 40px !important;
  padding-top: 30px !important;
  border-top: 1px dashed rgba(246,207,122,.3) !important;
  text-align: center !important;
}
.btn-nab-back{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 50px !important;
  padding: 0 34px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
}

/* ---- 7) タブレット・スマートフォン ---- */
@media (max-width: 900px){
  .news-article-body-section{ padding: 110px 18px 80px !important; }
  .nab-container{ padding: 30px 22px 32px !important; }
  .nab-header{ margin-bottom: 26px !important; padding-bottom: 20px !important; }
  .nab-header::before{ margin-bottom: 12px !important; letter-spacing: .24em !important; }
  .nab-title{ font-size: 20px !important; line-height: 1.8 !important; letter-spacing: .03em !important; }
  .nab-main-img-box{ max-height: 460px !important; margin-bottom: 26px !important; }
  .nab-main-img-box img{ max-height: 460px !important; }
  .nab-body-text{ font-size: 15px !important; line-height: 2.1 !important; }
  .nab-footer-nav{ margin-top: 30px !important; padding-top: 24px !important; }
  .btn-nab-back{ width: 100% !important; max-width: 320px !important; }
}

/* =========================================================
   8) 背景画像を入れたときの調整（2026-09-01 追加）
   ・デザイン設定の背景画像に、既定でかかる82%の黒い暗幕を解除
   ・画像を拡大せず、元のサイズのまま敷く
   ※ sec_1788245820163 は記事本文ブロックのID。
     ブロックを作り直した場合はIDを差し替えてください。
========================================================= */

/* 暗幕を無しにする */
.news-article-body-section{ --fc-bg-overlay: rgba(0,0,0,0); }

/* 拡大しない（原寸で敷く）。
   システムのインラインCSSに勝たせるため、ID＋クラスの指定が必要です。
   repeat  … 画像を並べて全面に敷く（柄・パターン向き／今回の設定）
   no-repeat に変えると1枚だけ中央に置き、周囲は下の背景色になります */
#sec_1788245820163.news-article-body-section{
  background-size: auto !important;        /* 原寸のまま（拡大しない） */
  background-repeat: repeat !important;    /* 柄として敷き詰める */
  background-position: center top !important;
  background-color: #c8a05c !important;    /* 画像と同系の金色（読み込み前の色） */
}

/* 上にヒーロー＋カスタムHTMLのリードを置いたので、記事セクション側の上余白は詰める。
   リードを外す場合は、この2行を削除してください（150px / 110px に戻ります） */
#sec_1788245820163.news-article-body-section{ padding-top: 0 !important; }
@media (max-width: 900px){
  #sec_1788245820163.news-article-body-section{ padding-top: 0 !important; }
}

/* 上下のフェード（黒い影）は使わない */
#sec_1788245820163.news-article-body-section::before{
  display: none !important;
}

/* 記事パネルは明るい背景の上でも読めるよう、濃いめの半透明に */
#sec_1788245820163 .nab-container{
  background: rgba(9,13,14,.9) !important;
  border-color: rgba(246,207,122,.4) !important;
  backdrop-filter: blur(6px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(6px) saturate(1.05) !important;
}

/* PCのみ：柄を画面基準で固定（境目対策）。スマホは通常スクロール */
@media (min-width: 901px){
  #sec_1788245820163.news-article-body-section{ background-attachment: fixed !important; }
}


/* =========================================================
   Page: access / bar Booty（バーブーティー）｜静内・新ひだか町のバー｜静内駅徒歩7分｜ACCESS
========================================================= */

/* Block: custom_html / sec_1788251703925 */
/* =========================================================
   ACCESSページ リード（カスタムHTMLブロック）
   bar Booty  ver.1  2026-09-01
   置き場所：店舗概要の前に置くカスタムHTMLブロックの
             「ブロック個別CSS」欄
   ※ .custom-html-wrapper のリセットCSSはブロック側が自動出力するので不要です
========================================================= */

.acc-lead-section{
  background: #0f1516;
  padding: 104px 20px 100px;
}
.acc-lead{
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 58px;
  align-items: center;
}

/* ---- 写真（PCでは左） ---- */
.acc-lead-media{ position: relative; }
.acc-lead-photo{
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 4px;
  background: #0b1011;
  box-shadow: 0 30px 70px rgba(0,0,0,.5);
  aspect-ratio: 4 / 3;
}
.acc-lead-photo img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.04) contrast(1.03) brightness(.97);
}
/* 写真の内側に細いゴールドの枠 */
.acc-lead-photo::after{
  content: "";
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(246,207,122,.34);
  pointer-events: none;
}

/* ---- 文章（PCでは右） ---- */
.acc-lead-en{
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 20px;
  font-family: var(--font-en, "Montserrat", sans-serif);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .3em;
  color: var(--fc-label, #f4d995);
  white-space: nowrap;
}
.acc-lead-en::after{
  content: "";
  flex: 1 1 auto;
  max-width: 110px;
  height: 1px;
  background: linear-gradient(90deg, rgba(197,162,90,.65), rgba(197,162,90,0));
}
.acc-lead-title{
  margin: 0 0 22px;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: clamp(21px, 2.1vw, 30px);
  font-weight: 800;
  line-height: 1.75;
  letter-spacing: .08em;
  color: var(--fc-title, #fff7ea);
  /* 見出しが単語の途中で折れないように */
  word-break: keep-all;
  line-break: strict;
  text-wrap: balance;
}
.acc-lead-text{
  margin: 0;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: 16px;
  line-height: 2.15;
  letter-spacing: .04em;
  color: var(--fc-body, #fff7ea);
  /* 日本語の改行整形：文節で折る／禁則処理／端数1文字の行を作らない */
  word-break: auto-phrase;
  line-break: strict;
  text-wrap: pretty;
}

/* ---- タブレット・スマートフォン ---- */
@media (max-width: 900px){
  .acc-lead-section{ padding: 74px 18px 70px; }
  .acc-lead{
    grid-template-columns: 1fr;
    gap: 26px;
  }
  .acc-lead-photo{ aspect-ratio: 16 / 10; }
  .acc-lead-photo::after{ inset: 9px; }
  .acc-lead-en{ margin-bottom: 14px; gap: 12px; letter-spacing: .24em; }
  .acc-lead-en::after{ max-width: 70px; }
  .acc-lead-title{
    font-size: 20px;
    line-height: 1.8;
    letter-spacing: .04em;
    margin-bottom: 16px;
  }
  .acc-lead-text{ font-size: 15px; line-height: 2.05; }
}

/* Block: store_info / sec_1785932333583 */
/* =========================================================
   ACCESSページ 店舗概要（store_info）＋ Googleマップ（gmap）完全版
   bar Booty  2026-09-05
   置き場所：「店舗概要」ブロック（sec_1785932333583）のブロック個別CSS欄
             （今入っているCSSは全部消して置き換え／マップ分もここに含みます）
   PHP・HTML：変更不要
   ※ 背景写真は管理画面の「デザイン設定 → 背景画像」から指定します。
     暗幕（オーバーレイ）は透明にして、写真をそのまま見せる設計です。
========================================================= */

/* ---- 1) 店舗概要セクション：背景写真を暗幕なしで表示 ---- */
#sec_1785932333583.store-info-section{
  --fc-bg-overlay: rgba(0,0,0,0);
  position: relative !important;
  padding: 104px 20px 112px !important;
  background-color: #0f1516 !important;   /* 背景画像を未設定のときの色 */
  color: var(--fc-title, #fff7ea) !important;
  overflow: hidden !important;
}
/* 上下の端だけページ背景へ溶かして前後のセクションと自然につなぐ。
   写真の中央は覆わないので、写真の見え方は変わりません。
   ※ 完全に写真だけを出したい場合は、この ::before のかたまりごと削除してください。 */
#sec_1785932333583.store-info-section::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(15,21,22,.95) 0%, rgba(15,21,22,0) 24%),
    linear-gradient(0deg,   rgba(15,21,22,.95) 0%, rgba(15,21,22,0) 24%) !important;
}
#sec_1785932333583 .store-info-container{ position: relative !important; z-index: 1 !important; max-width: 1000px !important; }

/* ---- 2) 見出し ---- */
#sec_1785932333583 .store-info-header{
  max-width: 760px !important;
  margin: 0 auto 44px !important;
  padding: 10px 24px 14px !important;
  text-align: center !important;
  /* 見出しの後ろだけ、ふちの見えない丸いぼかしで少し落とす（写真は隠しません） */
  background: radial-gradient(70% 150% at 50% 46%, rgba(8,11,12,.82) 0%, rgba(8,11,12,0) 74%) !important;
}
#sec_1785932333583 .store-info-title{
  margin: 0 0 18px !important;
  font-family: "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif !important;
  font-size: clamp(24px, 3vw, 34px) !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
  letter-spacing: .14em !important;
  text-indent: .07em !important;
  color: var(--fc-title, #fff7ea) !important;
  text-shadow: 0 2px 18px rgba(0,0,0,.8), 0 0 40px rgba(0,0,0,.6) !important;
  word-break: keep-all !important;
  line-break: strict !important;
}
#sec_1785932333583 .store-info-title::after{
  content: "" !important;
  display: block !important;
  width: 54px !important;
  height: 1px !important;
  margin: 20px auto 0 !important;
  background: linear-gradient(90deg, rgba(197,162,90,0), rgba(246,207,122,.9), rgba(197,162,90,0)) !important;
}
#sec_1785932333583 .store-info-desc{
  margin: 0 !important;
  font-family: "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif !important;
  font-size: 16px !important;
  line-height: 2.1 !important;
  letter-spacing: .04em !important;
  color: var(--fc-body, #fff7ea) !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.95) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

/* ---- 3) 概要テーブル（写真の上に置く半透明パネル） ---- */
#sec_1785932333583 .store-info-table-wrap{
  padding: 14px 40px 18px !important;
  background: rgba(9,13,14,.74) !important;
  border: 1px solid rgba(246,207,122,.3) !important;
  border-radius: 6px !important;
  box-shadow: 0 30px 70px rgba(0,0,0,.55) !important;
  backdrop-filter: blur(8px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.08) !important;
}
#sec_1785932333583 .store-info-table{
  width: 100% !important;
  max-width: 100% !important;
  table-layout: fixed !important;
}
/* tbody をグリッドにすることで、行の並び替え（下の 5) ）と
   列幅の揃えを同時に成立させています */
#sec_1785932333583 .store-info-table tbody{ display: grid !important; grid-template-columns: 1fr !important; }
#sec_1785932333583 .store-info-table tr{
  display: grid !important;
  grid-template-columns: 150px minmax(0, 1fr) !important;
  align-items: start !important;
  border-bottom: 1px solid rgba(246,207,122,.16) !important;
}
#sec_1785932333583 .store-info-table tr:last-child{ border-bottom: none !important; }
#sec_1785932333583 .store-info-table th,
#sec_1785932333583 .store-info-table td{
  padding: 17px 0 !important;
  border: none !important;
  font-family: "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif !important;   /* 指示書：詳細文は明朝体 */
  text-align: left !important;
  font-size: 15px !important;
  line-height: 1.95 !important;
  letter-spacing: .02em !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}
#sec_1785932333583 .store-info-table th{
  padding-right: 20px !important;
  color: var(--fc-muted, rgba(255,247,232,.66)) !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}
#sec_1785932333583 .store-info-table td{ color: var(--fc-body, #fff7ea) !important; }

/* ---- 4) 表の項目名を指示書の表記に合わせる ---- */
/* 「席数」→「座席数」。元に戻したいときはこのかたまりを削除してください。 */
#sec_1785932333583 .store-info-table tr:nth-child(5) th{
  visibility: hidden !important;
  font-size: 0 !important;
}
#sec_1785932333583 .store-info-table tr:nth-child(5) th::before{
  content: "座席数" !important;
  visibility: visible !important;
  font-size: 15px !important;
  line-height: 1.95 !important;
}

/* ---- 5) 行の並び順を指示書どおりにそろえる ---- */
/* 前提：電話番号を空欄にした10行構成
   （店名／住所／営業時間／定休日／席数／駐車場／アクセス＋追加3項目）
   電話番号を追加するなど行を増減した場合は、このかたまりを削除してください。
   削除するとブロック既定の並びに戻ります。 */
#sec_1785932333583 .store-info-table tr:nth-child(1){ order: 1 !important; }   /* 店名 */
#sec_1785932333583 .store-info-table tr:nth-child(2){ order: 2 !important; }   /* 住所 */
#sec_1785932333583 .store-info-table tr:nth-child(7){ order: 3 !important; }   /* アクセス */
#sec_1785932333583 .store-info-table tr:nth-child(3){ order: 4 !important; }   /* 営業時間 */
#sec_1785932333583 .store-info-table tr:nth-child(4){ order: 5 !important; }   /* 定休日 */
#sec_1785932333583 .store-info-table tr:nth-child(8){ order: 6 !important; }   /* 貸切 */
#sec_1785932333583 .store-info-table tr:nth-child(9){ order: 7 !important; }   /* お支払方法 */
#sec_1785932333583 .store-info-table tr:nth-child(5){ order: 8 !important; }   /* 座席数 */
#sec_1785932333583 .store-info-table tr:nth-child(6){ order: 9 !important; }   /* 駐車場 */
#sec_1785932333583 .store-info-table tr:nth-child(10){ order: 10 !important; } /* 禁煙喫煙 */


/* ---- 5b) 座席数・駐車場をACCESSだけで表示し、禁煙喫煙の直前へ ----
   TOPページ用CSSが全ページ共通で5・6行目を隠していても、
   ACCESSページでは既存の管理項目を表示します。

   通常の10行構成：5行目=座席数、6行目=駐車場、10行目=禁煙喫煙
   追加項目を重複登録した12行構成にも対応し、10・11行目を表示用に使います。
*/
#sec_1785932333583 .store-info-table tbody:not(:has(> tr:nth-child(12))) > tr:nth-child(5),
#sec_1785932333583 .store-info-table tbody:not(:has(> tr:nth-child(12))) > tr:nth-child(6){
  display: grid !important;
}
#sec_1785932333583 .store-info-table tbody:not(:has(> tr:nth-child(12))) > tr:nth-child(10){
  order: 10 !important;
}

/* 現在の管理画面にある重複登録（12行構成）は、標準5・6行目を隠して
   追加の座席数・駐車場・禁煙喫煙を8・9・10番目へ並べます。 */
#sec_1785932333583 .store-info-table tbody:has(> tr:nth-child(12)) > tr:nth-child(5),
#sec_1785932333583 .store-info-table tbody:has(> tr:nth-child(12)) > tr:nth-child(6){
  display: none !important;
}
#sec_1785932333583 .store-info-table tbody:has(> tr:nth-child(12)) > tr:nth-child(10){
  display: grid !important;
  order: 8 !important;
}
#sec_1785932333583 .store-info-table tbody:has(> tr:nth-child(12)) > tr:nth-child(11){
  display: grid !important;
  order: 9 !important;
}
#sec_1785932333583 .store-info-table tbody:has(> tr:nth-child(12)) > tr:nth-child(12){
  display: grid !important;
  order: 10 !important;
}

/* 写真を入れた場合の2カラムレイアウト（画像は任意） */
#sec_1785932333583 .store-info-layout.has-image{ gap: 36px !important; align-items: center !important; }
#sec_1785932333583 .store-info-image img{ border-radius: 4px !important; border-color: rgba(246,207,122,.3) !important; }

/* ---- 6) Googleマップ ---- */
.gmap-section{
  padding: 0 20px 116px !important;
  background: #0f1516 !important;
  color: var(--fc-title, #fff7ea) !important;
}
.gmap-container{ max-width: 1000px !important; margin: 0 auto !important; }
.gmap-header{
  max-width: 760px !important;
  margin: 0 auto 32px !important;
  text-align: center !important;
}
.gmap-title{
  margin: 0 0 14px !important;
  font-family: "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif !important;
  font-size: clamp(20px, 2.4vw, 26px) !important;
  font-weight: 800 !important;
  line-height: 1.6 !important;
  letter-spacing: .12em !important;
  text-indent: .06em !important;
  color: var(--fc-title, #fff7ea) !important;
  word-break: keep-all !important;
  line-break: strict !important;
}
.gmap-desc{
  margin: 0 !important;
  font-family: "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif !important;
  font-size: 16px !important;
  line-height: 2.1 !important;
  letter-spacing: .04em !important;
  color: var(--fc-body, #fff7ea) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}
.gmap-frame-wrap{
  aspect-ratio: 16 / 9 !important;
  border-radius: 6px !important;
  border: 1px solid rgba(246,207,122,.3) !important;
  box-shadow: 0 30px 70px rgba(0,0,0,.5) !important;
  background: #0b1011 !important;
}
.gmap-frame-wrap iframe{ filter: none !important; }

/* ---- 7) タブレット・スマートフォン ---- */
@media (max-width: 900px){
  #sec_1785932333583.store-info-section{ padding: 74px 18px 80px !important; }
  #sec_1785932333583 .store-info-header{ margin-bottom: 30px !important; }
  #sec_1785932333583 .store-info-desc{ font-size: 15px !important; line-height: 2 !important; }
  #sec_1785932333583 .store-info-table-wrap{ padding: 6px 22px 14px !important; }
  /* スマホは項目名を上、内容を下の縦積みにする */

  #sec_1785932333583 .store-info-table,
  #sec_1785932333583 .store-info-table tbody,
  #sec_1785932333583 .store-info-table tr,
  #sec_1785932333583 .store-info-table th,
  #sec_1785932333583 .store-info-table td{
    min-width: 0 !important;
    max-width: 100% !important;
  }
  #sec_1785932333583 .store-info-table td{
    overflow-wrap: anywhere !important;
  }

  #sec_1785932333583 .store-info-table tr{ grid-template-columns: 1fr !important; }
  #sec_1785932333583 .store-info-table th{
    padding: 16px 0 2px !important;
    font-size: 14px !important;
    white-space: normal !important;
  }
  #sec_1785932333583 .store-info-table td{ padding: 0 0 15px !important; font-size: 15px !important; }
  #sec_1785932333583 .store-info-table tr:nth-child(5) th::before{ font-size: 14px !important; }

  .gmap-section{ padding: 0 18px 80px !important; }
  .gmap-header{ margin-bottom: 24px !important; }
  .gmap-desc{ font-size: 15px !important; line-height: 2 !important; }
  .gmap-frame-wrap{ aspect-ratio: 4 / 3 !important; min-height: 280px !important; }
}

/* Block: gmap / sec_1785932342748 */
.gmap-section {padding: 90px 20px; background: #101718; color: #fff7ea;}
.gmap-container {max-width: 1080px; margin: 0 auto;}
.gmap-header {max-width: 820px; margin: 0 auto 34px; text-align: center;}
.gmap-title {font-family: 'Shippori Mincho', serif; font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 900; letter-spacing: 0.1em; color: var(--gold-light); margin: 0 0 12px;}
.gmap-desc {font-size: 14px; line-height: 1.9; color: #e0c8a0; margin: 0;}
.gmap-frame-wrap {position: relative; width: 100%; aspect-ratio: 16 / 9; min-height: 320px; border-radius: 8px; overflow: hidden; border: 1px solid var(--line); background: var(--bg-paper);}
.gmap-frame-wrap iframe {position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(.12) contrast(.97);}
.gmap-placeholder {position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 20px; color: var(--text-sub); font-size: 13px;}
@media (max-width: 768px) {.gmap-section {padding: 64px 15px;} .gmap-frame-wrap {aspect-ratio: 4 / 3; min-height: 260px;}}


/* =========================================================
   Page: concept / bar Booty（バーブーティー）｜静内・新ひだか町のバー｜静内駅徒歩7分｜CONCEPT
========================================================= */

/* Block: hero_page / sec_1785932055215 */
.page-hero-wrapper {
  position: relative;
  min-height: 360px;
  padding: 150px 20px 90px;
  text-align: center;
  color: var(--text-main);
  background-size: cover;
  background-position: center;
}
.page-hero-wrapper::after, .ph-overlay {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(16,23,24,.82), rgba(31,47,48,.46));
}
.ph-container { position: relative; z-index: 1; max-width: 820px; margin: 0 auto; }
.ph-title { font-family: var(--font-serif); font-size: clamp(2rem, 5vw, 3.4rem); color: var(--gold-light); letter-spacing: .16em; }
.ph-desc { margin-top: 16px; color: var(--text-sub); font-size: 14px; line-height: 2; }

/* Block: concept_split / sec_1788246707136 */
/* =========================================================
   CONCEPT 3ブロック（concept_split）完全版 v2
   bar Booty  2026-09-05

   置き場所：CONCEPTページ1番目の
             「コンセプト（左右分割）」ブロックの個別CSS欄
   入れ方　：現在の個別CSSを全削除し、このファイルへ丸ごと置き換え
   適用範囲：同ページの concept_split 3ブロック
   PHP・HTML：変更不要

   v2：本文を実DOMの p.concept-text に直接指定し、
       blocks.css／後続テーマCSSの詳細度に負けないよう強化。
========================================================= */

/* ---------- 1. セクション ---------- */
.concept-section{
  position: relative !important;
  padding: 108px 20px !important;
  overflow: hidden !important;
  background: #0f1516 !important;
  color: var(--text-main, #fff7ea) !important;
}

.concept-section:has(.concept-reverse){
  background: #141b1c !important;
}

.concept-section::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: radial-gradient(
    58% 68% at 76% 34%,
    rgba(214, 168, 88, .13),
    rgba(0, 0, 0, 0) 62%
  ) !important;
}

.concept-section:has(.concept-reverse)::before{
  background: radial-gradient(
    58% 68% at 24% 34%,
    rgba(214, 168, 88, .13),
    rgba(0, 0, 0, 0) 62%
  ) !important;
}

.concept-container{
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  width: 100% !important;
  max-width: 1120px !important;
  min-width: 0 !important;
  margin-inline: auto !important;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 1fr) !important;
  gap: 58px !important;
  align-items: center !important;
}

.concept-container.concept-reverse{
  grid-template-columns: minmax(300px, 1fr) minmax(0, 1fr) !important;
}

/* ---------- 2. テキスト ---------- */
.concept-content{
  min-width: 0 !important;
  padding-left: 0 !important;
  text-align: left !important;
}

/* 01 DRINKSなどの英字ラベルのみ欧文フォントを維持 */
.concept-section .concept-content > p.concept-eyebrow{
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin: 0 0 20px !important;
  color: var(--fc-label, #f4d995) !important;
  font-family: var(--font-en, "Montserrat", sans-serif) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: .3em !important;
  text-align: left !important;
  white-space: nowrap !important;
}

.concept-section .concept-content > p.concept-eyebrow::after{
  content: "" !important;
  flex: 1 1 auto !important;
  max-width: 110px !important;
  height: 1px !important;
  background: linear-gradient(
    90deg,
    rgba(197, 162, 90, .65),
    rgba(197, 162, 90, 0)
  ) !important;
}

.concept-section .concept-content > .concept-title,
.concept-section .concept-content > h2,
.concept-section .concept-content > h3{
  margin: 0 0 22px !important;
  color: var(--fc-title, #fff7ea) !important;
  font-family: "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif !important;
  font-size: clamp(21px, 2.1vw, 30px) !important;
  font-weight: 800 !important;
  line-height: 1.75 !important;
  letter-spacing: .08em !important;
  text-align: left !important;
  word-break: normal !important;
  word-break: auto-phrase !important;
  overflow-wrap: break-word !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

/*
   本文の実DOMは .concept-content > p.concept-text。
   body＋section＋直下構造で詳細度を上げ、読み込み順に左右されにくくする。
   将来spanが追加された場合も同じ明朝体を継続する。
*/
body section.concept-section .concept-container .concept-content > p.concept-text,
body section.concept-section .concept-container .concept-content > p.concept-text span,
body section.concept-section .concept-container .concept-content > p.concept-text strong,
body section.concept-section .concept-container .concept-content > p.concept-text em{
  margin-top: 0 !important;
  color: var(--fc-body, #fff7ea) !important;
  font-family: "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  line-height: 2.15 !important;
  letter-spacing: .04em !important;
  text-align: left !important;
  word-break: normal !important;
  word-break: auto-phrase !important;
  overflow-wrap: break-word !important;
  line-break: strict !important;
  text-wrap: pretty !important;
  hyphens: none !important;
}

/* ---------- 3. 写真 ---------- */
.concept-img-wrapper{
  min-width: 0 !important;
  overflow: hidden !important;
  border-radius: 4px !important;
  background: #0b1011 !important;
  box-shadow: 0 30px 70px rgba(0, 0, 0, .5) !important;
}

.concept-img-wrapper::before{
  inset: 12px !important;
  border: 1px solid rgba(246, 207, 122, .34) !important;
}

.concept-img-wrapper img,
.concept-img-wrapper video{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  filter: saturate(1.04) contrast(1.03) brightness(.98) !important;
  transition: transform 1s cubic-bezier(.25, 1, .5, 1) !important;
}

@media (hover: hover){
  .concept-section:hover .concept-img-wrapper img{
    transform: scale(1.035) !important;
  }
}

/* ---------- 4. ボタン ---------- */
.concept-content .fc-block-btn-wrap{
  margin-top: 30px !important;
  text-align: left !important;
}

/* ---------- 5. タブレット／スマートフォン ---------- */
@media (max-width: 900px){
  .concept-section{
    padding: 74px 18px !important;
  }

  .concept-section::before,
  .concept-section:has(.concept-reverse)::before{
    background: radial-gradient(
      70% 40% at 50% 22%,
      rgba(214, 168, 88, .12),
      rgba(0, 0, 0, 0) 68%
    ) !important;
  }

  .concept-container,
  .concept-container.concept-reverse{
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 26px !important;
  }

  /* 3ブロックとも「写真 → 文章」の順に統一 */
  .concept-container .concept-content,
  .concept-container.concept-reverse .concept-content{
    order: 2 !important;
  }

  .concept-container .concept-img-wrapper,
  .concept-container.concept-reverse .concept-img-wrapper{
    order: 1 !important;
  }

  .concept-section .concept-content > p.concept-eyebrow{
    gap: 12px !important;
    margin-bottom: 14px !important;
    letter-spacing: .24em !important;
  }

  .concept-section .concept-content > p.concept-eyebrow::after{
    max-width: 70px !important;
  }

  .concept-section .concept-content > .concept-title,
  .concept-section .concept-content > h2,
  .concept-section .concept-content > h3{
    margin-bottom: 16px !important;
    font-size: 20px !important;
    line-height: 1.8 !important;
    letter-spacing: .04em !important;
  }

  body section.concept-section .concept-container .concept-content > p.concept-text,
  body section.concept-section .concept-container .concept-content > p.concept-text span,
  body section.concept-section .concept-container .concept-content > p.concept-text strong,
  body section.concept-section .concept-container .concept-content > p.concept-text em{
    font-size: 15px !important;
    line-height: 2.05 !important;
  }

  .concept-img-wrapper::before{
    inset: 9px !important;
  }

  .concept-content .fc-block-btn-wrap{
    margin-top: 24px !important;
  }
}

@media (max-width: 380px){
  .concept-section{
    padding-inline: 14px !important;
  }

  .concept-section .concept-content > .concept-title,
  .concept-section .concept-content > h2,
  .concept-section .concept-content > h3{
    font-size: 19px !important;
    letter-spacing: .025em !important;
  }
}

@media (prefers-reduced-motion: reduce){
  .concept-img-wrapper img,
  .concept-img-wrapper video{
    transition: none !important;
  }

  .concept-section:hover .concept-img-wrapper img{
    transform: none !important;
  }
}


/* =========================================================
   Page: system / bar Booty（バーブーティー）｜静内・新ひだか町のバー｜静内駅徒歩7分｜SYSTEM
========================================================= */

/* Block: hero_page / sec_1788760314438 */
.page-hero-wrapper {
  position: relative;
  min-height: 360px;
  padding: 150px 20px 90px;
  text-align: center;
  color: var(--text-main);
  background-size: cover;
  background-position: center;
}
.page-hero-wrapper::after, .ph-overlay {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(16,23,24,.82), rgba(31,47,48,.46));
}
.ph-container { position: relative; z-index: 1; max-width: 820px; margin: 0 auto; }
.ph-title { font-family: var(--font-serif); font-size: clamp(2rem, 5vw, 3.4rem); color: var(--gold-light); letter-spacing: .16em; }
.ph-desc { margin-top: 16px; color: var(--text-sub); font-size: 14px; line-height: 2; }
/* =========================================================
   共通ヒーロー（hero_page ブロック / .page-hero-wrapper）
   bar Booty  ver.1  2026-09-01
   置き場所：ダッシュボード → 共通CSS編集（style.css）の末尾に1回だけ
   ※ このCSSだけで、下層ページ全部の hero_page ブロックに効きます
========================================================= */

/* ---- 0) サイト共通の文字色（ここを変えると下層ページ全体の文字色が変わります） ---- */
:root{
  --fc-title: #fff7ea;                 /* 見出しの色（TOPページと同じ白） */
  --fc-body:  #fff7ea;                 /* 本文の色 */
  --fc-muted: rgba(255,247,232,.66);   /* 補足・表の項目名など、少し弱める文字 */
  --fc-label: #f4d995;                 /* 英字ラベルだけゴールド（TOPのキッカーと同色） */
}

/* ---- 1) 調整用の変数（数値の変更はここだけでOK） ---- */
.page-hero-wrapper{
  --ph-min-pc: 460px;               /* PCの最低の高さ */
  --ph-header-pc: 78px;             /* 固定ヘッダーの高さ（PC） */
  --ph-veil-top:    rgba(10,7,5,.60);   /* 上の暗幕 */
  --ph-veil-mid:    rgba(10,7,5,.44);   /* 中央の暗幕（薄いほど写真が見える） */
  --ph-veil-bottom: rgba(10,7,5,.92);   /* 下の暗幕（次のセクションへの繋ぎ） */
  --ph-focus: rgba(6,4,3,.60);          /* 文字の後ろだけを落とす影（読みやすさ用） */
  --ph-glow: rgba(214,168,88,.20);      /* 全体にかける暖かいゴールドの色味 */
  --ph-en: "BAR BOOTY";                 /* 英字ラベルの初期値（ページ別に上書き） */
}

/* ---- 2) 土台 ---- */
.page-hero-wrapper{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--ph-min-pc);
  padding: calc(var(--ph-header-pc) + 62px) 24px 78px;
  margin: 0;
  overflow: hidden;
  isolation: isolate;
  text-align: center;
  color: var(--text-main, #fff7ea);
  background-color: #0d0b0a;        /* 画像が無い時／読込前の保険 */
  background-position: center 40%;
  background-size: cover;
  background-repeat: no-repeat;
}

/* ---- 3) 写真の上に重ねる色（暖色の暗幕＋中央の光＋四隅の締め） ---- */
.page-hero-wrapper .ph-overlay{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(66% 58% at 50% 48%, var(--ph-focus) 0%, rgba(0,0,0,0) 72%),
    linear-gradient(180deg, var(--ph-veil-top) 0%, var(--ph-veil-mid) 44%, var(--ph-veil-bottom) 100%),
    radial-gradient(135% 105% at 50% 46%, rgba(0,0,0,0) 38%, rgba(0,0,0,.55) 100%),
    radial-gradient(120% 82% at 50% 30%, var(--ph-glow) 0%, rgba(0,0,0,0) 68%);
}

/* 下端をページ背景色へ溶かす（切れ目を消してスクロールを促す） */
.page-hero-wrapper::before{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 130px;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(16,23,24,0) 0%, var(--bg-base, #101718) 100%);
}

/* スクロール誘導の細いゴールドの線 */
.page-hero-wrapper::after{
  content: "";
  position: absolute;
  left: 50%;
  margin-left: -1px;
  bottom: 24px;
  width: 2px;
  height: 52px;
  z-index: 3;
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(246,207,122,0) 0%, rgba(246,207,122,.95) 100%);
  box-shadow: 0 0 14px rgba(246,207,122,.45);
  animation: ph-scroll-line 2.6s cubic-bezier(.25,1,.5,1) infinite;
}
@keyframes ph-scroll-line{
  0%   { transform: scaleY(.15); transform-origin: top;    opacity: .25; }
  48%  { transform: scaleY(1);   transform-origin: top;    opacity: 1;   }
  52%  { transform: scaleY(1);   transform-origin: bottom; opacity: 1;   }
  100% { transform: scaleY(0);   transform-origin: bottom; opacity: .25; }
}

/* ---- 4) 文字まわり ---- */
.page-hero-wrapper .ph-container{
  position: relative;
  z-index: 4;
  max-width: 780px;
  margin: 0 auto;
  padding: 0;
}

/* 英字ラベル（CONCEPT など。ページ別に文字を差し替え） */
.page-hero-wrapper .ph-container::before{
  content: var(--ph-en);
  display: block;
  margin: 0 0 18px;
  font-family: var(--font-en, "Montserrat", sans-serif);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .34em;
  text-indent: .17em;               /* 字間の分だけ左にズレるのを中央へ戻す */
  color: var(--fc-label, #f4d995);
  text-shadow: 0 1px 14px rgba(0,0,0,.7);
  opacity: .95;
  white-space: nowrap;
}

.page-hero-wrapper .ph-title{
  margin: 0;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: clamp(28px, 4.4vw, 46px);
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: .14em;
  text-indent: .07em;
  color: var(--fc-title, #fff7ea);
  text-shadow: 0 2px 18px rgba(0,0,0,.75), 0 0 46px rgba(0,0,0,.5);
  /* 改行の暴れ止め：単語の途中で折らない／禁則処理／端数1文字の行を作らない */
  word-break: keep-all;
  line-break: strict;
  text-wrap: balance;
}

/* タイトル下の細い飾り線 */
.page-hero-wrapper .ph-title::after{
  content: "";
  display: block;
  width: 54px;
  height: 1px;
  margin: 22px auto 0;
  background: linear-gradient(90deg, rgba(197,162,90,0), rgba(246,207,122,.9), rgba(197,162,90,0));
}

.page-hero-wrapper .ph-desc{
  max-width: 34em;
  margin: 20px auto 0;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: 16px;
  line-height: 2.1;
  letter-spacing: .04em;
  color: var(--fc-body, #fff7ea);
  text-shadow: 0 1px 12px rgba(0,0,0,.7);
  /* 日本語の改行整形：文節で折る（対応ブラウザ）／禁則処理／ぶら下がり1文字を防ぐ */
  word-break: auto-phrase;
  line-break: strict;
  text-wrap: pretty;
  overflow-wrap: anywhere;
}

/* 途中で折りたくない語に使う共通クラス（カスタムHTML用） */
.fc-nw{ display: inline-block; white-space: nowrap; }

/* ---- 5) タブレット ---- */
@media (max-width: 992px){
  .page-hero-wrapper{
    --ph-min-pc: 380px;
    --ph-header-pc: 68px;
    padding: calc(var(--ph-header-pc) + 52px) 22px 64px;
  }
}

/* ---- 6) スマートフォン ---- */
@media (max-width: 600px){
  .page-hero-wrapper{
    --ph-min-pc: 320px;
    --ph-header-pc: 68px;
    /* 画面が小さいほど写真が文字の背後に来るので、暗幕を少し濃くする */
    --ph-veil-mid: rgba(10,7,5,.54);
    --ph-focus: rgba(6,4,3,.66);
    padding: calc(var(--ph-header-pc) + 44px) 18px 58px;
    background-position: center 42%;
  }
  .page-hero-wrapper .ph-container{ max-width: 100%; }
  .page-hero-wrapper .ph-container::before{
    margin-bottom: 14px;
    font-size: 14px;
    letter-spacing: .26em;
    text-indent: .13em;
  }
  .page-hero-wrapper .ph-title{
    font-size: clamp(26px, 7.2vw, 32px);
    line-height: 1.5;
    letter-spacing: .08em;          /* 字間を詰めて不自然な折返しを防ぐ */
    text-indent: .04em;
  }
  .page-hero-wrapper .ph-title::after{ width: 44px; margin-top: 18px; }
  .page-hero-wrapper .ph-desc{
    margin-top: 16px;
    font-size: 15px;
    line-height: 2;
    text-align: left;               /* 長文は左揃えの方が読みやすい */
  }
  .page-hero-wrapper::before{ height: 100px; }
  .page-hero-wrapper::after{ bottom: 16px; height: 40px; }
}

/* ---- 7) 動きを減らす設定の端末への配慮 ---- */
@media (prefers-reduced-motion: reduce){
  .page-hero-wrapper::after{ animation: none; opacity: .8; }
}

/* =========================================================
   ページ別の英字ラベル（sec_id 指定）
========================================================= */
#sec_1785932055215{ --ph-en: "CONCEPT"; }   /* CONCEPT ページ */
#sec_1788760314438{ --ph-en: "SYSTEM";  }   /* SYSTEM（courses）ページ */
#sec_1788237735393{ --ph-en: "RECRUIT"; }   /* RECRUIT ページ */
#sec_1788238560234{ --ph-en: "NEWS";    }   /* NEWS ページ */
#sec_1785932329448{ --ph-en: "ACCESS";  }   /* ACCESS ページ */
#sec_1785932170350{ --ph-en: "GALLERY"; }   /* ギャラリー（seats）ページ */

/* =========================================================
   共通ヒーローの背景写真（1か所で全ページに反映）
========================================================= */
.page-hero-wrapper{
  background-image: url("/image/assets/asset_20260821142342_6a87e0de3d5f5.webp") !important;
}
/* =========================================================
   TOPページ 修正まとめ（チェックバック対応）
   bar Booty  2026-09-04
   置き場所：TOPページのいずれかのブロックの「ブロック個別CSS」欄の末尾
             （1か所にまとめて貼ればOK。おすすめは店舗概要ブロック）
========================================================= */

/* ---- 1) MV右側の隙間 ---------------------------------------------------
   原因：ひとつの擬似要素（::after）に2つの役割が重なっています。
     ・style.css の .hero-wrapper::after … 全面にかける暗幕（inset: 0）
     ・TOPのブロックCSS #sec_1782110119323::after … 「SCROLL DOWN」の縦書きラベル
       （right: clamp(14px,2vw,30px) / bottom: 34px）
   擬似要素は1つしかないため両方が合成され、暗幕の箱が
   「右28px・下34pxだけ足りない大きな四角」になって隙間に見えていました。

   対処：::after は SCROLL DOWN ラベル専用にして、暗幕を外します。
   （MVの暗さは各スライドの .hero-slide::after が受け持っているので変わりません） */
#sec_1782110119323::after{
  top: auto !important;
  left: auto !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
}

/* ---- 2) 店舗概要の文字サイズ（15px → 16px） --------------------------- */
#sec_1785931790498 .store-info-table th,
#sec_1785931790498 .store-info-table td{
  font-size: 16px !important;
  line-height: 1.95 !important;
  font-family: var(--font-serif, "Shippori Mincho", serif) !important;  /* 指示書：明朝体 */
}
@media (max-width: 900px){
  #sec_1785931790498 .store-info-table th,
  #sec_1785931790498 .store-info-table td{ font-size: 16px !important; }
}

/* ---- 3) GALLERYの背景が粗い問題 ---------------------------------------
   PC：cover 指定で画面幅いっぱいまで約3倍に引き伸ばされていたのが原因。
   スマホ：拡大は直っても、タイルが1倍サイズのままだと
           Retina（2〜3倍密度）の画面で1ドットが2〜3ドットに引き伸ばされ、
           まだ少しにじんで見えます。→ 2倍サイズのタイルに差し替えます。 */
#sec_1788238305680.image-grid-section{
  --fc-bg-overlay: rgba(0,0,0,0);
  /* ▼ 2倍サイズのタイル（bg_gold_pattern@2x.webp／1280×852）を
     デザイン設定の背景画像に指定したうえで、表示は640px幅に縮めます。
     こうするとスマホ（Retina）でも1ドットずつ描かれ、にじみません。
     1倍のタイル（640×426）のままなら、この行を auto に戻してください。 */
  background-size: 640px auto !important;
  background-repeat: repeat !important;   /* 柄として敷き詰める */
  background-position: center top !important;
  background-color: #c8a05c !important;
}
@media (min-width: 901px){
  #sec_1788238305680.image-grid-section{ background-attachment: fixed !important; }
}

/* ---- 4) 改行位置（当店のご案内／CONCEPT／SYSTEM／RECRUIT） --------------
   現在は禁則処理だけが効いている状態です。
   文節で折り返す指定と、端数1文字の行を作らない指定を足します。 */
.booty-intro__body p,
.booty-feature__body p,
.booty-access-cta p,
.booty-top-content p:not(.booty-kicker):not(.booty-feature__number){
  word-break: auto-phrase !important;   /* 文節で折り返す */
  line-break: strict !important;        /* 禁則処理 */
  text-wrap: pretty !important;         /* 最終行が1〜2文字にならないようにする */
}
/* 見出しは単語の途中で折らない */
.booty-intro__body h2,
.booty-feature__body h2,
.booty-feature__body h3,
.booty-access-cta h2{
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

/* ---- 5) 中央揃えの英字ラベルが少し左右にズレる問題 ----------------------
   字間（letter-spacing）は最後の1文字の後ろにも入るため、
   中央揃えだとその分だけ文字が寄ります。半分を戻して中央に合わせます。 */
.fc-instagram-embed-label,
.booty-access-cta__label{
  text-indent: .15em !important;
}

/* ---- 6) 追従バーの色をフッターに合わせる -------------------------------
   バーだけ赤にすると、上のフッター（ローズ系）から色が急に変わって浮きます。
   フッターと完全に同じ配色（#70414d → #9a5d68 → #bf7d84）にそろえています。 */
.fc-floating-actions{
  background:
    radial-gradient(circle at 18% 0%, rgba(255, 228, 190, .34), transparent 36%),
    linear-gradient(145deg, #70414d 0%, #9a5d68 58%, #bf7d84 100%) !important;
}

/* Instagramボタンだけ、指示書のポイントカラー（赤）のままにしています。
   バーの色に馴染ませたい場合は、下の1行を
   linear-gradient(135deg, #b23d56, #7d3549) に戻してください。 */
.fc-floating-instagram{
  background: linear-gradient(135deg, #c03a44, #8d232b) !important;
  border: 1px solid rgba(255, 229, 186, .62) !important;
}

/* ---- 7) 「当店のご案内」の2段落目を2行に収める（2026-09-05 追加） -------
   文章側の列が493pxしかなく、
   「ゆっくりとした二次会まで、思い思いの時間を過ごしていただけます。」（532px必要）
   が収まらずに3行になっていました。左右の列を同じ幅にして余白を詰めます。
   ※ 列幅を広げるだけだと、今度は1行目が「…ゆっくりと」まで伸びて
     「ゆっくりと／した」で割れるため、原稿側に改行を1つ入れる必要があります
     （下の .br-pc と、HTMLの追記をセットで使ってください）。 */
/* ★PC・タブレットのみ。901px未満はTOP側の1カラム指定をそのまま使います。
   （メディアクエリを付けないと、スマホでも2カラムのままになり
     右側にはみ出して文字が切れます） */
@media (min-width: 901px){
  .booty-intro{
    grid-template-columns: minmax(0, 1fr) minmax(360px, 1fr) !important;
    gap: clamp(34px, 4.6vw, 72px) !important;
  }
}

/* PC・タブレットだけ有効になる改行。スマホでは無視されます */
.br-pc{ display: inline; }
@media (max-width: 900px){
  .br-pc{ display: none; }
}

/* ---- 8) Instagramセクションの背景を拡大しない（2026-09-05 追加） -------
   このブロックは「デザイン設定の背景画像」を、ブロック自身が
   <style id="bg-fc-instagram-embed-○○">#fc-instagram-embed-○○{ … cover … }</style>
   という形（ID指定・!important）で body 内に書き出します。
   ID指定にはクラス指定では勝てないため、次のどちらかで対応してください。

   【推奨】デザイン設定の「背景画像」を空にして、下のCSSで直接指定する
           （IDに依存しないので、InstagramのURLを変えても崩れません）        */
section.fc-instagram-embed-section{
  background-image: url("/image/assets/asset_20260901172722_6a968c6a55b9f.webp") !important;
  background-size: auto !important;          /* 原寸のまま＝拡大しない */
  background-repeat: no-repeat !important;   /* 1枚だけ置く（柄ではないため） */
  background-position: center top !important;
  background-color: #161e2a !important;      /* 画像の端と同じ色。左右の余白がなじみます */
}

/* 【簡易】デザイン設定の背景画像を残したまま直す場合は、こちらを使ってください。
   ※ InstagramのURLを変更するとIDが変わるので、その都度差し替えが必要です。
section#fc-instagram-embed-ff948a7d{
  background-size: auto !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-color: #161e2a !important;
}
*/

/* Block: custom_html / sec_1788760317963 */
/* =========================================================
   SYSTEMページ リード（カスタムHTMLブロック）
   bar Booty  ver.1  2026-09-01
   置き場所：料金カードの前にあるカスタムHTMLブロックの
             「ブロック個別CSS」欄（中身は全部消して置き換え）
   ※ 今入っている .custom-html-wrapper のリセットCSSは、
     ブロック側が自動で出力しているので消して大丈夫です
========================================================= */

.sys-lead-section{
  background: #0f1516;
  padding: 104px 20px 0;
}
.sys-lead{
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr);
  gap: 60px;
  align-items: center;
}

/* ---- 写真（大きい写真＋右下に小さい写真を重ねる） ---- */
.sys-lead-media{
  position: relative;
  padding-bottom: 54px;
}
.sys-lead-photo{
  margin: 0;
  overflow: hidden;
  border-radius: 4px;
  background: #0b1011;
  box-shadow: 0 30px 70px rgba(0,0,0,.5);
}
.sys-lead-photo img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.04) contrast(1.03) brightness(.97);
}
.sys-lead-photo.is-main{
  position: relative;
  aspect-ratio: 4 / 3;
}
/* 大きい写真の内側に細いゴールドの枠 */
.sys-lead-photo.is-main::after{
  content: "";
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(246,207,122,.34);
  pointer-events: none;
}
.sys-lead-photo.is-sub{
  position: absolute;
  right: -10px;
  bottom: 0;
  width: 46%;
  aspect-ratio: 3 / 2;
  border: 4px solid #0f1516;
  border-radius: 4px;
}

/* ---- 文章 ---- */
.sys-lead-en{
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 20px;
  font-family: var(--font-en, "Montserrat", sans-serif);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .3em;
  color: var(--fc-label, #f4d995);
  white-space: nowrap;
}
.sys-lead-en::after{
  content: "";
  flex: 1 1 auto;
  max-width: 110px;
  height: 1px;
  background: linear-gradient(90deg, rgba(197,162,90,.65), rgba(197,162,90,0));
}
.sys-lead-title{
  margin: 0 0 22px;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: clamp(21px, 2.1vw, 30px);
  font-weight: 800;
  line-height: 1.75;
  letter-spacing: .08em;
  color: var(--fc-title, #fff7ea);
  /* 見出しが単語の途中で折れないように */
  word-break: keep-all;
  line-break: strict;
  text-wrap: balance;
}
.sys-lead-text{
  margin: 0;
  font-family: var(--font-serif, "Shippori Mincho", serif);
  font-size: 16px;
  line-height: 2.15;
  letter-spacing: .04em;
  color: var(--fc-body, #fff7ea);
  /* 日本語の改行整形：文節で折る／禁則処理／端数1文字の行を作らない */
  word-break: auto-phrase;
  line-break: strict;
  text-wrap: pretty;
}

/* ---- タブレット・スマートフォン ---- */
@media (max-width: 900px){
  .sys-lead-section{ padding: 74px 18px 0; }
  .sys-lead{
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .sys-lead-media{ padding-bottom: 40px; }
  .sys-lead-photo.is-sub{ width: 44%; right: -4px; border-width: 3px; }
  .sys-lead-photo.is-main::after{ inset: 9px; }
  .sys-lead-en{ margin-bottom: 14px; gap: 12px; letter-spacing: .24em; }
  .sys-lead-en::after{ max-width: 70px; }
  .sys-lead-title{
    font-size: 20px;
    line-height: 1.8;
    letter-spacing: .04em;
    margin-bottom: 16px;
  }
  .sys-lead-text{ font-size: 15px; line-height: 2.05; }
}

/* Block: course_list / sec_1788760325328 */
/* =========================================================
   SYSTEM（料金）ページ／完全版
   bar Booty  2026-09-05

   置き場所：SYSTEMページ「コース・飲み放題一覧」ブロック
             （sec_1788238456449）のブロック個別CSS欄
   入れ方　：現在のCSSをすべて削除し、このファイルへ丸ごと置き換え
   PHP・HTML：変更不要
========================================================= */

/* ---- 1) セクション ---- */
.course-list-section{
  position: relative !important;
  padding: 104px 20px 112px !important;
  background: #0f1516 !important;
  color: var(--fc-title, #fff7ea) !important;
  overflow: hidden !important;
  --fc-bg-overlay: rgba(0,0,0,0);
}

.course-list-section::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: radial-gradient(
    70% 46% at 50% 0%,
    rgba(214,168,88,.14),
    rgba(0,0,0,0) 62%
  ) !important;
}

.course-list-header,
.course-list-grid{
  position: relative !important;
  z-index: 1 !important;
}

/* ---- 2) 見出し・リード文 ---- */
.course-list-header{
  max-width: 760px !important;
  margin: 0 auto 54px !important;
  text-align: center !important;
}

.course-list-title{
  margin: 0 0 18px !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: clamp(24px, 3vw, 34px) !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
  letter-spacing: .14em !important;
  text-indent: .07em !important;
  color: var(--fc-title, #fff7ea) !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

.course-list-title::after{
  content: "" !important;
  display: block !important;
  width: 54px !important;
  height: 1px !important;
  margin: 20px auto 0 !important;
  background: linear-gradient(
    90deg,
    rgba(197,162,90,0),
    rgba(246,207,122,.9),
    rgba(197,162,90,0)
  ) !important;
}

.course-list-desc{
  margin: 0 !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: 16px !important;
  line-height: 2.15 !important;
  letter-spacing: .04em !important;
  color: var(--fc-body, #fff7ea) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

/* ---- 3) 料金カード ---- */
.course-list-grid{
  max-width: 1080px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)) !important;
  gap: 26px !important;
}

.course-list-card{
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border: 1px solid rgba(246,207,122,.24) !important;
  border-radius: 6px !important;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.06),
    rgba(255,255,255,.02)
  ) !important;
  transition:
    transform .4s cubic-bezier(.25,1,.5,1),
    border-color .4s ease,
    box-shadow .4s ease !important;
}

.course-list-card:hover{
  transform: translateY(-5px) !important;
  border-color: rgba(246,207,122,.6) !important;
  box-shadow: 0 26px 58px rgba(0,0,0,.5) !important;
}

/* 写真 */
.course-list-img{
  aspect-ratio: 3 / 2 !important;
  background: #131b1c !important;
  overflow: hidden !important;
  color: rgba(197,162,90,.5) !important;
  font-size: 34px !important;
}

.course-list-img img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  filter: saturate(1.04) contrast(1.03) brightness(.97) !important;
  transition: transform 1s cubic-bezier(.25,1,.5,1) !important;
}

@media (hover: hover){
  .course-list-card:hover .course-list-img img{
    transform: scale(1.06) !important;
  }
}

/* カード本文 */
.course-list-body{
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  padding: 26px 24px 28px !important;
  text-align: center !important;
}

/* 「○名様より」は予約機能用の値のため非表示 */
.course-list-kicker{
  display: none !important;
}

.course-list-body h3{
  margin: 0 0 14px !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  line-height: 1.7 !important;
  letter-spacing: .06em !important;
  color: var(--fc-title, #fff7ea) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

.course-list-text{
  margin: 0 0 18px !important;
  min-height: 0 !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: 14px !important;
  line-height: 1.95 !important;
  letter-spacing: .02em !important;
  color: var(--fc-body, #fff7ea) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

/*
  金額・税込表記を明朝体へ統一。
  セクションIDも併記し、共通CSS側のMontserrat指定より確実に優先する。
*/
#sec_1788760325328 .course-list-price{
  margin: auto 0 0 !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(246,207,122,.18) !important;
  font-family: "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif !important;
  font-size: 30px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: .02em !important;
  color: var(--fc-title, #fff7ea) !important;
  white-space: nowrap !important;
}

#sec_1788760325328 .course-list-price small{
  margin-left: 8px !important;
  font-family: "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--fc-muted, rgba(255,247,232,.66)) !important;
  white-space: nowrap !important;
}

/* ---- 4) 注意書き用フリーテキストブロック ---- */
.free-text-section{
  padding: 96px 20px 112px !important;
  background: #0f1516 !important;
  color: var(--fc-title, #fff7ea) !important;
  text-align: center !important;
}

.course-list-section + .free-text-section{
  padding-top: 0 !important;
}

.free-text-container{
  max-width: 860px !important;
  margin: 0 auto !important;
  padding: 36px 40px 38px !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(246,207,122,.2) !important;
  border-left: 3px solid var(--gold, #c5a25a) !important;
  border-radius: 6px !important;
  box-shadow: 0 22px 54px rgba(0,0,0,.4) !important;
  text-align: left !important;
}

.free-text-title{
  margin: 0 0 18px !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 1.6 !important;
  letter-spacing: .1em !important;
  color: var(--fc-title, #fff7ea) !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

.free-text-desc{
  margin: 0 !important;
  font-family: var(--font-serif, "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif) !important;
  font-size: 15px !important;
  line-height: 2.15 !important;
  letter-spacing: .04em !important;
  color: var(--fc-body, #fff7ea) !important;
  word-break: auto-phrase !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

.free-text-container .fc-block-btn-wrap{
  margin-top: 26px !important;
  text-align: center !important;
}

/* ---- 5) 写真未登録の料金カード ---- */
.course-list-card:not(:has(.course-list-img img)) .course-list-img{
  display: none !important;
}

.course-list-card:not(:has(.course-list-img img)){
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.075),
    rgba(255,255,255,.025)
  ) !important;
}

.course-list-card:not(:has(.course-list-img img))::before{
  content: "" !important;
  display: block !important;
  height: 2px !important;
  background: linear-gradient(
    90deg,
    rgba(197,162,90,0),
    rgba(246,207,122,.85),
    rgba(197,162,90,0)
  ) !important;
}

.course-list-card:not(:has(.course-list-img img)) .course-list-body{
  padding: 38px 26px 34px !important;
}

/* ---- 6) 管理画面で指定した背景画像 ---- */
#sec_1788760325328.course-list-section{
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-color: #0f1516 !important;
}

/* 背景画像のみを明るくし、文字やカードの明るさは維持 */
#sec_1788760325328.course-list-section::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  backdrop-filter: brightness(1.6) saturate(1.05) !important;
  -webkit-backdrop-filter: brightness(1.6) saturate(1.05) !important;
  background:
    linear-gradient(180deg, rgba(15,21,22,.9) 0%, rgba(15,21,22,0) 22%),
    linear-gradient(0deg, rgba(15,21,22,.9) 0%, rgba(15,21,22,0) 22%) !important;
}

#sec_1788760325328 .course-list-header{
  padding: 10px 24px 14px !important;
  background: radial-gradient(
    70% 150% at 50% 46%,
    rgba(8,11,12,.72) 0%,
    rgba(8,11,12,0) 74%
  ) !important;
}

#sec_1788760325328 .course-list-card,
#sec_1788760325328 .course-list-card:not(:has(.course-list-img img)){
  background: rgba(9,13,14,.72) !important;
  border-color: rgba(246,207,122,.34) !important;
  backdrop-filter: blur(8px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.08) !important;
}

/* ---- 7) タブレット・スマートフォン ---- */
@media (max-width: 900px){
  .course-list-section{
    padding: 74px 18px 80px !important;
  }

  .course-list-header{
    margin-bottom: 38px !important;
  }

  #sec_1788760325328 .course-list-header{
    padding: 8px 12px 12px !important;
  }

  .course-list-desc{
    font-size: 15px !important;
    line-height: 2.05 !important;
    text-align: left !important;
  }

  .course-list-grid{
    grid-template-columns: minmax(0, 1fr) !important;
    max-width: 440px !important;
    gap: 20px !important;
  }

  .course-list-img{
    aspect-ratio: 16 / 9 !important;
  }

  .course-list-body{
    min-width: 0 !important;
    padding: 22px 20px 24px !important;
  }

  .course-list-body h3{
    font-size: 18px !important;
  }

  #sec_1788760325328 .course-list-price{
    padding-top: 15px !important;
    font-size: 27px !important;
  }

  .free-text-section{
    padding: 70px 18px 80px !important;
  }

  .course-list-section + .free-text-section{
    padding-top: 0 !important;
  }

  .free-text-container{
    padding: 28px 22px 30px !important;
  }

  .free-text-title{
    font-size: 18px !important;
    letter-spacing: .06em !important;
  }

  .free-text-desc{
    font-size: 15px !important;
    line-height: 2.05 !important;
  }

  .free-text-container .fc-block-btn-wrap .fc-block-btn{
    width: 100% !important;
    max-width: 320px !important;
  }

  .course-list-card:not(:has(.course-list-img img)) .course-list-body{
    padding: 30px 22px 28px !important;
  }
}

@media (max-width: 380px){
  .course-list-section{
    padding-inline: 14px !important;
  }

  .course-list-body,
  .course-list-card:not(:has(.course-list-img img)) .course-list-body{
    padding-inline: 18px !important;
  }

  .course-list-body h3{
    font-size: 17px !important;
    letter-spacing: .035em !important;
  }

  #sec_1788760325328 .course-list-price{
    font-size: 25px !important;
  }
}


/* =========================================================
   Page: footer / FOOTER ページ
========================================================= */

/* Block: global_footer / sec_1782112173284 */
/* =========================================================
   bar Booty / global_footer 追加CSS
   貼り付け先: 管理画面 > FOOTERページ > 共通フッター > セクション個別CSS
   既存CSSの末尾に追加
========================================================= */

:root {
  --booty-footer-rose-1: #5f303b;
  --booty-footer-rose-2: #8b5360;
  --booty-footer-rose-3: #bd7c82;
  --booty-footer-cream: #fff7e8;
  --booty-footer-gold: #f0cf8a;
  --booty-footer-red: #a92d35;
}

/* 店舗情報・決済・フッター内Googleマップは表示しない */
.global-footer .info-grid {
  display: none !important;
}

.global-footer {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  padding: clamp(46px, 5vw, 72px) clamp(24px, 6vw, 88px) !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(255, 224, 181, .35), transparent 30%),
    radial-gradient(circle at 92% 100%, rgba(244, 181, 191, .34), transparent 32%),
    linear-gradient(118deg,
      var(--booty-footer-rose-1) 0%,
      var(--booty-footer-rose-2) 52%,
      var(--booty-footer-rose-3) 100%) !important;
  color: var(--booty-footer-cream) !important;
  border-top: 1px solid rgba(255, 235, 201, .58) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

.global-footer::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255, 255, 255, .025) 1px, transparent 1px) !important;
  background-size: 56px 56px !important;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 24%, #000 76%, transparent) !important;
  mask-image: linear-gradient(90deg, transparent, #000 24%, #000 76%, transparent) !important;
}

/* ロゴ左・ヘッダーと同じメニュー右のシンプル構成 */
.global-footer .footer-nav-wrap {
  position: relative !important;
  z-index: 1 !important;
  width: min(100%, 1180px) !important;
  min-height: 142px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(120px, 170px) minmax(0, 1fr) !important;
  grid-template-areas: "brand nav" !important;
  column-gap: clamp(36px, 6vw, 92px) !important;
  align-items: center !important;
  text-align: left !important;
}

.global-footer .footer-nav-brand {
  grid-area: brand !important;
  width: auto !important;
  margin: 0 !important;
  text-align: left !important;
}

.global-footer .footer-nav-logo {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--booty-footer-cream) !important;
}

.global-footer .footer-nav-logo img {
  width: 132px !important;
  height: 132px !important;
  max-height: none !important;
  display: block !important;
  object-fit: contain !important;
  filter: drop-shadow(0 12px 24px rgba(66, 22, 32, .3)) !important;
}

.global-footer .footer-nav-brand h2 {
  margin: 0 !important;
  color: var(--booty-footer-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: .12em !important;
  white-space: nowrap !important;
}

.global-footer .footer-nav {
  grid-area: nav !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px clamp(20px, 2.8vw, 38px) !important;
}

.global-footer .footer-nav-link {
  position: relative !important;
  min-height: 44px !important;
  padding: 11px 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  color: var(--booty-footer-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .12em !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  text-shadow: 0 2px 10px rgba(75, 25, 35, .28) !important;
}

.global-footer .footer-nav-link::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 5px !important;
  width: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, var(--booty-footer-gold), #fff1c8) !important;
  transition: width .28s ease !important;
}

.global-footer .footer-nav-link:hover {
  color: #fff !important;
}

.global-footer .footer-nav-link:hover::after {
  width: 100% !important;
}

.global-footer .footer-nav-link[href*="instagram.com"] {
  padding-right: 14px !important;
  padding-left: 14px !important;
  gap: 8px !important;
  border: 1px solid rgba(255, 239, 203, .7) !important;
  background: rgba(111, 40, 53, .18) !important;
}

.global-footer .footer-nav-link[href*="instagram.com"]::before {
  content: "\f16d" !important;
  font-family: "Font Awesome 6 Brands" !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

.global-footer .footer-nav-link[href*="instagram.com"]::after {
  display: none !important;
}

/* コピーライトも黒に戻さず、フッターとつながる明るさにする */
.footer-copy-text,
.footer-copy {
  padding: 18px 20px !important;
  background: #56303a !important;
  color: rgba(255, 247, 232, .86) !important;
  border-top: 1px solid rgba(255, 235, 201, .34) !important;
  font-family: var(--font-serif) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  letter-spacing: .08em !important;
}

/* PCではフローティングボタンを出さない */
.fc-floating-actions {
  display: none !important;
}

/* 前回のヘッダー用固定ボタンを追加済みでも二重表示にしない */
.mobile-quick-actions {
  display: none !important;
}

@media (max-width: 900px) {
  .global-footer .footer-nav-wrap {
    grid-template-columns: 118px minmax(0, 1fr) !important;
    column-gap: 30px !important;
  }

  .global-footer .footer-nav-logo img {
    width: 110px !important;
    height: 110px !important;
  }
}

@media (max-width: 768px) {
  .global-footer {
    padding: 44px 18px 38px !important;
    background:
      radial-gradient(circle at 18% 0%, rgba(255, 228, 190, .34), transparent 36%),
      linear-gradient(145deg, #70414d 0%, #9a5d68 58%, #bf7d84 100%) !important;
  }

  .global-footer .footer-nav-wrap {
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "brand"
      "nav" !important;
    row-gap: 30px !important;
    text-align: center !important;
  }

  .global-footer .footer-nav-brand {
    justify-self: center !important;
    text-align: center !important;
  }

  .global-footer .footer-nav-logo img {
    width: 96px !important;
    height: 96px !important;
  }

  .global-footer .footer-nav-brand h2 {
    font-size: 28px !important;
  }

  .global-footer .footer-nav {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px 10px !important;
  }

  .global-footer .footer-nav-link {
    min-width: 0 !important;
    min-height: 46px !important;
    padding: 11px 6px !important;
    justify-content: center !important;
    border-bottom: 1px solid rgba(255, 239, 203, .24) !important;
    font-size: 14px !important;
    letter-spacing: .08em !important;
  }

  .global-footer .footer-nav-link[href*="instagram.com"] {
    border: 1px solid rgba(255, 239, 203, .62) !important;
  }

  .footer-copy-text,
  .footer-copy {
    padding: 16px 14px calc(16px + env(safe-area-inset-bottom)) !important;
    font-size: 14px !important;
    letter-spacing: .04em !important;
  }

  body.has-floating-actions {
    padding-bottom: calc(78px + env(safe-area-inset-bottom)) !important;
  }

  /* スマホだけ追従。Instagram + ACCESSの2ボタン */
  .fc-floating-actions {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 2400 !important;
    min-height: calc(70px + env(safe-area-inset-bottom)) !important;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom)) !important;
    display: flex !important;
    flex-direction: row !important;
    gap: 8px !important;
    background: rgba(100, 54, 65, .96) !important;
    border-top: 1px solid rgba(255, 234, 194, .58) !important;
    box-shadow: 0 -10px 26px rgba(65, 26, 34, .25) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    pointer-events: none !important;
  }

  .fc-floating-phone,
  .fc-floating-reserve,
  .fc-floating-line {
    display: none !important;
  }

  .fc-floating-instagram,
  .fc-floating-access {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    min-height: 54px !important;
    padding: 8px 10px !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border-radius: 6px !important;
    color: #fff !important;
    font-family: var(--font-serif) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    letter-spacing: .06em !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    box-shadow: none !important;
    pointer-events: auto !important;
  }

  .fc-floating-instagram {
    background: linear-gradient(135deg, #b23d56, #7d3549) !important;
    border: 1px solid rgba(255, 229, 186, .62) !important;
  }

  .fc-floating-access {
    background: linear-gradient(135deg, #f0cf8a, #d8a95a) !important;
    border: 1px solid #f8dfaa !important;
    color: #4c2630 !important;
  }

  .fc-floating-instagram i,
  .fc-floating-access i {
    flex: 0 0 auto !important;
    color: inherit !important;
    font-size: 19px !important;
  }
}

@media (max-width: 360px) {
  .global-footer {
    padding-right: 14px !important;
    padding-left: 14px !important;
  }

  .global-footer .footer-nav-link,
  .fc-floating-instagram,
  .fc-floating-access {
    letter-spacing: .03em !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .global-footer *,
  .fc-floating-actions * {
    transition: none !important;
  }
}
/* =========================================================
   bar Booty / global_footer 追加CSS（PHP変更なし版）
   貼り付け先: 管理画面 > FOOTERページ > 共通フッター > セクション個別CSS
   既存CSSの末尾に追加
========================================================= */

:root {
  --booty-footer-rose-1: #5f303b;
  --booty-footer-rose-2: #8b5360;
  --booty-footer-rose-3: #bd7c82;
  --booty-footer-cream: #fff7e8;
  --booty-footer-gold: #f0cf8a;
  --booty-footer-red: #a92d35;
  /* ヘッダーと同じロゴ画像。画像を変更した場合は、このURLだけ差し替える */
  --booty-footer-logo: url("https://bar-booty.cms-stg.site/image/assets/asset_20260901174632_6a9690e8ebcc6.webp");
}

/* 店舗情報・決済・フッター内Googleマップは表示しない */
.global-footer .info-grid {
  display: none !important;
}

.global-footer {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  padding: clamp(46px, 5vw, 72px) clamp(24px, 6vw, 88px) !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(255, 224, 181, .35), transparent 30%),
    radial-gradient(circle at 92% 100%, rgba(244, 181, 191, .34), transparent 32%),
    linear-gradient(118deg,
      var(--booty-footer-rose-1) 0%,
      var(--booty-footer-rose-2) 52%,
      var(--booty-footer-rose-3) 100%) !important;
  color: var(--booty-footer-cream) !important;
  border-top: 1px solid rgba(255, 235, 201, .58) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

.global-footer::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255, 255, 255, .025) 1px, transparent 1px) !important;
  background-size: 56px 56px !important;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 24%, #000 76%, transparent) !important;
  mask-image: linear-gradient(90deg, transparent, #000 24%, #000 76%, transparent) !important;
}

/* ロゴ左・ヘッダーと同じメニュー右のシンプル構成 */
.global-footer .footer-nav-wrap {
  position: relative !important;
  z-index: 1 !important;
  width: min(100%, 1180px) !important;
  min-height: 142px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(120px, 170px) minmax(0, 1fr) !important;
  grid-template-areas: "brand nav" !important;
  column-gap: clamp(36px, 6vw, 92px) !important;
  align-items: center !important;
  text-align: left !important;
}

.global-footer .footer-nav-brand {
  grid-area: brand !important;
  width: auto !important;
  margin: 0 !important;
  text-align: left !important;
}

.global-footer .footer-nav-brand h2 {
  /* PHPを触らず、既存の店名見出しをロゴ画像として表示 */
  width: 132px !important;
  height: 132px !important;
  display: block !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: transparent !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  text-indent: -9999px !important;
  white-space: nowrap !important;
  background-image: var(--booty-footer-logo) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  filter: drop-shadow(0 12px 24px rgba(66, 22, 32, .3)) !important;
}

.global-footer .footer-nav {
  grid-area: nav !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px clamp(20px, 2.8vw, 38px) !important;
}

.global-footer .footer-nav-link {
  position: relative !important;
  min-height: 44px !important;
  padding: 11px 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  color: var(--booty-footer-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .12em !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  text-shadow: 0 2px 10px rgba(75, 25, 35, .28) !important;
}

.global-footer .footer-nav-link::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 5px !important;
  width: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, var(--booty-footer-gold), #fff1c8) !important;
  transition: width .28s ease !important;
}

.global-footer .footer-nav-link:hover {
  color: #fff !important;
}

.global-footer .footer-nav-link:hover::after {
  width: 100% !important;
}

.global-footer .footer-nav-link[href*="instagram.com"] {
  padding-right: 14px !important;
  padding-left: 14px !important;
  gap: 8px !important;
  border: 1px solid rgba(255, 239, 203, .7) !important;
  background: rgba(111, 40, 53, .18) !important;
}

.global-footer .footer-nav-link[href*="instagram.com"]::before {
  content: "\f16d" !important;
  font-family: "Font Awesome 6 Brands" !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

.global-footer .footer-nav-link[href*="instagram.com"]::after {
  display: none !important;
}

/* コピーライトも黒に戻さず、フッターとつながる明るさにする */
.footer-copy-text,
.footer-copy {
  padding: 18px 20px !important;
  background: #56303a !important;
  color: rgba(255, 247, 232, .86) !important;
  border-top: 1px solid rgba(255, 235, 201, .34) !important;
  font-family: var(--font-serif) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  letter-spacing: .08em !important;
}

/* PCではフローティングボタンを出さない */
.fc-floating-actions {
  display: none !important;
}

/* 前回のヘッダー用固定ボタンを追加済みでも二重表示にしない */
.mobile-quick-actions {
  display: none !important;
}

@media (max-width: 900px) {
  .global-footer .footer-nav-wrap {
    grid-template-columns: 118px minmax(0, 1fr) !important;
    column-gap: 30px !important;
  }

  .global-footer .footer-nav-brand h2 {
    width: 110px !important;
    height: 110px !important;
  }
}

@media (max-width: 768px) {
  .global-footer {
    padding: 44px 18px 38px !important;
    background:
      radial-gradient(circle at 18% 0%, rgba(255, 228, 190, .34), transparent 36%),
      linear-gradient(145deg, #70414d 0%, #9a5d68 58%, #bf7d84 100%) !important;
  }

  .global-footer .footer-nav-wrap {
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "brand"
      "nav" !important;
    row-gap: 30px !important;
    text-align: center !important;
  }

  .global-footer .footer-nav-brand {
    justify-self: center !important;
    text-align: center !important;
  }

  .global-footer .footer-nav-brand h2 {
    width: 96px !important;
    height: 96px !important;
  }

  .global-footer .footer-nav {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px 10px !important;
  }

  .global-footer .footer-nav-link {
    min-width: 0 !important;
    min-height: 46px !important;
    padding: 11px 6px !important;
    justify-content: center !important;
    border-bottom: 1px solid rgba(255, 239, 203, .24) !important;
    font-size: 14px !important;
    letter-spacing: .08em !important;
  }

  .global-footer .footer-nav-link[href*="instagram.com"] {
    border: 1px solid rgba(255, 239, 203, .62) !important;
  }

  .footer-copy-text,
  .footer-copy {
    padding: 16px 14px calc(16px + env(safe-area-inset-bottom)) !important;
    font-size: 14px !important;
    letter-spacing: .04em !important;
  }

  body.has-floating-actions {
    padding-bottom: calc(78px + env(safe-area-inset-bottom)) !important;
  }

  /* スマホだけ追従。Instagram + ACCESSの2ボタン */
  .fc-floating-actions {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 2400 !important;
    min-height: calc(70px + env(safe-area-inset-bottom)) !important;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom)) !important;
    display: flex !important;
    flex-direction: row !important;
    gap: 8px !important;
    background: rgba(100, 54, 65, .96) !important;
    border-top: 1px solid rgba(255, 234, 194, .58) !important;
    box-shadow: 0 -10px 26px rgba(65, 26, 34, .25) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    pointer-events: none !important;
  }

  .fc-floating-phone,
  .fc-floating-reserve {
    display: none !important;
  }

  .fc-floating-instagram,
  .fc-floating-line {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    min-height: 54px !important;
    padding: 8px 10px !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border-radius: 6px !important;
    color: #fff !important;
    font-family: var(--font-serif) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    letter-spacing: .06em !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    box-shadow: none !important;
    pointer-events: auto !important;
  }

  .fc-floating-instagram {
    background: linear-gradient(135deg, #b23d56, #7d3549) !important;
    border: 1px solid rgba(255, 229, 186, .62) !important;
  }

  /* 管理画面のLINE欄をACCESSボタンとして利用 */
  .fc-floating-line {
    background: linear-gradient(135deg, #f0cf8a, #d8a95a) !important;
    border: 1px solid #f8dfaa !important;
    color: #4c2630 !important;
  }

  .fc-floating-instagram i,
  .fc-floating-line::before {
    flex: 0 0 auto !important;
    color: inherit !important;
    font-size: 19px !important;
  }

  .fc-floating-line i {
    display: none !important;
  }

  .fc-floating-line::before {
    content: "\f3c5" !important;
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }
}

@media (max-width: 360px) {
  .global-footer {
    padding-right: 14px !important;
    padding-left: 14px !important;
  }

  .global-footer .footer-nav-link,
  .fc-floating-instagram,
  .fc-floating-line {
    letter-spacing: .03em !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .global-footer *,
  .fc-floating-actions * {
    transition: none !important;
  }
}
/* =========================================================
   bar Booty / global_footer 追加CSS（PHP変更なし版）
   貼り付け先: 管理画面 > FOOTERページ > 共通フッター > セクション個別CSS
   既存CSSの末尾に追加
========================================================= */

:root {
  --booty-footer-rose-1: #5f303b;
  --booty-footer-rose-2: #8b5360;
  --booty-footer-rose-3: #bd7c82;
  --booty-footer-cream: #fff7e8;
  --booty-footer-gold: #f0cf8a;
  --booty-footer-red: #a92d35;
  /* 透過ロゴを管理画面へアップロード後、その画像URLへこの1行だけ差し替える */
  --booty-footer-logo: url("https://bar-booty.cms-stg.site/image/assets/asset_20260901174632_6a9690e8ebcc6.webp");
}

/* 店舗情報・決済・フッター内Googleマップは表示しない */
.global-footer .info-grid {
  display: none !important;
}

.global-footer {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  padding: clamp(46px, 5vw, 72px) clamp(24px, 6vw, 88px) !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(255, 224, 181, .35), transparent 30%),
    radial-gradient(circle at 92% 100%, rgba(244, 181, 191, .34), transparent 32%),
    linear-gradient(118deg,
      var(--booty-footer-rose-1) 0%,
      var(--booty-footer-rose-2) 52%,
      var(--booty-footer-rose-3) 100%) !important;
  color: var(--booty-footer-cream) !important;
  border-top: 1px solid rgba(255, 235, 201, .58) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

.global-footer::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255, 255, 255, .025) 1px, transparent 1px) !important;
  background-size: 56px 56px !important;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 24%, #000 76%, transparent) !important;
  mask-image: linear-gradient(90deg, transparent, #000 24%, #000 76%, transparent) !important;
}

/* ロゴ左・ヘッダーと同じメニュー右のシンプル構成 */
.global-footer .footer-nav-wrap {
  position: relative !important;
  z-index: 1 !important;
  width: min(100%, 1180px) !important;
  min-height: 142px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(120px, 170px) minmax(0, 1fr) !important;
  grid-template-areas: "brand nav" !important;
  column-gap: clamp(36px, 6vw, 92px) !important;
  align-items: center !important;
  text-align: left !important;
}

.global-footer .footer-nav-brand {
  grid-area: brand !important;
  width: auto !important;
  margin: 0 !important;
  text-align: left !important;
}

.global-footer .footer-nav-brand h2 {
  /* PHPを触らず、既存の店名見出しをロゴ画像として表示 */
  width: 132px !important;
  height: 132px !important;
  display: block !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: transparent !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  text-indent: -9999px !important;
  white-space: nowrap !important;
  background-image: var(--booty-footer-logo) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  filter: drop-shadow(0 12px 24px rgba(66, 22, 32, .3)) !important;
}

.global-footer .footer-nav {
  grid-area: nav !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px clamp(20px, 2.8vw, 38px) !important;
}

.global-footer .footer-nav-link {
  position: relative !important;
  min-height: 44px !important;
  padding: 11px 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  color: var(--booty-footer-cream) !important;
  font-family: var(--font-serif) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .12em !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  text-shadow: 0 2px 10px rgba(75, 25, 35, .28) !important;
}

.global-footer .footer-nav-link::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 5px !important;
  width: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, var(--booty-footer-gold), #fff1c8) !important;
  transition: width .28s ease !important;
}

.global-footer .footer-nav-link:hover {
  color: #fff !important;
}

.global-footer .footer-nav-link:hover::after {
  width: 100% !important;
}

.global-footer .footer-nav-link[href*="instagram.com"] {
  padding-right: 14px !important;
  padding-left: 14px !important;
  gap: 8px !important;
  border: 1px solid rgba(255, 239, 203, .7) !important;
  background: rgba(111, 40, 53, .18) !important;
}

.global-footer .footer-nav-link[href*="instagram.com"]::before {
  content: "\f16d" !important;
  font-family: "Font Awesome 6 Brands" !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

.global-footer .footer-nav-link[href*="instagram.com"]::after {
  display: none !important;
}

/* コピーライトも黒に戻さず、フッターとつながる明るさにする */
.footer-copy-text,
.footer-copy {
  padding: 18px 20px !important;
  background: #56303a !important;
  color: rgba(255, 247, 232, .86) !important;
  border-top: 1px solid rgba(255, 235, 201, .34) !important;
  font-family: var(--font-serif) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  letter-spacing: .08em !important;
}

/* PCではフローティングボタンを出さない */
.fc-floating-actions {
  display: none !important;
}

/* 前回のヘッダー用固定ボタンを追加済みでも二重表示にしない */
.mobile-quick-actions {
  display: none !important;
}

@media (max-width: 900px) {
  .global-footer .footer-nav-wrap {
    grid-template-columns: 118px minmax(0, 1fr) !important;
    column-gap: 30px !important;
  }

  .global-footer .footer-nav-brand h2 {
    width: 110px !important;
    height: 110px !important;
  }
}

@media (max-width: 768px) {
  .global-footer {
    padding: 44px 18px 38px !important;
    background:
      radial-gradient(circle at 18% 0%, rgba(255, 228, 190, .34), transparent 36%),
      linear-gradient(145deg, #70414d 0%, #9a5d68 58%, #bf7d84 100%) !important;
  }

  .global-footer .footer-nav-wrap {
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "brand"
      "nav" !important;
    row-gap: 30px !important;
    text-align: center !important;
  }

  .global-footer .footer-nav-brand {
    justify-self: center !important;
    text-align: center !important;
  }

  .global-footer .footer-nav-brand h2 {
    width: 96px !important;
    height: 96px !important;
  }

  .global-footer .footer-nav {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px 10px !important;
  }

  .global-footer .footer-nav-link {
    min-width: 0 !important;
    min-height: 46px !important;
    padding: 11px 6px !important;
    justify-content: center !important;
    border-bottom: 1px solid rgba(255, 239, 203, .24) !important;
    font-size: 14px !important;
    letter-spacing: .08em !important;
  }

  .global-footer .footer-nav-link[href*="instagram.com"] {
    border: 1px solid rgba(255, 239, 203, .62) !important;
  }

  .footer-copy-text,
  .footer-copy {
    padding: 16px 14px calc(16px + env(safe-area-inset-bottom)) !important;
    font-size: 14px !important;
    letter-spacing: .04em !important;
  }

  body.has-floating-actions {
    padding-bottom: calc(78px + env(safe-area-inset-bottom)) !important;
  }

  /* スマホだけ追従。Instagram + ACCESSの2ボタン */
  .fc-floating-actions {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 2400 !important;
    min-height: calc(70px + env(safe-area-inset-bottom)) !important;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom)) !important;
    display: flex !important;
    flex-direction: row !important;
    gap: 8px !important;
    background: rgba(100, 54, 65, .96) !important;
    border-top: 1px solid rgba(255, 234, 194, .58) !important;
    box-shadow: 0 -10px 26px rgba(65, 26, 34, .25) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    pointer-events: none !important;
  }

  .fc-floating-phone,
  .fc-floating-line,
  .fc-floating-reserve:not([href*="slug=access"]) {
    display: none !important;
  }

  .fc-floating-instagram,
  .fc-floating-reserve[href*="slug=access"] {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    min-height: 54px !important;
    padding: 8px 10px !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border-radius: 6px !important;
    color: #fff !important;
    font-family: var(--font-serif) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    letter-spacing: .06em !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    box-shadow: none !important;
    pointer-events: auto !important;
  }

  .fc-floating-instagram {
    background: linear-gradient(135deg, #b23d56, #7d3549) !important;
    border: 1px solid rgba(255, 229, 186, .62) !important;
  }

  /* 管理画面のWEB予約欄に登録済みのACCESSリンクを2つ目の固定ボタンとして利用 */
  .fc-floating-reserve[href*="slug=access"] {
    background: linear-gradient(135deg, #f0cf8a, #d8a95a) !important;
    border: 1px solid #f8dfaa !important;
    color: #4c2630 !important;
  }

  .fc-floating-instagram i,
  .fc-floating-reserve[href*="slug=access"]::before {
    flex: 0 0 auto !important;
    color: inherit !important;
    font-size: 19px !important;
  }

  .fc-floating-reserve[href*="slug=access"] i {
    display: none !important;
  }

  .fc-floating-reserve[href*="slug=access"]::before {
    content: "\f3c5" !important;
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }
}

@media (max-width: 360px) {
  .global-footer {
    padding-right: 14px !important;
    padding-left: 14px !important;
  }

  .global-footer .footer-nav-link,
  .fc-floating-instagram,
  .fc-floating-reserve[href*="slug=access"] {
    letter-spacing: .03em !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .global-footer *,
  .fc-floating-actions * {
    transition: none !important;
  }
}
/* ---- 6) 追従バー・Instagramボタンを指示書のポイントカラー（赤）へ -------
   現在はローズ系（#70414d〜#bf7d84 / #b23d56〜#7d3549）です。
   指示書のポイントカラーは赤なので、赤系に寄せています。
   ※ フッター全体もローズ系なので、フッターも赤に寄せるかは要判断です。 */
.fc-floating-actions{
  background:
    radial-gradient(circle at 18% 0%, rgba(255, 228, 190, .34), transparent 36%),
    linear-gradient(145deg, #70414d 0%, #9a5d68 58%, #bf7d84 100%) !important;
}
.fc-floating-instagram{
  background: linear-gradient(135deg, #c03a44, #8d232b) !important;
  border: 1px solid rgba(255, 229, 186, .62) !important;
}
/* =========================================================
   フッター背景を少し赤寄りに調整
========================================================= */

:root {
  --booty-footer-rose-1: #70252d;
  --booty-footer-rose-2: #a63a45;
  --booty-footer-rose-3: #d45b65;
}

/* コピーライト部分も赤寄りに */
.footer-copy-text,
.footer-copy {
  background: #5f2831 !important;
}

/* スマホ側は色が直接指定されているため別途上書き */
@media (max-width: 768px) {
  .global-footer {
    background:
      radial-gradient(
        circle at 18% 0%,
        rgba(255, 228, 190, .30),
        transparent 36%
      ),
      linear-gradient(
        145deg,
        #74303a 0%,
        #a64a56 58%,
        #ce6d75 100%
      ) !important;
  }
}