:root {
  font-size: 62.5%;
  color-scheme: dark;
  --color-bg: #0b0a20;
  --color-overlay: rgba(10, 4, 20, 0.7);
  --color-primary: #ff4fb3;
  --color-secondary: #f55c1b;
  --color-accent: #23d6df;
  --color-text: #ffffff;
  --color-muted: rgba(255, 255, 255, 0.85);
  --font-heading: 'Tilt Neon','WDXL Lubrifont JP N',  sans-serif;
  --font-disco: 'Monoton',  sans-serif;
  --font-maru: 'Kosugi Maru', sans-serif;
  --font-body: 'Noto Sans JP', system-ui, sans-serif;

  --neon-text-color: #f40;
  --neon-border-color: #08f;
}

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

body {
  margin: 0;
  color: var(--color-text);
  font-size: 1.6rem;
  line-height: 1.7;
  font-family: var(--font-body);
  background: #03020b;
}
main#bg {
  opacity: 0;
  transition: opacity 1.2s ease-in-out 0.5s; /* 0.5秒遅れてじわっと表示 */
}
.artist2026 main#bg,
main#bg.is-visible { opacity: 1;}
#disco-bg {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  z-index: -2; /* 背景Canvasは最背面 */
  opacity: 0.9;
}
img {
  display: block;
  max-width: 100%;
  height: auto;
}
span,em,strong,small {
	display: inline-block;
	text-indent: 0;
}
small { font-size: .8em;}

/* リンク
------------------------------- */
a {
/*   display: inline-flex; */
  color: inherit;
  text-decoration: none;
  gap: 0.3rem;
}
a:link,
a:visited { color: #fff; }
a:hover { color: #fd0c9b;}
a:active { filter: brightness( 104% ) contrast( 106% ) grayscale(0%) saturate( 100% ) ;	}



/* 汎用クラス 
------------------------------- */
.magenta { color: #f0419e !important;}
.gold {
	color: #ffd900 !important;
	text-shadow : 
	1px 1px 0px rgba(10,10,0,0.5),
	-1px -1px 0px rgba(255,255,255,.1);
}
.bold { font-weight: bold !important;}

.center {
	margin: 0 auto;
	text-align: center !important;
}
.attention {
  display: inline-block;
  margin: auto;
  list-style: none;
}
.btn a {
	display: inline-block;
  padding: 1.2rem 2rem;
  width: 100%;
  max-width: 320px;
/*   font-family: var(--font-heading); */
  font-size: 1.4rem;
  letter-spacing: 0.08em;
  text-align: center;
  background: rgba(255, 255, 255, 0.1);
  border: 0.1rem solid rgba(255, 255, 255, 0.3);
  border-radius: 999px;
}
.icon {
	display: inline-block;
	width: auto;
	height: 1.5rem;
	vertical-align: middle;
	filter: invert(30%) sepia(96%) saturate(7493%) hue-rotate(315deg) brightness(104%) contrast(98%);
}
.hdn { display: none !important;}


/* WPクラス 
------------------------------- */
.wp-block-buttons {
	margin: 1.85em auto 1em;
	text-align: center;
}
.wp-block-button { margin: .63em auto;}
.wp-block-button a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 1.2rem 2rem;
	min-width: 250px;
/* 	font-family: var(--font-heading); */
	font-size: 1.4rem;
	letter-spacing: 0.08em;
	border-radius: 999px;
	border: 0.1rem solid rgba(255, 255, 255, 0.3);
	background: rgba(255, 255, 255, 0.1);
}


/* ローディング 
------------------------------- */
.loader {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  place-items: center;
  background: rgba(6, 4, 18, 0.95);
  z-index: 1000; /* ローダーは最前面 */
}

/* is-hidden がついたら、黒背景がじわっと消える */
.loader.is-hidden {
  opacity: 0;
  visibility: hidden;
  transition: opacity 1.2s ease-in-out 0.5s, visibility 1.2s ease-in-out 0.5s;
}

.loader__inner {
  position: relative;
  text-align: center;
  transition: opacity 0.7s ease-in-out; /* サルがじわっと消える時間 */
}

/* is-hidden がついたら、サル（inner）がフェードアウト */
.loader.is-hidden .loader__inner {
  opacity: 0;
}

/* is-paused がついたら、アニメーションを停止して不透明度を1にする */
.loader.is-paused .loader__monkey img {
  animation: none;
  opacity: 1;
  transform: translateY(0) scaleX(1);
}

.loader__monkey {
  /* この要素が拡大を担当 */
  animation: loading-zoom-in 10s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}


.loader__monkey img {
  margin: 0 auto;
  width: 10rem;
  /* この要素がダンスを担当 */
  animation: loading-flash-and-flip 1.6s infinite ease-out;
}

.loader__text {
  position: relative;
  margin-top: 1.5rem;
  height: 2.4rem; /* テキストの高さ分のスペースを確保 */
  font-size: 1.2rem;
  font-family: var(--font-body);
  font-weight: bold;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 0.7);
}

.loader__text-item {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  transition: opacity 0.4s ease-in-out;
}

.loader__text-item.is-active {
  opacity: 1;
  white-space: nowrap; /* テキストが折り返さないようにする */
}

/* 2番目のテキスト（Let's...）を大きくする */
.loader__text-item:nth-child(2) {
  font-size: 1.4em;
}

/* タイピング中のカーソル */
.loader__text-item.is-typing::after {
  content: '|';
  animation: typing-cursor 2.7s infinite;
}

@keyframes typing-cursor {
  from { opacity: 1; }
  to { opacity: 0; }
}

/* Loadingのドットアニメーション（1番目のテキスト用） */
.loader__text-item:first-child.is-active::after {
  content: '.';
  animation: loading-dots 1.4s infinite;
  display: inline-block;
  width: 1em; /* ドット3つ分の幅を確保 */
  text-align: left;
  font-family: monospace; /* 等幅フォントで統一感を出す */
  letter-spacing: 0; /* 文字間隔を統一 */
}

/* 2番目のテキスト（Let's）用のドットアニメーション（. → .. → ... で止まる） */
.loader__text-item:nth-child(2).is-active::after {
  content: '.';
  animation: loading-dots-let 1.2s forwards; /* 1回だけ実行して最後の状態で止める */
  display: inline-block;
  margin-left: 0.1em; /* 少し間隔を空ける */
  font-family: monospace; /* 等幅フォントで統一感を出す */
  letter-spacing: 0; /* 文字間隔を統一 */
}

@keyframes loading-dots {
  0% {
    content: '.';
  }
  33% {
    content: '..';
  }
  66% {
    content: '...';
  }
}

/* Let's用のドットアニメーション（. → .. → ... で止まる） */
@keyframes loading-dots-let {
  0% {
    content: '.';
  }
  33% {
    content: '..';
  }
  66%, 100% {
    content: '...';
  }
}


@keyframes loading-zoom-in {
  from {
    transform: scale(0.2);
    opacity: 0.1;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes loading-flash-and-flip {
  0% {
    transform: translateY(0) scaleX(1);
    opacity: 0;
  }
  1% {
    transform: translateY(-1px) scaleX(1);
    opacity: 0;
  }
  10% {
    transform: translateY(-10px) scaleX(1);
    opacity: 1;
  }
  20% {
    transform: translateY(0) scaleX(1);
    opacity: 1;
  }
  30% {
    transform: translateY(-10px) scaleX(1);
    opacity: 1;
  }
  40% {
    transform: translateY(0) scaleX(1);
    opacity: 1;
  }
  49% {
    transform: translateY(-9px) scaleX(1);
    opacity: 0;
  } 
  50% {
    opacity: 0;
  }
  51% {
    transform: translateY(-9px) scaleX(-1);
    opacity: 0;
  }
  60% {
    transform: translateY(0px) scaleX(-1);
    opacity: 1;
  }
  70% {
    transform: translateY(-10px) scaleX(-1);
    opacity: 1;
  }
  80% {
    transform: translateY(0px) scaleX(-1);
    opacity: 1;
  }
  90% {
    transform: translateY(-10px) scaleX(-1);
    opacity: 1;
  }
  99% {
    transform: translateY(-1px) scaleX(-1);
    opacity: 0;
  }
  100% {
    transform: translateY(0) scaleX(-1);
    opacity: 0;
  }
}
@keyframes loading-text {
  0% { opacity: 0;}
  1% { opacity: 0;}
  10% { opacity: 1;}
  40% { opacity: 1;}
  49% { opacity: 0;} 
  50% { opacity: 0;}
  51% { opacity: 0;}
  60% { opacity: 1;}
  90% { opacity: 1;}
  99% { opacity: 0;}
  100% { opacity: 0;}
}


/* heroエリア
------------------------------------------- */

.hero {
  position: relative;
  min-height: 100vh;
	padding: 0 0 6rem !important;
	background:url(/sarufes2026/common/images/bg-top2.png) #000 no-repeat center top;
	background-size: 100% auto;
}
@media (min-width: 1600px) {
  .hero { background-size: 1600px auto;}
}

.hero .inner {
  display: flex;
  padding: 8rem 2.4rem 6rem;
  min-height: 100vh;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  overflow: visible;
  position: relative;
}


/* タイトルエリア（.hero__content） */
.hero__content {
	position: relative;
	max-width: 90vw;
	z-index: 2;
}
.hero__content img { filter: drop-shadow(0px 0px 5px rgba(0,0,0,.7)) ;}
.presents { margin: 0 auto .2rem;}
.presents img {
	margin: auto;
	width: auto;
  max-height: 20px;  
}
h1.title-main {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0;
  margin: 0 0 0.8rem;
  font-family: var(--font-heading);
  font-size: 3.2rem;
  line-height: .6;
  text-align: center;
  text-shadow: 0 0 1.5rem rgba(255, 79, 179, 0.5);
}
h1.title-main img {
	display: block;
	width: auto;
  max-height: 50px;
}
h1.title-main img:nth-of-type(1) { animation: image-glow 4s infinite linear; }
h1.title-main img:nth-of-type(2) { animation: image-glow 4s infinite linear 0.3s; }
h2.theme {
  display: block;
  margin-top: 1rem;
  font-size: 2rem;
  letter-spacing: 0.05em;
}
h2.theme img {
	margin: auto;
	width: auto;
	height: 40px;
  max-height: 40px;  
}
h2.theme img:nth-of-type(1) { animation: image-glow 4s infinite linear 0.6s; }
h2.theme img:nth-of-type(2) { animation: image-glow 4s infinite linear 0.9s; }
.hero__info {
  display: inline-flex;
  flex-direction: column;
  gap: 0.2rem;
  margin: 2rem;
  font-size: 5rem;
  font-weight: 400;
  font-family: var(--font-disco);
}
.hero__date {
  color: var(--color-secondary);
  text-shadow: 0 0 5px rgba(0, 0, 78, 0.8);
}
.hero__date-dot { margin: 0 0.2rem;}
.hero__date-day {
  margin-left: 0.8rem;
  border-radius: 999px;
  font-size: 1.2rem;
  text-align: center;
}
.hero__place {
  font-size: 2rem;
  letter-spacing: 0.08em;
  font-family: var(--font-body);
}
.hero__place img {
	margin: auto;
	width: 80px;
	height: auto;
	filter: invert(92%) sepia(92%) saturate(34%) hue-rotate(127deg) brightness(108%) contrast(111%);
}
.hero__cta {
  display: inline-block;
  margin: 2rem;
  padding: 1.2rem 2.8rem;
  border-radius: 999px;
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 1.6rem;
/*   font-weight: bold; */
  letter-spacing: 0.05em;
  transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
  background-color: rgba(0,0,0,.8);
  box-shadow: 0 0 2rem rgba(255, 79, 179, 0.35);
}

.hero__cta:hover,
.hero__cta:focus-visible {
  background: var(--color-primary);
  box-shadow: 0 0 3.5rem rgba(255, 79, 179, 0.6);
/*   transform: translateY(-0.2rem); */
}

/* flyerエリア
------------------------------------------- */
.hero .flyer {
	position: relative;
  height: calc(88vw*1.41 - var(--flyer-shift, 0px));
  min-height:calc(88vw*1.41 - var(--flyer-shift, 0px));
}
.hero .flyer img {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%) ;
  width: 88vw;
	height: auto;
  filter: drop-shadow(0 0 4rem rgba(0, 0, 80, 0.9));
  opacity: .1;
  pointer-events: none;
  transition: transform 0.8s ease-out, opacity 0.8s ease-out;
  z-index: 3;
}
.hero .flyer.is-visible img {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(calc(var(--flyer-shift, 0px) * -1));
}
.hero .btn {
/* 	margin-top: -5em; */
}


/* セクション（.section）構造
------------------------------------------- */
.section {
	padding: 8rem 2.4rem;
	min-height: 100vh;
}
.section--info,
.section--tickets {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.section__inner {
  margin: 0 auto;
  max-width: 1024px;
}
.section__heading {
  position: relative; /* キャラクター装飾画像用（削除予定の可能性あり） */
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  margin-bottom: 7rem;
  text-align: center;
  overflow: visible; /* 画像がはみ出てもOK */
}

.section__heading::before {/* 各セクションにキャラクター画像を配置（CSS疑似要素で実装） */
  content: '';
  position: absolute;
  display: none;
  width: 120px;
  height: 120px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 1;
  pointer-events: none;
  z-index: 0;

  animation: chara-float 3s ease-in-out infinite;
  --chara-rotation: 0deg;
}


/* 浮遊アニメーション */
@keyframes chara-float {
  0%, 100% {
    transform: translateY(0) rotate(var(--chara-rotation, 0deg));
  }
  50% {
    transform: translateY(-10px) rotate(var(--chara-rotation, 0deg));
  }
}

.section__title {
	position: relative;
  margin: 0 ;
  font-family: var(--font-heading);
  font-size: clamp(4.4rem,11vw,6.5rem);
  font-weight: 400;
  font-style: italic; /* イタリック体を追加 */
  letter-spacing: 0.1em;
  text-align: center;
  line-height: 1.1;
  transform: rotate(-2.5deg); /* 少し斜めに */
  --interval: 1s;
  text-shadow: 
    0 0 10px var(--neon-base-color, yellow),
    0 0 20px var(--neon-base-color, orange),
    0 0 40px var(--neon-base-color, pink),
    0 0 80px var(--neon-base-color, red);
  will-change: filter, color;
  filter: saturate(60%);
  animation: flicker steps(100) var(--interval) 1s infinite;
  z-index: 1;
}
@keyframes flicker {
    0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% {
        text-shadow:
            -0.2rem -0.2rem 1rem #fff,
            0.2rem 0.2rem 1rem #fff,
            0 0 2rem var(--neon-text-color, #f40),
            0 0 4rem var(--neon-text-color, #f40),
            0 0 6rem var(--neon-text-color, #f40),
            0 0 8rem var(--neon-text-color, #f40),
            0 0 10rem var(--neon-text-color, #f40); 
    }
    20%, 24%, 55% {        
        text-shadow: none;
        box-shadow: none;
    }    
}

/* 各セクションタイトルの色を個別に設定 */
.section--info .section__title { --neon-text-color: #00ff7f; } /* SpringGreen */
.section--tickets .section__title { --neon-text-color: #ff4500; } /* OrangeRed */
.section--artists .section__title { --neon-text-color: #ff1493; } /* DeepPink */
.section--shinkai .section__title { --neon-text-color: #1e90ff; } /* DodgerBlue */
.section--food .section__title { --neon-text-color: #ffff00; } /* Yellow */
.section--timetable .section__title { --neon-text-color: #9932cc; } /* DarkOrchid */
.section--goods .section__title { --neon-text-color: #00ced1; } /* DarkTurquoise */
.section--access .section__title { --neon-text-color: #ff8c00; } /* DarkOrange */
.section--faq .section__title { --neon-text-color: #7cfc00; } /* LawnGreen */

.section__lead {
  margin: 0 auto;
  max-width: 80%;
  color: var(--color-muted);
  font-size: 1.45rem;
  letter-spacing: 0.1em;
}

.section__heading .info {
	margin: 2.5vh auto 0;
	padding: .25em 1em;
	width: 85%;
	max-width: 600px;
	font-size: 1.85rem;
	text-align: center;
	border: 3px solid #fff;
	border-radius: 50px;
}
.section__heading .info p {
	margin: .2em auto .3em;
	line-height: 1.2;
}

/* 概要（info）エリア
------------------------------------------- */
.section--info {
	padding: 18rem 4rem;
	background-color: rgba(0,0,0,.5);
}
.section--info .body {
	margin: 0 auto;
	max-width: 600px;
}
.section--info .body .text {
	margin: 4vh auto;
	font-size: 2.3rem;
	font-family: var(--font-maru);
	font-feature-settings: "palt";
	font-weight: bold;
	text-align: justify;
	text-align-last: left;
	letter-spacing: .06em;
	text-shadow:
	0 0 2px var(--neon-base-color, yellow),
	0 0 4px var(--neon-base-color, orange),
	0 0 6px var(--neon-base-color, yellow),
	0 0 8px var(--neon-base-color, yellow);
	animation: flicker steps(300) 4s 4s infinite;
}
.info-grid {
  display: grid;
  gap: 2.4rem;
  justify-content: center; /* カードを中央揃えにする */
}
.info-card {
  position: relative;
  padding: 2.4rem;
  border-radius: 1.6rem;
  background: rgba(18, 10, 44, 0.55);
  backdrop-filter: blur(1.2rem);
  box-shadow: 0 3.2rem 4.8rem rgba(4, 2, 18, 0.35);
}

.info-card__header {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  margin-bottom: 1.6rem;
}
.info-card__title {
  margin: 0 auto;
  font-size: 3.15rem;
/*   font-family: var(--font-body); */
/*   font-family: var(--font-heading); */
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.25;
  text-align: center;
  text-shadow : 0px 1px 0px rgba(0,0,0,0.5);
/*   transform: rotate(-2.5deg); */
}
.info-card__body {
  margin: 0;
  font-size: 1.5rem;
}
.info-card__row {
  display: grid;
  grid-template-columns: 8.4rem 1fr;
  gap: 1.2rem;
  padding: 1.2rem 0;
  border-top: 0.1rem solid rgba(255, 255, 255, 0.14);
}
.info-card__row:first-of-type {
  border-top: none;
  padding-top: 0;
}

.info-card__row dt {
  margin: 0;
  font-weight: 600;
  color: var(--color-muted);
}
.info-card__row dd { margin: 0;}
.info-card__link {
  color: var(--color-accent);
  text-decoration: underline;
}
.info-card__text { margin: 0 0 1.2rem;}
.info-card__text:last-child { margin-bottom: 0;}
.info-card__text--muted {
  color: var(--color-muted);
  font-size: 1.4rem;
}
.info-card__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 1.8rem;
  padding: 1.2rem 2rem;
  border-radius: 999px;
  border: 0.1rem solid rgba(255, 255, 255, 0.35);
  background: rgba(255, 255, 255, 0.04);
  font-family: var(--font-heading);
  font-size: 1.4rem;
  letter-spacing: 0.08em;
}


/* チケット（.section--tickets）エリア
------------------------------------------- */
.section--tickets {
	background-color: #000;
}
.section--tickets .section__inner { max-width: 500px;}
.ticket-grid {
  display: grid;
  gap: 3rem;
}

.ticket-card {
  /* スマホでの表示順序をorderで指定 */
  &.ticket-card--on-site { order: 1; }
  &.ticket-card--archive { order: 2; }
  &.ticket-card--combo { order: 3; }
  &.ticket-card--after { order: 4; }
}
  .ticket-card.ticket-card--on-site { background-color: #e0b701;}
  .ticket-card.ticket-card--combo   { background-color: #d25d6f;}
  .ticket-card.ticket-card--archive { background-color: #37aec6;}
  .ticket-card.ticket-card--after { background-color: #9462e0;}

.ticket-card__actions {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column; /* ボタンを縦に並べる */
  gap: 1rem;
  margin-top: 1.6rem;
}

.ticket-card__button {
  flex: 1 1 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.8rem; /* テキストとアイコンの間隔 */
  padding: 1rem 1.6rem;
  font-size: 1.75rem;
	font-weight: 600;
  text-align: center;
  letter-spacing: 0.08em;
  text-shadow : 0px 1px 0px rgba(0,0,0,0.5);
  background: rgba(0, 0, 0, 0.21);
  border-radius: 999px;
  transition: background-color 0.3s, border-color 0.3s;
}
.ticket-card__button.e { font-size: 1.95rem;}
.ticket-card__button:hover {
	color: rgba(0,0,65,0.5);
  text-shadow : 0px 0px 0px rgba(0,0,0,0.5);
  background-color: rgba(255, 255, 255, 0.75);
  border-color: rgba(255, 255, 255, 0.5);
  box-shadow : 0px 0px 5px 0px rgba(0,0,65,0.15);
  
}

.ticket-card__button::after {
  content: '';
  display: inline-block;
  width: 2rem; /* 拡大 */
  height: 1.9rem; /* 拡大 */
  background-image: url('/sarufes2026/common/images/link-external1.svg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: invert(1); /* アイコンを白に */
  transform: translateY(2px); /* 位置を少し下に微調整 */
  filter:invert(1) drop-shadow(0px 1px 0px rgba(0,0,0,0.5)) ;
}
.ticket-card__button:hover::after {
  filter: invert(0) drop-shadow(0px 0px 0px rgba(0,0,65,0.5)) ;
}
.ticket-card__actions .a {
	flex: 1 1 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.8rem;
	padding: 1rem 1.6rem;
	font-size: 1.75rem;
	font-weight: 600;
	text-align: center;
	letter-spacing: 0.08em;
	text-shadow: 0px 1px 0px rgba(0,0,0,0.5);
	background: rgba(0, 0, 0, 0.21);
	border-radius: 999px;
	transition: background-color 0.3s, border-color 0.3s;
}


.ticket-card__notes {
  margin: 1.6rem 0 0;
  padding: 0;
  list-style: none;
  font-size: 1.3rem;
  color: var(--color-muted);
  line-height: 1.6;
}

.ticket-card__notes li {
	margin-bottom: .3em;
  padding-left: 1.3em;
  text-indent: -1.3em;
  line-height: 1.3;
  letter-spacing: 0.05em;
}

.ticket-card__notes li::before {
  content: '※';
  margin-right: 0.4em;
}

.ticket-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 1.6rem;
}

.ticket-list__item {
  padding-bottom: 1.2rem;
  border-bottom: 0.1rem dashed rgba(255, 255, 255, 0.15);
}

.ticket-list__item:last-child {
  padding-bottom: 0;
  text-align: center;
  border-bottom: none;

}

.ticket-list__label {
  display: block;
  font-weight: 600;
  margin-bottom: 0.4rem;
}
.ticket-list__price {
  display: block;
  font-size: 3.2rem;
  font-family: var(--font-disco);
  text-align: center;
  letter-spacing: 0.05em;
  line-height: 1.23;
  text-shadow : 0px 1px 0px rgba(0,0,0,0.5);
}
.ticket-list__price small {font-size: .6em;}

.ticket-list__note {
  display: block;
  margin-top: 0.63rem;
  color: var(--color-muted);
  font-size: 1.3rem;
  font-family: var(--font-disco);
  text-align: center;
  letter-spacing: 0.05em;
}

.ticket-list__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0.35rem auto 0;
  padding: 0.2rem 0.8rem;
  color: #fff;
  font-size: 1.1rem;
  letter-spacing: 0.08em;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.18);

}

/* アーティストエリア
------------------------------------------- */
.section--lineup {
  position: relative;
  overflow: hidden;
}
.section--lineup .section__inner { position: relative;}
.section--artists {
  position: relative;
  background:
    radial-gradient(circle at 22% 12%, rgba(255, 79, 179, 0.16) 0%, rgba(255, 79, 179, 0) 62%),
    radial-gradient(circle at 78% 20%, rgba(35, 214, 223, 0.14) 0%, rgba(35, 214, 223, 0) 58%),
    transparent;
}

.section--artists::before {
  content: '';
  position: absolute;
  inset: 0;
  /* background: linear-gradient(180deg, rgba(5, 4, 18, 0.45) 0%, rgba(3, 4, 18, 0.85) 62%, rgba(1, 2, 12, 0.98) 100%); */
  pointer-events: none;
}

.section--artists .section__inner {
  position: relative;
}

.section--artists .section__inner::before {
  display: none;
}

.section__title--artists {
  display: inline-block;
  padding: 0.4rem 1.8rem;
  border-radius: 999px;
  border: 0.1rem solid rgba(255, 255, 255, 0.25);
  font-size: 2.2rem;
  letter-spacing: 0.5em;
  background: rgba(255, 255, 255, 0.04);
  box-shadow: 0 0 2.4rem rgba(255, 79, 179, 0.35);
}

.lineup-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(26rem, 1fr));
  gap: 2.4rem;
}

.lineup-grid__empty {
  grid-column: 1 / -1;
  margin: 0;
  padding: 3.2rem;
  border-radius: 1.6rem;
  background: rgba(255, 255, 255, 0.05);
  text-align: center;
  color: var(--color-muted);
}

.lineup-grid__empty span {
  display: block;
  margin-top: 0.8rem;
  font-size: 1.2rem;
}

.lineup-card {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  padding: 2.4rem;
  border-radius: 1.6rem;
  border: 0.1rem solid rgba(255, 255, 255, 0.08);
  background: rgba(15, 10, 32, 0.55);
  backdrop-filter: blur(1rem);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border 0.3s ease;
  cursor: pointer;
}

.lineup-card:hover {
  transform: translateY(-0.4rem);
  border-color: rgba(255, 255, 255, 0.25);
  box-shadow: 0 1.6rem 2.4rem rgba(4, 2, 18, 0.4);
}

/* singlepageがfalseのアーティストカードのスタイル */
.lineup-card--disabled {
  cursor: default;
}

.lineup-card--disabled:hover {
  transform: none; /* ホバーエフェクトを無効化 */
  border-color: rgba(255, 255, 255, 0.08); /* 元のボーダー色を維持 */
  box-shadow: none; /* シャドウを無効化 */
}

.lineup-card__thumb {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 1.2rem;
  background: linear-gradient(135deg, rgba(255, 79, 179, 0.4), rgba(35, 214, 223, 0.3));
  overflow: hidden;
}

.lineup-card__thumb img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.lineup-card__thumb img.contain { object-fit: contain;}

.lineup-card__placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-heading);
  font-size: clamp(2.4rem, 4vw, 3rem);
  letter-spacing: 0.18em;
  background: linear-gradient(135deg, rgba(255, 79, 179, 0.35), rgba(35, 214, 223, 0.35));
}

.lineup-card__placeholder--modal {
  font-size: clamp(3rem, 6vw, 4.2rem);
}

.lineup-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.14rem;
}

.lineup-card__category {
  display: inline-flex;
  align-items: center;
  margin: .3em .3em .5em;
  padding: 0.3rem 0.8rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  font-size: 1.1rem;
  letter-spacing: 0.08em;
  color: var(--color-muted);
}

.lineup-card__kana {
  margin: 0;
  font-size: 1.2rem;
  color: var(--color-muted);
  line-height: 1.4;
}

.lineup-card__name {
  margin: 0 0 .2em;
/*   font-family: var(--font-disco); */
  font-size: 2rem;
  letter-spacing: 0.05em;
  line-height: 1.1;
}

.lineup-card__time {
  margin: 0;
  font-size: 1.3rem;
  color: var(--color-muted);
}

.section--shinkai {
  position: relative;
  background:
    /* radial-gradient(circle at 25% 15%, rgba(47, 93, 255, 0.12) 0%, rgba(47, 93, 255, 0) 60%), */
    transparent;
}

.section--shinkai::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  /* background: linear-gradient(150deg, rgba(15, 28, 80, 0.8), rgba(6, 12, 48, 0.6)); */
  pointer-events: none;
}

.section--shinkai .section__inner {
  position: relative;
}

.section--food-lineup {
  position: relative;
  background:
    /* radial-gradient(circle at 15% 20%, rgba(255, 162, 53, 0.14) 0%, rgba(255, 162, 53, 0) 60%), */
    transparent;
}

.section--food-lineup::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  /* background: linear-gradient(130deg, rgba(255, 79, 179, 0.08), rgba(35, 214, 223, 0.05)); */
  pointer-events: none;
}

.section--food-lineup .section__inner {
  position: relative;
}

.artist-modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 2.4rem;
  z-index: 2000;
}

.artist-modal.is-open {
  display: flex;
}

.artist-modal__overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(6, 3, 16, 0.25);
  backdrop-filter: blur(1.5rem);
}

.artist-modal__dialog {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  width: min(1000px, 100%);
  margin: 0 auto;
  padding: 2rem 2rem 2rem;
  line-height: 1.25;
  border-radius: 2rem;
  background: rgba(12, 8, 36, 0.85);
  box-shadow: 0 3.2rem 4.8rem rgba(4, 2, 18, 0.65);
  z-index: 1;
  height: 92vh;
  max-height: 700px; /* 画面の高さの85%を上限に */
}

.artist-modal__dialog::after {
  content: '';
  position: absolute;
  /* ナビゲーションボタンの高さを考慮して位置を調整 */
  bottom: 8.4rem; 
  left: 2.4rem; /* ダイアログの左右paddingに合わせる */
  right: 2.4rem;
  height: 4rem; /* グラデーションの高さ */
  background: linear-gradient(to top, rgba(12, 8, 36, 1) 10%, rgba(12, 8, 36, 0));
  border-radius: 0 0 10px 10px;
  pointer-events: none; /* グラデーションがクリック操作を妨げないように */
  z-index: 1; /* スクロールするコンテンツより手前に配置 */
}

.artist-modal__close {
  position: fixed;
  top: 1.6rem;
  right: 1.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4.2rem;
  height: 4.2rem;
  border-radius: 50%;
  border: 0.1rem solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
  color: var(--color-text);
  font-family: var(--font-heading);
  font-size: 2rem;
  cursor: pointer;
  z-index: 10;
}

.artist-modal__body {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  overflow-y: auto; /* 内容がはみ出たらスクロール */
  overflow-x: hidden; /* 横スクロールは無効に */
  padding-right: .6rem; /* スクロールバーのスペース確保 */
  flex: 1; /* ← これが重要！残りのスペースを全て埋める */
}

.artist-modal__visual {
  position: relative;
  width: 100%;
  margin: 0;
  padding-top: 70%;
  color: #281e28;
  border-radius: 1.6rem;
  /* background: rgba(0, 0, 0, 0.2); */ /* 背景色をコメントアウト */
  overflow: hidden;
  transition: padding-top 0.3s ease; /* 高さが変わるアニメーションを追加 */
}

/* JSで付与するクラスに応じて高さを変える */
.artist-modal__visual.is-portrait {padding-top: 85%; }/* 縦長画像は高さを大きく */
.artist-modal__visual.is-landscape {padding-top: 65%;} /* 横長画像は高さを小さく */
.artist-modal__visual img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  object-fit: contain; /* contain に戻して全体を表示 */
  transform: translate(-50%, -50%);
}
.artist-modal__visual img:before {
	content: "";
	display: block;
	
}

.artist-modal__visual figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0.18rem .8rem;
/*   background: rgba(0, 0, 0, 0.75); */
  color: rgba(255, 255, 255, 0.49);
  font-size: 1.2rem;
  line-height: 1.4;
  text-align: right;
  z-index: 2;
}

.artist-modal__content {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  min-height: 0; /* flexboxの縮小を許可 */
}

.artist-modal__category {
  margin: .3em 0;
  padding: 0.3rem 0.8rem;
  color: var(--color-muted);
  font-size: 1.25rem;
  letter-spacing: 0.08em;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
}
.artist-modal__kana {
  margin: 0;
  color: var(--color-muted);
  font-size: 1.3rem;
  line-height: 1.2;
}
.artist-modal__name {
	position: relative;
  margin: 0 0 .46em;
	font-family: var(--font-heading);
	font-family: var(--font-maru);
  font-size: 2.6rem;
	font-size: clamp(2.8rem,11vw,3.2rem);
	font-weight: 600;
/* 	font-style: italic; */
  line-height: 1.24;
	letter-spacing: 0.08em;
/* 	transform: rotate(-2.5deg); */
	--interval: 1s;
	text-shadow:
	0 0 5px var(--neon-base-color, yellow),
	0 0 10px var(--neon-base-color, orange),
	0 0 20px var(--neon-base-color, pink),
	0 0 40px var(--neon-base-color, red);
	will-change: filter, color;
	filter: saturate(60%);
	animation: flicker steps(100) var(--interval) 1s infinite;
	z-index: 1;
}

.artist-modal__time {
  display: none;
  margin: 0;
  font-size: 1.4rem;
  letter-spacing: 0.1em;
  color: var(--color-accent);
}

.artist-modal__content-text {
  font-size: 1.5rem;
  line-height: 1.55;
}

.artist-modal__content-text p {
  margin: 0 0 1rem;
  font-size: 1.65rem;
/*
	font-feature-settings: "pkna";
	font-feature-settings: "pwid";
*/
	font-feature-settings: "palt";
	text-align: justify;
	word-wrap: break-word;
	text-align-last: left;
	letter-spacing: .06em;
}

.artist-modal__member {
  margin-top: 1.5rem;
  padding-bottom: 2rem;
  font-size: 1.5rem;
  line-height: 1.55;
}
.artist-modal__member h4.title {
  margin: 2.65em 0 1.25em;
  padding: 0.3rem 0.8rem;
  color: var(--color-muted);
  font-size: 1.15rem;
  letter-spacing: 0.08em;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
}
.artist-modal__profile {
	padding-bottom: 2rem;
  font-size: 1.5rem;
  line-height: 1.55;
}

.artist-modal__profile h4.title {
  margin: 2.65em 0 1.25em;
  padding: 0.3rem 0.8rem;
  color: var(--color-muted);
  font-size: 1.15rem;
  letter-spacing: 0.08em;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
}
.artist-modal__profile h5 {
	margin: 1em .5em .3em;
	padding-bottom: .25em;
	font-size: 1.65rem;
	font-weight: bold;
/* 	border-bottom: 1px dotted rgba(255,255,255,.5); */
}
.artist-modal__member p {
  margin: 0 .85em .5em;
  font-size: 1.65rem;
}

.artist-modal__profile p {
	margin: 0 .85em .5em;
	font-size: 1.65rem;
}

.artist-modal__links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}

.artist-modal__link {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.6rem 1.2rem;
  border-radius: 999px;
  border: 0.1rem solid rgba(255, 255, 255, 0.2);
  font-size: 1.3rem;
  letter-spacing: 0.05em;
  background: rgba(255, 255, 255, 0.06);
}

.artist-modal__media iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: none;
  border-radius: 1.2rem;
}

.artist-modal__nav {
  display: flex;
  
  justify-content: space-between;
  z-index: 20;
  margin-top: auto; /* ← これが重要！上に押し上げられる */
}

.artist-modal__nav-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4.4rem;
  height: 4.4rem;
  border-radius: 50%;
  border: 0.1rem solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.08);
  color: var(--color-text);
  font-family: var(--font-heading);
  font-size: 1.8rem;
  cursor: pointer;
}


.section--food {
  position: relative;
  background:
    radial-gradient(circle at 15% 20%, rgba(255, 162, 53, 0.12) 0%, rgba(255, 162, 53, 0) 60%),
    rgba(4, 9, 32, 0.85);
}

.section--food::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(125deg, rgba(255, 79, 179, 0.08), rgba(35, 214, 223, 0.06));
  opacity: 0.7;
  pointer-events: none;
}

.section--food .section__inner {
  position: relative;
}

.food-grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 2rem;
}

.food-card {
  display: flex;
  flex-direction: column;
  border-radius: 1.6rem;
  background: rgba(16, 12, 40, 0.7);
  box-shadow: 0 1.2rem 2.4rem rgba(5, 3, 22, 0.4);
  overflow: hidden;
}

.food-card__thumb {
  position: relative;
  width: 100%;
  padding-top: 70%;
  overflow: hidden;
}

.food-card__thumb img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: transform 0.4s ease;
}

.food-card:hover .food-card__thumb img {
  transform: scale(1.05);
}

.food-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 2rem;
}

.food-card__name {
  margin: 0;
  font-family: var(--font-heading);
  font-size: 1.6rem;
  letter-spacing: 0.08em;
}

.food-card__desc {
  margin: 0;
  font-size: 1.4rem;
}

.food-card__tag {
  align-self: flex-start;
  padding: 0.4rem 0.8rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: var(--color-muted);
  font-size: 1.1rem;
  letter-spacing: 0.08em;
}

/* TIME TABLE（#timetable）エリア
------------------------------------------- */
.section--timetable {
  position: relative;
  min-height: auto;
  background: /* rgba(8, 6, 30, 0.85) */ transparent;
}

.section--timetable::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  /* background: radial-gradient(circle at 50% 0%, rgba(35, 214, 223, 0.12), transparent 60%); */
  pointer-events: none;
}

.section--timetable .section__inner {
  position: relative;
}

.timetable-card {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 2.4rem;
  padding: 3rem 2.4rem;
  border-radius: 1.8rem;
/*   background: rgba(255, 255, 255, 0.05); */
/*   box-shadow: 0 1.6rem 3rem rgba(3, 2, 12, 0.45); */
}

.timetable-card__images {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 1.6rem;
  max-width: 700px; /* PCでも1列、最大幅を制限 */
  margin: 0 auto; /* 中央揃え */
}

.timetable-image {
  position: relative;
  width: 100%;
  border-radius: 1.2rem;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.3);
  box-shadow: 0 0.8rem 1.6rem rgba(0, 0, 0, 0.3);
}

.timetable-image img {
  width: 100%;
  height: auto;
  display: block;
}

.timetable-card__actions {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  margin: 2rem auto;
  width: 100%;
  max-width: 320px;
}

.timetable-card__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1.2rem 2rem;
  border-radius: 999px;
  border: 0.1rem solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.1);
  font-family: var(--font-heading);
  font-size: 1.4rem;
  letter-spacing: 0.08em;
}

.timetable-card__button--disabled {
  background: rgba(255, 255, 255, 0.04);
  border: 0.1rem dashed rgba(255, 255, 255, 0.2);
  color: var(--color-muted);
  pointer-events: none;
}

/* GOODS（#goods）エリア
------------------------------------------- */
.section--goods {
  position: relative;
  background:
    /* radial-gradient(circle at 15% 20%, rgba(255, 79, 179, 0.1) 0%, rgba(255, 79, 179, 0) 55%), */
    transparent;
}

.section--goods::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  /* background: linear-gradient(140deg, rgba(255, 192, 67, 0.12), rgba(35, 214, 223, 0.06)); */
  pointer-events: none;
}

.section--goods .section__inner {
  position: relative;
}
.section--goods .banner a img {
	transition: all .3s ease;
}
.section--goods .banner a:hover img {
	transition: all .3s ease;
	box-shadow : 0px 0px 8px rgba(255,255,255,0.8);
	transform: translateY(-4px);	
}
.section--goods .onsale {
  margin: -20px auto 50px;
  padding: .6em 3em .65em;
  width: 85%;
  max-width: 700px;
  font-size: 2rem;
  text-align: center;
  border: 3px solid #fff;
  border-radius: 150px;
}
.section--goods .onsale p {
  margin: 0 .5em .15em;
  color: #fff;
  font-size: 2.1rem;
  text-align: center;
}
.section--goods .onsale .attention { 
	margin: 0 auto;
	padding: 0;
	text-align: left;
}
.section--goods .onsale .attention li {
	padding-left: 1.3rem;
	text-indent: -1.3rem;
	font-size: 1.3rem;
	line-height: 1.4;
}
.section--goods .attention li::before { content: "＊ ";}

/* Goods - Productions（去年の構造対応）
------------------------------------------- */
.section--goods .productions {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 2.4rem;
  margin-top: 3.2rem;
}

.section--goods .production {
  position: relative;
  margin: 0 auto;
  padding: 0;
  width: 100%;
  max-width: 800px;
  border-radius: 1.6rem;
  overflow: hidden;
  background: rgba(0, 0, 45, 0.75);
  box-shadow: 0 1.6rem 2.6rem rgba(4, 2, 16, 0.45);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.section--goods .production:hover {
  transform: translateY(-0.4rem);
  box-shadow: 0 2rem 3rem rgba(4, 2, 16, 0.6);
}

.section--goods .production a {
  display: block;
  padding: 0 0 6rem;
  height: 100%;
  color: #fff;
  text-decoration: none;
}

.section--goods .production figure {
  width: 100%;
  margin: 0;
  background-color: #fff;
  line-height: 0;
}

.section--goods .production figure img {
  width: 100%;
  height: auto;
  display: block;
}

.section--goods .production .textarea {
  padding: 2rem;
}

.section--goods .production h2 {
  margin: 0 0 1rem;
  color: #fff;
  font-size: 2rem;
  line-height: 1.3;
  text-align: center;
}

.section--goods .production h2 small {
  display: block;
  font-size: 0.75em;
}
.section--goods .production p {
  margin: 0 0 1rem;
  color: rgba(255, 255, 255, 0.8);
  font-size: 1.4rem;
  text-align: center;
  line-height: 1.6;
}

.section--goods .production p.hidden {
  display: none;
}

/* textarea内の複数のdlを縦に並べる */
.section--goods .production .textarea {
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.section--goods .production dl {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 1.2rem;
  margin: 0 auto;
  padding: 0;
  width: 100%;
  max-width: 300px;
}

/* dtとddを横並びに配置 */
.section--goods .production dl dt {
  flex-shrink: 0;
  min-width: 7rem;
  margin: 0;
  padding: 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: 1.3rem;
  font-weight: normal;
  vertical-align: baseline;
}
.section--goods .production dl dd {
  flex: 1;
  margin: 0;
  padding: 0;
  color: #fff;
  font-size: 1.4rem;
  line-height: 1.6;
}
.section--goods .production dl dd strong {
  font-size: 1.5em;
  font-weight: bold;
}
.section--goods .production dl dd small { 
  font-size: 0.8em;
  display: inline-block;
  line-height: 1.5;
  margin-top: 0.4rem;
}
.section--goods .production dl dd small:first-child {
  margin-top: 0;
}
.section--goods .production dl dt.size { margin-top: 0;}
.section--goods .production dl .strikethrough {
	position: relative;
	display: inline-block;
}
.section--goods .production dl .strikethrough::after {
  content: "";
  position: absolute;
  top: 55%;
  left: 0;
  width: 100%;
  height: 6%;
  background-color: #f0419e;
}
/* 早割 */
.section--goods .production dl.price,
.section--goods .production dl.sale { align-items: baseline;}
.section--goods .production dl.sale { margin-bottom: 1rem;}
.section--goods .production dl.sale small { margin-top: 0;}
.section--goods .production dl.sale dt {
	color: #f0419e;
	font-size: 1.23rem;
	font-weight: bold;
}
.section--goods .production dl.sale dd {
	color: #f0419e;
	font-size: 1.8rem;
	line-height: 1.2;
}
.section--goods .production dl.sale.gold dt,
.section--goods .production dl.sale.gold dd {
	color: #ffd900 !important;
	text-shadow : 
	1px 1px 0px rgba(10,10,0,0.5),
	-1px -1px 0px rgba(255,255,255,.1);
}



.section--goods .production dl dd ul.attentions {
  margin: 0.8rem 0 0;
  padding-left: 1.6rem;
  list-style: disc;
}

.section--goods .production dl dd ul.attentions li {
  margin: 0.4rem 0;
  font-size: 1.2rem;
  line-height: 1.5;
}

.section--goods .production .btn {
  position: absolute;
  bottom: 1.6rem;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 3.2rem);
  max-width: 300px;
  text-align: center;
}

.section--goods .production .btn .buy {
  display: block;
  padding: 1.2rem 2rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.15);
  border: 0.1rem solid rgba(255, 255, 255, 0.3);
  color: #fff;
/*   font-family: var(--font-heading); */
  font-size: 1.4rem;
  letter-spacing: 0.08em;
  transition: all 0.3s ease;
}

.section--goods .production a:hover .btn .buy {
  background: rgba(255, 255, 255, 0.25);
  border-color: rgba(255, 255, 255, 0.5);
  transform: scale(1.05);
}

.section--goods .good_info {
  margin: 4rem auto 0;
  padding: 2rem;
  max-width: 700px;
  text-align: center;
  background: rgba(0, 0, 45, 0.75);
  border-radius: 1.6rem;
}

.section--goods .good_info .attention {
  margin: 0;
  padding: 0;
  text-align: left;
  list-style: none;
}

.section--goods .good_info .attention li {
  margin: 0.25rem 0;
  color: rgba(255, 255, 255, 0.8);
  font-size: 1.3rem;
  line-height: 1.6;
}

.section--goods .good_info .attention.change li::before {
  content: "※ ";
}

.section--goods .good_info p.center {
  margin: 1.6rem 0 0;
  color: rgba(255, 255, 255, 0.9);
  font-size: 1.4rem;
  text-align: center;
  line-height: 1.6;
}
.section--goods .good_info p.center img.arrow {
	margin: .9em auto 0;
	height: 60px;
	filter: invert(92%) sepia(92%) saturate(34%) hue-rotate(127deg) brightness(108%) contrast(111%);
}
.section--goods .good_info .banner {
	margin-bottom: 0;
}

.goods-grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 2rem;
}

.goods-card {
  display: flex;
  flex-direction: column;
  border-radius: 1.6rem;
  background: rgba(18, 14, 46, 0.8);
  box-shadow: 0 1.6rem 2.6rem rgba(4, 2, 16, 0.45);
  overflow: hidden;
}

.goods-card__thumb {
  position: relative;
  width: 100%;
  padding-top: 100%;
  overflow: hidden;
}

.goods-card__thumb img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.goods-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 2rem;
}

.goods-card__name {
  margin: 0;
  font-family: var(--font-heading);
  font-size: 1.6rem;
}

.goods-card__price {
  margin: 0;
  color: var(--color-secondary);
  font-family: var(--font-heading);
  font-size: 1.4rem;
}

.goods-card__desc {
  margin: 0;
  font-size: 1.4rem;
}


/* ACCESS（#access）エリア
------------------------------------------- */
.section--access {
  position: relative;
  background: /* rgba(4, 7, 24, 0.9) */ transparent;
}

.section--access::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  /* background: radial-gradient(circle at 90% 10%, rgba(35, 214, 223, 0.12), transparent 60%); */
  pointer-events: none;
}

.section--access .section__inner {
  position: relative;
}

.access-layout {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 2.4rem;
}

.access-map {
  position: relative;
  margin: 0 auto;
  width: 100%;
  max-width: 545px;
  border-radius: 1.6rem;
  box-shadow: 0 1.6rem 2.8rem rgba(3, 2, 14, 0.45);
  overflow: hidden;
}

.access-map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.access-info {
  display: flex;
  flex-direction: column;
  gap: 1.8rem;
}
.access-info h3 {
	margin: 0;
	text-align: center;
	font-weight: normal;
}
.access-info h3 img {
	margin: auto;
	width: 50vw;
	max-width: 200px;
	filter: invert(92%) sepia(92%) saturate(34%) hue-rotate(127deg) brightness(108%) contrast(111%);
	transition: all .3s ease; 
}
.access-info h3 a:hover img {
	filter: invert(92%) sepia(92%) saturate(34%) hue-rotate(127deg) brightness(108%) contrast(111%)
	drop-shadow(0px 0px 6px rgba(255,255,255,.7));
	transform: translateY( -4px);  
}

.access-list {
  display: grid;
  gap: 1.6rem;
  margin: 0;
  padding: 0;
}

.access-list div {
  display: grid;
  gap: 0.4rem;
}

.access-list dt {
  margin: 0;
  color: var(--color-muted);
  font-size: 1.65rem;
  font-weight: bold;
  letter-spacing: 0.08em;
}
.access-list dt::before {
	content: "- ";
}

.access-list dd {
  margin: 0;
  font-size: 1.5rem;
  line-height: 1.65;
}
.access-list dd a {
  white-space: nowrap; /* 改行を防ぐ */
  display: inline-flex; /* テキストと画像を同じ行に */
  align-items: center; /* 縦方向の中央揃え */
  gap: 0.4rem; /* テキストと画像の間隔 */
}
.access-list dd a:hover { color: #fd0c9b;}
.access-list dd img {
	display: inline-block; /* インライン表示 */
	width: auto;
	height: 1.5rem;
	vertical-align: middle; /* テキストと縦方向の位置を揃える */
	filter: invert(30%) sepia(96%) saturate(7493%) hue-rotate(315deg) brightness(104%) contrast(98%);
}

.access-links {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  font-size: 1.4rem;
}

.access-links a {
  color: var(--color-accent);
  text-decoration: underline;
}


/* F.A.Q.（#faq）エリア
------------------------------------------- */
.section--faq {
  position: relative;
  background:
    /* radial-gradient(circle at 50% 50%, rgba(18, 12, 52, 0.9), rgba(4, 4, 18, 0.95)) */
    transparent;
}

.faq-accordion {
  display: grid;
  gap: 1.6rem;
}

.faq-item {
  border-radius: 1.6rem;
  background: rgba(0, 0, 0, 0.75);
  overflow: hidden;
}

.faq-item__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.6rem;
  width: 100%;
  padding: 1.6rem 2rem;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.faq-item__q {
/*   font-family: var(--font-heading); */
  font-size: 1.75rem;
  letter-spacing: 0.08em;
  text-align: left;
}

.faq-item__icon {
  font-size: 2rem;
  transition: transform 0.3s ease;
}

.faq-item.is-open .faq-item__icon {
  transform: rotate(45deg);
}

.faq-item__panel {
  display: none;
  padding: 0 2rem 1.8rem;
  color: var(--color-muted);
  font-size: 1.7rem;
}
.faq-item__panel p {
	margin: 0;
}

.faq-item.is-open .faq-item__panel {
  display: block;
}

.faq-contact {
  margin-top: 3.2rem;
  text-align: center;
}

.faq-contact__text {
  margin: 0;
  font-size: 1.4rem;
}

.faq-contact__text a {
  color: var(--color-accent);
  text-decoration: underline;
}

/* Archive（#archive）エリア
------------------------------------------- */
.section--archive { min-height: auto;}
#sarufesnavi {
  display: grid;
  /*grid-template-columns: repeat(3, 1fr);  スマホでは3列 */
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  gap: 1.6rem;
  justify-items: center;
  align-items: center;
  margin: 3.2rem auto;
  width: 100%;
  max-width: 900px;
}

#sarufesnavi a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 120px;
  transition: transform 0.3s ease, opacity 0.3s ease;
  opacity: 1; /* 通常時も完全表示 */
}
#sarufesnavi a:hover {
  opacity: 1;
  transform: scale(1.1);
}
#sarufesnavi a img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 0.4rem;
  transition: filter 0.3s ease;
}
#sarufesnavi a:hover img {
  filter: brightness(1.1);
}

/* リンク・コンタクト */
.section--archive .credit {
	margin-top: 10vh;
	text-align: center;
}
.section--archive .credit #link a {
	display: inline-block;
	margin: 0 .4em;
}

.section--archive .contact a {
	font-weight: bold;
	--interval: 1s;
  text-shadow:
  0 0 2px var(--neon-base-color, yellow),
  0 0 4px var(--neon-base-color, orange),
  0 0 7px var(--neon-base-color, pink),
  0 0 10px var(--neon-base-color, red);
  will-change: filter, color;
  animation: flicker steps(100) var(--interval) 1s infinite;
}
.section--archive .contact a:hover {
  filter: saturate(60%);
}


/* フッター 
------------------------------------------- */

.site-footer {
  position: relative;
  padding: 4rem 2.4rem 6rem;
  background: linear-gradient(180deg, rgba(4, 3, 14, 0.95) 0%, rgba(2, 1, 8, 1) 100%);
  text-align: center;
}

.site-footer__inner {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  max-width: 96rem;
  margin: 0 auto;
}

.site-footer__logo {
	display: flex;
	flex-direction: row;
	justify-content: center;
  font-family: var(--font-heading);
  font-size: 2rem;
  letter-spacing: 0.2em;
  text-align: center;
}
.site-footer__logo img {
	width: auto;
	height: 30px;
	filter: invert(92%) sepia(92%) saturate(34%) hue-rotate(127deg) brightness(108%) contrast(111%) opacity(75%);
}


.site-footer__nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.2rem 2.4rem;
}

.site-footer__nav a {
  color: var(--color-muted);
  font-size: 1.3rem;
  letter-spacing: 0.16em;
}

.site-footer__sns {
  display: flex;
  justify-content: center;
  gap: 1.6rem;
  font-size: 1.4rem;
}

.site-footer__sns a {
  color: var(--color-accent);
  text-decoration: underline;
  transition: opacity 0.3s;
}
.site-footer__sns a:hover {
  opacity: 0.7;
}
.site-footer__sns img {
  width: 2.4rem;
  height: auto;
  filter: invert(1); /* SVGの色を白にする */
}

.site-footer__copy {
  margin: 2.4rem 0 0;
  font-size: 1.2rem;
  letter-spacing: 0.05em;
}

/*-------------------------------------------
  ハンバーガーメニュー
-------------------------------------------*/
/* ハンバーガーメニューとキャラクターのラッパー */
.hamburger_area {
  position: fixed;
  bottom: 4vmin;
  right: 1vmin;
  z-index: 1000; /* ハンバーガーエリアはローダーと同等か、その上に配置 */
  display: flex;
  align-items: flex-end;
  flex-direction: row-reverse; /* キャラクターをメニューの左に配置 */
  width: 12vmin;
  height: 13vmin;
}
.hamburger_menu {
	position: absolute;
	bottom: 0;
	right: 4vmin;
  padding: 0;
  z-index: 1000; /* ハンバーガーメニューボタン自体も前面に */
  width: 7.2rem;
  height: 7.2rem;
  border: none;
  border-radius: 50%;
  background-color: rgba(255, 255, 0, 0.85); /* 黄色を透過させる */
  cursor: pointer;
  transition: all 0.3s ease;
}

.hamburger_menu span {
  display: block;
  width: 2.8rem; /* 線の幅を太く */
  height: 3px; /* 線の高さを太く */
  margin: 0.6rem auto; /* 間隔を調整 */
  background-color: #000000; /* 線の色を黒に変更 */
  transition: all 0.3s ease;
}
.hamburger_menu.is-active span:nth-child(1) { transform: translateY(9px) rotate(45deg);} /* 太さの分、移動量を調整 */
.hamburger_menu.is-active span:nth-child(2) { opacity: 0;}
.hamburger_menu.is-active span:nth-child(3) { transform: translateY(-9px) rotate(-45deg);} /* 太さの分、移動量を調整 */




@keyframes spotlight-flicker {
  0%, 100% {
    opacity: 0.8;
    transform: translate(-50%, -50%) scale(1);
  }
  25% {
    transform: translate(-50%, -50%) scale(1.1);
  }
  49% {
    opacity: 1;
  }
  50%, 51% {
    opacity: 0;
  }
  75% {
    transform: translate(-50%, -50%) scale(1.1);
  }
}

.menu-modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999; /* メニューモーダルはローダーより一つ低い層、または必要に応じて調整 */
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0.4s ease;
  overflow-y: auto;
  display: flex; /* 追加 */
  align-items: center; /* 追加 */
  justify-content: center; /* 追加 */
}

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

.menu-modal__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 100%;
  padding: 2rem 4rem; /* 上部パディングを2remに、左右は4rem維持 */
}

.menu-modal__nav {
  display: flex;
  flex-direction: column;
  gap: 1.6rem; /* 間隔をさらに狭める */
  text-align: center; /* 中央揃えに */
  width: fit-content; /* コンテンツに合わせて幅を調整 */
  margin: 0 auto; /* 水平方向の中央配置 */
}

.menu-modal__nav a {
  color: #fff;
  font-size: 3.2rem;
  font-family: var(--font-heading);
  text-decoration: none;
  font-style: italic; /* イタリック体を追加 */
  font-weight: 400; /* 重さを合わせる */
  line-height: 1.2;
  letter-spacing: 0.1em;
  transition: color 0.3s;
  transform: rotate(-2.5deg); /* 傾きを追加 */
  animation: flicker 4s infinite linear; /* flickerアニメーションを適用 */
}
.menu-modal__nav a[href="#shinkai"] { font-size: 2.8rem;letter-spacing: 0.2em;}
.menu-modal__nav a::after {
  content: '';
  display: none; /* スマホで非表示にする */
  margin-top: 0.4rem;
  font-family: var(--font-body);
  font-size: 1.4rem;
  font-weight: 400;
  color: var(--color-muted);
  letter-spacing: 0.05em;
}


/* メニュー項目の色をセクションタイトルと合わせる */
.menu-modal__nav a[href="/sarufes26/#festival-info"],
.menu-modal__nav a[href="#festival-info"] { --neon-text-color: #00ff7f; color: #fff; }
.menu-modal__nav a[href="/sarufes26/#tickets"],
.menu-modal__nav a[href="#tickets"] { --neon-text-color: #ff4500; color: #fff; }
.menu-modal__nav a[href="/sarufes26/#artists"],
.menu-modal__nav a[href="#artists"] { --neon-text-color: #ff1493; color: #fff; }
.menu-modal__nav a[href="/sarufes26/#shinkai"],
.menu-modal__nav a[href="#shinkai"] { --neon-text-color: #1e90ff; color: #fff; }
.menu-modal__nav a[href="/sarufes26/#food"],
.menu-modal__nav a[href="#food"] { --neon-text-color: #ffff00; color: #fff; }
.menu-modal__nav a[href="/sarufes26/#timetable"],
.menu-modal__nav a[href="#timetable"] { --neon-text-color: #9932cc; color: #fff; }
.menu-modal__nav a[href="/sarufes26/#goods"],
.menu-modal__nav a[href="#goods"] { --neon-text-color: #00ced1; color: #fff; }
.menu-modal__nav a[href="/sarufes26/#access"],
.menu-modal__nav a[href="#access"] { --neon-text-color: #ff8c00; color: #fff; }
.menu-modal__nav a[href="/sarufes26/#faq"],
.menu-modal__nav a[href="#faq"] { --neon-text-color: #7cfc00; color: #fff; }

.menu-modal__nav a[href="/sarufes26/#festival-info"]::after,
.menu-modal__nav a[href="#festival-info"]::after { content: 'さるフェスとは？'; }
.menu-modal__nav a[href="/sarufes26/#tickets"]::after,
.menu-modal__nav a[href="#tickets"]::after { content: 'チケット情報'; }
.menu-modal__nav a[href="/sarufes26/#artists"]::after,
.menu-modal__nav a[href="#artists"]::after { content: '出演者'; }
.menu-modal__nav a[href="/sarufes26/#shinkai"]::after,
.menu-modal__nav a[href="#shinkai"]::after { content: '似顔絵コーナー'; }
.menu-modal__nav a[href="/sarufes26/#food"]::after,
.menu-modal__nav a[href="#food"]::after { content: 'さるフェス名物の数々'; }
.menu-modal__nav a[href="/sarufes26/#timetable"]::after,
.menu-modal__nav a[href="#timetable"]::after { content: 'タイムテーブル'; }
.menu-modal__nav a[href="/sarufes26/#goods"]::after,
.menu-modal__nav a[href="#goods"]::after { content: 'オリジナルグッズ'; }
.menu-modal__nav a[href="/sarufes26/#access"]::after,
.menu-modal__nav a[href="#access"]::after { content: '新宿ロフトはこちら！'; }
.menu-modal__nav a[href="/sarufes26/#faq"]::after,
.menu-modal__nav a[href="#faq"]::after { content: 'よくある質問'; }

.menu-modal__nav a:hover { color: #fff; }/* ホバー時は白に戻す */

.menu-modal__sns {
  display: flex;
  gap: 2.4rem;
  margin-top: 4rem;
}

.menu-modal__sns a {
  font-size: 1.6rem;
  color: #fff;
  text-decoration: none;
  transition: color 0.3s;
}

.menu-modal__sns a:hover {
  color: var(--color-primary);
}

.menu-modal__sns img,
.site-footer__sns img {
  width: 3.6rem;
  height: auto;
  filter: invert(1) brightness(1.2);
  transition: transform 0.3s ease, filter 0.3s ease;
}

.menu-modal__sns a:hover img,
.site-footer__sns a:hover img {
  transform: scale(1.3);
  filter: invert(1) brightness(1.2) drop-shadow(0 0 8px rgba(255, 255, 255, 0.8));
}

@keyframes scroll-pulse {
  0%,
  100% {
    transform: scaleY(0.8);
    opacity: 0.35;
  }
  50% {
    transform: scaleY(1);
    opacity: 0.9;
  }
}

@keyframes image-glow {
  0%, 88%, 100% {
    filter: drop-shadow(0 0 4px rgba(0,0,0,.7));
  }
  92% {
    filter: drop-shadow(0 0 4px rgba(0,0,0,.7)) 
            drop-shadow(0 0 10px rgba(255, 255, 255, 1)) 
            drop-shadow(0 0 18px rgba(255, 255, 220, 0.9));
  }
}


/* アーティスト個別ページ（single-artist26.php）
-------------------------------------------- */
.single-artist-page {
  min-height: 100vh;
  padding: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.single-artist-page .artist-modal__dialog {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  width: min(800px, 100%);
  height: auto;
  max-height: none;
  margin: 0 auto;
  padding: 2rem;
  line-height: 1.25;
  border-radius: 2rem;
  background: rgba(12, 8, 36, 0.85);
  box-shadow: 0 3.2rem 4.8rem rgba(4, 2, 18, 0.65);
}
.single-artist-page .artist-modal__dialog::after {
	content: "";
	display: none;
}

.single-artist-page .artist-modal__body {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.single-artist-page .artist-modal__nav-button--disabled {
  opacity: 0.3;
  cursor: not-allowed;
  pointer-events: none;
}
.single-artist-page .btn {
	margin-bottom: 70px;
	position: relative;
/* 	display: flex; */
	flex-direction: column;
	gap: 1.6rem;
	margin-bottom: 7rem;
	text-align: center;
	overflow: visible;
}

.single-artist-page .btn a {
	position: relative;
	color: #fff;
	width: auto;
	letter-spacing: 0;
	background-color: #f0419e;
	border: none;
	z-index: 2;
}

.single-artist-page .btn::after {
	content: '';
  position: absolute;
  width: 120px;
  height: 120px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 1;
  pointer-events: none;
  z-index: 0;
/*   animation: chara-float 3s ease-in-out infinite; */
	background-image: url('/sarufes2026/common/images/chara_05.png');
	right: calc(50% - 130px);
	left: auto;
	top: -20%;
	transform: translateY(-50%);
	--chara-rotation: 5deg;
  }




@media (min-width: 1024px) {
/* .single-artist-page .artist-modal__content {overflow-y: visible;} */
.single-artist-page .artist-modal__visual {
	aspect-ratio: unset;
}	
.single-artist-page .artist-modal__visual.is-portrait { padding-top: 85% !important;}
.single-artist-page .artist-modal__visual.is-landscape { padding-top: 60% !important;}
.single-artist-page .artist-modal__visual.is-square { padding-top: 70% !important;}

}@media (min-width: 768px) {

/* メニュー 
  --------------------------------------- */
  .hamburger_area {
	  background:url('/sarufes2026/common/images/chara01.png') no-repeat center center;
	  background-size: contain;
	}
  .hamburger_menu {right: 8vmin;}

  .menu-modal__inner {
    gap: 4rem 6rem; /* 項目間の余白を調整 */
    max-width: 900px; /* 最大幅を調整 */
  }
  .menu-modal__nav {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem 8rem; /* 項目間の余白を調整 */
    width: auto;
    margin: 0; /* 中央配置をリセット */
    text-align: left; /* 左寄せに戻す */
  }
  .menu-modal__nav a {
	  width: auto;
    font-size: 5rem;
  }
  .menu-modal__nav a[href="#shinkai"] { font-size: 4rem;}
  .menu-modal__nav a[href="#timetable"] {/* TIME TABLEだけ特別に調整 */
    white-space: nowrap;
    font-size: 4.5rem; /* 少し小さくして1行に収める */
  }
  .menu-modal__nav a::after { display: block; }
  .menu-modal__sns {
    grid-column: 1 / -1;
    display: flex;
    justify-content: center; /* アイコンを横並びで中央に配置 */
    margin-top: 4rem; /* 上のメニューとの適切な間隔を再設定 */
    gap: 3.2rem; /* 間隔を広げる */
  }

  .menu-modal__sns img {
    width: 4.2rem; /* アイコンサイズを大きくする */
  }


/* heroエリア
------------------------------------------- */
  .hero .flyer {
    height: calc(100vh - var(--flyer-shift, 0px));
    min-height:calc(950px - var(--flyer-shift, 0px));
  }
  .hero .flyer img {
    width: auto;
    height: 96vh;
    min-height: 900px;
    max-height: 1160px;
  }

  .hero__content {
    width: 90vw;
  }
  h1.title-main {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .3rem;
    margin-bottom: 0.7em;
    font-size: 4.2rem;
    text-align: center;
  }
  h1.title-main img {
    max-height: 80px;
  }
  h2.theme {
    font-size: 2.4rem;
  }
  h2.theme img {
	  height: 54px;
    max-height: 54px;
  }


/* セクション（.section）構造
------------------------------------------- */
.section { padding: 8rem 3.6rem;}

  .food-grid { grid-template-columns: repeat(2, minmax(0, 1fr));}
  .goods-grid { grid-template-columns: repeat(2, minmax(0, 1fr));}
  .section--goods .productions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3.2rem;
  }
  
  .section--goods .production h2 {
    font-size: 2.4rem;
  }
  
  .section--goods .production .textarea {
    padding: 2.4rem;
  }
  .timetable-card { grid-template-columns: 1fr; /* PCでも1列レイアウト */}
  .timetable-card__images {
    grid-template-columns: repeat(1, minmax(0, 1fr)); /* PCでも1列 */
    max-width: 700px; /* 最大幅を制限 */
  }
  .timetable-card__actions { 
    justify-content: center; /* ボタンを中央揃え */
    margin-top: 2rem;
  }
  .access-layout { grid-template-columns: 1.2fr 1fr;}


/* セクションタイトルアイコン（.section__heading）
------------------------------------------- */
.section__heading::before { display: block;}

/* 各セクションにキャラクターを指定（左右交互、タイトルに近い位置） */
/* 左側配置（偶数セクション）- タイトルに近い位置 */
.section--info .section__heading::before {
  background-image: url('/sarufes2026/common/images/chara_05.png');
  right: calc(50% - 40px); /* タイトルの左側に近い位置 */
  left: auto;
  top: -130%;
  transform: translateY(-50%);
  --chara-rotation: 5deg;
}

.section--artists .section__heading::before {
  background-image: url('/sarufes2026/common/images/chara_03.png');
  left: calc(50% - 280px); /* タイトルに近い位置 */
  top: -10%;
  transform: translateY(-50%);
  --chara-rotation: -5deg;
}

.section--food-lineup .section__heading::before {
  background-image: url('/sarufes2026/common/images/chara_01.png');
  left: calc(50% - 310px); /* タイトルに近い位置 */
  top: -20%;
  transform: translateY(50%);
  --chara-rotation: -5deg;
}

.section--timetable .section__heading::before {
  background-image: url('/sarufes2026/common/images/chara_07.png');
  right: calc(50% - 340px); /* タイトルに近い位置 */
  top: -40%;
  --chara-rotation: -5deg;
}

.section--access .section__heading::before {
  background-image: url('/sarufes2026/common/images/chara_01.png');
  left: calc(50% - 390px); /* タイトルに近い位置 */
  top: 0%;
  transform: translateY(-50%);
  --chara-rotation: -5deg;
}

/* 右側配置（奇数セクション）- タイトルに近い位置 */
.section--tickets .section__heading::before {
  background-image: url('/sarufes2026/common/images/chara_02.png');
  right: calc(50% - 280px); /* タイトルの右側に近い位置 */
  left: auto;
  top: -30%;
  transform: translateY(-50%);
  --chara-rotation: 5deg;
}

.section--shinkai .section__heading::before {
  background-image: url('/sarufes2026/common/images/chara_04.png');
  right: calc(50% - 230px); /* タイトルに近い位置 */
  left: auto;
  top: -30%;
  transform: translateY(-50%);
  --chara-rotation: 15deg;
}

.section--goods .section__heading::before {
  background-image: url('/sarufes2026/common/images/chara_06.png');
  left: calc(50% - 410px);
  top: -20%;
  transform: translateY(-50%);
  --chara-rotation: 5deg;
}

.section--faq .section__heading::before {
  background-image: url('/sarufes2026/common/images/chara_08.png');
  right: calc(50% - 240px); /* タイトルに近い位置 */
  left: auto;
  top: -25%;
  transform: translateY(-50%);
  --chara-rotation: 5deg;
}





/* INFOエリア（.section--info）
------------------------------------------- */
.section--info {padding: 18rem 4.8rem;}

/* チケットエリア（.section--tickets）
------------------------------------------- */
.section--tickets .section__inner { max-width: 1100px;}
.ticket-grid { grid-template-columns: repeat(2, 1fr);}
.ticket-card {
  display: flex; /* Flexboxを有効化 */
  flex-direction: column; /* 子要素を縦に並べる */
  height: 100%; /* 親のgridの高さいっぱいに広げる */
}

/* PCでの表示順序を再指定 */
.ticket-card.ticket-card--on-site { order: 2;}
.ticket-card.ticket-card--combo   { order: 1;}
.ticket-card.ticket-card--archive { order: 3;}
.ticket-card.ticket-card--after { order: 4;}
.ticket-card__footer { margin-top: auto;} /* ボタンと注釈のグループを一番下に押し出す */

/* アーティストエリア
------------------------------------------- */

.artist-modal__dialog {
  width: min(1000px,80%);
  max-height: 86vh; 
}

/* F.A.Q.エリア
------------------------------------------- */
.faq-item__trigger { padding: 2rem 2.6rem;}
.faq-item__panel { padding: 0 2.6rem 2.2rem;}




}@media (min-width: 1024px) {
  /* heroエリア
------------------------------------------- */
  h1.title-main { font-size: 4.8rem;}
  h2.theme { font-size: 2.8rem;}
  .section { padding: 14.6rem 4.8rem;}
  .info-card { padding: 3.2rem;}
/*   .info-card__title { font-size: 2rem;} */
/*  .info-card__body,
   .ticket-list__price { font-size: 1.6rem;} */

/* セクション（.section）構造
------------------------------------------- */
.section__inner { width: 75%;}


/* INFO・TICKETエリア
------------------------------------------- */
.section--info {padding: 18rem 4.8rem;}
.info-grid { grid-template-columns: minmax(0, 50rem);} /* 中央のカードの最大幅を指定 */ 


 /* アーティストエリア
------------------------------------------- */

.artist-tabs { grid-template-columns: repeat(10, minmax(0, 1fr));}
.artist-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.4rem;}
.artist-modal__body {
	position: relative;
  flex-direction: row;
  align-items: center; /* 上から配置 */
  overflow-y: hidden;
  gap: 3rem; /* PC表示用にカラム間のgapを調整 */
}

.artist-modal__visual {
  flex: 0 0 45%; /* 画像エリアの幅を指定 */
  padding-top: 0 !important; /* padding-topをリセット */
  height: 100%;
  align-self: center; /* 上から配置 */
  aspect-ratio: 1 / 1; /* アスペクト比を正方形に変更 */
}
.artist-modal__visual.is-portrait img {
	  width: 75%;
  object-fit: contain;
}/* 縦長画像 */
.artist-modal__visual.is-landscape img {} /* 横長画像 */
.artist-modal__visual.is-square img {
  width: 80%;
  height: 80%;
  object-fit: contain;
}
.artist-modal__content {
	flex: 1;
	padding:0 1em;
	height: 100%;
	overflow-x: visible;
	overflow-y:scroll;
} /* テキストエリアが残りの幅をすべて使う */
.artist-modal__dialog {
	padding: 4rem 3.6rem 3.2rem;
  width: min(900px,80%);
  max-height: 650px; /* 画面の高さの85%を上限に */
}

/* グッズエリア（.section--goods）
------------------------------------------- */
/*
.goods-grid { grid-template-columns: repeat(3, minmax(0, 1fr));}
.section--goods .productions {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
*/
.access-layout {
  grid-template-columns: 1.1fr 1fr;
  gap: 3.2rem;
}
.site-footer { padding: 5rem 3.6rem 6rem;}
  
}

@media (min-width: 1400px) {
  .menu-modal__nav {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 3rem 6rem; /* 3カラム用に間隔を調整 */
  }
}


@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}














