/* レスポンシブデザイン */

/* PCデザインと同じカラー変数を適用 */
:root {
    /* メインカラーパレット - 背景画像に合わせた非常に濃いテキスト色 */
    --primary-color: #f8b4d9;
    --secondary-color: #f4a6c8;
    --accent-color: #f8b4d9;
    --text-color: #000000;
    --light-text: #000000;
    --white: #ffffff;
    --light-gray: #f8f9fa;
    --marble-bg: linear-gradient(135deg, #ffffff 0%, #f8f9fa 50%, #f1f3f4 100%);
    --gold: #ffd700;
    --shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    --transition-base: all 0.3s ease;
    --transition-nav: all 0.2s ease;
    --animation-delay: 0;
    --float-animation: float 6s ease-in-out infinite;
    --pulse-animation: gentlePulse 4s ease-in-out infinite;
    --glow-animation: softGlow 3s ease-in-out infinite;

    /* ヘッダー */
    --header-text-color: rgba(255, 255, 255, 0.98);
    --header-subtext-color: rgba(255, 255, 255, 0.8);
    --header-nav-color: #333333;
    --header-nav-hover-color: #555555;

    /* セクションタイトル */
    --section-title-color: #000000;
    --section-title-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    --section-title-underline: #f8b4d9;

    /* メニューセクション */
    --menu-heading-color: #000000;
    --menu-text-color: #000000;
    --menu-heading-weight: 600;
    --menu-text-weight: 400;

    /* 新着情報セクション */
    --news-date-color: #f8b4d9;
    --news-heading-color: #000000;
    --news-text-color: #000000;
    --news-heading-weight: 600;
    --news-text-weight: 400;

    /* 料金セクション */
    --price-heading-color: #000000;
    --price-text-color: #000000;
    --price-amount-color: #f8b4d9;
    --price-border-color: #f8b4d9;
    --price-heading-weight: 600;
    --price-text-weight: 400;

    /* 商品セクション */
    --product-heading-color: #000000;
    --product-text-color: #000000;
    --product-price-color: #f8b4d9;
    --product-heading-weight: 600;
    --product-text-weight: 400;

    /* 店舗情報セクション */
    --shop-heading-color: #000000;
    --shop-text-color: #000000;
    --shop-icon-color: #f8b4d9;
    --shop-heading-weight: 600;
    --shop-text-weight: 400;

    /* お問い合わせセクション */
    --contact-title-color: #000000;
    --contact-text-color: #000000;
    --contact-icon-color: #f8b4d9;
    --contact-title-weight: 600;
    --contact-text-weight: 400;

    /* LINEセクション */
    --line-title-color: #000000;
    --line-text-color: #000000;
    --line-title-weight: 600;
    --line-text-weight: 400;

    /* 会社概要セクション */
    --about-heading-color: #000000;
    --about-text-color: #000000;
    --about-border-color: #f8b4d9;
    --about-heading-weight: 600;
    --about-text-weight: 400;

    /* フッター */
    --footer-text-color: var(--white);
    --footer-opacity: 0.9;
}

/* 共通のレスポンシブ設定 */

/* 強制的なテキスト色設定 - すべての画面サイズで適用 */
.menu-item h3,
.menu-item p,
.news-content h3,
.news-content p,
.price-item h3,
.price-details,
.product-item h3,
.product-item p,
.info-item h3,
.info-item p,
.contact-title,
.contact-description,
.contact-item,
.line-title,
.line-description,
.feature-item,
.about-item h3,
.about-item p {
    color: #333333 !important;
    text-shadow: 0 2px 4px rgba(255, 255, 255, 0.9), 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

/* 金額部分の色設定 */
.price-row span:last-child,
.product-price {
    color: #f06292 !important;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8) !important;
    font-weight: 600 !important;
}

/* 金額の後に円マークを追加 */
.price-row span:last-child::after,
.product-price::after {
    content: "円";
    margin-left: 2px;
    color: #f06292 !important;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8) !important;
    font-weight: 600 !important;
}

/* レスポンシブ用ハンバーガーメニュー内のテキスト色設定（黒系） */
@media (max-width: 768px) {
    .nav-menu a {
        color: #000000 !important;
        text-shadow: 0 2px 4px rgba(255, 255, 255, 0.9), 0 1px 2px rgba(0, 0, 0, 0.3) !important;
    }
}

/* レスポンシブ用ナビゲーションメニューの強制上書き */
@media (max-width: 768px) {
    .nav-menu a {
        color: #000000 !important;
        text-shadow: 0 2px 4px rgba(255, 255, 255, 0.9), 0 1px 2px rgba(0, 0, 0, 0.3) !important;
    }
    
    .nav-menu a:hover {
        color: #000000 !important;
        text-shadow: 0 2px 8px rgba(248, 180, 217, 0.8) !important;
    }
}

@media (max-width: 768px) {
    /* PCデザインと同じカラー変数を維持 */
    :root {
        /* メインカラーパレット - 背景画像に合わせた非常に濃いテキスト色 */
        --primary-color: #f8b4d9;
        --secondary-color: #f4a6c8;
        --accent-color: #f8b4d9;
        --text-color: #000000;
        --light-text: #000000;
        --white: #ffffff;
        --light-gray: #f8f9fa;
        --marble-bg: linear-gradient(135deg, #ffffff 0%, #f8f9fa 50%, #f1f3f4 100%);
        --gold: #ffd700;
        --shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
        --transition-base: all 0.3s ease;
        --transition-nav: all 0.2s ease;
        --animation-delay: 0;
        --float-animation: float 6s ease-in-out infinite;
        --pulse-animation: gentlePulse 4s ease-in-out infinite;
        --glow-animation: softGlow 3s ease-in-out infinite;

        /* ヘッダー */
        --header-text-color: rgba(255, 255, 255, 0.98);
        --header-subtext-color: rgba(255, 255, 255, 0.8);
        --header-nav-color: #333333;
        --header-nav-hover-color: #555555;

        /* セクションタイトル */
        --section-title-color: #000000;
        --section-title-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        --section-title-underline: #f8b4d9;

        /* メニューセクション */
        --menu-heading-color: #000000;
        --menu-text-color: #000000;
        --menu-heading-weight: 600;
        --menu-text-weight: 400;

        /* 新着情報セクション */
        --news-date-color: #f8b4d9;
        --news-heading-color: #000000;
        --news-text-color: #000000;
        --news-heading-weight: 600;
        --news-text-weight: 400;

        /* 料金セクション */
        --price-heading-color: #000000;
        --price-text-color: #000000;
        --price-amount-color: #f8b4d9;
        --price-border-color: #f8b4d9;
        --price-heading-weight: 600;
        --price-text-weight: 400;

        /* 商品セクション */
        --product-heading-color: #000000;
        --product-text-color: #000000;
        --product-price-color: #f8b4d9;
        --product-heading-weight: 600;
        --product-text-weight: 400;

        /* 店舗情報セクション */
        --shop-heading-color: #000000;
        --shop-text-color: #000000;
        --shop-icon-color: #f8b4d9;
        --shop-heading-weight: 600;
        --shop-text-weight: 400;

        /* お問い合わせセクション */
        --contact-title-color: #000000;
        --contact-text-color: #000000;
        --contact-icon-color: #f8b4d9;
        --contact-title-weight: 600;
        --contact-text-weight: 400;

        /* LINEセクション */
        --line-title-color: #000000;
        --line-text-color: #000000;
        --line-title-weight: 600;
        --line-text-weight: 400;

        /* 会社概要セクション */
        --about-heading-color: #000000;
        --about-text-color: #000000;
        --about-border-color: #f8b4d9;
        --about-heading-weight: 600;
        --about-text-weight: 400;

        /* フッター */
        --footer-text-color: var(--white);
        --footer-opacity: 0.9;
    }

    .container {
        padding: 0 15px;
    }

    /* ヘッダー - レスポンシブでも固定表示 */
    body .header {
        position: fixed !important;
        background: linear-gradient(135deg, rgba(248, 180, 217, 0.7), rgba(244, 166, 200, 0.6)) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        box-shadow: 0 4px 20px rgba(248, 180, 217, 0.2) !important;
        border-bottom: 2px solid rgba(248, 180, 217, 0.3) !important;
        transition: transform 0.3s ease-in-out !important;
    }

    /* ヘッダーロゴのカラー設定 */
    .logo h1 {
        color: var(--header-text-color) !important;
    }

    .logo p {
        color: var(--header-subtext-color) !important;
    }

    /* ナビゲーションリンクのカラー設定 */
    .nav-menu a {
        color: var(--header-nav-color) !important;
    }

    .nav-menu a:hover {
        color: var(--header-nav-hover-color) !important;
    }

    .nav-container {
        position: relative;
    }

    .header-reservation-btn {
        position: absolute;
        right: 16px;
        top: 50%;
        transform: translateY(-50%);
        margin-left: 0;
        padding: 0.55rem 1.1rem;
        font-size: 0.9rem;
        line-height: 1;
    }

    /* Android端末向けの微調整（AQUOS等のセーフエリア/フォント差吸収） */
    @supports (-webkit-touch-callout: none) {
        .header-reservation-btn {
            top: 50%;
            transform: translateY(-50%);
        }
    }

    .nav-menu {
        position: fixed;
        left: -100%;
        top: 70px;
        flex-direction: column;
        background: url('../images/shinotekusucha.jpg') no-repeat center center;
        background-size: cover;
        width: 100%;
        text-align: center;
        transition: var(--transition-base);
        box-shadow: var(--shadow);
        padding: 2rem 0;
        gap: 1rem;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .nav-menu.active {
        left: 0;
    }

    .hamburger {
        display: flex;
    }

    .hamburger.active span:nth-child(2) {
        opacity: 0;
    }

    .hamburger.active span:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }

    .hamburger.active span:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }

    /* メインビジュアル */
    .hero-slideshow {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
    }
    
    .slide {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        opacity: 0;
        transition: opacity 1.5s ease-in-out;
        will-change: opacity;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }
    
    .slide.active {
        opacity: 1;
    }
    
    /* モバイルでのスライドショー最適化 */
    @media (max-width: 768px) {
        .hero-slideshow {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 1;
            -webkit-transform: translateZ(0);
            transform: translateZ(0);
        }
    }
    
    .slide.active {
        opacity: 1;
    }
    
    .hero-title {
        font-size: 2.5rem;
    }

    .hero-subtitle {
        font-size: 1.2rem;
    }

    .hero-description {
        font-size: 1rem;
    }

    /* セクションタイトル */
    .section-title {
        font-size: 2rem;
    }

    /* グリッドレイアウトの統一 */
    .menu-grid,
    .price-grid,
    .products-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    /* 新着情報 */
    .news-item {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    .news-date {
        min-width: auto;
    }

    /* 店舗情報 */
    .shop-info-content {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .shop-image {
        height: 300px;
    }

    /* お問い合わせ */
    .contact-content {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .contact-title {
        font-size: 1.8rem;
    }

    .line-contact {
        padding: 2rem;
    }

    .line-logo {
        width: 70px;
        height: 70px;
    }

    .line-logo i {
        font-size: 2rem;
    }

    .line-title {
        font-size: 1.6rem;
    }

    /* フッター */
    .footer-content {
        grid-template-columns: 1fr;
        gap: 2rem;
        text-align: center;
    }

    .social-icons {
        justify-content: center;
    }
}

/* モバイル (480px以下) */
@media (max-width: 480px) {
    /* PCデザインと同じカラー変数を維持 */
    :root {
        /* メインカラーパレット - 背景画像に合わせた非常に濃いテキスト色 */
        --primary-color: #f8b4d9;
        --secondary-color: #f4a6c8;
        --accent-color: #f8b4d9;
        --text-color: #000000;
        --light-text: #000000;
        --white: #ffffff;
        --light-gray: #f8f9fa;
        --marble-bg: linear-gradient(135deg, #ffffff 0%, #f8f9fa 50%, #f1f3f4 100%);
        --gold: #ffd700;
        --shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
        --transition-base: all 0.3s ease;
        --transition-nav: all 0.2s ease;
        --animation-delay: 0;
        --float-animation: float 6s ease-in-out infinite;
        --pulse-animation: gentlePulse 4s ease-in-out infinite;
        --glow-animation: softGlow 3s ease-in-out infinite;

        /* ヘッダー */
        --header-text-color: rgba(255, 255, 255, 0.98);
        --header-subtext-color: rgba(255, 255, 255, 0.8);
        --header-nav-color: #333333;
        --header-nav-hover-color: #555555;

        /* セクションタイトル */
        --section-title-color: #000000;
        --section-title-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        --section-title-underline: #f8b4d9;

        /* メニューセクション */
        --menu-heading-color: #000000;
        --menu-text-color: #000000;
        --menu-heading-weight: 600;
        --menu-text-weight: 400;

        /* 新着情報セクション */
        --news-date-color: #f8b4d9;
        --news-heading-color: #000000;
        --news-text-color: #000000;
        --news-heading-weight: 600;
        --news-text-weight: 400;

        /* 料金セクション */
        --price-heading-color: #000000;
        --price-text-color: #000000;
        --price-amount-color: #f8b4d9;
        --price-border-color: #f8b4d9;
        --price-heading-weight: 600;
        --price-text-weight: 400;

        /* 商品セクション */
        --product-heading-color: #000000;
        --product-text-color: #000000;
        --product-price-color: #f8b4d9;
        --product-heading-weight: 600;
        --product-text-weight: 400;

        /* 店舗情報セクション */
        --shop-heading-color: #000000;
        --shop-text-color: #000000;
        --shop-icon-color: #f8b4d9;
        --shop-heading-weight: 600;
        --shop-text-weight: 400;

        /* お問い合わせセクション */
        --contact-title-color: #000000;
        --contact-text-color: #000000;
        --contact-icon-color: #f8b4d9;
        --contact-title-weight: 600;
        --contact-text-weight: 400;

        /* LINEセクション */
        --line-title-color: #000000;
        --line-text-color: #000000;
        --line-title-weight: 600;
        --line-text-weight: 400;

        /* 会社概要セクション */
        --about-heading-color: #000000;
        --about-text-color: #000000;
        --about-border-color: #f8b4d9;
        --about-heading-weight: 600;
        --about-text-weight: 400;

        /* フッター */
        --footer-text-color: var(--white);
        --footer-opacity: 0.9;
    }

    .container {
        padding: 0 10px;
    }

    /* ヘッダー - 小画面でも固定表示 */
    body .header {
        position: fixed !important;
        background: linear-gradient(135deg, rgba(248, 180, 217, 0.7), rgba(244, 166, 200, 0.6)) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        box-shadow: 0 4px 20px rgba(248, 180, 217, 0.2) !important;
        border-bottom: 2px solid rgba(248, 180, 217, 0.3) !important;
        transition: transform 0.3s ease-in-out !important;
    }

    /* ヘッダーロゴのカラー設定 */
    .logo h1 {
        color: var(--header-text-color) !important;
    }

    .logo p {
        color: var(--header-subtext-color) !important;
    }

    /* ナビゲーションリンクのカラー設定 */
    .nav-menu a {
        color: var(--header-nav-color) !important;
    }

    .nav-menu a:hover {
        color: var(--header-nav-hover-color) !important;
    }

    /* ヘッダー */
    .logo h1 {
        font-size: 1.5rem;
    }

    .logo p {
        font-size: 0.8rem;
    }

    /* メインビジュアル */
    .hero-title {
        font-size: 2rem;
    }

    .hero-subtitle {
        font-size: 1rem;
    }

    .hero-description {
        font-size: 0.9rem;
    }

    .cta-button {
        padding: 0.8rem 2rem;
        font-size: 0.9rem;
    }

    /* セクション */
    section {
        padding: 3rem 0;
    }

    .section-title {
        font-size: 1.8rem;
        margin-bottom: 2rem;
    }

    /* アイテム共通スタイル */
    .menu-item h3,
    .product-item h3 {
        font-size: 1.1rem;
    }

    .menu-item p,
    .product-item p {
        font-size: 0.9rem;
    }

    .menu-item p {
        padding: 0 1rem 1rem;
    }

    /* 料金アイテム */
    .price-item {
        padding: 1.5rem;
    }

    .price-item h3 {
        font-size: 1.3rem;
    }

    .price-row span:last-child {
        font-size: 1rem;
    }

    .product-price {
        font-size: 1.2rem;
    }

    /* 店舗情報 */
    .info-item h3 {
        font-size: 1.1rem;
    }

    .info-item p {
        font-size: 0.9rem;
    }

    .shop-image {
        height: 250px;
    }

    /* お問い合わせ */
    .contact-content {
        gap: 2rem;
    }

    .contact-title {
        font-size: 1.6rem;
        margin-bottom: 1rem;
    }

    .contact-description {
        font-size: 1rem;
        margin-bottom: 2rem;
    }

    .contact-item {
        font-size: 1rem;
        gap: 0.8rem;
    }

    .line-contact {
        padding: 1.5rem;
    }

    .line-logo {
        width: 60px;
        height: 60px;
    }

    .line-logo i {
        font-size: 1.8rem;
    }

    .line-title {
        font-size: 1.4rem;
    }

    .line-description {
        font-size: 0.9rem;
    }

    .feature-item {
        font-size: 0.9rem;
    }

    .line-button {
        padding: 0.8rem 1.5rem;
        font-size: 0.9rem;
    }

    /* 会社概要 */
    .about-item h3 {
        font-size: 1.1rem;
    }

    .about-item p {
        font-size: 0.9rem;
    }

    /* フッター */
    .footer-info h3 {
        font-size: 1.5rem;
    }

    .footer-info p {
        font-size: 0.9rem;
    }

    .social-icon {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }

    .qr-placeholder {
        width: 100px;
        height: 100px;
        font-size: 1.5rem;
    }

    .qr-placeholder p {
        font-size: 0.7rem;
    }
}

/* 小さいモバイル (360px以下) */
@media (max-width: 360px) {
    /* PCデザインと同じカラー変数を維持 */
    :root {
        /* メインカラーパレット - 背景画像に合わせた非常に濃いテキスト色 */
        --primary-color: #f8b4d9;
        --secondary-color: #f4a6c8;
        --accent-color: #f8b4d9;
        --text-color: #000000;
        --light-text: #000000;
        --white: #ffffff;
        --light-gray: #f8f9fa;
        --marble-bg: linear-gradient(135deg, #ffffff 0%, #f8f9fa 50%, #f1f3f4 100%);
        --gold: #ffd700;
        --shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
        --transition-base: all 0.3s ease;
        --transition-nav: all 0.2s ease;
        --animation-delay: 0;
        --float-animation: float 6s ease-in-out infinite;
        --pulse-animation: gentlePulse 4s ease-in-out infinite;
        --glow-animation: softGlow 3s ease-in-out infinite;

        /* ヘッダー */
        --header-text-color: rgba(255, 255, 255, 0.98);
        --header-subtext-color: rgba(255, 255, 255, 0.8);
        --header-nav-color: #333333;
        --header-nav-hover-color: #555555;

        /* セクションタイトル */
        --section-title-color: #000000;
        --section-title-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        --section-title-underline: #f8b4d9;

        /* メニューセクション */
        --menu-heading-color: #000000;
        --menu-text-color: #000000;
        --menu-heading-weight: 600;
        --menu-text-weight: 400;

        /* 新着情報セクション */
        --news-date-color: #f8b4d9;
        --news-heading-color: #000000;
        --news-text-color: #000000;
        --news-heading-weight: 600;
        --news-text-weight: 400;

        /* 料金セクション */
        --price-heading-color: #000000;
        --price-text-color: #000000;
        --price-amount-color: #f8b4d9;
        --price-border-color: #f8b4d9;
        --price-heading-weight: 600;
        --price-text-weight: 400;

        /* 商品セクション */
        --product-heading-color: #000000;
        --product-text-color: #000000;
        --product-price-color: #f8b4d9;
        --product-heading-weight: 600;
        --product-text-weight: 400;

        /* 店舗情報セクション */
        --shop-heading-color: #000000;
        --shop-text-color: #000000;
        --shop-icon-color: #f8b4d9;
        --shop-heading-weight: 600;
        --shop-text-weight: 400;

        /* お問い合わせセクション */
        --contact-title-color: #000000;
        --contact-text-color: #000000;
        --contact-icon-color: #f8b4d9;
        --contact-title-weight: 600;
        --contact-text-weight: 400;

        /* LINEセクション */
        --line-title-color: #000000;
        --line-text-color: #000000;
        --line-title-weight: 600;
        --line-text-weight: 400;

        /* 会社概要セクション */
        --about-heading-color: #000000;
        --about-text-color: #000000;
        --about-border-color: #f8b4d9;
        --about-heading-weight: 600;
        --about-text-weight: 400;

        /* フッター */
        --footer-text-color: var(--white);
        --footer-opacity: 0.9;
    }

    .hero-title {
        font-size: 1.8rem;
    }

    .hero-subtitle {
        font-size: 0.9rem;
    }

    .hero-description {
        font-size: 0.8rem;
    }

    .section-title {
        font-size: 1.6rem;
    }

    .cta-button {
        padding: 0.7rem 1.5rem;
        font-size: 0.8rem;
    }

    /* グリッドアイテムの統一 */
    .menu-grid,
    .price-grid,
    .products-grid {
        gap: 1rem;
    }

    .menu-item,
    .price-item,
    .product-item {
        margin-bottom: 1rem;
    }
}

/* 横長モバイル (横画面) */
@media (max-height: 500px) and (orientation: landscape) {
    .hero {
        height: 100vh;
        padding: 2rem 0;
    }

    .hero-title {
        font-size: 2rem;
        margin-bottom: 0.5rem;
    }

    .hero-subtitle {
        font-size: 1rem;
        margin-bottom: 1rem;
    }

    .hero-description {
        font-size: 0.9rem;
        margin-bottom: 1.5rem;
    }

    .cta-button {
        padding: 0.6rem 1.5rem;
        font-size: 0.8rem;
    }
}

/* 高解像度ディスプレイ */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .placeholder-image {
        background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    }
}

/* 印刷スタイル */
@media print {
    .header,
    .hamburger,
    .cta-button,
    .social-icons,
    .footer {
        display: none;
    }

    .hero {
        height: auto;
        padding: 2rem 0;
    }

    .hero-title {
        color: #000;
        text-shadow: none;
    }

    .hero-subtitle,
    .hero-description {
        color: #333;
    }

    section {
        padding: 1rem 0;
        page-break-inside: avoid;
    }

    .section-title {
        color: #000;
    }

    .menu-item,
    .price-item,
    .product-item {
        box-shadow: none;
        border: 1px solid #ddd;
    }
}

/* アクセシビリティ対応 */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .hero-content,
    .fade-in,
    .float-animation,
    .gentle-pulse,
    .soft-glow {
        animation: none !important;
        transition: none !important;
    }
}

/* ダークモード対応 */
@media (prefers-color-scheme: dark) {
    :root {
        /* ダークモード用カラーパレット */
        --primary-color: #ecf0f1;
        --secondary-color: #bdc3c7;
        --accent-color: #ecf0f1;
        --text-color: #000000;
        --light-text: #000000;
        --white: #ffffff;
        --light-gray: #34495e;
        --marble-bg: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
        --shadow: 0 8px 25px rgba(0, 0, 0, 0.3);

        /* ヘッダー */
        --header-text-color: rgba(236, 240, 241, 0.98);
        --header-subtext-color: rgba(236, 240, 241, 0.8);
        --header-nav-color: #333333;
        --header-nav-hover-color: #555555;

        /* セクションタイトル */
        --section-title-color: #000000;
        --section-title-shadow: 0 2px 4px rgba(255, 255, 255, 0.9), 0 1px 2px rgba(0, 0, 0, 0.3);
        --section-title-underline: #ecf0f1;

        /* メニューセクション */
        --menu-heading-color: #000000;
        --menu-text-color: #000000;

        /* 新着情報セクション */
        --news-date-color: #ecf0f1;
        --news-heading-color: #000000;
        --news-text-color: #000000;

        /* 料金セクション */
        --price-heading-color: #000000;
        --price-text-color: #000000;
        --price-amount-color: #ecf0f1;
        --price-border-color: #ecf0f1;

        /* 商品セクション */
        --product-heading-color: #000000;
        --product-text-color: #000000;
        --product-price-color: #ecf0f1;

        /* 店舗情報セクション */
        --shop-heading-color: #000000;
        --shop-text-color: #000000;
        --shop-icon-color: #ecf0f1;

        /* お問い合わせセクション */
        --contact-title-color: #000000;
        --contact-text-color: #000000;
        --contact-icon-color: #ecf0f1;

        /* LINEセクション */
        --line-title-color: #000000;
        --line-text-color: #000000;

        /* 会社概要セクション */
        --about-heading-color: #000000;
        --about-text-color: #000000;
        --about-border-color: #ecf0f1;

        /* フッター */
        --footer-text-color: #ecf0f1;
    }

    body .header {
        background: linear-gradient(135deg, rgba(248, 180, 217, 0.7), rgba(244, 166, 200, 0.6)) !important;
    }

    .nav-menu {
        background-color: transparent !important;
    }

    .menu-item,
    .price-item,
    .product-item {
        background: transparent !important;
        color: var(--text-color);
    }

    .news-item:hover {
        background: transparent !important;
    }

    .line-contact {
        background: transparent !important;
    }

    .qr-code {
        background: transparent !important;
        color: var(--text-color);
    }
    
    .qr-image {
        width: 100px;
        height: 100px;
        border-radius: 6px;
        display: block;
    }
}

/* フォーカス表示の改善 */
@media (any-hover: hover) {
    .nav-menu a:focus,
    .cta-button:focus,
    .line-button:focus,
    .social-icon:focus {
        outline: 2px solid var(--accent-color);
        outline-offset: 2px;
    }
}

/* タッチデバイス対応 */
@media (hover: none) and (pointer: coarse) {
    .menu-item:hover,
    .price-item:hover,
    .product-item:hover,
    .line-button:hover,
    .social-icon:hover {
        transform: none;
    }

    .nav-menu a:hover::after {
        width: 0;
    }

    .social-item:hover .qr-code {
        opacity: 0;
        visibility: hidden;
    }
}