/**
 * SPARKLE GIRLS - メインスタイルシート
 *
 * 目次:
 * 1. ベーススタイル・リセット
 * 2. レイアウト・コンテナ
 * 3. ヘッダー・ナビゲーション
 * 4. ファーストビュー
 * 5. MUST SEE（バナースライダー）
 * 6. INFORMATION & SCHEDULE
 * 7. MOVIE
 * 8. お知らせバナー
 * 9. フッター
 * 10. ユーティリティ
 * 11. レスポンシブ
 */


/* ==========================================================================
   1. ベーススタイル・リセット
   ========================================================================== */

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

html {
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: rgba(240, 66, 110, 0.4) transparent;
}

/* Webkit系スクロールバー */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: rgba(240, 66, 110, 0.4);
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(240, 66, 110, 0.6);
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: #e5e7eb;
    background-color: #0d0d14;
    overflow-x: hidden;
}

a {
    text-decoration: none;
    color: #f0426e;
    -webkit-tap-highlight-color: transparent;
}

a:focus,
button:focus {
    outline: none;
}

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

button {
    border: none;
    background: none;
    cursor: pointer;
    font-family: inherit;
}

ul, ol {
    list-style: none;
}

/* スクロールバー非表示 */
.scrollbar-hide::-webkit-scrollbar {
    display: none;
}
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}


/* ==========================================================================
   2. レイアウト・コンテナ
   ========================================================================== */

.container {
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}

.container-narrow {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}


/* ==========================================================================
   3. ヘッダー・ナビゲーション
   ========================================================================== */

/* ヘッダー - 初期状態（透明・大ロゴ） */
.site-header {
    position: fixed;
    top: 0;
    z-index: 50;
    width: 100%;
    transition: all 0.3s ease;
    border-bottom: 1px solid transparent;
}

.site-header .container {
    padding-left: 0;
}

/* トップページ：初期状態で黒グラデーション */
.front-page .site-header:not(.is-scrolled)::before {
    content: "";
    position: absolute;
    inset: 0;
    bottom: -60px;
    background: linear-gradient(to bottom, rgb(0, 0, 0) 0%, transparent 100%);
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.front-page .site-header.is-scrolled::before {
    opacity: 0;
}

/* ヘッダー - スクロール後（すりガラス・小ロゴ） */
.site-header.is-scrolled {
    background-color: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* ナビコンテナ - 初期状態 */
.header-inner {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding-top: 20px;
    transition: height 0.3s ease;
}

/* ナビコンテナ - スクロール後 */
.site-header.is-scrolled .header-inner {
    height: 64px;
    align-items: center;
    padding-top: 0;
}

/* ロゴリンク */
.logo-link {
    display: block;
}

/* ロゴ - 初期状態
   --logo-ratio: 元画像の幅/高さ比（PHPから注入）
   幅を基準に、アスペクト比で高さを自動算出 */
.site-logo {
    --logo-width: min(45vw, 300px);
    width: var(--logo-width);
    height: calc(var(--logo-width) / var(--logo-ratio, 2));
    object-fit: contain;
    transition: height 0.3s ease, width 0.3s ease;
}

/* ロゴ - スクロール後 */
.site-header.is-scrolled .site-logo {
    --logo-width: calc(40px * var(--logo-ratio, 2));
    height: 40px;
}

/* グローバルナビゲーション（PC） */
.global-nav {
    display: none;
    align-items: center;
    gap: 1.5rem;
}

/* タブレットナビゲーション */
.tablet-nav {
    display: none;
    align-items: center;
    gap: 1rem;
}

/* ナビリンク - 初期状態（白文字） */
.nav-link {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.4rem;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: color 0.2s ease;
}

.nav-link:hover {
    color: #ff8fa9;
}

.nav-link.active {
    color: #cfc7ff;
}

/* ナビリンク - スクロール後 */
.site-header.is-scrolled .nav-link {
    color: #e5e7eb;
}

.site-header.is-scrolled .nav-link:hover {
    color: #f0426e;
}

.site-header.is-scrolled .nav-link.active {
    color: #f0426e;
}

/* ハンバーガーメニューボタン */
.menu-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.875rem;
}

.menu-toggle .material-symbols-outlined {
    font-size: 1.875rem;
}

.site-header.is-scrolled .menu-toggle {
    color: #e5e7eb;
}


/* ==========================================================================
   4. ファーストビュー
   ========================================================================== */

.hero {
    position: relative;
    width: 100%;
}

.hero-image {
    width: 100%;
    max-height: 100vh;
    object-fit: contain;
    display: block;
}


/* ==========================================================================
   5. MUST SEE（バナースライダー）
   ========================================================================== */

.must-see-section {
    width: 100%;
    background-color: #0d0d14;
    padding: 2rem 0;
}

/* 無限ループスライダー */
.banner-slider-wrapper {
    overflow: hidden;
    width: 100%;
    cursor: grab;
    -webkit-user-select: none;
    user-select: none;
}

.banner-slider {
    display: flex;
    gap: 1.25rem;
    width: max-content;
    animation: banner-scroll var(--banner-speed, 25s) linear infinite;
}

/* 収まる場合は中央揃え・アニメーション無効 */
.banner-slider.is-static {
    animation: none;
    width: 100%;
    justify-content: center;
}

@keyframes banner-scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(calc(-50% - 0.625rem));
    }
}

/* バナーカード */
.banner-card {
    position: relative;
    flex-shrink: 0;
    width: 320px;
    height: 220px;
    border-radius: 1rem;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.banner-card-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.banner-card:hover .banner-card-image {
    transform: scale(1.1);
}

.banner-card-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgb(0 0 0 / 90%), rgb(0 0 0 / 40%), transparent)
}

.banner-card-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 1.25rem;
}

.banner-card-text {
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}


/* ==========================================================================
   6. INFORMATION & SCHEDULE
   ========================================================================== */

.info-schedule-section {
    width: 100%;
    padding: 4rem 0;
    overflow: hidden;
}

.info-schedule-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
}

/* セクションヘッダー */
.section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.section-title-wrap {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
}

.section-title {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.65rem;
    font-weight: normal;
    text-transform: uppercase;
    letter-spacing: -0.025em;
    color: #f0426e;
    white-space: nowrap;
}

.section-title-lg {
    font-size: 2.25rem;
}

.accent-line {
    height: 1px;
    flex: 1;
    border-radius: 9999px;
    background-color: #f0426e;
}

/* お知らせリスト */
.info-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* お知らせカード */
.info-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border-radius: 1rem;
    background-color: rgba(255, 255, 255, 0.06);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
    cursor: pointer;
}

.info-card:hover {
    background-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 4px 12px rgba(240, 66, 110, 0.2);
    transform: translateX(4px);
}

.info-card:hover .info-card-title a {
    color: #f0426e;
}

.info-card:hover .info-card-thumb img {
    transform: scale(1.1);
}

.info-card-thumb {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    border-radius: 0.75rem;
    overflow: hidden;
    background-color: rgba(255, 255, 255, 0.1);
}

.info-card-thumb img {
    width: 100%;
    height: 100%;
    transition: transform 0.5s ease;
}

/* アイキャッチなし時のロゴフォールバック */
.info-card-thumb-noimg {
    display: flex;
    align-items: center;
    justify-content: center;
}

.info-card-logo-fallback {
    width: 50%;
    height: auto;
    object-fit: contain;
    opacity: 0.15;
}

.info-card-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.info-card-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.category-tag {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 9999px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.category-release {
    background-color: rgba(240, 66, 110, 0.15);
    color: #f0426e;
}

.category-event {
    background-color: rgba(59, 130, 246, 0.15);
    color: #60a5fa;
}

.category-media {
    background-color: rgba(139, 92, 246, 0.15);
    color: #a78bfa;
}

.date {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 0.75rem;
    font-weight: 500;
    color: #9ca3af;
}

.info-card-title {
    font-size: .85rem;
    font-weight: 700;
    color: #e5e7eb;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.2s ease;
}

/* INFORMATIONカード矢印アイコン */
.info-card-arrow {
    display: none;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    color: #9ca3af;
    transition: all 0.2s ease;
}

.info-card:hover .info-card-arrow {
    background-color: #f0426e;
    color: #fff;
}

.info-card:hover .info-card-title {
    color: #f0426e;
}

/* INFORMATION一覧ページ */
.info-page-section {
    padding: 5rem 0 6rem;
    background-color: #0d0d14;
    min-height: 50vh;
}

.info-page-section .info-list {
    max-width: 720px;
    margin: 0 auto;
}

.no-posts-message {
    text-align: center;
    color: #9ca3af;
    padding: 3rem 0;
    font-size: 0.95rem;
}

/* ページネーション */
.info-pagination {
    margin-top: 2.5rem;
}

.pagination-list {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.375rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

.pagination-item a,
.pagination-item span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0 0.5rem;
    border-radius: 0.75rem;
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 0.95rem;
    color: #9ca3af;
    background-color: #1a1a26;
    text-decoration: none;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

.pagination-item a:hover {
    color: #fff;
    background: linear-gradient(135deg, #f0426e, #c084fc);
    box-shadow: 0 2px 8px rgba(240, 66, 110, 0.3);
}

.pagination-item span.current {
    color: #fff;
    background: linear-gradient(135deg, #f0426e, #c084fc);
    font-weight: 700;
}

.pagination-item .material-symbols-outlined {
    font-size: 1.25rem;
}

/* スケジュールリスト */
.schedule-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* スケジュールカード（当日・未来：白背景） */
a.schedule-card {
    text-decoration: none;
    color: inherit;
}

.schedule-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border-radius: 1rem;
    background-color: rgba(255, 255, 255, 0.06);
    border-left: 4px solid #f0426e;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

.schedule-card:hover {
    transform: translateX(4px);
}

.schedule-card:hover .schedule-title {
    color: #f0426e;
}

.schedule-card:hover .schedule-arrow {
    background-color: #f0426e;
    color: #fff;
}

/* 過去のカード（ダーク） */
.schedule-card-past {
    background-color: #1a1a26;
    border-left-color: #4b5563;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

/* 当日のカード */
.schedule-card-today {
    border-left-color: #f59e0b;
    background-color: rgba(245, 158, 11, 0.1);
}

.schedule-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem;
    border-radius: 0.75rem;
    background-color: rgba(240, 66, 110, 0.12);
    flex-shrink: 0;
}

.schedule-date-past {
    background-color: rgba(255, 255, 255, 0.05);
}

.schedule-date-today {
    background-color: rgba(245, 158, 11, 0.15);
}

.schedule-date .month {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1rem;
    text-transform: uppercase;
    color: #f0426e;
}

.schedule-date-past .month {
    color: #6b7280;
}

.schedule-date-today .month {
    color: #d97706;
}

.schedule-date .day {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.5rem;
    font-weight: 900;
    color: #e5e7eb;
}

.schedule-card-past .schedule-date .day {
    color: #e5e7eb;
}

.schedule-date .weekday {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 10px;
    color: #9ca3af;
}

.schedule-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .25rem;
}

.schedule-title {
    font-size: .85rem;
    font-weight: 700;
    color: #e5e7eb;
    transition: color 0.2s ease;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.schedule-card-past .schedule-title {
    color: #e5e7eb;
}

.schedule-detail {
    font-size: 0.7rem;
    color: #9ca3af;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.schedule-card-past .schedule-detail {
    color: #6b7280;
}

.schedule-arrow {
    display: none;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    color: #9ca3af;
    transition: all 0.2s ease;
}


/* ==========================================================================
   7. MOVIE
   ========================================================================== */

.movie-section {
    width: 100%;
    background-color: #161621;
    padding: 4rem 1rem;
    position: relative;
    overflow: hidden;
}

.movie-section::before,
.movie-section::after {
    content: '';
    position: absolute;
    width: 140%;
    height: 60px;
    background: url('../../images/deco_barbed_wire.webp') repeat-x;
    background-size: auto 100%;
    opacity: 0.25;
    pointer-events: none;
    z-index: 0;
}

.movie-section::before {
    top: 10%;
    left: -20%;
    transform: rotate(-8deg);
}

.movie-section::after {
    bottom: 12%;
    right: -20%;
    transform: rotate(5deg);
}

.movie-section > .container-narrow {
    position: relative;
    z-index: 1;
}

.movie-header {
    text-align: center;
    margin-bottom: 2.5rem;
}

.movie-description {
    color: #b1b1b1;
    font-size: min(4vw, 18px);
    margin-top: 0.5rem;
}

.video-wrapper {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 */
    border-radius: min(2.5vw, 30px);
    overflow: hidden;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

.video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.movie-footer {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
}


/* ==========================================================================
   8. お知らせバナー
   ========================================================================== */

.notice-section {
    width: 100%;
    background-color: #1b1623;
    padding: 3rem 1rem;
}

.notice-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1.5rem;
    text-align: center;
}

.notice-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: 'Cabin Sketch', sans-serif;
    text-transform: uppercase;
    color: #f0426e;
}

.notice-text {
    font-size: 0.875rem;
    color: #9ca3af;
}

.notice-link {
    font-weight: 700;
    text-decoration: underline;
    text-decoration-color: #f0426e;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
    transition: color 0.2s ease;
}

.notice-link:hover {
    color: #f0426e;
}


/* ==========================================================================
   9. フッター（夢かわいいデザイン）
   ========================================================================== */

.footer-dreamy {
    background-color: #000;
    padding: min(15vw, 100px) 1rem;
    position: relative;
    overflow: hidden;
}


/* フッターロゴ */
.footer-logo {
    display: flex;
    justify-content: center;
    margin-bottom: min(15vw, 100px);
}

.footer-logo img {
    --logo-height: min(15vw, 80px);
    filter: brightness(5);
    height: var(--logo-height);
    width: calc(var(--logo-height) * var(--logo-ratio, 2));
    max-width: 80vw;
    object-fit: contain;
}

/* フッターナビゲーション */
.footer-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem 1.5rem;
    margin-bottom: 2.5rem;
}

.footer-nav-link {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: .85rem;
    color: rgba(255, 255, 255, .65);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.footer-nav-link:hover {
    color: #f0426e;
}

.footer-nav-link.active {
    color: #f0426e;
}

/* SNSアイコン */
.footer-sns {
    display: flex;
    justify-content: center;
    gap: .8rem;
    margin-bottom: 2.5rem;
}

.sns-icon-dreamy {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.1);
    color: #9e9aa2;
    font-size: 1.24rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
}

.sns-icon-dreamy:hover {
    background: linear-gradient(135deg, #f0426e 0%, #ff6b9d 100%);
    color: #fff;
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(240, 66, 110, 0.3);
}

/* フッター専用リンク */
.footer-legal {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    margin-bottom: 2rem;
    font-size: 0.75rem;
}

.footer-legal a {
    color: rgba(255, 255, 255, 0.7);
    transition: color 0.2s ease;
}

.footer-legal a:hover {
    color: #fff;
}

.footer-legal .divider {
    color: rgba(255, 255, 255, 0.3);
}

/* メニュー使用時のセパレータ */
.footer-legal .footer-legal-link + .footer-legal-link::before {
    content: "|";
    margin-right: 1.5rem;
    color: rgba(255, 255, 255, 0.3);
}

/* ルールボタン */
.footer-rules-buttons {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: min(18vw, 80px);
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
}

.footer-rules-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 0.5rem;
    background: rgba(255, 255, 255, 0.04);
    color: #e5e7eb;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.footer-rules-btn::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(240, 66, 110, 0.1), rgba(192, 132, 252, 0.1));
    opacity: 0;
    transition: opacity 0.3s ease;
}

.footer-rules-btn:hover {
    border-color: rgba(240, 66, 110, 0.5);
    color: #fff;
}

.footer-rules-btn:hover::before {
    opacity: 1;
}

.footer-rules-btn-text {
    position: relative;
    z-index: 1;
}

.footer-rules-btn-arrow {
    position: relative;
    z-index: 1;
    font-size: 1.25rem;
    color: rgba(255, 255, 255, 0.3);
    transition: color 0.3s ease, transform 0.3s ease;
}

.footer-rules-btn:hover .footer-rules-btn-arrow {
    color: #f0426e;
    transform: translateX(4px);
}

@media (min-width: 768px) {
    .footer-rules-buttons {
        flex-direction: row;
        max-width: 640px;
    }

    .footer-rules-btn {
        flex: 1;
    }
}

/* コピーライト */
.footer-copyright {
    text-align: center;
}

.footer-copyright p {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
}


/* ==========================================================================
   10. ユーティリティ
   ========================================================================== */

/* VIEW MOREボタン */
.btn-view-more {
    display: inline-block;
    padding: 0.5rem 1.25rem;
    border: 1px solid #f0426e;
    border-radius: 20px 0;
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 0.75rem;
    color: #f0426e;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.btn-view-more:hover {
    background-color: #f0426e;
    color: #fff;
}

/* ラベルバッジ */
.badge {
    display: inline-block;
    padding: 2px 8px;
    margin-bottom: 0.5rem;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
}

.badge-primary {
    background-color: #f0426e;
}

.badge-event {
    background-color: #3b82f6;
}

.badge-media {
    background-color: #8b5cf6;
}

.badge-goods {
    background-color: #f97316;
}

.badge-new {
    background-color: #ef4444;
}


/* ==========================================================================
   11. プロフィールページ
   ========================================================================== */

/* ページヘッダー */
.page-header {
    background: linear-gradient(135deg, #2a0e24 0%, #1a1032 100%);
    padding: min(30vw, 100px) min(5vw, 30px) min(10vw, 30px);
    text-align: center;
}

.page-title {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: min(10vw, 45px);
    font-weight: normal;
    color: #fff;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.page-subtitle {
    font-size: min(3.2vw, 15px);
    letter-spacing: .2em;
    font-weight: normal;
    color: #fff;
    opacity: .7;
}

/* パンくずリスト */
.breadcrumb {
    background-color: #12121c;
    padding: .5rem 0;
    border-bottom: 1px solid rgba(240, 66, 110, 0.1);
}

.breadcrumb .container {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.65rem;
}

.breadcrumb a {
    color: #f0426e;
    transition: color 0.2s ease;
    flex-shrink: 0;
}

.breadcrumb a:hover {
    color: #ff6b9d;
}

.breadcrumb .separator {
    color: #d1d5db;
    flex-shrink: 0;
}

.breadcrumb .current {
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

/* グループ紹介セクション */
.profile-intro {
    padding: 4rem 1rem;
    background-color: #12121c;
    overflow: hidden;
}

.group-profile {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    align-items: start;
}

.group-image {
    border-radius: min(5vw, 20px);
    overflow: hidden;
}

.group-image img {
    width: 100%;
    height: auto;
}

.group-name {
    font-size: min(5vw, 25px);
    font-weight: normal;
    letter-spacing: .2rem;
    margin-bottom: 0.25rem;
}

.group-reading {
    font-size: min(3vw, 12px);
    color: #f0426e;
    letter-spacing: .14rem;
    margin-bottom: 1.5rem;
}

.group-description {
    font-size: min(3.5vw, 16px);
    line-height: 2;
    color: #9ca3af;
    margin-bottom: 2rem;
}

.group-sns {
    display: flex;
    justify-content: center;
    gap: 1rem;
}

/* BIOGRAPHYセクション */
.biography-section {
    padding: 4rem 1rem;
    background-color: #12121c;
}

.biography-timeline {
    max-width: 640px;
    margin: 0 auto;
}

.biography-item {
    display: flex;
    gap: 1.5rem;
    padding: 1rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.biography-item:last-child {
    border-bottom: none;
}

.biography-year {
    flex-shrink: 0;
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.25rem;
    color: #f0426e;
    min-width: 70px;
}

.biography-event {
    font-size: 0.95rem;
    color: #e5e7eb;
    line-height: 1.6;
}


/* メンバー一覧セクション */
.members-section {
    padding: 4rem 0;
    background-color: #0d0d14;
}

.section-header-center {
    text-align: center;
    margin-bottom: 2.5rem;
}

.members-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .6rem;
}

/* メンバーカード */
.member-card {
    display: block;
    background-color: #1a1a26;
    border-radius: min(2vw, 16px);
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

.member-card:hover {
    transform: translateY(-8px);
}

.member-image {
    position: relative;
    aspect-ratio: 3/4;
    overflow: hidden;
}

.member-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    transition: transform 0.5s ease;
}

.member-card:hover .member-image img {
    transform: scale(1.1);
}

.member-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(240, 66, 110, 0.9) 0%, transparent 50%);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 1.5rem;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.member-card:hover .member-overlay {
    opacity: 1;
}

.view-profile {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1rem;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.member-info {
    padding: 1rem 1rem .25rem;
    text-align: center;
}

.member-position {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    margin-bottom: 0.5rem;
    border-radius: 9999px;
    background-color: rgba(240, 66, 110, 0.12);
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 0.75rem;
    color: #f0426e;
    text-transform: uppercase;
}

.member-name {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.member-name-en {
    font-size: 0.7rem;
    color: #f0426e;
}

/* メンバーカードリンク */
.member-card-link {
    display: block;
    color: inherit;
}

/* メンバーカードSNS */
.member-sns {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    padding: .6rem .8rem 1rem;
    flex-wrap: wrap;
}

.sns-icon-small {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    font-size: 1rem;
    color: #737076;
    transition: all 0.3s ease;
}

.sns-icon-small:hover {
    color: #f0426e;
}

/* メンバー個別プロフィールページ */
.member-profile-section {
    padding: 4rem 1rem;
    background: linear-gradient(135deg, #12121c 0%, #1a1032 100%);
    overflow: hidden;
}

.member-profile-grid {
    display: grid;
    grid-template-columns: 1fr;
}

.member-profile-image {
    border-radius: 1.5rem;
    overflow: hidden;
}

.member-profile-image img {
    width: 100%;
    height: auto;
}

.member-profile-info {
    text-align: center;
}

.member-profile-position {
    display: inline-block;
    padding: 0.375rem 1rem;
    margin-bottom: 1rem;
    border-radius: 9999px;
    background: linear-gradient(135deg, #f0426e 0%, #ff6b9d 100%);
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 0.875rem;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.member-profile-name {
    font-size: 1.5rem;
    font-weight: 700;
    margin-top: 2.5rem;
    margin-bottom: 0.25rem;
}

.member-profile-name-en {
    font-size: .7rem;
    color: #f0426e;
    margin-bottom: 2rem;
}

/* プロフィールデータ */
.member-profile-details {
    margin-bottom: 2rem;
}

.profile-data {
    text-align: left;
    max-width: 400px;
    margin: 0 auto;
}

.profile-row {
    display: flex;
    padding: 0.75rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.profile-data > div:last-of-type {
    border-bottom: none;
}

.profile-row dt {
    flex-shrink: 0;
    width: min(37%, 150px);
    font-weight: 700;
    color: rgba(255,255,255,.3);
    font-size: 0.875rem;
    font-weight: normal;
}

.profile-row dd {
    flex: 1;
    color: #e5e7eb;
    font-size: min(3.5vw, 16px);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.color-badge {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid rgba(0, 0, 0, 0.1);
}

/* メッセージ */
.member-profile-message {
    position: relative;
    padding: 2.5rem 1.5rem 1.5rem;
    background-color: rgba(255, 255, 255, 0.04);
    border-radius: 1rem;
    text-align: left;
}

.member-profile-message::before {
    content: '\201C';
    position: absolute;
    top: 0.25rem;
    left: 1rem;
    font-size: 4rem;
    line-height: 1;
    color: #f0426e;
    opacity: 0.5;
}

.member-profile-message p {
    font-size: min(3.5vw, 16px);
    line-height: 1.8;
    color: #b6b6b6;
}

/* 手書きメッセージ画像 */
.member-handwriting {
    margin-top: 1.5rem;
}

.member-handwriting img {
    width: 100%;
    max-width: 400px;
    height: auto;
    display: block;
}

/* メンバーSNS */
.member-profile-sns {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-bottom: min(10vw, 50px);
}

/* 他のメンバー */
.other-members {
    margin-top: 4rem;
    padding-top: 3rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.other-members-title {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 2rem;
    font-weight: normal;
    color: #f0426e;
    text-align: center;
    margin-bottom: 2rem;
}

.other-members-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.other-member-link {
    display: block;
    text-align: center;
    transition: transform 0.3s ease;
}

.other-member-link:hover {
    transform: translateY(-4px);
}

.other-member-link img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    object-position: top;
    border-radius: 50%;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    margin-bottom: 0.5rem;
}

.other-member-link span {
    font-size: 1rem;
    font-weight: 500;
}


/* ==========================================================================
   12. レスポンシブ
   ========================================================================== */

/* タブレット以上 (768px~) */
@media (min-width: 768px) {
    .container {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    .container-narrow {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    /* バナーカード */
    .banner-card {
        width: 380px;
        height: 240px;
    }

    /* スケジュール矢印 */
    .schedule-arrow {
        display: flex;
    }

    /* INFORMATION矢印 */
    .info-card-arrow {
        display: flex;
    }

    /* お知らせセクション */
    .info-schedule-section {
        padding: 4rem 3rem;
    }

    /* プロフィールページ */
    .group-profile {
        grid-template-columns: 1fr 1fr;
        gap: 3rem;
    }

    .group-info {
        text-align: left;
    }

    .group-sns {
        justify-content: flex-start;
    }

    .members-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 2rem;
    }

    .member-profile-grid {
        grid-template-columns: 1fr 1fr;
        gap: 4.5rem;
        align-items: start;
        max-width: 860px;
        margin: 0 auto;
    }

    .member-profile-info {
        text-align: left;
    }

    .member-profile-position {
        margin-bottom: 1.5rem;
    }

    .member-profile-name {
        font-size: 1.65rem;
    }

    .profile-data {
        max-width: none;
        margin: 0;
    }

    .member-profile-sns {
        justify-content: flex-start;
    }

    .other-members-list {
        grid-template-columns: repeat(4, 1fr);
        gap: 2rem;
        max-width: 960px;
        margin: 0 auto;
    }
}

/* デスクトップ (1024px~) */
@media (min-width: 1024px) {
    .container {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .container-narrow {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    /* お知らせセクション */
    .info-schedule-section {
        padding: 4rem 6rem;
    }
}

/* 900px~ : グローバルナビ表示・ハンバーガー非表示 */
@media (min-width: 900px) {
    .menu-toggle {
        display: none;
    }

    .global-nav {
        display: flex;
    }
}

/* 900px~1200px : nav-link文字サイズ縮小 */
@media (min-width: 900px) and (max-width: 1200px) {
    .nav-link {
        font-size: 1rem;
    }

    .global-nav {
        gap: 1rem;
    }
}

/* ワイドデスクトップ (1280px~) */
@media (min-width: 1280px) {
    .site-logo {
        --logo-width: 300px;
    }

    /* INFORMATION & SCHEDULE 2カラム */
    .info-schedule-grid {
        grid-template-columns: 1fr 1fr;
        gap: 3rem;
    }

    /* プロフィールページ */
    .members-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}


/* ==========================================================================
   12. ローディング画面
   ========================================================================== */

/* ローディング中はスクロール無効 */
body.loading {
    overflow: hidden;
}

/* ローディングオーバーレイ */
.loading-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.5s ease-out, visibility 0.5s ease-out;
    overflow: hidden;
}

.loading-screen.fade-out {
    opacity: 0;
    visibility: hidden;
}

/* ローディングコンテンツ */
.loading-content {
    position: relative;
    z-index: 2;
}

/* グリッチラッパー */
.glitch {
    position: relative;
    --logo-width: min(80vw, 400px);
    width: var(--logo-width);
    overflow: hidden;
}

/* メインロゴ（基準画像） */
.glitch .glitch-img {
    width: 100%;
    height: auto;
    display: block;
    position: relative;
    z-index: 1;
}

/* 複製レイヤー（JSで生成） */
.glitch .glitch-copy {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    display: block;
    opacity: 0;
    z-index: 2;
}

/* ノイズcanvasオーバーレイ（ローディング画面内） */
.loading-noise {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    pointer-events: none;
    opacity: 0;
}

/* スキャンライン（ローディング画面内） */
.loading-scanlines {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 4;
    pointer-events: none;
    background: repeating-linear-gradient(
        to bottom,
        transparent 0px,
        transparent 2px,
        rgba(0, 0, 0, 0.08) 2px,
        rgba(0, 0, 0, 0.08) 4px
    );
    opacity: 0;
}


/* ==========================================================================
   13. スクロールアニメーション
   ========================================================================== */

/* 基本のスクロールアニメーション */
.scroll-animate {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.scroll-animate.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* 下から上へフェードイン */
.scroll-animate-up {
    opacity: 0;
    transform: translateY(60px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.scroll-animate-up.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* 左からフェードイン（clip-pathでオーバーフロー防止） */
.scroll-animate-left {
    opacity: 0;
    transform: translateX(-40px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
    will-change: opacity, transform;
}

.scroll-animate-left.is-visible {
    opacity: 1;
    transform: translateX(0);
}

/* 右からフェードイン */
.scroll-animate-right {
    opacity: 0;
    transform: translateX(40px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
    will-change: opacity, transform;
}

.scroll-animate-right.is-visible {
    opacity: 1;
    transform: translateX(0);
}

/* スケールアップアニメーション */
.scroll-animate-scale {
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.scroll-animate-scale.is-visible {
    opacity: 1;
    transform: scale(1);
}

/* フェードのみ（transform無し） */
.scroll-fade {
    opacity: 0;
    transition: opacity 0.8s ease-out;
}

.scroll-fade.is-visible {
    opacity: 1;
}

/* 遅延アニメーション用クラス */
.scroll-delay-1 {
    transition-delay: 0.1s;
}

.scroll-delay-2 {
    transition-delay: 0.2s;
}

.scroll-delay-3 {
    transition-delay: 0.3s;
}

.scroll-delay-4 {
    transition-delay: 0.4s;
}

/* 子要素を順番にアニメーション（スタガー効果） */
.scroll-stagger > * {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.scroll-stagger.is-visible > *:nth-child(1) { transition-delay: 0s; }
.scroll-stagger.is-visible > *:nth-child(2) { transition-delay: 0.1s; }
.scroll-stagger.is-visible > *:nth-child(3) { transition-delay: 0.2s; }
.scroll-stagger.is-visible > *:nth-child(4) { transition-delay: 0.3s; }
.scroll-stagger.is-visible > *:nth-child(5) { transition-delay: 0.4s; }
.scroll-stagger.is-visible > *:nth-child(6) { transition-delay: 0.5s; }

.scroll-stagger.is-visible > * {
    opacity: 1;
    transform: translateY(0);
}


/* ==========================================================================
   14. ディスコグラフィーページ
   ========================================================================== */

.discography-section {
    padding: 3rem 1rem 4rem;
    background: linear-gradient(135deg, #12121c 0%, #1a1032 100%);
}

.discography-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}

/* ディスコグラフィーカード */
.discography-card {
    display: flex;
    flex-direction: column;
    background: #1a1a26;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* ジャケット画像 */
.discography-jacket {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

.discography-jacket img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ディスコグラフィー情報 */
.discography-info {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: center;
    gap: 0.5rem;
}

/* タイプバッジ（Single/Album） */
.discography-type {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.7rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.discography-type-single {
    background: rgba(59, 130, 246, 0.15);
    color: #60a5fa;
}

.discography-type-album {
    background: rgba(139, 92, 246, 0.15);
    color: #a78bfa;
}

/* タイトル */
.discography-title {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: .85rem;
    font-weight: normal;
    color: #e5e7eb;
    margin: 0;
}

/* リリース日 */
.discography-date {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.5rem;
    color: #f0426e;
    margin: 0;
}

.discography-date .material-symbols-outlined {
    font-size: 1.1rem;
}

/* 視聴ボタン */
.btn-listen {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    margin: 0.5rem auto .85rem;
    background: linear-gradient(135deg, #f0426e 0%, #ff6b9d 100%);
    color: #fff;
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 0.95rem;
    letter-spacing: 0.1em;
    text-decoration: none;
    border-radius: 9999px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(240, 66, 110, 0.3);
}

.btn-listen:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(240, 66, 110, 0.4);
}

.btn-listen .material-symbols-outlined {
    font-size: 1.25rem;
}

/* ==========================================================================
   動画一覧ページ（MOVIE）
   ========================================================================== */

.movie-list-section {
    padding: 3rem 1rem 4rem;
    background: linear-gradient(135deg, #12121c 0%, #1a1032 100%);
}

/* カテゴリフィルター */
.movie-filter {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
    margin-bottom: 2rem;
}

.movie-filter-btn {
    display: inline-block;
    text-decoration: none;
    padding: 0.5rem 1.25rem;
    border: 2px solid rgba(255, 255, 255, 0.15);
    border-radius: 9999px;
    background: transparent;
    color: #9ca3af;
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 0.875rem;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.3s ease;
}

.movie-filter-btn:hover {
    border-color: rgba(240, 66, 110, 0.5);
    color: #e5e7eb;
}

.movie-filter-btn.active {
    background: linear-gradient(135deg, #f0426e 0%, #ff6b9d 100%);
    border-color: transparent;
    color: #fff;
}

.movie-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}

/* フィルターで非表示 */
.movie-card.is-hidden {
    display: none;
}

/* 動画カード */
.movie-card {
    background: #1a1a26;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.movie-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 30px rgba(240, 66, 110, 0.2);
}

/* サムネイル */
.movie-card-thumb {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background-color: #000;
}

.movie-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.movie-card:hover .movie-card-thumb img {
    transform: scale(1.05);
}

/* 再生ボタンオーバーレイ */
.movie-card-play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.movie-card:hover .movie-card-play {
    opacity: 1;
}

.movie-card-play .material-symbols-outlined {
    font-size: 4rem;
    color: #fff;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.5));
}

/* カード情報 */
.movie-card-info {
    padding: 1.25rem;
}

.movie-card-category {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    margin-bottom: 0.5rem;
    border-radius: 9999px;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.movie-cat-mv {
    background: rgba(240, 66, 110, 0.15);
    color: #f0426e;
}

.movie-cat-pv {
    background: rgba(139, 92, 246, 0.15);
    color: #a78bfa;
}

.movie-cat-live {
    background: rgba(59, 130, 246, 0.15);
    color: #60a5fa;
}

.movie-cat-making {
    background: rgba(245, 158, 11, 0.15);
    color: #fbbf24;
}

.movie-cat-variety {
    background: rgba(16, 185, 129, 0.15);
    color: #34d399;
}

.movie-cat-other {
    background: rgba(255, 255, 255, 0.08);
    color: #9ca3af;
}

.movie-card-title {
    font-size: 1rem;
    font-weight: 700;
    color: #e5e7eb;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 動画再生モーダル */
.movie-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

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

.movie-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(4px);
}

.movie-modal-content {
    position: relative;
    width: 90%;
    max-width: 900px;
    transform: scale(0.9);
    transition: transform 0.3s ease;
}

.movie-modal.active .movie-modal-content {
    transform: scale(1);
}

.movie-modal-close {
    position: absolute;
    top: -3rem;
    right: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: #fff;
    font-size: 1.5rem;
    padding: 0.25rem;
    transition: color 0.2s ease;
    z-index: 1;
}

.movie-modal-close:hover {
    color: #f0426e;
}

.movie-modal-player {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
}

.movie-modal-player iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* タブレット (768px~) - 2列 */
@media (min-width: 768px) {
    .movie-list-section {
        padding: 4rem 2rem 5rem;
    }

    .movie-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 2.5rem;
    }
}

/* デスクトップ (1024px~) - 3列 */
@media (min-width: 1024px) {
    .movie-list-section {
        padding: 5rem 2rem 6rem;
    }

    .movie-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}


/* ==========================================================================
   スケジュール詳細ページ
   ========================================================================== */

.schedule-detail-section {
    padding: 3rem 0 4rem;
    background: linear-gradient(135deg, #12121c 0%, #1a1032 100%);
}

.schedule-detail-card {
    background: #ffffffe0;
    border-radius: 1.5rem;
    padding: 2.5rem 2rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    gap: 2rem;
    overflow-wrap: break-word;
    word-break: break-word;
}

.schedule-detail-card.is-past {
    background: #1a1a26;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

/* 日付表示 */
.schedule-detail-date {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    padding-bottom: .25rem;
    border-bottom: 2px solid #f0426e;
}

.schedule-detail-card.is-past .schedule-detail-date {
    border-bottom-color: #4b5563;
}

.schedule-detail-card.is-today .schedule-detail-date {
    border-bottom-color: #f59e0b;
}

.schedule-detail-month {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.25rem;
    color: #f0426e;
}

.schedule-detail-card.is-past .schedule-detail-month {
    color: #6b7280;
}

.schedule-detail-card.is-today .schedule-detail-month {
    color: #d97706;
}

.schedule-detail-day {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 2rem;
    font-weight: 900;
    color: #1f2937;
    line-height: 1;
}

.schedule-detail-card.is-past .schedule-detail-day {
    color: #e5e7eb;
}

.schedule-detail-weekday {
    font-size: 1rem;
    font-weight: 700;
    color: #6b7280;
}

.schedule-detail-year {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1rem;
    color: #9ca3af;
}

/* 本文エリア */
.schedule-detail-title {
    font-size: 1rem;
    font-weight: 700;
    color: #1f2937;
    padding-bottom: 1rem;
    overflow-wrap: break-word;
    word-break: break-word;
}

.schedule-detail-card.is-past .schedule-detail-title {
    color: #e5e7eb;
}

.schedule-detail-text {
    font-size: min(3.5vw, 16px);
    color: #878787;
    line-height: 1.8;
    margin-top: 0.5rem;
    overflow-wrap: break-word;
    word-break: break-word;
}

.schedule-detail-card.is-past .schedule-detail-text {
    color: #9ca3af;
}

.schedule-detail-content {
    margin-top: 1rem;
    font-size: min(3.5vw, 16px);
    line-height: 1.8;
    color: #4b5563;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* 投稿本文内の画像・iframe等 */
.schedule-detail-content img {
    width: 100%;
    height: auto;
    display: block;
    margin: 1.5rem 0;
    border-radius: 0.75rem;
}

.schedule-detail-content iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    display: block;
    margin: 1.5rem 0;
    border: none;
    border-radius: 0.75rem;
}

.schedule-detail-content video,
.schedule-detail-content embed,
.schedule-detail-content object {
    width: 100%;
    height: auto;
    display: block;
    margin: 1.5rem 0;
}

.schedule-detail-content .wp-block-image,
.schedule-detail-content .wp-block-embed,
.schedule-detail-content .wp-block-video {
    margin: 1.5rem 0;
}

.schedule-detail-content .wp-block-image img {
    margin: 0;
}

.schedule-detail-card.is-past .schedule-detail-content {
    color: #9ca3af;
}

.schedule-detail-link {
    margin-top: 1.5rem;
}

/* INFORMATION詳細 - メタ情報（日付・カテゴリ） */
.info-detail-meta {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.info-detail-date {
    font-size: 0.8rem;
    color: #9ca3af;
}

/* INFORMATION詳細 - アイキャッチ画像 */
.info-detail-thumbnail {
    margin-top: 1rem;
    border-radius: 1rem;
    overflow: hidden;
}

.info-detail-thumbnail img {
    width: 100%;
    height: auto;
    display: block;
}

/* 詳細ページ - カテゴリタグの位置調整 */
.schedule-detail-body .category-tag {
    margin-bottom: 0.5rem;
}

/* 戻るボタン */
.schedule-detail-back {
    margin-top: 2rem;
    text-align: center;
}

.schedule-detail-back .btn-view-more {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.schedule-detail-back .material-symbols-outlined {
    font-size: 1.125rem;
}

/* タブレット以上 */
@media (min-width: 768px) {
    .schedule-detail-card {
        flex-direction: row;
        align-items: flex-start;
        padding: 3rem;
    }

    .schedule-detail-day {
        font-size: 3rem;
    }

    .schedule-detail-date {
        flex-direction: column;
        align-items: center;
        gap: 0.25rem;
        padding-bottom: 0;
        padding-right: 2rem;
        margin-right: 2rem;
        border-bottom: none;
        border-right: 2px solid #f0426e;
        flex-shrink: 0;
        min-width: 100px;
    }

    .schedule-detail-card.is-past .schedule-detail-date {
        border-right-color: #4b5563;
    }

    .schedule-detail-card.is-today .schedule-detail-date {
        border-right-color: #f59e0b;
    }
    

    .schedule-detail-year {
        margin-left: 0;
    }

    .schedule-detail-title {
        font-size: 1.5rem;
    }
}


/* タブレット (768px~) - 2列 */
@media (min-width: 768px) {
    .discography-section {
        padding: 4rem 2rem 5rem;
    }

    .discography-list {
        grid-template-columns: repeat(2, 1fr);
        gap: 2.5rem;
    }
}

/* デスクトップ (1024px~) - 3列 */
@media (min-width: 1024px) {
    .discography-section {
        padding: 5rem 2rem 6rem;
    }

    .discography-list {
        grid-template-columns: repeat(3, 1fr);
        gap: 2.5rem;
    }

    .discography-title {
        font-size: 1rem;
    }
}


/* ==========================================================================
   15. スケジュールページ
   ========================================================================== */

.schedule-page-section {
    padding: 3rem 0 4rem;
    background: linear-gradient(135deg, #12121c 0%, #1a1032 100%);
}

/* 表示切り替えボタン */
.schedule-view-toggle {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin-bottom: 2rem;
}

.view-toggle-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.75rem 1.25rem;
    border: 2px solid rgba(240, 66, 110, 0.5);
    border-radius: 9999px;
    background: transparent;
    color: #e5e7eb;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
}

.view-toggle-btn .material-symbols-outlined {
    font-size: 1.25rem;
}

.view-toggle-btn:hover {
    background: rgba(240, 66, 110, 0.1);
}

.view-toggle-btn.active {
    background: linear-gradient(135deg, #f0426e 0%, #ff6b9d 100%);
    border-color: transparent;
    color: #fff;
}

/* ビュー切り替え */
.schedule-view {
    display: none;
}

.schedule-view.active {
    display: block;
}

/* カレンダーヘッダー */
.calendar-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.calendar-month-title {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.75rem;
    font-weight: normal;
    color: #f0426e;
    min-width: 160px;
    text-align: center;
}

.calendar-nav-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 50%;
    background: #1a1a26;
    color: #f0426e;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.calendar-nav-btn:hover {
    background: linear-gradient(135deg, #f0426e 0%, #ff6b9d 100%);
    color: #fff;
    transform: scale(1.1);
}

/* 曜日ヘッダー */
.calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
    margin-bottom: 2px;
}

.calendar-weekdays .weekday {
    padding: 0.75rem 0.25rem;
    text-align: center;
    font-size: 0.8rem;
    font-weight: 700;
    color: #9ca3af;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 0.5rem 0.5rem 0 0;
}

.calendar-weekdays .weekday.sun {
    color: #ef4444;
}

.calendar-weekdays .weekday.sat {
    color: #3b82f6;
}

/* カレンダーグリッド */
.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}

.calendar-day {
    height: 85px;
    padding: 0.5rem;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 0.5rem;
    transition: all 0.2s ease;
    overflow: hidden;
}

.calendar-day.empty {
    background: transparent;
}

.calendar-day:not(.empty):hover {
    background: rgba(255, 255, 255, 0.06);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.calendar-day .day-number {
    display: block;
    font-size: 0.9rem;
    font-weight: 700;
    color: #e5e7eb;
    margin-bottom: 0.25rem;
}

.calendar-day.sun .day-number {
    color: #ef4444;
}

.calendar-day.sat .day-number {
    color: #3b82f6;
}

.calendar-day.today {
    background-color: rgba(245, 158, 11, 0.08);
}

.calendar-day.today.has-event {
    background-color: rgba(245, 158, 11, 0.25);
}

.calendar-day.today .day-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%);
    color: #fff;
}

.calendar-day.has-event {
    background: rgba(240, 66, 110, 0.2);
    cursor: pointer;
}

/* カレンダーイベント */
.calendar-event {
    padding: 0.25rem 0.375rem;
    margin-top: 0.25rem;
    background: linear-gradient(135deg, #f0426e 0%, #ff6b9d 100%);
    border-radius: 0.25rem;
    font-size: 0.6rem;
    font-weight: 500;
    color: #fff;
    cursor: pointer;
    /* 1行で省略 */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

.calendar-event:hover {
    opacity: 0.9;
}

/* 過去日のイベントをグレーアウト */
.calendar-day.is-past.has-event {
    background: rgba(255, 255, 255, 0.03);
}

.calendar-day.is-past .calendar-event {
    background: rgba(0,0,0,0.5);
    color: rgba(255,255,255,0.3);
}

.calendar-day.is-past .calendar-event-more {
    color: #9ca3af;
}

/* 複数予定の「+N件」表示 */
.calendar-event-more {
    margin-top: 0.125rem;
    font-size: 0.55rem;
    font-weight: 600;
    color: #f0426e;
    cursor: pointer;
    text-align: center;
}

.calendar-event-more:hover {
    text-decoration: underline;
}

/* 特典会レギュレーションバナー */
.rules-banner-section {
    padding: 3rem 1rem;
    background: #000;
}

.rules-banner {
    display: block;
    max-width: 460px;
    margin: 0 auto;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    border: solid 1px #ff53e2;
}

.rules-banner:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 30px rgba(240, 66, 110, 0.2);
}

.rules-banner img {
    width: 100%;
    height: auto;
    display: block;
}

/* PICKUPイベントモーダル */
.pickup-modal {
    position: fixed;
    inset: 0;
    z-index: 9998;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

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

.pickup-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(4px);
}

.pickup-modal-content {
    position: relative;
    background: #1a1a26;
    border-radius: 1rem;
    padding: 1.5rem;
    width: 90%;
    max-width: 540px;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
    transform: scale(0.9) translateY(20px);
    transition: transform 0.3s ease;
}

.pickup-modal.active .pickup-modal-content {
    transform: scale(1) translateY(0);
}

.pickup-modal-close {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    background: none;
    border: none;
    cursor: pointer;
    color: #9ca3af;
    padding: 0.25rem;
    border-radius: 50%;
    transition: color 0.2s ease, background 0.2s ease;
    z-index: 1;
}

.pickup-modal-close:hover {
    color: #f0426e;
    background: rgba(240, 66, 110, 0.1);
}

.pickup-modal-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.25rem;
    color: #f0426e;
    margin-bottom: 1rem;
    padding-right: 2rem;
}

.pickup-modal-title .material-symbols-outlined {
    font-size: 1.25rem;
}

.pickup-modal-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pickup-modal-item {
    display: block;
    border-radius: 0.75rem;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

a.pickup-modal-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(240, 66, 110, 0.2);
}

.pickup-modal-item img {
    width: 100%;
    height: auto;
    display: block;
}

/* スケジュールモーダル */
.schedule-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

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

.schedule-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
}

.schedule-modal-content {
    position: relative;
    background: #1a1a26;
    border-radius: 1rem;
    padding: 1.5rem;
    width: 90%;
    max-width: 480px;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
    transform: scale(0.9) translateY(20px);
    transition: transform 0.3s ease;
}

.schedule-modal.active .schedule-modal-content {
    transform: scale(1) translateY(0);
}

.schedule-modal-close {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    background: none;
    border: none;
    cursor: pointer;
    color: #9ca3af;
    padding: 0.25rem;
    border-radius: 50%;
    transition: color 0.2s ease, background 0.2s ease;
}

.schedule-modal-close:hover {
    color: #f0426e;
    background: rgba(240, 66, 110, 0.1);
}

.schedule-modal-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: #e5e7eb;
    margin-bottom: 1rem;
    padding-right: 2rem;
}

.schedule-modal-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.schedule-modal-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: rgba(240, 66, 110, 0.06);
    border-left: 3px solid #f0426e;
    border-radius: 0.5rem;
    padding: 0.875rem 1rem;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.schedule-modal-item:hover {
    background: rgba(240, 66, 110, 0.12);
    transform: translateX(4px);
}

.schedule-modal-item-content {
    flex: 1;
    min-width: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}

.schedule-modal-item-arrow {
    flex-shrink: 0;
    color: #f0426e;
    font-size: 1.25rem;
    opacity: 0.6;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.schedule-modal-item:hover .schedule-modal-item-arrow {
    opacity: 1;
    transform: translateX(2px);
}

.schedule-modal-item-past .schedule-modal-item-arrow {
    color: #9ca3af;
}

.schedule-modal-item-today {
    background: rgba(245, 158, 11, 0.1);
    border-left-color: #f59e0b;
}

.schedule-modal-item-today:hover {
    background: rgba(245, 158, 11, 0.15);
}

.schedule-modal-item-today .schedule-modal-item-arrow {
    color: #f59e0b;
}

.schedule-modal-item-past {
    background: rgba(255, 255, 255, 0.02);
    border-left-color: #4b5563;
    opacity: 0.7;
}

.schedule-modal-item-past:hover {
    background: rgba(255, 255, 255, 0.04);
}

.schedule-modal-item-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: #e5e7eb;
    margin-bottom: 0.25rem;
}

.schedule-modal-item-past .schedule-modal-item-title {
    color: #6b7280;
}

.schedule-modal-item-detail {
    font-size: 0.8rem;
    color: #9ca3af;
    line-height: 1.4;
}

/* リスト表示 */
.schedule-list-page {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 800px;
    margin: 0 auto;
}

.schedule-list-page .schedule-card {
    background: rgba(255, 255, 255, 0.06);
    border-radius: 1rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

.schedule-list-page .schedule-card-today {
    background: rgba(245, 158, 11, 0.1);
}

.schedule-list-page .schedule-card-past {
    background: #1a1a26;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

.schedule-list-page .schedule-title,
.schedule-list-page .schedule-detail {
    display: block;
    -webkit-line-clamp: unset;
    line-clamp: unset;
    overflow: visible;
}

/* LOAD MOREボタン */
.load-more-container {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
}

.btn-load-more {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 2.5rem;
    background: linear-gradient(135deg, #FF69B4, #FFB6C1);
    color: #fff;
    border: none;
    border-radius: 50px;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(255, 105, 180, 0.3);
}

.btn-load-more:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 105, 180, 0.4);
    background: linear-gradient(135deg, #FF85C1, #FFC8D7);
}

.btn-load-more .material-symbols-outlined {
    font-size: 1.25rem;
}

/* ドットはデフォルト非表示（モバイルのみ表示） */
.calendar-dots {
    display: none;
}

/* モバイル - カレンダーをドット表示 */
@media (max-width: 767px) {
    .calendar-day {
        height: 60px;
        padding: 0.375rem;
        cursor: pointer;
    }

    .calendar-day .day-number {
        font-size: 0.8rem;
        margin-bottom: 0.125rem;
    }

    .calendar-day.today .day-number {
        width: 22px;
        height: 22px;
        font-size: 0.7rem;
    }

    /* イベントテキストを非表示 */
    .calendar-event {
        display: none;
    }

    /* +N件も非表示 */
    .calendar-event-more {
        display: none;
    }

    /* ドット表示（イベント数分） */
    .calendar-dots {
        display: flex;
        justify-content: center;
        gap: 3px;
        margin-top: 0.25rem;
        flex-wrap: wrap;
    }

    .calendar-dot {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: linear-gradient(135deg, #f0426e 0%, #ff6b9d 100%);
    }

    .calendar-dot-today {
        background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%);
    }

    .calendar-day.is-past .calendar-dot {
        background: #d1d5db;
    }
}

/* タブレット (768px~) */
@media (min-width: 768px) {
    .schedule-page-section {
        padding: 4rem 2rem 5rem;
    }

    .calendar-month-title {
        font-size: 2rem;
    }

    .calendar-day {
        height: 100px;
        padding: 0.75rem;
    }

    .calendar-day .day-number {
        font-size: 1rem;
    }

    .calendar-event {
        font-size: 0.65rem;
        padding: 0.375rem 0.5rem;
    }

    .calendar-event-more {
        font-size: 0.6rem;
    }
}

/* デスクトップ (1024px~) */
@media (min-width: 1024px) {
    .schedule-page-section {
        padding: 5rem 2rem 6rem;
    }

    .calendar-day {
        height: 120px;
    }

    .calendar-event {
        font-size: 0.7rem;
    }

    .calendar-event-more {
        font-size: 0.85rem;
    }
}

/* 予定がない場合のメッセージ */
.no-schedule-message {
    text-align: center;
    padding: 3rem 1rem;
    max-width: 800px;
    margin: 0 auto;
}

.no-schedule-message p {
    font-size: .8rem;
    color: #9ca3af;
    background: #1a1a26;
    padding: 2rem;
    border-radius: 1rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}


/* ==========================================================================
   16. モバイルメニュー
   ========================================================================== */

.mobile-menu {
    position: fixed;
    top: 0;
    right: -100%;
    width: 80%;
    max-width: 320px;
    height: 100%;
    background: linear-gradient(135deg, #12121c 0%, #1a1032 50%, #12121c 100%);
    z-index: 100;
    transition: right 0.3s ease;
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.4);
    overflow-y: auto;
}

.mobile-menu.is-open {
    right: 0;
}

.mobile-menu-inner {
    padding: 2rem 1.5rem;
}

.mobile-menu-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-left: auto;
    margin-bottom: 2rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    color: #e5e7eb;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.mobile-menu-close:hover {
    background: #f0426e;
    color: #fff;
}

.mobile-menu-nav {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 2rem;
}

.mobile-menu-nav .nav-link {
    display: block;
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.5rem;
    color: #e5e7eb;
    padding: 0.75rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    transition: color 0.2s ease;
}

.mobile-menu-nav .nav-link:hover,
.mobile-menu-nav .nav-link.active {
    color: #f0426e;
}

.mobile-menu-sns {
    display: flex;
    gap: 0.75rem;
    padding-top: 1rem;
}

/* メニュー開いている時の背景オーバーレイ */
body.menu-open::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 99;
}

body.menu-open {
    overflow: hidden;
}

/* ==========================================================================
   17. 会社概要ページ
   ========================================================================== */

.company-section {
    padding: 3rem 1rem 5rem;
    background: linear-gradient(135deg, #0d0d14 0%, #1a1032 100%);
}

.company-message {
    margin-bottom: 2.5rem;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 1rem;
    font-size: 0.9rem;
    line-height: 2;
    color: #9ca3af;
}

.company-table-wrapper {
    max-width: 800px;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 1.5rem;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.company-table {
    width: 100%;
    border-collapse: collapse;
}

.company-table th,
.company-table td {
    padding: 1.25rem 1.5rem;
    text-align: left;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.875rem;
}

.company-table tr:last-child th,
.company-table tr:last-child td {
    border-bottom: none;
}

.company-table th {
    width: 140px;
    font-weight: 700;
    color: #f0426e;
    white-space: nowrap;
    vertical-align: top;
}

.company-table td {
    color: #e5e7eb;
    line-height: 1.8;
}

.company-table td a {
    color: #f0426e;
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color 0.2s ease;
}

.company-table td a:hover {
    color: #ff6b9d;
}

/* モバイル: 縦並び */
@media (max-width: 599px) {
    .company-table th,
    .company-table td {
        display: block;
        width: 100%;
        padding: 0.5rem 1.25rem;
    }

    .company-table th {
        padding-top: 1.25rem;
        padding-bottom: 0.25rem;
        font-size: 0.75rem;
    }

    .company-table td {
        padding-bottom: 1.25rem;
    }
}

@media (min-width: 768px) {
    .company-section {
        padding: 4rem 2rem 6rem;
    }

    .company-table th {
        width: 160px;
    }

    .company-table th,
    .company-table td {
        padding: 1.5rem 2rem;
    }
}


/* ==========================================================================
   17a. 汎用固定ページ
   ========================================================================== */

.generic-page-section {
    padding: 3rem 1rem 5rem;
    background: linear-gradient(135deg, #0d0d14 0%, #1a1032 100%);
}

.generic-page-content {
    font-size: 0.9rem;
    line-height: 2;
    color: #9ca3af;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* 見出しスタイル */
.generic-page-content h2 {
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.5rem;
    font-weight: normal;
    color: #f0426e;
    margin: 3rem 0 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid rgba(240, 66, 110, 0.3);
}

.generic-page-content h3 {
    font-size: 1rem;
    font-weight: 700;
    color: #e5e7eb;
    margin: 2.5rem 0 1rem;
    padding-left: 0.85rem;
    border-left: 3px solid #f0426e;
}

.generic-page-content h4 {
    font-size: 1rem;
    font-weight: 700;
    color: #d1d5db;
    margin: 2rem 0 0.75rem;
}

.generic-page-content h4::before {
    content: '\25C6';
    color: #f0426e;
    margin-right: 0.5rem;
    font-size: 0.7rem;
}

.generic-page-content h5 {
    font-size: 0.9rem;
    font-weight: 700;
    color: #9ca3af;
    margin: 1.5rem 0 0.5rem;
}

/* 本文要素 */
.generic-page-content p {
    margin-bottom: 1.25rem;
    font-size: .85rem;
}

.generic-page-content h3 + p {
    padding-left: 1rem;
}

.generic-page-content a {
    color: #f0426e;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.generic-page-content a:hover {
    color: #ff6b9d;
}

.generic-page-content ul {
    padding-left: 1rem;
}

.generic-page-content ul,
.generic-page-content ol {
    margin: 1rem 0 1.5rem 1.5rem;
}

.generic-page-content li {
    margin-bottom: 0.5rem;
}

.generic-page-content ul li {
    list-style: disc;
    line-height: 1.6;
}

.generic-page-content ol li {
    list-style: decimal;
}

.generic-page-content img {
    width: 100%;
    height: auto;
    display: block;
    margin: 1.5rem 0;
    border-radius: 0.75rem;
}

.generic-page-content iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    display: block;
    margin: 1.5rem 0;
    border: none;
    border-radius: 0.75rem;
}

.generic-page-content blockquote {
    margin: 1.5rem 0;
    padding: 1.25rem 1.5rem;
    border-left: 3px solid #f0426e;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 0 0.5rem 0.5rem 0;
    color: #d1d5db;
    font-style: italic;
}

.generic-page-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
}

.generic-page-content th,
.generic-page-content td {
    padding: 0.75rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 0.85rem;
}

.generic-page-content th {
    background: rgba(240, 66, 110, 0.08);
    color: #e5e7eb;
    font-weight: 700;
}

.generic-page-content td {
    color: #9ca3af;
}

@media (min-width: 768px) {
    .generic-page-section {
        padding: 4rem 2rem 6rem;
    }

    .generic-page-content h2 {
        font-size: 1.75rem;
    }
}


/* ==========================================================================
   17b. 特典会レギュレーション・プレゼントルール
   ========================================================================== */

.rules-section {
    padding: min(7vw, 80px) 0 4rem;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    position: relative;
}

.rules-section::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('../../images/bg_concrete_sp.webp?20260403') center bottom / cover no-repeat;
    opacity: 0.25;
    pointer-events: none;
}

@media (min-width: 768px) {
    .rules-section::after {
        background-image: url('../../images/bg_concrete.webp');
    }
}

.rules-section > .container-narrow {
    position: relative;
    z-index: 1;
}

.rules-divider {
    border: none;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    margin: 3rem 0;
}

.rules-header {
    text-align: center;
    margin-bottom: 2.5rem;
}

.rules-subtitle {
    font-size: min(4vw, 18px);
    font-weight: 700;
    color: #9ca3af;
    margin-top: 0.25rem;
}

.rules-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 800px;
    margin: 0 auto 2rem;
}

.rules-item {
    display: flex;
    gap: 1.25rem;
    padding: 1.5rem;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 1rem;
    border-left: 3px solid #f0426e;
}

.rules-item-number {
    flex-shrink: 0;
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    color: #f0426e;
    opacity: 0.5;
    line-height: 1;
    padding-top: 0.15rem;
}

.rules-item-body {
    flex: 1;
    min-width: 0;
}

.rules-item-title {
    font-size: min(4vw, 18px);
    font-weight: 700;
    color: #e5e7eb;
    margin-bottom: 0.5rem;
}

.rules-item-desc {
    font-size: min(3.2vw, 15px);
    line-height: 1.5;
    color: #9ca3af;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* 導入テキスト */
.rules-intro {
    max-width: 800px;
    margin: 0 auto 2rem;
    font-size: min(3.2vw, 15px);
    line-height: 1.8;
    color: #9ca3af;
    text-align: center;
}

/* スマホ用改行（PCでは非表示） */
.sp-br {
    display: none;
}

@media (max-width: 767px) {
    .sp-br {
        display: inline;
    }
}

/* サブ項目 */
.rules-sub-list {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: min(8vw, 40px);
}

.rules-sub-item {
    padding-left: 0.75rem;
}

.rules-sub-title {
    font-size: min(3.5vw, 16px);
    font-weight: 700;
    color: #f0426e;
    margin-bottom: min(3vw, 10px);
}

.rules-sub-desc {
    font-size: min(3.2vw, 15px);
    line-height: 1.7;
    color: #9ca3af;
    overflow-wrap: break-word;
    word-break: break-word;
    padding-left: 0.5rem;
    border-left: 2px solid rgba(240, 66, 110, 0.2);
}

/* 説明文内の箇条書き */
.rules-item-desc p,
.rules-sub-desc p {
    margin-bottom: 0.5rem;
}

.rules-item-desc p:last-child,
.rules-sub-desc p:last-child {
    margin-bottom: 0;
}

.rules-text-list {
    list-style: none;
    padding: 0;
    margin: 0.5rem 0;
}

.rules-text-list li {
    padding-left: 1.25rem;
    text-indent: -1.25rem;
    margin-bottom: 0.35rem;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
}

.rules-text-list li .list-marker {
    color: #f0426e;
    margin-right: 0.25rem;
}

/* 注釈（※） */
.rules-note {
    line-height: 1.7;
    color: #9ca3af;
    margin-top: 0.5rem;
    margin-bottom: 0.25rem;
    padding-left: 1.25rem;
    text-indent: -1.25rem;
}

.rules-note-mark {
    margin-right: 0.25rem;
}

/* 注意事項内の注釈 */
.contact-notice-body .rules-note-mark {
    color: #fbbf24;
}

/* ルール内にインライン表示するメニュー */
.tokuten-menu-inline {
    margin-top: 1rem;
    padding: 1.25rem;
    border-radius: 0.75rem;
}

.tokuten-menu-inline .tokuten-menu-title {
    font-size: 0.85rem;
    margin-bottom: 0.75rem;
    transform: translateX(-32px);
}

/* 注意事項はcontact-noticeを共用（max-width調整） */
.rules-section .contact-notice {
    max-width: 800px;
    margin: 0 auto;
}

/* 特典交換メニュー */
.tokuten-menu {
    max-width: 600px;
    margin: 0 auto;
    padding: 2rem .5em 0;
}

.tokuten-menu-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: min(4vw, 18px);
    font-weight: 700;
    margin-bottom: 1.25rem;
}

.tokuten-menu-title .material-symbols-outlined {
    font-size: 1.25rem;
}

.tokuten-menu-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.tokuten-menu-item {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    background: rgb(142 75 169 / 16%);
    border-radius: 0.5rem;
    border: solid 1px rgb(188 75 174 / 6%);
    flex-direction: row;
    flex-wrap: wrap;
}

.tokuten-menu-ticket {
    flex-shrink: 0;
    font-size: min(3.5vw, 16px);
    font-weight: 700;
    color: #f0426e;
    white-space: nowrap;
}

.tokuten-menu-dots {
    flex: 1;
    border-bottom: 1px dotted rgba(255, 255, 255, 0.15);
    min-width: 1rem;
}

.tokuten-menu-content {
    flex-shrink: 1;
    font-size: min(3.5vw, 16px);
    color: #e5e7eb;
    text-align: right;
    overflow-wrap: break-word;
    word-break: break-word;
}

.tokuten-menu-note {
    margin-top: 0.75rem;
    font-size: min(3.2vw, 15px);
    line-height: 1.7;
    color: #9ca3af;
}

.tokuten-exchange-menu {
    margin-bottom: 2rem;
}

@media (min-width: 768px) {
    .rules-section {
        padding: 5rem 2rem;
    }

    .rules-item {
        padding: 2rem;
        gap: 1.5rem;
    }

    .rules-item-number {
        font-size: 2rem;
    }

    .tokuten-menu {
        padding: 2.5rem;
    }

    .tokuten-menu-item {
        padding: 1rem 1.5rem;
    }
}


/* ==========================================================================
   18. お問い合わせページ
   ========================================================================== */

.contact-section {
    padding: 3rem 0 5rem;
    background: linear-gradient(135deg, #0d0d14 0%, #1a1032 100%);
}

.contact-description {
    margin-bottom: 2rem;
    padding: 0 .5rem;
    border-radius: 1rem;
    font-size: min(3.2vw, 15px);
    line-height: 1.8;
    color: #9ca3af;
}

/* 注意事項 */
.contact-notice {
    margin-bottom: 2rem;
    padding: min(5vw, 30px) min(4vw, 30px);
    background: rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.2);
    border-radius: 10px;
}

.contact-notice-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: min(4vw, 18px);
    font-weight: 700;
    color: #fbbf24;
    margin-bottom: 1rem;
}

.contact-notice-title .material-symbols-outlined {
    font-size: 1.25rem;
}

.contact-notice-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.contact-notice-list li {
    position: relative;
    padding-left: 1.25rem;
    font-size: min(3.2vw, 15px);
    line-height: 1.7;
    color: #d1d5db;
}

.contact-notice-list li::before {
    content: '\30FB';
    position: absolute;
    left: 0;
    color: #fbbf24;
}

/* 注意事項本文（mekm_format_text使用） */
.contact-notice-body {
    font-size: min(3.2vw, 15px);
    line-height: 1.7;
    color: #d1d5db;
}

.contact-notice-body p {
    margin-bottom: 0.5rem;
}

.contact-notice-body p:last-child {
    margin-bottom: 0;
}

.contact-notice-body .rules-text-list {
    margin: 0.5rem 0;
}

.contact-notice-body .rules-text-list .list-marker {
    color: #fbbf24;
}

.contact-form-wrapper {
    margin: 0 auto;
    padding: 2.5rem 1.2rem;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

#contact-form {
    max-width: 600px;
    margin: 0 auto;
}

.form-group {
    margin-bottom: 1.5rem;
}

.form-label {
    display: block;
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 0.85rem;
    color: #e5e7eb;
    margin-bottom: 0.5rem;
}

.form-required {
    color: #f0426e;
    margin-left: 0.25rem;
}

.form-input,
.form-select,
.form-textarea {
    width: 100%;
    padding: 0.875rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0.75rem;
    background-color: rgba(255, 255, 255, 0.06);
    color: #e5e7eb;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: min(3.5vw, 16px);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    -webkit-appearance: none;
    appearance: none;
}

.form-input::placeholder,
.form-textarea::placeholder {
    color: #6b7280;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
    outline: none;
    border-color: #f0426e;
    box-shadow: 0 0 0 3px rgba(240, 66, 110, 0.15);
}

.form-select {
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%239ca3af' d='M1.41 0L6 4.58 10.59 0 12 1.41l-6 6-6-6z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.5rem;
}

.form-select option {
    background-color: #1a1a26;
    color: #e5e7eb;
}

.form-textarea {
    resize: vertical;
    min-height: 120px;
}

/* チェックボックス */
.form-group-checkbox {
    margin-bottom: 1.5rem;
    padding: 1.25rem;
    border: 1px solid rgba(240, 66, 110, 0.25);
    border-radius: 0.75rem;
    background: rgba(240, 66, 110, 0.04);
}

.form-checkbox-label {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
}

.form-checkbox {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    accent-color: #f0426e;
    cursor: pointer;
}

.form-checkbox-text {
    font-size: 0.85rem;
    font-weight: 500;
    color: #e5e7eb;
}

.form-checkbox-text a {
    color: #f0426e;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.form-checkbox-text a:hover {
    color: #ff6b9d;
}

/* Turnstile */
.form-group-turnstile {
    display: flex;
    justify-content: center;
    margin-bottom: 1.5rem;
}

/* 送信ボタン */
.form-group-submit {
    text-align: center;
    margin-bottom: 1rem;
}

.btn-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 1rem 3rem;
    background: linear-gradient(135deg, #f0426e 0%, #ff6b9d 100%);
    color: #fff;
    font-family: 'Cabin Sketch', sans-serif;
    font-size: 1.1rem;
    letter-spacing: 0.1em;
    border: none;
    border-radius: 9999px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(240, 66, 110, 0.3);
}

.btn-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(240, 66, 110, 0.4);
}

.btn-submit:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.btn-submit-loading {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 0.9rem;
}

.spinning {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* 結果メッセージ */
.contact-result {
    padding: 1rem 1.25rem;
    border-radius: 0.75rem;
    font-size: 0.875rem;
    text-align: center;
}

.contact-result-success {
    background-color: rgba(16, 185, 129, 0.12);
    color: #10b981;
    border: 1px solid rgba(16, 185, 129, 0.25);
}

.contact-result-error {
    background-color: rgba(239, 68, 68, 0.12);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.25);
}

/* 確認画面 */
.confirm-heading {
    text-align: center;
    font-size: 1rem;
    font-weight: 700;
    color: #e5e7eb;
    margin-bottom: 2rem;
}

.confirm-data {
    margin-bottom: 2rem;
}

.confirm-row {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 1rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.confirm-row:last-child {
    border-bottom: none;
}

.confirm-row dt {
    font-size: 0.75rem;
    font-weight: 700;
    color: #9ca3af;
}

.confirm-row dd {
    font-size: 0.9rem;
    color: #e5e7eb;
    white-space: pre-wrap;
    overflow-wrap: break-word;
    word-break: break-word;
}

.confirm-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.btn-back {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.875rem 1.5rem;
    background: transparent;
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 9999px;
    color: #9ca3af;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.btn-back:hover {
    border-color: #f0426e;
    color: #f0426e;
}

.btn-back .material-symbols-outlined {
    font-size: 1.1rem;
}

/* 送信完了 */
.contact-complete {
    text-align: center;
}

.contact-complete .contact-result-success {
    padding: 2rem;
}

.complete-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
}

.complete-title .material-symbols-outlined {
    font-size: 1.5rem;
}

/* プライバシーポリシーモーダル */
.privacy-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

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

.privacy-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(4px);
}

.privacy-modal-content {
    position: relative;
    background: #1a1a26;
    border-radius: 1rem;
    width: 90%;
    max-width: 640px;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
    transform: scale(0.9) translateY(20px);
    transition: transform 0.3s ease;
}

.privacy-modal.active .privacy-modal-content {
    transform: scale(1) translateY(0);
}

.privacy-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    flex-shrink: 0;
}

.privacy-modal-title {
    font-size: 1rem;
    font-weight: 700;
    color: #e5e7eb;
}

.privacy-modal-close {
    background: none;
    border: none;
    cursor: pointer;
    color: #9ca3af;
    padding: 0.25rem;
    border-radius: 50%;
    transition: color 0.2s ease, background 0.2s ease;
}

.privacy-modal-close:hover {
    color: #f0426e;
    background: rgba(240, 66, 110, 0.1);
}

.privacy-modal-body {
    padding: 1.5rem;
    overflow-y: auto;
    font-size: 0.85rem;
    line-height: 1.8;
    color: #9ca3af;
}

.privacy-modal-body h1,
.privacy-modal-body h2,
.privacy-modal-body h3,
.privacy-modal-body h4 {
    color: #e5e7eb;
    margin: 1.5rem 0 0.75rem;
    font-size: 1rem;
}

.privacy-modal-body h1:first-child,
.privacy-modal-body h2:first-child {
    margin-top: 0;
}

.privacy-modal-body p {
    margin-bottom: 0.75rem;
}

.privacy-modal-body ul,
.privacy-modal-body ol {
    margin-bottom: 0.75rem;
    padding-left: 1.5rem;
    list-style: disc;
}

.privacy-modal-body a {
    color: #f0426e;
    text-decoration: underline;
}

/* タブレット以上 */
@media (min-width: 768px) {
    .contact-section {
        padding: 4rem 0 6rem;
    }

    .contact-form-wrapper {
        padding: 3rem;
    }

    .confirm-row {
        flex-direction: row;
        gap: 1.5rem;
    }

    .confirm-row dt {
        flex-shrink: 0;
        width: 140px;
    }
}

/* フッターロゴ画像（WordPress用） */
.footer-logo-img {
    --logo-height: min(30vw, 120px);
    filter: brightness(5);
    height: var(--logo-height);
    width: calc(var(--logo-height) * var(--logo-ratio, 2));
    max-width: 80vw;
    object-fit: contain;
}