/* =========================================
           各セクションのタイトル
           ========================================= */
        .sectionTitle,
        .blog-section-title {
            text-align: center;
            font-size: 47px;
            font-weight: 500;
            margin-top: 30px;
            margin-bottom: 40px;
            font-family: 'Raleway', 'Noto Sans JP', sans-serif;
        }

        @media (max-width: 768px) {

            .sectionTitle,
            .blog-section-title {
                font-size: 30px;
                margin-top: 10px;
                margin-bottom: 10px;
            }
        }

        /* =========================================
           もっと見るボタン
           ========================================= */
        #more-button {
            background: #5e5e5e;
            color: #fff;
            border: none;
            padding: 10px 20px;
            font-size: 14px;
            border-radius: 50px;
            cursor: pointer;
            font-weight: bold;
        }

        @media(max-width: 768px) {
            #more-button {
                padding: 7px 15px;
                font-size: 10px;
            }
        }

        #more-button:hover {
            background-color: #444;
        }

        /* =========================================
           ブログページ
           ========================================= */
        .main #about.blogDetail>.blog_inner {
            padding: 0 !important;
            border-bottom: none !important;
        }

        .main #about>.blog_inner {
            padding: 0 0 40px 0 !important;
            margin-bottom: 30px;
        }

        .main #about .paginate-wrp {
            display: none;
        }

        .blogListMain .blog_contents {
            height: 60px !important;
        }

        .main #about .blog_head_image img,
        .main #about .blog_contents .blog_body img {
            border-radius: 15px;
        }

        .main #about>.blog_inner .blog_contents .read_more {
            text-align: right;
        }

        .main #about .read_more a {
            color: #676767 !important;
            padding-right: 20px;
        }

        .main #about.blogDetail a:hover,
        .main #about .read_more a:hover {
            opacity: 0.7;
        }

        @media (max-width: 768px) {
            .blogListMain .blog_contents {
                height: 100px important;
            }
        }

        .blogListMain .text {
            padding: 10px !important;
        }

        .main #about.blogDetail .social {
            display: block;
            font-size: 13px;
        }

        .main #about.blogDetail .social img {
            opacity: 0.8;
            height: 20px;
            width: 20px;
        }

        .blog_contents p span {
            font-size: 13px !important;
            line-height: 1.6em !important;
            font-family: 'Noto Sans JP', sans-serif !important;
        }

        @media (max-width: 768px) {
            .main #about .read_more a {
                font-size: 9px !important;
            }

            .blogListMain .text {
                font-size: 11px !important;
            }

            .main #about.blogListMain .blog_publish {
                margin-bottom: 15px !important;
            }

            .main #about.blogDetail .social {
                font-size: 12px;
            }
        }

        /* =========================================
           ブログセクション
           ========================================= */
        .blog-section {
            margin: 60px auto;
            padding: 0 15px;
        }

        /* 各セクションのタイトルでまとめて定義
        .blog-section-title {} */

        .blog-list {
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

        .blog-item {
            background: #fff;
            border-radius: 12px;
            overflow: hidden;
            transition: transform 0.3s ease;
            display: flex;
            align-items: center;
            padding: 20px;
            box-shadow: 0 2px 0 rgba(0, 0, 0, 0.04);
        }

        .blog-item:hover {
            transform: translateY(-2px);
        }

        .blog-item a {
            display: flex;
            align-items: center;
            text-decoration: none;
            color: inherit;
            width: 100%;
            gap: 20px;
        }

        .blog-image {
            width: 200px;
            height: 130px;
            overflow: hidden;
            border-radius: 8px;
            flex-shrink: 0;
        }

        .blog-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.3s ease;
        }

        .blog-item:hover .blog-image img {
            transform: scale(1.05);
        }

        .blog-content {
            flex: 1;
            display: flex;
            flex-direction: column;
            gap: 6px;
        }

        .blog-title {
            font-size: 14px;
            font-weight: 600;
            margin: 0;
            line-height: 1.4;
            color: #333;
            font-family: 'Noto Sans JP', sans-serif;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            overflow: hidden;
        }

        .blog-date {
            font-size: 11px;
            color: #888;
            margin: 0;
        }

        .blog-excerpt {
            display: none;
        }

        .blog-more {
            text-align: right;
            margin-top: 20px;
            padding: 0 15px;
        }

        .blog-more-btn {
            text-decoration: none;
            font-size: 14px;
            font-weight: normal;
            transition: color 0.3s ease;
            display: inline-block;
        }

        .blog-more-btn:hover {
            text-decoration: underline;
            opacity: 0.7;
        }

        @media (max-width: 768px) {
            .blog-section {
                margin: 40px auto;
                padding: 0 12px;
            }

            /* 各セクションのタイトルでまとめて定義
            .blog-section-title {} */

            .blog-item {
                padding: 15px;
            }

            .blog-item a {
                gap: 15px;
            }

            .blog-image {
                width: 120px;
                height: 80px;
            }

            .blog-title {
                font-size: 12px;
            }

            .blog-date {
                font-size: 10px;
            }

            .blog-more-btn {
                font-size: 12px;
            }
        }

        /* =========================================
           ヘッダー
           ========================================= */
        .header-content::before {
            content: '';
            position: absolute;
            bottom: -250px;
            left: 0;
            width: 100%;
            height: 380px;
            filter: drop-shadow(0 2px 0 rgba(0, 0, 0, 0.04));
            pointer-events: none;
            z-index: 0;
            background:
                radial-gradient(circle at 0% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 6.25% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 12.5% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 18.75% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 25% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 31.25% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 37.5% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 43.75% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 50% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 56.25% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 62.5% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 68.75% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 75% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 81.25% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 87.5% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 93.75% 0%, white 150px, transparent 151px),
                radial-gradient(circle at 100% 0%, white 150px, transparent 151px);
        }

        @media (min-width: 1024px) and (max-width: 1399px) {
            .header-content::before {
                height: 370px;
                background:
                    radial-gradient(circle at 0% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 12.5% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 25% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 37.5% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 50% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 62.5% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 75% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 87.5% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 100% 0%, white 150px, transparent 151px);
            }
        }

        @media (min-width: 630px) and (max-width: 1023px) {
            .header-content::before {
                height: 370px;
                background:
                    radial-gradient(circle at 0% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 16.6% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 33.3% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 50% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 66.6% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 83.3% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 100% 0%, white 150px, transparent 151px);
            }
        }

        @media (min-width: 520px) and (max-width: 635px) {
            .header-content::before {
                height: 380px;
                background:
                    radial-gradient(circle at 10% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 30% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 50% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 70% 0%, white 150px, transparent 151px),
                    radial-gradient(circle at 90% 0%, white 150px, transparent 151px);
            }
        }

        @media (max-width: 519px) {
            .header-content::before {
                height: 317px;
                background:
                    radial-gradient(circle at 10% 0%, white 80px, transparent 81px),
                    radial-gradient(circle at 30% 0%, white 80px, transparent 81px),
                    radial-gradient(circle at 50% 0%, white 80px, transparent 81px),
                    radial-gradient(circle at 70% 0%, white 80px, transparent 81px),
                    radial-gradient(circle at 90% 0%, white 80px, transparent 81px);
            }
        }

        /* =========================================
           ハンバーガーメニュー
           ========================================= */
        #mobileMenuToggle {
            display: none;
            position: fixed;
            top: calc(var(--information-banner-height, 0px) + 15px);
            right: auto;
            left: 20px;
            z-index: 2024;
            width: 21px;
            height: 21px;
            cursor: pointer;
        }

        .menu-line {
            width: 24px;
            height: 4px;
            border-radius: 3px;
            transition: all 0.3s ease;
            margin-bottom: 4px;
            position: relative;
        }

        #mobileMenuToggle.open .menu-line:nth-child(1) {
            top: 20px;
            right: 20px;
            transform: rotate(45deg) translate(5px, 5px);
        }

        #mobileMenuToggle.open .menu-line:nth-child(2) {
            opacity: 0;
        }

        #mobileMenuToggle.open .menu-line:nth-child(3) {
            top: 20px;
            right: 20px;
            transform: rotate(-45deg) translate(7px, -6px);
        }

        #mobileSidebar.open {
            left: 0;
            display: block;

        }

        .mobile-only {
            display: none !important;
        }

        @media(min-width: 1700px) {
            #mobileHeader .header-logo {
                margin-left: 40px;
            }

            .mobile-only,
            #mobileSidebar {
                display: none !important;
            }

            body.shop #shopHeader nav {
                display: block;
                margin: 0 7px;
            }
        }

        @media(max-width: 1699px) {
            #mobileHeader .header-logo {
                margin-left: 0px;
            }

            .mobile-only {
                display: block !important;
            }


            body.shop #shopHeader>nav {
                display: none;
            }


            #mobileSidebar {
                display: block;
            }


            #mobileSidebar nav {
                margin: 0;
                border: none;
                display: block;
            }

            #mobileSidebar nav ul {
                flex-direction: column;
                align-items: flex-start;
                padding: 0 15px;
            }

            #mobileSidebar nav ul li {
                width: 100%;
                height: auto;
                text-align: left;
                border-bottom: 1px solid #eee;
            }

            #mobileSidebar nav ul li a {
                padding: 15px 0;
                display: block;
            }

            #mobileSidebar nav ul li:hover {
                border-bottom: 1px solid #eee;
                height: auto;
            }

            #mobileSidebar nav ul li.itemSearch {
                padding: 15px 0;
            }

            #mobileSidebar nav ul li.itemSearch form {
                padding: 0;
                position: relative;
                height: 40px;
            }
        }

        /* =========================================
           購入に関する注意点
           ========================================= */
        .purchase-notice-section-wrapper {
            border-top: 1px solid #e4dace;
        }

        .purchase-notice-header {
            padding: 20px;
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            transition: background-color 0.3s ease;
        }

        /* レビューセクションがない場合のみ、購入注意事項に追加 */
        .purchase-notice-section-wrapper:not(:has(~ .review-section-wrapper)) .purchase-notice-header,
        .purchase-notice-section-wrapper:last-child .purchase-notice-header {
            border-bottom: 1px solid #e4dace;
        }

        .purchase-notice-title {
            font-size: 13px;
            font-weight: 500;
            color: #676767;
            margin: 0;
        }

        .purchase-notice-toggle-icon {
            font-size: 12px;
            color: #676767;
            opacity: 0.8;
            transition: all 0.3s ease;
            user-select: none;
        }

        .purchase-notice-content {
            display: none;
            padding: 20px;
            font-size: 12px;
            line-height: 1.6;
            border-top: 1px solid #e4dace;
        }

        .purchase-notice-content.expanded {
            display: block;
        }

        .purchase-notice-content h3 {
            font-size: 14px;
            font-weight: 500;
            margin: 20px 0 10px;
            color: #676767;
        }

        .purchase-notice-content h3:first-child {
            margin-top: 0;
        }

        .purchase-notice-content ul {
            margin: 10px 0;
            padding-left: 0;
        }

        .purchase-notice-content li {
            list-style: none;
            margin: 8px 0;
            padding-left: 15px;
            position: relative;
            color: #676767;
        }

        .purchase-notice-content li::before {
            content: "•";
            color: #676767;
            font-weight: bold;
            position: absolute;
            left: 0;
        }

        @media (max-width: 768px) {
            .purchase-notice-header {
                padding: 15px;
            }

            .purchase-notice-title {
                font-size: 13px;
            }

            .purchase-notice-toggle-icon {
                font-size: 12px;
            }

            .purchase-notice-content {
                padding: 15px;
                font-size: 11px;
            }

            .purchase-notice-content h3 {
                font-size: 13px;
            }
        }

        /* =========================================
           ショップの評価
           ========================================= */
        .review-header {
            padding: 20px;
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-bottom: 1px solid #e4dace;
            border-top: 1px solid #e4dace;
            transition: background-color 0.3s ease;
        }

        .review-title {
            font-size: 13px;
            font-weight: 500;
            color: #676767;
            margin: 0;
        }

        .review-toggle-icon {
            font-size: 12px;
            color: #676767;
            opacity: 0.8;
            transition: all 0.3s ease;
            user-select: none;
        }

        .review-content {
            display: none;
            padding: 0;
        }

        .review01__reply {
            background-color: #fbf9f6 !important;
        }

        .review-content.expanded {
            display: block;
        }

        .review01__title {
            display: none;
        }

        .review01__tabWrap {
            border-top: 0px !important;
        }

        .review01__list {
            border-bottom: 1px solid #ccc !important;
        }

        .review01__listChild {
            padding: 20px !important;
        }

        @media (max-width: 768px) {
            .review-header {
                padding: 15px;
            }

            .review-title {
                font-size: 13px;
            }

            .review-toggle-icon {
                font-size: 12px;
            }
        }