/* =========================================================
   Forchestra Theme - style.css (Consolidated Full)
   - Key fix: TOP "LINE UP" styles are scoped to .lineup only
     so SUPPORT (which reuses .logo-item) will not break.
========================================================= */

/* ============ RESET / BASIC ============ */

*,
*::before,
*::after { box-sizing: border-box; }

html,
body{
  margin: 0;
  padding: 0;
  max-width: 100%;
  overflow-x: hidden; /* 横スクロール防止 */
}

html{ scroll-behavior: smooth; }

img{
  max-width: 100%;
  height: auto;
  display: block;
}

body{
  font-family: "ten-mincho-text", "YuMincho", "Hiragino Mincho ProN", serif;
  font-weight: 400;
  color: #333;
  background-color: #fff;
  line-height: 1.8;
}

/* a のデフォルト下線を消したい場合の基本（必要最低限） */
a{ color: inherit; }

/* ============ HEADER ============ */

.header{
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  height: 80px;
  padding: 0 20px;

  display: flex;
  justify-content: space-between;
  align-items: center;

  background-color: #fff;
  border-bottom: 1px solid #eee;
  z-index: 5000;
}

.logo img{ height: 40px; }

.header-icons{
  display: flex;
  align-items: center;
  gap: 24px;
}

.header-instagram img{
  width: 22px;
  height: 22px;
}

/* ハンバーガー */
.hamburger{
  width: 28px;
  height: 22px;
  padding: 0;
  border: none;
  background: none;

  display: flex;
  flex-direction: column;
  justify-content: space-between;

  cursor: pointer;
}

.hamburger span{
  width: 100%;
  height: 2px;
  background: #333;
}

/* ============ OVERLAY MENU ============ */

.menu-overlay{
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  background: #ffffff;

  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;

  z-index: 9000;
}

.menu-overlay.active{
  opacity: 1;
  visibility: visible;
}

.overlay-header{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 40px;
}

.overlay-logo{ height: 40px; }

/* ×ボタン */
.close-btn{
  width: 28px;
  height: 28px;
  background: none;
  border: none;
  cursor: pointer;
  position: relative;
}

.close-btn span{
  position: absolute;
  width: 100%;
  height: 2px;
  background: #333;
  top: 13px;
}

.close-btn span:first-child{ transform: rotate(45deg); }
.close-btn span:last-child{ transform: rotate(-45deg); }

/* メニューリスト */
.overlay-menu{
  margin-top: 80px;
  list-style: none;
  padding: 0;
  text-align: center;
}

.overlay-menu li{ margin: 18px 0; }

.overlay-menu a{
  position: relative;
  display: inline-block;
  padding-bottom: 30px;
  text-decoration: none;
  color: #7c7066;
  font-size: 1rem;
  letter-spacing: 4px;
  transition: color 0.3s ease;
}

.overlay-menu a::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 0;
  height: 1px;
  background-color: #7c7066;
  transition: width 0.3s ease;
}

.overlay-menu a:hover{ color: #000; }
.overlay-menu a:hover::after{ width: 60%; }

/* ============ MAIN VISUAL ============ */

.main-visual{
  margin-top: 80px; /* ヘッダー分 */
  position: relative;
  text-align: center;
}

.main-visual img{
  width: 100%;
  height: auto;
}

.main-visual .btn{
  display: inline-block;
  margin: 20px auto;
}

/* ============ 共通ボタン ============ */

.btn{
  display: inline-block;
  padding: 10px 30px;
  border: 1px solid #aaa;
  text-decoration: none;
  color: #333;
  transition: 0.3s;
  font-size: 0.9rem;
}

.btn:hover{
  background-color: #333;
  color: #fff;
}

.btn-outline{
  display: inline-block;
  padding: 10px 40px;
  border: 1px solid #000;
  text-decoration: none;
  color: #000;
  font-size: 0.9rem;
  letter-spacing: 2px;
  transition: 0.3s;
}

.btn-outline:hover{
  background-color: #000;
  color: #fff;
}

/* ============ 見出し共通 ============ */

.en-heading{
  font-family: "ten-mincho-text", "YuMincho", "Hiragino Mincho ProN", serif;
  font-weight: 300;
  font-style: normal;
  font-size: 2.5rem;
  letter-spacing: 0.3em;
  text-align: center;
  margin: 80px 0 40px;
}

.section-heading{
  font-family: "ten-mincho-text", "YuMincho", "Hiragino Mincho ProN", serif;
  font-weight: 300;
  font-size: 2.5rem;
  letter-spacing: 0.35em;
  text-align: center;
  margin: 0 0 40px;
}

/* LINE UP 見出し（上に点線） */
.en-heading.lineup-heading{
  position: relative;
  margin: 80px 0 40px;
  padding-top: 40px;
}
.en-heading.lineup-heading::before{
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  max-width: 1100px;
  border-top: 1px dotted #d3cfc9;
}

/* ============ PERFORMANCE（TOP） ============ */

.performance{
  text-align: center;
  padding: 80px 20px;
  border-top: 1px dotted #d3cfc9;
  margin-top: 60px;
}

.performance h2{
  letter-spacing: 3px;
  font-weight: normal;
  margin-bottom: 10px;
}

.performance p{
  font-size: 0.9rem;
  color: #777;
  margin-bottom: 40px;
}

.performance-item{ margin-bottom: 60px; }

.performance-item img{
  width: 90%;
  max-width: 600px;
  margin: 20px auto;
  border: 1px solid #eee;
}

/* =========================================================
   TOP: LINE UP / SHOKU / MONO / WORKSHOP (Shared structure)
   ※ IMPORTANT: Support also uses .logo-item.
     → TOPのLINE UPだけ .lineup 内で完結して上書きします
========================================================= */

.lineup{
  padding: 40px 0 0;
}

/* 各ブロックの余白 */
.lineup .lineup-block{
  padding: 70px 20px;
  text-align: center;
}

/* 見出し（タイケン / タベル / モノ） */
.lineup .section-title{
  font-size: 1.4rem;
  letter-spacing: 5px;
  margin: 0 0 40px;
  font-weight: 300;
  position: relative;
  padding: 24px 0;
}

.lineup .section-title::before,
.lineup .section-title::after{
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  max-width: 1100px;
  border-top: 1px dotted #d3cfc9;
}
.lineup .section-title::before{ top: 0; }
.lineup .section-title::after{ bottom: 0; }

/* ---------- TOP LINE UP：グリッド ---------- */
/* .workshop-logos / .shoku-logos / .mono-logos はPHPのまま活かす */
.lineup .workshop-logos,
.lineup .shoku-logos,
.lineup .mono-logos{
  width: min(1100px, calc(100% - 0px));
  margin: 0 auto 44px;

  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px 14px;
  justify-items: center;
  align-items: start;
}

/* タブレット */
@media (min-width: 768px){
  .lineup .workshop-logos,
  .lineup .shoku-logos,
  .lineup .mono-logos{
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 36px 18px;
  }
}

/* PC */
@media (min-width: 1024px){
  .lineup .workshop-logos,
  .lineup .shoku-logos,
  .lineup .mono-logos{
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 44px 22px;
  }
}

/* ---------- TOP LINE UP：カード（画像＋店名） ---------- */
.lineup .logo-item{
  width: 100%;
  text-align: center;
}

.lineup .logo-item a{
  display: block;
  width: 100%;
  text-decoration: none;
  color: inherit;

  transform: translateY(0);
  transition: transform 220ms ease;
  will-change: transform;
}

/* 画像：タイル（角丸なし・cover） */
.lineup .logo-item img{
  width: 100%;
  height: auto;

  aspect-ratio: 4 / 3;
  object-fit: cover;

  border-radius: 0;     /* 角丸なし（要件） */
  background: #f3f3f3;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08);

  transition: box-shadow 220ms ease, transform 220ms ease;
  will-change: transform;
}

/* 店名 */
.lineup .logo-item p{
  margin: 10px 0 0;
  font-size: 0.82rem;
  letter-spacing: 0.02em;
  color: #555;

  /* 長い店名の段落崩れ防止 */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}

/* hover：画像だけじゃなくセットで浮かせる */
.lineup .logo-item a:hover,
.lineup .logo-item a:focus-visible{
  transform: translateY(-8px);
}

.lineup .logo-item a:hover img,
.lineup .logo-item a:focus-visible img{
  transform: scale(1.02);
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.12);
}

.lineup .logo-item a:focus-visible{
  outline: 2px solid rgba(0,0,0,0.45);
  outline-offset: 4px;
}

/* LINE UP 下のボタン */
.lineup .workshop-button{
  text-align: center;
  margin-top: 20px;
}

/* =========================================================
   SUPPORT（TOP）
   - TOP LINE UP のタイル設定を侵食しないよう、ここで支える
========================================================= */

.support{
  text-align: center;
  padding: 60px 20px;
}

/* SUPPORTの文章の装飾は切る */
.support p{
  border: none;
  text-decoration: none;
}

/* SUPPORT内のロゴ配置は .workshop-logos を流用しているので、
   ここで SUPPORT 用の “見た目” を指定（画像サイズは変えない） */
.support .workshop-logos{
  max-width: 1100px;
  margin: 0 auto 40px;

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 40px 20px;
  justify-items: center;
  align-items: start;
}

.support .logo-item{
  text-align: center;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;

  transform: translateY(0);
  transition: transform 220ms ease;
  will-change: transform;
}

.support .logo-item a{
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;

  text-decoration: none;
  color: inherit;
}

/* SUPPORTの画像：固定サイズ（今までの見た目に近い） */
.support .logo-item img{
  width: 130px;
  height: 130px;
  object-fit: contain;
  margin-bottom: 0;

  transition: box-shadow 220ms ease;
}

/* SUPPORT：画像だけ拡大はしない（サイズ変更なし） */
.support .logo-item:hover img{
  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.15);
}

/* SUPPORT：画像＋テキストがセットで浮く */
.support .logo-item:hover,
.support .logo-item:focus-within{
  transform: translateY(-8px);
}

.support .logo-item a:focus-visible{
  outline: 2px solid rgba(0,0,0,0.45);
  outline-offset: 4px;
}

/* =========================================================
   EVENT TEAM（SUPPORT）：一部ロゴだけ小さくする
   対象：フジタカデザイン / yŌl / 大工屋工房 芯
========================================================= */
.support .logo-item.is-small-logo img{
  width: 100px;   /* ここで小ささ調整（例：100〜120） */
  height: 130px;
  object-fit: contain; /* 見切れ防止 */
}

/* ============ FOOTER ============ */

.footer{
  text-align: center;
  padding: 20px;
  font-size: 0.8rem;
  color: #888;
  border-top: 1px solid #eee;
}



/* =========================================================
   Responsive (Global)
========================================================= */

@media screen and (max-width: 768px){
  .header{
    padding: 0 12px;
    height: 64px;
  }

  .main-visual{ margin-top: 64px; }

  .btn{
    font-size: 0.8rem;
    padding: 8px 20px;
  }

  .en-heading{
    font-size: 1.6rem;
    letter-spacing: 0.2em;
    margin: 60px 0 30px;
  }

  .en-heading.lineup-heading{ padding-top: 28px; }

  .section-heading{
    font-size: 1.6rem;
    letter-spacing: 0.22em;
    line-height: 1.2;
    padding: 0 12px;
    overflow-wrap: anywhere;
  }

  /* ===== スマホ時：ロゴ一覧のリンク下線（青線）を消す ===== */
  .lineup a,
  .support a{
    text-decoration: none !important;
    color: inherit !important;
  }
}

/* =========================================================
   TICKET（index.php / #ticket）
========================================================= */

#ticket.home-ticket{
  width: 100%;
  padding: 64px 0;
}

#ticket .home-ticket__inner{
  width: min(980px, calc(100% - 40px));
  margin: 0 auto;
}

#ticket .home-ticket__header{
  text-align: center;
  margin-bottom: 24px;
}

#ticket .home-ticket__title{
  letter-spacing: 0.22em;
  margin: 0 0 10px;
}

#ticket .home-ticket__lead{
  margin: 0;
  line-height: 1.8;
}

/* 概要 */
#ticket .ticket-hero{
  border: 1px solid #e6e6e6;
  padding: 12px 14px;
  margin: 18px 0 26px;
}

#ticket .ticket-hero__row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 14px;
  line-height: 1.4;
  flex-wrap: nowrap;
}

#ticket .ticket-hero__row p{
  margin: 0;
  white-space: nowrap;
}

#ticket .ticket-hero__time{
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

#ticket .ticket-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  align-items: stretch;
  margin: 0 0 26px;
}

#ticket .ticket-card{
  border: 1px solid #e6e6e6;
  border-radius: 0;
  padding: 18px 18px 14px;
  text-align: left;

  display: flex;
  flex-direction: column;

  position: relative;
  overflow: hidden;
}

#ticket .ticket-card__head{
  padding-bottom: 12px;
  border-bottom: 1px solid #eee;
  margin-bottom: 12px;
}

#ticket .ticket-card__kicker{
  margin: 0 0 6px;
  font-size: 12px;
  letter-spacing: 0.18em;
  opacity: 0.9;
}

#ticket .ticket-card__title{
  margin: 0 0 8px;
  font-size: 18px;
  line-height: 1.35;
}

#ticket .ticket-card__price{
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
}

#ticket .ticket-card__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 10px;
}

#ticket .chip{
  display: inline-block;
  border: 1px solid #e6e6e6;
  border-radius: 0;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1;
  background: transparent;
}

#ticket .ticket-card__details{ margin-top: 10px; }

#ticket .ticket-card__summary{
  cursor: pointer;
  font-size: 13px;
  list-style: none;
}

#ticket .ticket-card__summary::-webkit-details-marker{ display: none; }

#ticket .ticket-card__summary::after{
  content: "▼";
  display: inline-block;
  margin-left: 8px;
  font-size: 11px;
  transform: translateY(-1px);
  opacity: 0.8;
}
#ticket details[open] .ticket-card__summary::after{ content: "▲"; }

#ticket .ticket-list{
  margin: 10px 0 0;
  padding-left: 18px;
  font-size: 13px;
  line-height: 1.7;
}

#ticket .ticket-cta{
  text-align: center;
  margin-top: 8px;
}

#ticket .ticket-cta__btn{
  display: inline-block;
  border: 1px solid #333;
  border-radius: 0;
  padding: 14px 24px;
  text-decoration: none;
  color: #333;
  background: transparent;
  transition: background-color 0.15s ease, color 0.15s ease;
}

#ticket .ticket-cta__btn:hover{
  background: #000;
  color: #fff;
}

#ticket .ticket-cta__sub{
  margin: 10px 0 0;
  font-size: 12px;
  opacity: 0.75;
}

/* SOLD OUT：中央固定 */
#ticket .ticket-card .ticket-card__ribbon{
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) rotate(0deg) !important;

  z-index: 999 !important;
  pointer-events: none;

  background: rgba(0,0,0,0.85);
  color: #fff;
  padding: 14px 34px;
  font-size: 14px;
  letter-spacing: 0.18em;
  line-height: 1;
  white-space: nowrap;

  min-width: 240px;
  text-align: center;
  border-radius: 2px;
}

@media (max-width: 900px){
  #ticket.home-ticket{ padding: 48px 0; }

  #ticket .ticket-hero__row{
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    flex-wrap: wrap;
  }

  #ticket .ticket-hero__row p{ white-space: normal; }

  #ticket .ticket-hero__time{
    overflow: visible;
    text-overflow: clip;
  }

  #ticket .ticket-grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

/* =========================================================
   KIDS（トップ差し込み）
========================================================= */

#kids-activities.kids-activities{
  width: 100%;
  padding: 70px 0;
}

#kids-activities .kids-activities__inner{
  width: min(1100px, calc(100% - 40px));
  margin: 0 auto;
}

#kids-activities .kids-activities__header{
  text-align: center;
  margin-bottom: 28px;
}

#kids-activities .kids-activities__title{
  margin: 0 0 10px;
  letter-spacing: 0.22em;
}

#kids-activities .kids-activities__lead{
  margin: 0;
  line-height: 1.8;
}

#kids-activities .kids-activities__grid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
  align-items: stretch;
}

#kids-activities .kids-card{
  border: 1px solid #e6e6e6;
  background: #fff;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

#kids-activities .kids-card__media{
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #f7f7f7;
  aspect-ratio: 4 / 3;
}

#kids-activities .kids-card__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

#kids-activities .kids-card__date{
  position: absolute;
  top: 12px;
  left: 12px;
  background: rgba(0,0,0,0.65);
  color: #fff;
  font-size: 12px;
  padding: 6px 10px;
  line-height: 1;
}

#kids-activities .kids-card__body{
  padding: 18px 18px 22px;
  text-align: left;
  flex: 1;
}

#kids-activities .kids-card__topline{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid #eee;
  padding-bottom: 10px;
  margin-bottom: 14px;
}

#kids-activities .kids-card__kicker{
  margin: 0;
  font-size: 12px;
  letter-spacing: 0.14em;
  opacity: 0.9;
}

#kids-activities .kids-card__badge{
  margin: 0;
  border: 1px solid #333;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}

#kids-activities .kids-card__title{
  margin: 0 0 8px;
  font-size: 22px;
  line-height: 1.25;
}

#kids-activities .kids-card__meta{
  margin: 0 0 12px;
  font-size: 13px;
  opacity: 0.8;
}

#kids-activities .kids-card__desc p{
  margin: 0 0 8px;
  line-height: 1.8;
  font-size: 14px;
}

#kids-activities .kids-card__apply{
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #eee;
}

#kids-activities .kids-card__applylabel{
  margin: 0 0 10px;
  font-size: 12px;
  opacity: 0.8;
}

#kids-activities .kids-card__applylink{
  display: inline-block;
  border: 1px solid #333;
  padding: 10px 14px;
  text-decoration: none;
  color: #333;
  background: transparent;
  font-size: 14px;
  line-height: 1.1;
}

#kids-activities .kids-card__applylink:hover{
  background: #000;
  color: #fff;
}

#kids-activities .kids-card__bring{
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #eee;
}

#kids-activities .kids-card__bringtitle{
  margin: 0 0 8px;
  font-size: 12px;
  letter-spacing: 0.12em;
  opacity: 0.85;
}

#kids-activities .kids-card__bringtext{
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
}

#kids-activities .kids-card__notes{
  margin: 14px 0 0;
  padding-left: 18px;
  list-style: disc;
  list-style-position: outside;
  font-size: 13px;
  line-height: 1.8;
}

#kids-activities .kids-card__notes li{ margin: 0 0 6px; }

/* kids内：タイムテーブル導線ボタン */
#kids-activities .kids-activities__inner > a.btn.btn-outline{
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 30px auto;
  text-align: center;
}

@supports not (width: fit-content){
  #kids-activities .kids-activities__inner{ text-align: center; }
  #kids-activities .kids-activities__inner > a.btn.btn-outline{
    display: inline-block;
    margin: 30px auto;
  }
}

#kids-activities .kids-activities__parking{
  margin: 18px 0 0;
  text-align: center;
  font-size: 13px;
  opacity: 0.8;
}

@media (max-width: 900px){
  #kids-activities .kids-activities__grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }
  #kids-activities .kids-card__title{ font-size: 20px; }
}

/* =========================================================
   Motion reduced
========================================================= */
@media (prefers-reduced-motion: reduce){
  .lineup .logo-item a,
  .lineup .logo-item img,
  .support .logo-item,
  .support .logo-item img{
    transition: none !important;
  }
}


/* ================================
   PERFORMANCE 固定ページ専用
================================ */

.performance-main{ padding-top: 80px; }

.page-title{
  font-weight: 300;
  font-style: normal;
  font-size: 2.5rem;
  letter-spacing: 0.3em;
  text-align: center;
  margin: 0 0 24px;
}

.section-divider{
  width: 90%;
  max-width: 800px;
  margin: 60px auto 40px;
  border-top: 1px dotted #d3cfc9;
}

.performance-hero{
  min-height: calc(100vh - 80px);
  padding: 40px 20px 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.performance-title{
  font-size: 1.1rem;
  letter-spacing: 0.4em;
  margin-bottom: 40px;
}

.performance-info{
  max-width: 620px;
  margin: 0 auto 10px;
  text-align: left;
  font-size: 0.95rem;
  line-height: 2;
}

.performance-info .info-row{
  display: flex;
  gap: 32px;
  align-items: flex-start;
  margin-bottom: 4px;
}

.performance-info dt{
  width: 4.5em;
  white-space: nowrap;
  letter-spacing: 0.2em;
}

.performance-info dd{ margin: 0; }

.performance-info .info-note dd{ line-height: 1.7; }

.artist-section{ padding: 40px 20px 0; }

.artist-heading{
  max-width: 960px;
  margin: 0 auto 16px;
  display: flex;
  align-items: baseline;
  gap: 16px;
}

.artist-name{
  font-size: 1.3rem;
  letter-spacing: 0.3em;
}

.artist-subtitle{
  font-size: 0.7rem;
  color: #999;
}

.usagi-heading{ margin-top: 40px; }
.usagi-name{ letter-spacing: 0.25em; }

.artist-layout{
  max-width: 960px;
  margin: 0 auto 40px;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 40px;
  align-items: flex-start;
}

.artist-layout-right{
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
}

.artist-layout-right .artist-photo{ order: 2; }
.artist-layout-right .artist-text{ order: 1; }

.artist-photo img{
  width: 100%;
  border: 1px solid #eee;
}

.artist-text{
  font-size: 0.9rem;
  color: #555;
}

.description-section{ padding: 20px 20px 60px; }

.description-inner{
  max-width: 760px;
  margin: 0 auto 40px;
  font-size: 0.9rem;
  color: #555;
}

.ticket-btn-area{
  text-align: center;
  margin-bottom: 40px;
}

/* ================= MOVIE =================
==================================================================== */
.performance-movie{
  width: min(960px, 100% - 40px);
  margin: 18px auto 28px;
}


.movie-embed{
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
  border: 1px solid rgba(0,0,0,0.12);
}

.movie-embed iframe{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 900px){
  .artist-layout,
  .artist-layout-right{ grid-template-columns: 1fr; }
  .artist-layout-right .artist-photo,
  .artist-layout-right .artist-text{ order: initial; }
}

@media screen and (max-width: 768px){
  .performance-main{ padding-top: 64px; }
  .performance-hero{ min-height: calc(100vh - 64px); padding-top: 24px; }
  .page-title{ font-size: 1.8rem; letter-spacing: 0.2em; }
  .performance-title{ font-size: 0.95rem; letter-spacing: 0.3em; }
  .performance-info{ font-size: 0.85rem; }
  .artist-layout{ gap: 24px; }
}
.performance-movie{
  width: min(960px, 100% - 40px);
  margin: 18px auto 28px;
}

.movie-video{
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid rgba(0,0,0,0.12);
  background: #000;
}


/* ================= WORK SHOP LIST（LINE UP ページ） =================
   目的：
   - 日付（17 sat / 18 sun / 両日）を「画像の左上バッジ」に戻す
   - PHP構造が多少違っても当たるように、複数セレクタで吸収
   - 他ページへ影響させない（.lineup-main 配下だけ）
==================================================================== */

.lineup-main{
  max-width: 1200px;
  margin: 0 auto;
  padding: 120px 24px 80px;
  box-sizing: border-box;
}

@media (max-width: 768px){
  .lineup-main{
    padding: 100px 16px 60px;
  }
}

.lineup-main .workshop-list-section{
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
}

@media (max-width: 768px){
  .lineup-main .workshop-list-section{
    padding: 0 0 60px;
  }
}

.lineup-main .lineup-header{
  text-align: center;
  margin: 0 0 40px;
}

.lineup-main .lineup-list-heading{
  margin: 0 0 10px;
  font-size: 2.5rem;
  letter-spacing: 0.35em;
  font-weight: 400;
}

.lineup-main .lineup-subtitle{
  font-size: 0.85rem;
  color: #777;
  margin: 0;
}

@media (max-width: 768px){
  .lineup-main .lineup-list-heading{
    font-size: 2rem;
    letter-spacing: 0.28em;
  }
  .lineup-main .lineup-subtitle{
    font-size: 0.75rem;
  }
}

/* ---------- 日付タブ ---------- */
.lineup-main .lineup-day-tabs{
  display: flex;
  justify-content: center;
  gap: 24px;
  margin-bottom: 40px;
  flex-wrap: wrap;
}

.lineup-main .day-tab{
  border: none;
  background: transparent;
  padding: 8px 16px;
  font-size: 14px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  cursor: pointer;
  border-bottom: 1px solid transparent;
  color: #777;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.lineup-main .day-tab.is-active{
  border-bottom-color: #000;
  color: #000;
}

.lineup-main .lineup-day{ display: none; }
.lineup-main .lineup-day.is-active{ display: block; }

/* ---------- セクション見出し（点線上下） ---------- */
.lineup-main .workshop-list-header{
  margin: 40px 0 16px;
  text-align: center;
  position: relative;
  padding: 14px 0;
}

.lineup-main .workshop-list-header::before,
.lineup-main .workshop-list-header::after{
  content: "";
  position: absolute;
  left: 0; right: 0;
  border-top: 1px dotted #d3cfc9;
}

.lineup-main .workshop-list-header::before{ top: 0; }
.lineup-main .workshop-list-header::after{ bottom: 0; }

.lineup-main .workshop-list-heading{
  margin: 0;
  font-size: 1.2rem;
  letter-spacing: 0.35em;
  font-weight: 400;
}

/* =====================================================
   カード一覧：最後の行もセンターに寄るように flex に変更
   （スクショ2の「最後の行が中央揃え」になりやすい）
===================================================== */
.lineup-main .workshop-card-grid{
  --card-w: 220px;

  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 34px 22px;

  margin: 0 auto 40px;
  padding: 0;
}

/* 3列になりやすい中間幅 */
@media (max-width: 1024px){
  .lineup-main .workshop-card-grid{
    --card-w: 210px;
    gap: 28px 18px;
  }
}

/* スマホは2列相当 */
@media (max-width: 768px){
  .lineup-main .workshop-card-grid{
    --card-w: calc(50% - 7px); /* gap(14px)想定で2列 */
    gap: 24px 14px;
  }
}

.lineup-main a.workshop-card,
.lineup-main .workshop-card{
  flex: 0 1 var(--card-w);
  text-decoration: none;
  color: inherit;

  position: relative; /* ★日付バッジの基準 */
  display: block;
}

/* 画像枠 */
.lineup-main .workshop-thumb{
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;

  background: #f5f5f5;
  border-radius: 4px;
  overflow: hidden;

  /* スクショ2に寄せて “控えめ” に */
  border: 1px solid #eee;
  box-shadow: none;
}

.lineup-main .workshop-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 店名 */
.lineup-main .workshop-name{
  margin-top: 8px;
  font-size: 0.78rem;
  text-align: center;
  color: #666;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}

@media (max-width: 768px){
  .lineup-main .workshop-name{
    font-size: 0.74rem;
  }
}


/* バッジ（クラス指定がある場合） */
.lineup-main .workshop-card .workshop-date,
.lineup-main .workshop-card .workshop-day,
.lineup-main .workshop-card .day-badge,
.lineup-main .workshop-card .date-badge,
.lineup-main .workshop-card .vendor-date,
.lineup-main .workshop-card .vendor-day,
.lineup-main a.workshop-card .workshop-date,
.lineup-main a.workshop-card .workshop-day,
.lineup-main a.workshop-card .day-badge,
.lineup-main a.workshop-card .date-badge,
.lineup-main a.workshop-card .vendor-date,
.lineup-main a.workshop-card .vendor-day,

/* バッジ（クラスが分からない場合の保険：最初の p / span / div をバッジとして扱う）
   ※ 店名(.workshop-name)が先頭に来る構造は通常ない想定だが、念のため除外 */
.lineup-main a.workshop-card > p:first-child:not(.workshop-name),
.lineup-main a.workshop-card > span:first-child:not(.workshop-name),
.lineup-main a.workshop-card > div:first-child:not(.workshop-thumb):not(.workshop-name),
.lineup-main .workshop-card > p:first-child:not(.workshop-name),
.lineup-main .workshop-card > span:first-child:not(.workshop-name),
.lineup-main .workshop-card > div:first-child:not(.workshop-thumb):not(.workshop-name){
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 5;

  display: inline-block;
  padding: 6px 10px;

  background: rgba(0,0,0,0.65);
  color: #fff;

  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.14em;
  white-space: nowrap;

  margin: 0 !important;

  pointer-events: none;
  user-select: none;
}

/* 日付が .workshop-thumb の中に入っている構造にも対応（念のため） */
.lineup-main .workshop-thumb .workshop-date,
.lineup-main .workshop-thumb .workshop-day,
.lineup-main .workshop-thumb .day-badge,
.lineup-main .workshop-thumb .date-badge{
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 5;

  display: inline-block;
  padding: 6px 10px;

  background: rgba(0,0,0,0.65);
  color: #fff;

  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.14em;
  white-space: nowrap;

  margin: 0 !important;

  pointer-events: none;
  user-select: none;
}

/* hover（控えめ） */
.lineup-main a.workshop-card:hover .workshop-thumb{
  border-color: #ddd;
}

.lineup-main a.workshop-card:focus-visible{
  outline: 2px solid rgba(0,0,0,0.35);
  outline-offset: 6px;
}

/* =============================
   NEWS PAGE
============================= */

.news-page{ padding-top: 80px; }

.news-inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 20px 60px;
}

.news-title{
  font-weight: 300;
  letter-spacing: 0.25em;
  text-align: center;
  font-size: 2.2rem;
  margin: 0 0 80px;
}

.news-list{ border-top: 1px dotted #d3cfc9; }

.news-item{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 60px;
  padding: 40px 0;
  border-bottom: 1px dotted #d3cfc9;
}

.news-text{ flex: 1 1 55%; }
.news-thumb{ flex: 0 0 35%; }

.news-thumb img{
  width: 100%;
  object-fit: cover;
}

.news-meta{
  font-size: 0.8rem;
  letter-spacing: 0.12em;
  margin: 0 0 18px;
}

.news-body{ margin-bottom: 24px; }

.news-lead{
  font-size: 0.8rem;
  margin: 0 0 10px;
}

.news-dots{
  width: 100%;
  height: 60px;
  background-image: radial-gradient(#c7c1b9 1px, transparent 1px);
  background-size: 6px 6px;
  opacity: 0.8;
}

.news-more{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-decoration: none;
  color: #333;
}

.news-arrow{
  position: relative;
  display: inline-block;
  width: 60px;
  height: 1px;
  background-color: #333;
}

.news-arrow::after{
  content: "";
  position: absolute;
  right: 0;
  top: -3px;
  border-left: 5px solid #333;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
}

/* SINGLE NEWS */
.single-news .performance-main{
  padding-top: 80px;
  min-height: auto;
}

@media screen and (max-width: 768px){
  .single-news .performance-main{ padding-top: 64px; }
}

.single-news .performance-hero{
  min-height: auto;
  padding: 80px 20px 40px;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
}

.single-news .performance-title{
  font-size: 1.1rem;
  letter-spacing: 0.3em;
  margin-top: 12px;
  margin-bottom: 0px;
}

.single-news .description-section{ padding: 0 20px 80px; }

.single-news .description-inner{
  max-width: 760px;
  margin: 0 auto 50px;
  text-align: left;
}

.single-news .description-inner img{
  display: block;
  max-width: 760px;
  width: 100%;
  margin: 40px auto;
}

@media screen and (max-width: 900px){
  .news-item{
    flex-direction: column;
    gap: 24px;
  }
  .news-thumb{ width: 100%; }
}

@media screen and (max-width: 768px){
  .news-page{ padding-top: 64px; }
  .news-inner{ padding: 60px 16px 40px; }
  .news-title{ font-size: 1.6rem; margin-bottom: 60px; }
  .news-meta{ font-size: 0.75rem; }
  .news-lead{ font-size: 0.75rem; }
  .news-dots{ height: 40px; }
  .news-arrow{ width: 40px; }
}

/* ================================
   CONCEPT 固定ページ専用
================================ */

.concept-main{ padding-top: 80px; }

.concept-section{
  max-width: 900px;
  margin: 0 auto 80px;
  padding: 80px 20px 60px;
  text-align: center;
}

.concept-text{
  margin: 40px auto 60px;
  text-align: center;
  font-size: 0.95rem;
  line-height: 2;
  color: #555;
}

.concept-lead{
  margin-bottom: 24px;
  font-size: 1rem;
  font-weight: 400;
}

.concept-text p{ margin: 4px 0; }

.concept-bottom-line{
  margin-top: 24px;
  font-weight: 400;
}

.concept-sign{
  margin-top: 8px;
  font-size: 1rem;
  letter-spacing: 0.2em;
}

.concept-image{
  max-width: 720px;
  margin: 0 auto 40px;
}

.concept-image img{
  width: 100%;
  border: 1px solid #eee;
}

.concept-button-wrap{ text-align: center; }

@media screen and (max-width: 768px){
  .concept-main{ padding-top: 64px; }
  .concept-section{
    padding: 60px 16px 40px;
    margin-bottom: 60px;
  }
  .concept-text{
    font-size: 0.9rem;
    margin: 30px auto 40px;
  }
  .concept-lead{ font-size: 0.95rem; }
  .concept-image{ margin: 0 auto 30px; }
}



/* ==============================
   ハンバーガーメニュー（スマホ）
============================== */

@media screen and (max-width: 768px){
  .overlay-header{ padding: 16px 20px; }
  .overlay-menu{ margin-top: 40px; }
  .overlay-menu li{ margin: 8px 0; }
  .overlay-menu a{
    padding-bottom: 14px;
    font-size: 0.9rem;
    letter-spacing: 0.25em;
  }
}


/* =========================================================
   VENDOR：出店者詳細（single vendor）ページ専用CSS
   影響範囲：.vendor-main 配下のみ（他ページに干渉しない）
   目的：
   - SHOP INTRODUCTION の余白・中央配置を安定化
   - the_content 内の画像を「中央＋適正幅」に固定（崩れ対策）
   - その他のWORK SHOP を中央寄せカードグリッド化
   - data-date の日付バッジ表示
========================================================= */

/* ---------- 全体 ---------- */
.vendor-main{
  padding-top: 120px; /* 固定ヘッダーがある想定。必要なら増減OK */
  overflow-x: hidden;
}

/* ---------- 上部タイトルエリア ---------- */
.vendor-main .vendor-hero{
  text-align: center;
  padding: 70px 20px 40px;
}

.vendor-main .vendor-hero .page-title{
  margin: 0;
  font-size: clamp(18px, 2.2vw, 26px);
  letter-spacing: 0.35em;
  font-weight: 400;
}

.vendor-main .vendor-hero .vendor-title{
  margin: 18px 0 0;
  font-size: clamp(14px, 1.6vw, 18px);
  letter-spacing: 0.25em;
  font-weight: 400;
}

/* ---------- 本文エリア（線＋中央カラム） ---------- */
.vendor-main .vendor-body{
  padding: 0 20px 10px;
}

.vendor-main .vendor-body-inner{
  width: min(960px, 100%);
  margin: 0 auto;
  border-top: 1px solid #d3cfc9; /* 画像2枚目の細い横線 */
  padding-top: 55px;
}

/* 本文そのものは中央カラムに収める（画像の幅もここで制御） */
.vendor-main .vendor-content{
  width: min(680px, 100%);   /* ここを小さくすると画像も小さくなる */
  margin: 0 auto;
  text-align: left;         /* 文章は読みやすく左寄せ（ブロックは中央） */
  line-height: 1.9;
  color: #333;
  font-size: 0.95rem;
}

/* the_content 内の余白 */
.vendor-main .vendor-content > *{
  margin-top: 0;
  margin-bottom: 18px;
}

/* --- 画像が崩れるのを防ぐ（最重要） --- */
.vendor-main .vendor-content img{
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
}

/* Gutenberg（WPブロック）画像の想定 */
.vendor-main .vendor-content figure.wp-block-image{
  margin: 0 auto 22px;
  width: 100%;
  max-width: 100%;
}

.vendor-main .vendor-content figure.wp-block-image img{
  width: 100%;
  height: auto;
}

/* alignwide / alignfull が入っても vendor では拡げない */
.vendor-main .vendor-content .alignwide,
.vendor-main .vendor-content .alignfull{
  width: 100%;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* モバイル調整 */
@media (max-width: 768px){
  .vendor-main{
    padding-top: 100px;
  }
  .vendor-main .vendor-hero{
    padding: 55px 16px 34px;
  }
  .vendor-main .vendor-body{
    padding: 0 16px 10px;
  }
  .vendor-main .vendor-body-inner{
    padding-top: 40px;
  }
  .vendor-main .vendor-content{
    width: min(620px, 100%);
    font-size: 0.92rem;
  }
}

/* ---------- 予約ボタンエリア（workshop_link / reserve_link） ---------- */
.vendor-main .vendor-reserve{
  padding: 34px 20px 10px;
  text-align: center;
}

.vendor-main .vendor-reserve .btn-outline{
  display: inline-block;
  padding: 14px 22px;
  border: 1px solid #333;
  text-decoration: none;
  color: #333;
  letter-spacing: 0.08em;
  font-size: 0.95rem;
  transition: opacity .2s ease;
}

.vendor-main .vendor-reserve .btn-outline:hover{
  opacity: .75;
}

.vendor-main .vendor-reserve-text{
  margin: 14px 0 0;
  font-size: 0.85rem;
  color: #666;
  line-height: 1.7;
}

/* ---------- その他の WORK SHOP セクション ---------- */
.vendor-main .vendor-workshop-section{
  padding: 60px 20px 80px;
}

/* 見出し（点線上下＋中央） */
.vendor-main .vendor-workshop-section .workshop-list-header{
  width: min(960px, 100%);
  margin: 0 auto 22px;
  text-align: center;
  position: relative;
  padding: 14px 0;
}

.vendor-main .vendor-workshop-section .workshop-list-header::before,
.vendor-main .vendor-workshop-section .workshop-list-header::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  border-top: 1px dotted #d3cfc9;
}

.vendor-main .vendor-workshop-section .workshop-list-header::before{ top: 0; }
.vendor-main .vendor-workshop-section .workshop-list-header::after { bottom: 0; }

.vendor-main .vendor-workshop-section .workshop-list-heading{
  margin: 0;
  font-size: 1.2rem;
  letter-spacing: 0.35em;
  font-weight: 400;
}

/* カードグリッド：中央寄せ */
.vendor-main .vendor-workshop-section .workshop-card-grid{
  --card-w: 220px;

  width: min(960px, 100%);
  margin: 0 auto;
  padding: 0;

  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 34px 22px;
}

@media (max-width: 1024px){
  .vendor-main .vendor-workshop-section .workshop-card-grid{
    --card-w: 210px;
    gap: 28px 18px;
  }
}

@media (max-width: 768px){
  .vendor-main .vendor-workshop-section{
    padding: 48px 16px 70px;
  }
  .vendor-main .vendor-workshop-section .workshop-card-grid{
    --card-w: calc(50% - 7px); /* gap(14px)想定 */
    gap: 24px 14px;
  }
}

/* カード */
.vendor-main .vendor-workshop-section a.workshop-card,
.vendor-main .vendor-workshop-section .workshop-card{
  flex: 0 1 var(--card-w);
  display: block;
  text-decoration: none;
  color: inherit;
  position: relative; /* 日付バッジの基準 */
}

/* サムネ（4:3固定＋薄枠） */
.vendor-main .vendor-workshop-section .workshop-thumb{
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  background: #f5f5f5;

  border: 1px solid #eee;
  border-radius: 4px;
  overflow: hidden;
}

.vendor-main .vendor-workshop-section .workshop-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 店名 */
.vendor-main .vendor-workshop-section .workshop-name{
  margin-top: 8px;
  font-size: 0.78rem;
  text-align: center;
  color: #666;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}

@media (max-width: 768px){
  .vendor-main .vendor-workshop-section .workshop-name{
    font-size: 0.74rem;
  }
}

/* hover（控えめ） */
.vendor-main .vendor-workshop-section a.workshop-card:hover .workshop-thumb{
  border-color: #ddd;
}

.vendor-main .vendor-workshop-section a.workshop-card:focus-visible{
  outline: 2px solid rgba(0,0,0,0.35);
  outline-offset: 6px;
}

/* ---------- 日付バッジ（data-date があるカードだけ表示） ---------- */
.vendor-main .vendor-workshop-section .workshop-card[data-date]::before{
  content: attr(data-date);
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 5;

  display: inline-block;
  padding: 6px 10px;
  background: rgba(0,0,0,0.65);
  color: #fff;

  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.14em;
  white-space: nowrap;

  pointer-events: none;
  user-select: none;
}

@media (max-width: 768px){
  .vendor-main .vendor-workshop-section .workshop-card[data-date]::before{
    top: 8px;
    left: 8px;
    padding: 5px 8px;
    font-size: 11px;
  }
}

/* ---------- PERFORMANCE 導線（必要最低限。既存があるなら不要） ---------- */
.vendor-main .vendor-performance{
  padding: 40px 20px 90px;
  text-align: center;
}

.vendor-main .vendor-performance .section-divider{
  width: min(960px, 100%);
  height: 1px;
  background: #d3cfc9;
  margin: 0 auto 48px;
}

.vendor-main .vendor-performance .vendor-performance-inner{
  width: min(720px, 100%);
  margin: 0 auto;
}

.vendor-main .vendor-performance .section-heading{
  margin: 0 0 18px;
  font-size: 1.2rem;
  letter-spacing: 0.35em;
  font-weight: 400;
}

.vendor-main .vendor-performance .vendor-performance-text{
  margin: 0 0 26px;
  color: #666;
  line-height: 1.9;
  font-size: 0.95rem;
}

.vendor-main .vendor-performance .ticket-btn-area .btn-outline{
  display: inline-block;
  padding: 14px 22px;
  border: 1px solid #333;
  text-decoration: none;
  color: #333;
  letter-spacing: 0.08em;
  font-size: 0.95rem;
  transition: opacity .2s ease;
}

.vendor-main .vendor-performance .ticket-btn-area .btn-outline:hover{
  opacity: .75;
}


/* =========================
   CONTACT（/contact/）専用
   ========================= */

/* ヘッダー固定に被らないよう上余白を確保 */
body.page-contact .contact-main,
body.page-id-316 .contact-main {
  padding-top: 140px;   /* ヘッダー高さに合わせて調整 */
  padding-bottom: 120px;
}

/* タイトル */
body.page-contact .contact-hero .page-title,
body.page-id-316 .contact-hero .page-title {
  text-align: center;
  margin: 0 0 40px;
}

/* フォーム全体を中央カラムに */
body.page-contact .contact-body,
body.page-id-316 .contact-body {
  padding: 0 20px; /* 画面端の余白 */
}

body.page-contact .contact-inner,
body.page-id-316 .contact-inner {
  width: 100%;
  max-width: 560px;  /* フォームは 480〜640px が見やすいです */
  margin: 0 auto;    /* 中央寄せ */
}

/* CF7 本体 */
body.page-contact .contact-inner .wpcf7,
body.page-id-316 .contact-inner .wpcf7 {
  width: 100%;
  margin: 0 auto;
}

/* 1項目ごとの余白 */
body.page-contact .wpcf7 form p,
body.page-id-316 .wpcf7 form p {
  margin: 0 0 18px;
}

/* ラベル・説明文（必要なら） */
body.page-contact .wpcf7 form p label,
body.page-id-316 .wpcf7 form p label {
  display: block;
  margin-bottom: 8px;
}

/* 入力欄を幅いっぱいに統一 */
body.page-contact .wpcf7 input[type="text"],
body.page-contact .wpcf7 input[type="email"],
body.page-contact .wpcf7 input[type="tel"],
body.page-contact .wpcf7 input[type="url"],
body.page-contact .wpcf7 textarea,
body.page-id-316 .wpcf7 input[type="text"],
body.page-id-316 .wpcf7 input[type="email"],
body.page-id-316 .wpcf7 input[type="tel"],
body.page-id-316 .wpcf7 input[type="url"],
body.page-id-316 .wpcf7 textarea {
  width: 100%;
  max-width: 100%;
  display: block;
  box-sizing: border-box;
}

/* テキストエリアの最低高さ */
body.page-contact .wpcf7 textarea,
body.page-id-316 .wpcf7 textarea {
  min-height: 180px;
}

/* 送信ボタンを中央に */
body.page-contact .wpcf7 input[type="submit"],
body.page-contact .wpcf7 .wpcf7-submit,
body.page-id-316 .wpcf7 input[type="submit"],
body.page-id-316 .wpcf7 .wpcf7-submit {
  display: block;
  margin: 22px auto 0;
}



/* スマホ時の余白 */
@media (max-width: 768px) {
  body.page-contact .contact-main,
  body.page-id-316 .contact-main {
    padding-top: 110px;
    padding-bottom: 90px;
  }

  body.page-contact .contact-inner,
  body.page-id-316 .contact-inner {
    max-width: 520px;
  }
}

/* =========================
   TOP：フッターお問い合わせ（2枚目の見た目に合わせる）
   ========================= */
.footer-contact{
  padding: 80px 20px 60px;  /* 上下余白 */
}

.footer-contact-inner{
  max-width: 780px;
  margin: 0 auto;
  text-align: center;

  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
}

.footer-contact-title{
  margin: 0;
}

.footer-contact-text{
  margin: 0;
}

/* ボタンを中央に固定（幅が勝手に100%になるのを防ぐ） */
.footer-contact-btn{
  display: inline-block;
  margin: 0 auto;
  width: auto;
}

/* ===== Contact：スマホだけ中央寄せ（上書き） ===== */
@media (max-width: 768px) {

  /* Contactページ全体の本文を中央寄せ */
  .contact-main,
  .contact-section,
  .contact-inner,
  .contact-wrap,
  .contact-container {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }

  /* フォーム全体のブロック自体を中央に */
  .wpcf7,
  form.wpcf7-form {
    margin-left: auto;
    margin-right: auto;
  }

  /* 入力欄は“ボックス自体”を中央に（中の文字は左のままが使いやすい） */
  .wpcf7 input[type="text"],
  .wpcf7 input[type="email"],
  .wpcf7 input[type="tel"],
  .wpcf7 textarea {
    display: block;
    width: 100%;
    max-width: 520px;   /* 好みで調整 */
    margin-left: auto;
    margin-right: auto;
    text-align: left;   /* 入力しやすさ優先 */
  }

  /* ボタンは中央に */
  .wpcf7 input[type="submit"],
  .wpcf7 button,
  .contact-submit,
  .submit {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
  }
}

/* =========================================
   TICKET（index.php / #ticket 専用）ボタンなし版
   要件：
   - 角丸なし
   - カード内は左揃え
   - 3カードの高さを揃える
   - モバイルは1列
   - 概要行（date/time/base）はPCで極力1行
========================================= */

#ticket.home-ticket {
  width: 100%;
  padding: 64px 0;
}

#ticket .home-ticket__inner {
  width: min(980px, calc(100% - 40px));
  margin: 0 auto;
}

#ticket .home-ticket__header {
  text-align: center;
  margin-bottom: 24px;
}

#ticket .home-ticket__title {
  letter-spacing: 0.22em;
  margin: 0 0 10px;
}

#ticket .home-ticket__lead {
  margin: 0;
  line-height: 1.8;
}

/* ===== 概要 ===== */
#ticket .ticket-hero {
  border: 1px solid #e6e6e6;
  padding: 12px 14px;
  margin: 18px 0 26px;
}

#ticket .ticket-hero__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 14px;
  line-height: 1.4;
  flex-wrap: nowrap;         /* PCでは原則1行 */
}

#ticket .ticket-hero__row p {
  margin: 0;
  white-space: nowrap;       /* PCでは折り返しを抑制 */
}

#ticket .ticket-hero__date {
  flex: 0 0 auto;
}

#ticket .ticket-hero__time {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;   /* どうしても長い時は省略 */
}

#ticket .ticket-hero__base {
  flex: 0 0 auto;
}

/* ===== カードグリッド ===== */
#ticket .ticket-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  align-items: stretch;      /* 高さ揃え */
  margin: 0 0 26px;
}

/* カード本体（角丸なし） */
#ticket .ticket-card {
  border: 1px solid #e6e6e6;
  border-radius: 0;          /* 角丸なし */
  padding: 18px 18px 14px;
  text-align: left;          /* 左揃え */
  display: flex;             /* 高さ揃え＆中身管理 */
  flex-direction: column;

  position: relative;        /* ★追加：リボンの土台 */
  overflow: hidden;          /* ★追加：斜め帯をカード内で綺麗にクリップ */
}

/* ヘッダ部分 */
#ticket .ticket-card__head {
  padding-bottom: 12px;
  border-bottom: 1px solid #eee;
  margin-bottom: 12px;
}

#ticket .ticket-card__kicker {
  margin: 0 0 6px;
  font-size: 12px;
  letter-spacing: 0.18em;
  opacity: 0.9;
}

#ticket .ticket-card__title {
  margin: 0 0 8px;
  font-size: 18px;
  line-height: 1.35;
}

#ticket .ticket-card__price {
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
}

/* 特徴チップ（角丸なし） */
#ticket .ticket-card__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 10px;
}

#ticket .chip {
  display: inline-block;
  border: 1px solid #e6e6e6;
  border-radius: 0;          /* 角丸なし */
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1;
  background: transparent;
}

/* details */
#ticket .ticket-card__details {
  margin-top: 10px;
}

#ticket .ticket-card__summary {
  cursor: pointer;
  font-size: 13px;
  list-style: none;
}

#ticket .ticket-card__summary::-webkit-details-marker {
  display: none;
}

#ticket .ticket-card__summary::after {
  content: "▼";
  display: inline-block;
  margin-left: 8px;
  font-size: 11px;
  transform: translateY(-1px);
  opacity: 0.8;
}

#ticket details[open] .ticket-card__summary::after {
  content: "▲";
}

#ticket .ticket-list {
  margin: 10px 0 0;
  padding-left: 18px;
  font-size: 13px;
  line-height: 1.7;
}

/* CTA（購入導線） */
#ticket .ticket-cta {
  text-align: center;
  margin-top: 8px;
}

#ticket .ticket-cta__btn {
  display: inline-block;
  border: 1px solid #333;
  border-radius: 0;          /* 角丸なし */
  padding: 14px 24px;
  text-decoration: none;
  color: #333;
  background: transparent;
  transition: background-color 0.15s ease, color 0.15s ease;
}

/* 他のボタンと同じ “黒くなる” hover */
#ticket .ticket-cta__btn:hover {
  background: #000;
  color: #fff;
}

#ticket .ticket-cta__sub {
  margin: 10px 0 0;
  font-size: 12px;
  opacity: 0.75;
}

/* ===== SOLD OUT 斜め帯（リボン） ===== */
#ticket .ticket-card__ribbon{
  position: absolute;
  top: 14px;
  right: -52px;              /* 斜めにするので右に逃がす */
  width: 180px;
  padding: 8px 0;
  text-align: center;

  background: rgba(0,0,0,0.85);
  color: #fff;

  font-size: 12px;
  letter-spacing: 0.14em;
  line-height: 1;

  transform: rotate(45deg);
  transform-origin: center;

  z-index: 3;
  pointer-events: none;
}

/* ===== レスポンシブ ===== */
@media (max-width: 900px) {
  #ticket.home-ticket {
    padding: 48px 0;
  }

  /* 概要は折り返し許可（省略しないで見せる） */
  #ticket .ticket-hero__row {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    flex-wrap: wrap;
  }

  #ticket .ticket-hero__row p {
    white-space: normal;
  }

  #ticket .ticket-hero__time {
    overflow: visible;
    text-overflow: clip;
  }

  /* 1列 */
  #ticket .ticket-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

/* =========================================
   KIDS / 子ども向け活動（トップ差し込み用）
========================================= */

#kids-activities.kids-activities{
  width: 100%;
  padding: 70px 0;
}

#kids-activities .kids-activities__inner{
  width: min(1100px, calc(100% - 40px));
  margin: 0 auto;
}

#kids-activities .kids-activities__header{
  text-align: center;
  margin-bottom: 28px;
}

#kids-activities .kids-activities__title{
  margin: 0 0 10px;
  letter-spacing: 0.22em;
}

#kids-activities .kids-activities__lead{
  margin: 0;
  line-height: 1.8;
}

/* ===== グリッド ===== */
#kids-activities .kids-activities__grid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
  align-items: stretch;
}

/* ===== カード ===== */
#kids-activities .kids-card{
  border: 1px solid #e6e6e6;
  background: #fff;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

/* ===== 画像：横長で固定 ===== */
#kids-activities .kids-card__media{
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #f7f7f7;
  aspect-ratio: 4 / 3;
}

#kids-activities .kids-card__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* 日付バッジ */
#kids-activities .kids-card__date{
  position: absolute;
  top: 12px;
  left: 12px;
  background: rgba(0,0,0,0.65);
  color: #fff;
  font-size: 12px;
  padding: 6px 10px;
  line-height: 1;
}

/* ===== 本文：左揃え ===== */
#kids-activities .kids-card__body{
  padding: 18px 18px 22px;
  text-align: left;
  flex: 1;
}

/* kicker / badge 行 */
#kids-activities .kids-card__topline{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid #eee;
  padding-bottom: 10px;
  margin-bottom: 14px;
}

#kids-activities .kids-card__kicker{
  margin: 0;
  font-size: 12px;
  letter-spacing: 0.14em;
  opacity: 0.9;
}

#kids-activities .kids-card__badge{
  margin: 0;
  border: 1px solid #333;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}

/* タイトル */
#kids-activities .kids-card__title{
  margin: 0 0 8px;
  font-size: 22px;
  line-height: 1.25;
  text-align: left;
}

/* メタ */
#kids-activities .kids-card__meta{
  margin: 0 0 12px;
  font-size: 13px;
  opacity: 0.8;
}

/* 説明 */
#kids-activities .kids-card__desc p{
  margin: 0 0 8px;
  line-height: 1.8;
  font-size: 14px;
}

/* 申込み */
#kids-activities .kids-card__apply{
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #eee;
}

#kids-activities .kids-card__applylabel{
  margin: 0 0 10px;
  font-size: 12px;
  opacity: 0.8;
}

#kids-activities .kids-card__applylink{
  display: inline-block;
  border: 1px solid #333;
  padding: 10px 14px;
  text-decoration: none;
  color: #333;
  background: transparent;
  font-size: 14px;
  line-height: 1.1;
}

#kids-activities .kids-card__applylink:hover{
  background: #000;
  color: #fff;
}

/* 持ってくるもの */
#kids-activities .kids-card__bring{
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #eee;
}

#kids-activities .kids-card__bringtitle{
  margin: 0 0 8px;
  font-size: 12px;
  letter-spacing: 0.12em;
  opacity: 0.85;
}

#kids-activities .kids-card__bringtext{
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
}

/* 注意（箇条書き崩れ防止） */
#kids-activities .kids-card__notes{
  margin: 14px 0 0;
  padding-left: 18px;
  list-style: disc;
  list-style-position: outside;
  font-size: 13px;
  line-height: 1.8;
}

#kids-activities .kids-card__notes li{
  margin: 0 0 6px;
}

/* =========================
   ★追加：タイムテーブル導線ボタン
========================= */
#kids-activities .kids-activities__inner > a.btn.btn-outline{
  display: block;
  width: fit-content;     /* ボタン幅＝テキスト幅 */
  max-width: 100%;
  margin: 30px auto;      /* ★上下30px + 中央 */
  text-align: center;
}

/* iOS等で fit-content が効きづらい場合の保険 */
@supports not (width: fit-content){
  #kids-activities .kids-activities__inner{
    text-align: center;
  }
  #kids-activities .kids-activities__inner > a.btn.btn-outline{
    display: inline-block;
    margin: 30px auto;
  }
}

/* 下部メッセージ */
#kids-activities .kids-activities__parking{
  margin: 18px 0 0;
  text-align: center;
  font-size: 13px;
  opacity: 0.8;
}

/* ===== レスポンシブ ===== */
@media (max-width: 900px){
  #kids-activities .kids-activities__grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }

  #kids-activities .kids-card__title{
    font-size: 20px;
  }

  #kids-activities .kids-card__media{
    aspect-ratio: 4 / 3;
  }
}

/* =========================================
   TICKET：SOLD OUT をカード中央に固定
========================================= */

/* SOLD OUT 本体（真っ直ぐ＋大きく） */
#ticket .ticket-card .ticket-card__ribbon{
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;

  right: auto !important;
  bottom: auto !important;

  /* 真っ直ぐ中央 */
  transform: translate(-50%, -50%) rotate(0deg) !important;
  transform-origin: center !important;

  z-index: 999 !important;
  pointer-events: none;

  /* 帯を大きく（ここがサイズ調整の主役） */
  background: rgba(0,0,0,0.85);
  color: #fff;

  padding: 14px 34px;     /* ← 太さ：上下 / 長さ：左右 */
  font-size: 14px;        /* ← 文字を大きく */
  letter-spacing: 0.18em;
  line-height: 1;
  white-space: nowrap;

  min-width: 240px;       /* ← 帯の長さ（必要なら 260/280） */
  text-align: center;

  /* 角を少しだけ */
  border-radius: 2px;
}




/* =========================================================
   ACCESS page CSS (full rewrite)
   Scope: .access-wrap only (avoid body class mismatch)
========================================================= */

.access-wrap{
  --access-ink: #3c2d17;
  --access-sage: #c8cca3;
  --access-line: rgba(60, 45, 23, 0.18);
  --access-soft: rgba(60, 45, 23, 0.08);
  --access-max: 980px;

  color: var(--access-ink);
  padding: 110px 0 90px; /* PC: fixed header(80px) + 余白 */
}

/* スマホ（header 64px想定） */
@media (max-width: 768px){
  .access-wrap{
    padding: 96px 0 76px;
  }
}

/* 余計な影響を抑える */
.access-wrap *{
  box-sizing: border-box;
}

.access-wrap a{
  color: inherit;
  text-decoration: none;
}

/* 内側幅 */
.access-wrap .access-container{
  width: min(var(--access-max), calc(100% - 40px));
  margin: 0 auto;
}

/* =========================
   HERO
========================= */
.access-wrap .access-title{
  margin: 0;
  text-align: center;
  letter-spacing: 0.42em;
  font-weight: 400;
  font-size: clamp(28px, 3vw, 42px);
}

/* 会場情報 */
.access-wrap .access-venue{
  text-align: center;
  margin-top: 22px;
}

.access-wrap .access-venue-label{
  margin: 0;
  font-size: 14px;
  letter-spacing: 0.08em;
  opacity: 0.9;
}

.access-wrap .access-venue-address{
  margin: 10px 0 0;
  font-size: 14px;
  letter-spacing: 0.04em;
  line-height: 1.9;
}

.access-wrap .access-venue-postal{
  display: inline-block;
  margin-right: 10px;
}

/* モバイルで住所が見やすいように */
@media (max-width: 768px){
  .access-wrap .access-venue-address{
    display: grid;
    gap: 6px;
    justify-items: center;
  }
  .access-wrap .access-venue-postal{
    margin-right: 0;
  }
}

.access-wrap .access-venue-actions{
  margin-top: 16px;
}

/* =========================
   Buttons (角なし + hover黒)
========================= */
.access-wrap .access-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 12px 22px;
  border: 1px solid var(--access-ink);
  border-radius: 0;              /* 角なし */
  background: transparent;
  color: var(--access-ink);

  font-size: 13px;
  letter-spacing: 0.12em;
  line-height: 1;

  cursor: pointer;
  transition: background-color 0.14s ease, color 0.14s ease, border-color 0.14s ease;
}

.access-wrap .access-btn:hover{
  background: #000;
  color: #fff;
  border-color: #000;
}

.access-wrap .access-btn:focus-visible{
  outline: 2px solid rgba(0,0,0,0.35);
  outline-offset: 3px;
}

/* =========================
   Map (角なし)
========================= */
.access-wrap .access-map{
  margin-top: 26px;

  border-radius: 0;              /* 角なし */
  overflow: hidden;
  border: 1px solid var(--access-soft);

  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.06);

  aspect-ratio: 16 / 9;
  min-height: 260px;
}

@media (max-width: 820px){
  .access-wrap .access-map{
    aspect-ratio: 4 / 3;
    min-height: 240px;
  }
}

/* =========================
   Lead heading (見出し + 点線上下 + 余白)
========================= */
.access-wrap .access-lead{
  margin: 26px 0 0;
  text-align: center;

  font-weight: 500;
  letter-spacing: 0.12em;
  font-size: clamp(16px, 2vw, 18px);

  padding: 18px 0;               /* 余白 */
  border-top: 1px dashed var(--access-line);
  border-bottom: 1px dashed var(--access-line);
}

/* =========================
   Lower section
========================= */
.access-wrap .access-section{
  margin-top: 36px;
}

/* Card (角なし) */
.access-wrap .access-card{
  border: 1px solid var(--access-soft);
  border-radius: 0;              /* 角なし */
  padding: 24px 22px;

  background: #fff;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.03);
}

.access-wrap .access-card + .access-card{
  margin-top: 18px;
}

@media (max-width: 820px){
  .access-wrap .access-card{
    padding: 20px 16px;
  }
}

/* H2 (中央寄せ + 点線上下 + 余白) */
.access-wrap .access-h2{
  margin: 0 0 16px;
  text-align: center;

  font-size: clamp(18px, 4.6vw, 22px);
  font-weight: 500;
  letter-spacing: 0.14em;

  padding: 14px 0;               /* 余白 */
  border-top: 1px dashed var(--access-line);
  border-bottom: 1px dashed var(--access-line);
}

/* List (中央寄せ) */
.access-wrap .access-list{
  margin: 0;
  padding: 0;
  list-style: none;

  text-align: center;            /* 中央寄せ */
  font-size: 13px;
  line-height: 2.0;
  letter-spacing: 0.04em;
}

.access-wrap .access-list li{
  position: relative;
  padding: 6px 0;
}

/* “・”を中央寄せでも破綻しにくい形で付与 */
.access-wrap .access-list li::before{
  content: "・";
  margin-right: 0.3em;
}

/* =========================
   Ferry grid
========================= */
.access-wrap .access-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

@media (max-width: 820px){
  .access-wrap .access-grid{
    grid-template-columns: 1fr;
  }
}

.access-wrap .access-subcard{
  border: 1px solid var(--access-soft);
  border-radius: 0;              /* 角なし */
  padding: 18px 16px;
  background: rgba(255, 255, 255, 0.92);
}

.access-wrap .access-h3{
  margin: 0 0 10px;
  text-align: center;

  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.10em;

  padding: 12px 0;
  border-top: 1px dashed var(--access-line);
  border-bottom: 1px dashed var(--access-line);
}

.access-wrap .access-p{
  margin: 10px 0 0;
  text-align: center;
  font-size: 13px;
  line-height: 1.9;
  opacity: 0.92;
}

/* =========================
   Bus badge (角なし + 無色)
========================= */
.access-wrap .access-badge-row{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: center;       /* 中央寄せ */
  margin-bottom: 14px;
}

.access-wrap .access-badge{
  display: inline-flex;
  align-items: center;

  padding: 8px 14px;
  border-radius: 0;              /* 角なし */
  background: transparent;       /* 無色 */
  border: 1px solid var(--access-ink);

  color: var(--access-ink);
  font-size: 13px;
  letter-spacing: 0.06em;
}

.access-wrap .access-badge-sub{
  font-size: 12px;
  letter-spacing: 0.06em;
  opacity: 0.85;
  text-align: center;
}

/* Bus text blocks */
.access-wrap .access-route-title{
  margin: 14px 0 10px;
  text-align: center;

  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.10em;

  padding: 12px 0;
  border-top: 1px dashed var(--access-line);
  border-bottom: 1px dashed var(--access-line);
}

.access-wrap .access-small{
  margin: 10px 0 0;
  text-align: center;
  font-size: 12px;
  line-height: 1.9;
  opacity: 0.9;
}

/* =========================
   Note (角なし)
========================= */
.access-wrap .access-note{
  margin-top: 16px;

  border: 1px dashed var(--access-line);
  border-radius: 0;              /* 角なし */
  padding: 14px 16px;

  background: rgba(200, 204, 163, 0.18);

  font-size: 12px;
  letter-spacing: 0.06em;
  line-height: 1.9;
  text-align: center;
}


/* ================================
   TIME TABLE 固定ページ（30分刻み）
================================ */

/* fixed header 分 */
.timetable-main { padding-top: 80px; }
@media screen and (max-width: 768px) { .timetable-main { padding-top: 64px; } }

.timetable-section{
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 20px 100px;
  text-align: center;
}

.timetable-subtitle{
  font-size: 0.85rem;
  color: #777;
  margin: 8px 0 32px;
}

/* ---------- 日付タブ ---------- */
.timetable-date-tabs{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 60px;
  margin: 32px 0 34px;
}

.tt-date-btn{
  all: unset;
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  padding: 4px 0 10px;
  cursor: pointer;
  font-family: "ten-mincho-text", "YuMincho", "Hiragino Mincho ProN", serif;
  font-size: 0.85rem;
  letter-spacing: 0.28em;
  color: #b1a79b;
}

.tt-date-btn::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  transform:translateX(-50%);
  width:0;
  height:1px;
  background:#333;
  transition: width 0.25s ease, opacity 0.25s ease;
}

.tt-date-btn.is-active{ color:#333; }
.tt-date-btn.is-active::after{ width:70%; opacity:1; }

.tt-date-btn:hover{ color:#555; }
.tt-date-btn:hover::after{ width:70%; opacity:0.5; }

.tt-date-btn:focus-visible{
  outline: 2px solid rgba(0,0,0,0.35);
  outline-offset: 4px;
}

/* ---------- タブの中身 ---------- */
.timetable-pane{
  display:none;
  margin: 40px 0 60px;
}
.timetable-pane.is-active{ display:block; }

/* ---------- ラッパー ---------- */
.timetable-wrapper{
  background:#f5f3ee;
  box-shadow: 0 4px 18px rgba(0,0,0,0.06);
  padding: 24px 24px 40px;
  overflow-x:auto;
  -webkit-overflow-scrolling: touch;
}

/* =========================================
   グリッド本体（30分刻み）
   罫線レイヤーを ::before で「最前面」に描く
========================================= */
.timetable-grid{
  /* 罫線 */
  --tt-line-30: 1px;
  --tt-line-60: 2px;
  --tt-line-30-color: rgba(60,45,23,0.10);
  --tt-line-60-color: rgba(60,45,23,0.18);

  /* PHPが inline style で渡す値（上書きされます） */
  --tt-header-h: 56px;
  --tt-row-h: 44px;

  min-width: 900px;
  margin: 0 auto;
  display: grid;
  position: relative;
  font-size: 0.7rem;

  background: #f5f3ee;

  /* ★重要：この中だけでスタッキングを完結（外部CSS干渉を遮断） */
  isolation: isolate;
}

/* ★罫線：カードより必ず上に出す */
.timetable-grid::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top: var(--tt-header-h);
  bottom:0;
  pointer-events:none;

  /* ★カードより上 / 時刻より下 */
  z-index: 40;

  background-image:
    repeating-linear-gradient(
      to bottom,
      var(--tt-line-30-color) 0,
      var(--tt-line-30-color) var(--tt-line-30),
      transparent var(--tt-line-30),
      transparent var(--tt-row-h)
    ),
    repeating-linear-gradient(
      to bottom,
      var(--tt-line-60-color) 0,
      var(--tt-line-60-color) var(--tt-line-60),
      transparent var(--tt-line-60),
      transparent calc(var(--tt-row-h) * 2)
    );
}

/* ヘッダー左右空白 */
.tt-header-empty{
  background: transparent;
}

/* レーン見出し */
.tt-lane-header{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction: column;
  gap: 4px;

  background:#e3ddd4;
  border-left: 1px solid #d1c9be;
  border-right: 1px solid #d1c9be;
  border-bottom: 1px solid #cfc7bb;

  padding: 10px 8px;

  position: relative;
  z-index: 60; /* 罫線より上でOK */
}

.tt-lane-title{
  font-size: 0.8rem;
  letter-spacing: 0.25em;
  font-weight: 400;
}

.tt-lane-sub{
  font-size: 0.65rem;
  color: rgba(0,0,0,0.55);
  letter-spacing: 0.14em;
}

/* ---------- 時刻（左・右） ----------
   罫線に被らないように：背景+マスク
----------------------------------- */
.tt-time{
  position: relative;
  z-index: 70; /* 罫線より上（読みやすさ優先） */

  display:flex;
  align-items:center;
  height: 100%;

  padding: 0 6px;
  font-size: 0.65rem;
  color:#777;
  line-height: 1;

  pointer-events: none;
  user-select: none;

  background: rgba(245,243,238,0.96);
  box-shadow: 0 0 0 3px rgba(245,243,238,0.96);
  border-radius: 2px;
}

.tt-time-left{
  justify-content:flex-end;
  padding-right: 6px;
}

.tt-time-right{
  justify-content:flex-start;
  padding-left: 6px;
}

/* =========================================
   イベントカード
========================================= */
.tt-card{
  position: relative;

  /* ★最重要：外部CSSに負けないように固定 */
  z-index: 10 !important;

  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;

  width: 100%;
  height: 100%;
  justify-self: stretch;
  align-self: stretch;

  padding: 10px 8px;
  margin: 2px 6px;
  border-radius: 4px;

  color:#fff;
  text-decoration:none;
  overflow:hidden;

  box-shadow: 0 10px 22px rgba(0,0,0,0.25);

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  transition: transform 0.18s ease, box-shadow 0.18s ease;
  will-change: transform;
}

/* 暗幕 */
.tt-card::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(to bottom, rgba(0,0,0,0.55), rgba(0,0,0,0.45));
  z-index: 0;
}

.tt-card-inner,
.tt-card-title,
.tt-card-time{
  position: relative;
  z-index: 1;
}

.tt-card-title{
  font-size: 0.8rem;
  letter-spacing: 0.12em;
  margin-bottom: 4px;

  display:-webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow:hidden;
}

.tt-card-time{
  font-size: 0.65rem;
  opacity: 0.9;
}

.tt-card-link:hover{
  transform: translateY(-3px);
  box-shadow: 0 14px 32px rgba(0,0,0,0.30);
}

.tt-card-note{ cursor: default; }

/* notice */
.tt-card-notice{
  background: rgba(227,221,212,0.85);
  color: #3c2d17;
  box-shadow: none;
  border: 1px solid rgba(60,45,23,0.15);
}
.tt-card-notice::before{ display:none; }
.tt-card-notice .tt-card-time{ opacity: 0.75; }
/* 分割表示 */
.tt-card[data-split="2"]{
  width: calc(50% - 6px);
  margin: 2px 3px;
}
.tt-card[data-split="3"]{
  width: calc(33.333% - 6px);
  margin: 2px 3px;
}

.tt-card[data-side="left"]{ justify-self: start; }
.tt-card[data-side="center"]{ justify-self: center; }
.tt-card[data-side="right"]{ justify-self: end; }

/* ---------- Responsive ---------- */
@media screen and (max-width: 768px){
  .timetable-section{ padding: 60px 16px 80px; }
  .timetable-wrapper{ padding: 16px 12px 30px; }
  .timetable-grid{ min-width: 820px; }

  .timetable-date-tabs{
    gap: 32px;
    margin: 24px 0 24px;
  }
  .tt-date-btn{
    font-size: 0.8rem;
    letter-spacing: 0.2em;
  }
  .timetable-pane{ margin: 24px 0 40px; }

  /* スマホは分割を解除して縦積み */
  .tt-card[data-split="2"],
  .tt-card[data-split="3"]{
    width: 100%;
    margin: 2px 6px;
    justify-self: stretch;
  }

  /* 余白を削って表示領域を最大化 */
  .timetable-section{ padding: 48px 10px 70px; }
  .timetable-wrapper{ padding: 12px 8px 18px; }

  /* スマホ時は列幅を小さく（inline styleを上書き） */
  .timetable-grid{
    grid-template-columns: 52px minmax(0, 1fr) minmax(0, 1fr) 52px !important;
    min-width: 720px; /* 820px→軽くする。必要なら680〜760で調整 */
  }

  /* カードも少し詰めて情報量を稼ぐ */
  .tt-card{
    margin: 2px 4px;
    padding: 8px 6px;
  }
  .tt-card-title{ font-size: 0.75rem; }
  .tt-card-time{ font-size: 0.6rem; }
}

/* 横スクロールの“気づき”用フェード */
.timetable-wrapper{
  position: relative;
}

.timetable-wrapper::after{
  content:"";
  position:absolute;
  top:0;
  right:0;
  width:26px;
  height:100%;
  pointer-events:none;
  background: linear-gradient(to left, rgba(245,243,238,1), rgba(245,243,238,0));
}

/* LINE UP：日付バッジを画像内に表示 */
.lineup .logo-thumb{
  position: relative;
}

.lineup .logo-date{
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 5;

  display: inline-block;
  padding: 6px 10px;

  background: rgba(0,0,0,0.65);
  color: #fff;

  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.14em;
  white-space: nowrap;

  pointer-events: none;
}

.lineup .logo-label{
  margin: 10px 0 0;
}


/* =========================================================
   PERFORMANCE：WORK SHOP LIST（data-date を左上バッジ表示）
   - PHPは変更不要（a.workshop-card の data-date を利用）
   - スクショ同様：画像左上に常時表示
========================================================= */

.performance-main .workshop-card[data-date]{
  position: relative; /* バッジの基準 */
}

/* バッジ本体 */
.performance-main .workshop-card[data-date]::before{
  content: attr(data-date);
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 5;

  display: inline-block;
  padding: 6px 10px;

  background: rgba(0,0,0,0.65);
  color: #fff;

  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.14em;
  white-space: nowrap;

  pointer-events: none;
  user-select: none;
}

/* 「両日」をスクショの “2days” 表記に寄せたい場合（任意） */
.performance-main .workshop-card[data-date="両日"]::before{
  content: "2days";
}

/* hover/focus時に少しだけ濃く（任意・雰囲気調整） */
.performance-main .workshop-card:hover::before,
.performance-main .workshop-card:focus-visible::before{
  background: rgba(0,0,0,0.80);
}

/* スマホ微調整 */
@media (max-width: 768px){
  .performance-main .workshop-card[data-date]::before{
    top: 8px;
    left: 8px;
    padding: 5px 8px;
    font-size: 11px;
  }
}

/* ================================
   FLOOR MAP 固定ページ専用（LINE UP / TIME TABLE 風）
   ・白基調 / 点線セパレーター / タブは下線アクティブ
   ・ボタン hover は黒
================================ */

/* 既存ヘッダー高さに合わせて調整（必要なら数値だけ変更） */
.page-template-page-floormap .floor-main{
  padding-top: 80px;
}

.page-template-page-floormap .floor-section{
  padding: 84px 0 120px;
  text-align: center;
}

/* タイトル（LINE UPの雰囲気：広めの字間） */
.page-template-page-floormap .page-title{
  font-weight: 300;
  font-style: normal;
  font-size: clamp(2.0rem, 3.2vw, 2.8rem);
  letter-spacing: 0.35em;
  margin: 0 0 14px;
}

/* リード文（控えめ・中央） */
.page-template-page-floormap .floor-lead{
  width: min(820px, 100% - 40px);
  margin: 0 auto 22px;
  line-height: 2.0;
  font-size: 0.95rem;
  color: #444;
}

/* 点線セパレーター（LINE UPの区切り感） */
.page-template-page-floormap .floor-lead::after{
  content: "";
  display: block;
  width: min(980px, 100% - 40px);
  margin: 26px auto 0;
  border-top: 1px dotted rgba(0,0,0,0.25);
}

/* -------------------------
   Day切り替え（タブ：下線アクティブ）
------------------------- */
.page-template-page-floormap .floor-tabs{
  width: min(980px, 100% - 40px);
  margin: 18px auto 26px;
  display: flex;
  justify-content: center;
  gap: 34px;
  align-items: center;
  position: relative;
  padding-bottom: 10px;
}

/* タブ下の薄い基準線 */
.page-template-page-floormap .floor-tabs::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  border-top: 1px solid rgba(0,0,0,0.10);
}

/* タブ本体（ピル廃止 → テキストリンク風） */
.page-template-page-floormap .floor-tab{
  appearance: none;
  border: 0;
  background: transparent;
  padding: 8px 6px 10px;
  cursor: pointer;

  font-size: 0.85rem;
  letter-spacing: 0.22em;
  color: #555;
  position: relative;
  transition: color .15s ease, transform .15s ease;
}

/* hoverで軽く濃く */
.page-template-page-floormap .floor-tab:hover{
  color: #111;
  transform: translateY(-1px);
}

/* アクティブ：黒文字 + 下線 */
.page-template-page-floormap .floor-tab.is-active{
  color: #111;
}

.page-template-page-floormap .floor-tab.is-active::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: #111;
}

/* フォーカス可視化（アクセシビリティ） */
.page-template-page-floormap .floor-tab:focus-visible{
  outline: 2px solid rgba(0,0,0,0.35);
  outline-offset: 4px;
  border-radius: 6px;
}

/* -------------------------
   パネル / カード（白基調＋細線）
------------------------- */
.page-template-page-floormap .floor-panel{
  width: min(980px, 100% - 40px);
  margin: 0 auto;
}

/* カード：白＋薄い枠。LINE UPの余白感重視 */
.page-template-page-floormap .floor-map-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,0.10);
  box-shadow: 0 6px 18px rgba(0,0,0,0.04);
  border-radius: 14px;
  padding: 18px;
}

/* 画像クリック領域 */
.page-template-page-floormap .floor-map-click{
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  width: 100%;
  cursor: zoom-in;
  position: relative;
  display: block;
}

/* 画像：見やすさ最優先（枠は薄く） */
.page-template-page-floormap .floor-map-image{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.10);
}

/* 「タップで拡大」ヒント：邪魔しない小さめ */
.page-template-page-floormap .floor-map-hint{
  position: absolute;
  right: 12px;
  bottom: 12px;
  background: rgba(0,0,0,0.60);
  color: #fff;
  font-size: 0.78rem;
  padding: 7px 10px;
  border-radius: 999px;
  letter-spacing: 0.12em;
}

/* -------------------------
   アクションボタン（hoverは黒）
------------------------- */
.page-template-page-floormap .floor-actions{
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px dotted rgba(0,0,0,0.20);
}

/* 共通ボタン：白ベース */
.page-template-page-floormap .floor-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 170px;
  padding: 12px 14px;
  border-radius: 999px;

  border: 1px solid rgba(0,0,0,0.28);
  background: #fff;
  color: #111;

  text-decoration: none;
  cursor: pointer;

  font-size: 0.9rem;
  letter-spacing: 0.18em;

  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}

/* hover：黒（ご要望） */
.page-template-page-floormap .floor-btn:hover{
  background: #000;
  color: #fff;
  border-color: #000;
  transform: translateY(-1px);
}

/* フォーカス可視化 */
.page-template-page-floormap .floor-btn:focus-visible{
  outline: 2px solid rgba(0,0,0,0.35);
  outline-offset: 3px;
}

/* is-ghost も同じ挙動（統一感） */
.page-template-page-floormap .floor-btn.is-ghost{
  background: #fff;
  color: #111;
}

/* -------------------------
   固定ページ本文
------------------------- */
.page-template-page-floormap .floor-content{
  width: min(820px, 100% - 40px);
  margin: 34px auto 0;
  text-align: center;
  color: #444;
}

.page-template-page-floormap .floor-content::before{
  content: "";
  display: block;
  width: min(980px, 100% - 40px);
  margin: 0 auto 26px;
  border-top: 1px dotted rgba(0,0,0,0.25);
}

/* -------------------------
   モーダル（拡大表示）
   ※ボタン hover は黒に統一
------------------------- */
html.is-modal-open,
html.is-modal-open body{
  overflow: hidden;
}

.page-template-page-floormap .floor-modal{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
}

.page-template-page-floormap .floor-modal.is-open{
  display: block;
}

.page-template-page-floormap .floor-modal-backdrop{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.78);
}

.page-template-page-floormap .floor-modal-dialog{
  position: absolute;
  inset: 20px;
  margin: auto;
  width: min(1100px, 100%);
  height: calc(100% - 40px);

  background: #111;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 20px 60px rgba(0,0,0,0.50);

  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.page-template-page-floormap .floor-modal-close{
  position: absolute;
  top: 10px;
  right: 12px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.22);
  background: rgba(255,255,255,0.10);
  color: #fff;
  font-size: 26px;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
}

.page-template-page-floormap .floor-modal-close:hover{
  background: rgba(255,255,255,0.16);
  border-color: rgba(255,255,255,0.35);
  transform: translateY(-1px);
}

.page-template-page-floormap .floor-modal-figure{
  margin: 0;
  padding: 56px 16px 12px;
  flex: 1;
  overflow: auto;
}

/* 画像：横幅フィット＋縦スクロール */
.page-template-page-floormap .floor-modal-figure img{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.12);
  background: #fff;
}

/* モーダル下のボタン */
.page-template-page-floormap .floor-modal-footer{
  padding: 12px 14px 16px;
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;

  background: rgba(255,255,255,0.06);
  border-top: 1px solid rgba(255,255,255,0.10);
}

/* モーダル内ボタン：白ベース → hover黒 */
.page-template-page-floormap .floor-modal-footer .floor-btn{
  background: #fff;
  color: #111;
  border-color: rgba(255,255,255,0.30);
}

.page-template-page-floormap .floor-modal-footer .floor-btn:hover{
  background: #000;
  color: #fff;
  border-color: #000;
}

/* -------------------------
   レスポンシブ
------------------------- */
@media screen and (max-width: 768px){
  .page-template-page-floormap .floor-main{
    padding-top: 64px;
  }

  .page-template-page-floormap .floor-section{
    padding: 58px 0 92px;
  }

  .page-template-page-floormap .page-title{
    letter-spacing: 0.28em;
  }

  .page-template-page-floormap .floor-tabs{
    gap: 18px;
  }

  .page-template-page-floormap .floor-tab{
    font-size: 0.82rem;
    letter-spacing: 0.18em;
  }

  .page-template-page-floormap .floor-map-card{
    padding: 14px;
    border-radius: 14px;
  }

  .page-template-page-floormap .floor-map-hint{
    right: 10px;
    bottom: 10px;
    font-size: 0.74rem;
    padding: 6px 9px;
  }

  .page-template-page-floormap .floor-btn{
    min-width: 150px;
    padding: 11px 12px;
    font-size: 0.88rem;
  }

  .page-template-page-floormap .floor-modal-dialog{
    inset: 10px;
    height: calc(100% - 20px);
  }

  .page-template-page-floormap .floor-modal-figure{
    padding-top: 54px;
  }
}