/* トップページ（Views/Home/Index.aspx）専用 */
            /* force-reload: 2026-08-06 topic-band-vcenter */
            /* ヒーローセクション — デザイン統一指針 */
            .hero-section {
                width: 600px;
                margin: 0 0 var(--space-2) 0;
                padding: 0;
                box-sizing: border-box;
                position: relative;
                overflow: hidden;
                border: 1px solid #e5e9f0;
                border-radius: var(--radius-lg);
                background:
                    radial-gradient(ellipse 85% 70% at 8% 0%, #ffffff 0%, transparent 50%),
                    radial-gradient(ellipse 60% 55% at 95% 100%, rgba(255, 196, 140, 0.28) 0%, transparent 55%),
                    linear-gradient(160deg, #f7f9fc 0%, #eef3fa 40%, #f8f6f3 100%);
                box-shadow: 0 2px 10px rgba(40, 60, 100, 0.06);
                color: #334155;
            }
            .hero-section:before {
                content: "";
                position: absolute;
                top: 0; right: 0; bottom: 0; left: 0;
                background-image:
                    radial-gradient(circle at 16% 28%, rgba(255,255,255,.9) 0 2px, transparent 3px),
                    radial-gradient(circle at 82% 20%, rgba(255,255,255,.65) 0 1.5px, transparent 2.5px),
                    radial-gradient(circle at 48% 76%, rgba(255,255,255,.75) 0 2px, transparent 3px);
                pointer-events: none;
            }
            @keyframes hero-rise {
                from { opacity: 0; transform: translateY(6px); }
                to { opacity: 1; transform: translateY(0); }
            }
            .hero-section .hero-inner {
                position: relative;
                z-index: 1;
                padding: var(--space-4) 18px var(--space-4);
                text-align: center;
                animation: hero-rise 0.4s ease-out both;
            }
            .hero-section .hero-title {
                margin: 0 0 var(--space-2);
                padding: 0;
                font-family: var(--font-sans);
                font-weight: var(--fw-bold);
                color: #1a2333;
                -webkit-font-smoothing: antialiased;
            }
            .hero-section .hero-line1 {
                display: block;
                font-size: var(--text-2xl);
                line-height: var(--lh-snug);
                letter-spacing: 0.02em;
                margin-bottom: 2px;
                color: #1f4f9a;
            }
            .hero-section .hero-line2 {
                display: block;
                font-size: var(--text-2xl);
                line-height: var(--lh-snug);
                letter-spacing: 0.01em;
                color: #1a2333;
            }
            .hero-section .hero-proof {
                margin: 0 auto var(--space-2);
                max-width: 540px;
                font-size: var(--text-md);
                line-height: var(--lh-normal);
                font-weight: var(--fw-bold);
                color: #1f4f9a;
            }
            .hero-section .hero-sub {
                margin: 0 auto;
                max-width: 540px;
                font-size: var(--text-md);
                line-height: var(--lh-normal);
                font-weight: var(--fw-bold);
                color: #333b4a;
            }
            .hero-section .hero-ctas {
                margin-bottom: 10px;
            }
            .hero-section .hero-ctas a {
                display: inline-block;
                text-decoration: none;
                font-family: var(--font-sans);
                font-weight: var(--fw-bold);
                font-size: var(--text-lg);
                padding: 10px 22px;
                border-radius: var(--radius-md);
                margin: 0 5px 4px;
                transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
                vertical-align: middle;
            }
            .hero-section .btn-primary {
                background: #f07812;
                color: #fff;
                border: 2px solid #f07812;
                border-radius: var(--radius-pill);
                box-shadow: 0 2px 8px rgba(240, 120, 18, 0.3);
            }
            .hero-section .btn-primary:hover {
                background: #de6a08;
                border-color: #de6a08;
                color: #fff;
            }
            .hero-section .btn-secondary {
                background: #fff;
                color: #1f4f9a;
                border: 2px solid #1f4f9a;
            }
            .hero-section .btn-secondary:hover {
                background: #eef4fb;
                color: #173d7a;
                border-color: #173d7a;
            }
            .hero-section .hero-badges {
                margin: 0;
                padding: 0;
                list-style: none;
            }
            .hero-section .hero-badges li {
                display: inline-block;
                background: #fff;
                border: 1px solid #cfd7e6;
                border-radius: var(--radius-pill);
                padding: var(--space-1) var(--space-3) var(--space-1) 7px;
                font-size: var(--text-sm);
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                color: #2a3a52;
                margin: 0 5px 4px;
                vertical-align: middle;
            }
            .hero-section .badge-icon {
                display: inline-block;
                width: 18px;
                height: 18px;
                margin-right: 6px;
                vertical-align: middle;
                line-height: 0;
            }
            .hero-section .badge-icon svg {
                width: 18px;
                height: 18px;
                vertical-align: middle;
            }

            /* ヒーロー直下：新着3台（T1・コンパクト） */
            .new-arrivals {
                width: 600px;
                margin: 0 0 var(--space-3) 0;
                padding: 0;
                box-sizing: border-box;
            }
            .new-arrivals-head {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                justify-content: space-between;
                gap: var(--space-2);
                margin: 0 0 var(--space-2) 0;
                padding: 0 2px 0 8px;
                border-left: 3px solid #1f4f9a;
            }
            .new-arrivals-heading {
                margin: 0;
                padding: 0;
                font-size: var(--text-xl);
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                color: #1f4f9a;
                letter-spacing: 0.02em;
                line-height: var(--lh-snug);
            }
            a.new-arrivals-more,
            a.new-arrivals-more:link,
            a.new-arrivals-more:visited {
                font-size: var(--text-sm);
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                color: #1f4f9a !important;
                text-decoration: none !important;
                white-space: nowrap;
            }
            a.new-arrivals-more:hover {
                color: #173d7a !important;
                text-decoration: underline !important;
                background: transparent !important;
            }
            .new-arrivals-grid {
                display: -ms-grid;
                display: grid;
                -ms-grid-columns: 1fr 8px 1fr 8px 1fr;
                grid-template-columns: 1fr 1fr 1fr;
                gap: var(--space-2);
            }
            .new-arrivals-rail {
                position: relative;
            }
            .new-arrivals-viewport {
                overflow: hidden;
                width: 100%;
            }
            .new-arrivals-track {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-transition: -webkit-transform 0.35s ease;
                transition: transform 0.35s ease;
                will-change: transform;
            }
            .new-arrivals-page {
                -webkit-box-flex: 0;
                -ms-flex: 0 0 100%;
                flex: 0 0 100%;
                width: 100%;
                max-width: 100%;
                box-sizing: border-box;
                display: -ms-grid;
                display: grid;
                -ms-grid-columns: 1fr 8px 1fr 8px 1fr;
                grid-template-columns: 1fr 1fr 1fr;
                gap: var(--space-2);
                padding: 0 2px;
            }
            button.new-arrivals-nav {
                position: absolute;
                top: 50%;
                z-index: 2;
                width: 36px;
                height: 36px;
                margin-top: -18px;
                padding: 0;
                border: 0;
                border-radius: 50%;
                background: rgba(31, 79, 154, 0.42);
                color: #fff;
                font-size: 24px;
                font-weight: bold;
                line-height: 34px;
                text-align: center;
                cursor: pointer;
                -webkit-appearance: none;
                appearance: none;
                box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
            }
            button.new-arrivals-nav--prev {
                left: 2px;
            }
            button.new-arrivals-nav--next {
                right: 2px;
            }
            button.new-arrivals-nav:hover {
                background: rgba(31, 79, 154, 0.62);
            }
            button.new-arrivals-nav.is-disabled,
            button.new-arrivals-nav:disabled {
                opacity: 0.28;
                pointer-events: none;
                cursor: default;
            }
            a.new-card {
                display: block;
                min-width: 0;
                padding: var(--space-2) !important;
                border: 1px solid #c5d0e0;
                border-radius: var(--radius-md);
                background: #fff;
                text-decoration: none !important;
                color: #1a2333 !important;
                font-family: var(--font-sans);
                cursor: pointer;
                outline: none;
                position: relative;
                -webkit-transition: border-color 0.15s ease, background 0.15s ease;
                transition: border-color 0.15s ease, background 0.15s ease;
            }
            a.new-card:link,
            a.new-card:visited,
            a.new-card:active {
                color: #1a2333 !important;
                text-decoration: none !important;
                background: #fff;
            }
            a.new-card:hover,
            a.new-card:focus {
                border-color: #1f4f9a !important;
                background: #f8fbff !important;
                color: #1a2333 !important;
                text-decoration: none !important;
            }
            a.new-card:hover .new-card-name,
            a.new-card:focus .new-card-name {
                color: #1f4f9a !important;
                background: transparent !important;
            }
            .new-card-img {
                display: block;
                width: 100%;
                height: auto;
                object-fit: contain;
                border-radius: var(--radius-sm);
                background: #f5f7fb;
            }
            .new-card-name {
                display: block;
                margin: 6px 0 2px;
                font-size: var(--text-sm);
                font-weight: var(--fw-bold);
                line-height: var(--lh-snug);
                color: #1a2333;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }
            .card-name-full {
                position: absolute;
                width: 1px;
                height: 1px;
                padding: 0;
                margin: -1px;
                overflow: hidden;
                clip: rect(0, 0, 0, 0);
                border: 0;
            }
            .new-card-price {
                display: block;
                font-size: var(--text-md);
                font-weight: var(--fw-bold);
                color: #c85a10;
            }
            .new-card-price-ex {
                display: block;
                font-size: var(--text-xs);
                font-weight: var(--fw-normal);
                color: #666;
                line-height: 1.3;
            }
            .new-card-os {
                display: inline-block;
                margin: 2px 0 0;
                padding: 2px 6px;
                font-size: var(--text-xs);
                font-weight: var(--fw-bold);
                line-height: var(--lh-tight);
                color: #1f4f9a !important;
                background: #eef3fa;
                border: 1px solid #c5d0e0;
                border-radius: var(--radius-sm);
            }
            /* T4: 用途から探すを独立セクション化（新着の直下） */
            .why-used-quick-section {
                width: 600px;
                margin: 0 0 var(--space-3) 0;
                padding: var(--space-3);
                box-sizing: border-box;
                background: #fff;
                border: 1px solid #c5d0e0;
                border-radius: var(--radius-md);
            }
            /* 中古PCメリット（ヒーロー直後） */
            .why-used-section {
                width: 600px;
                margin: 0 0 var(--space-2) 0;
                padding: var(--space-3);
                box-sizing: border-box;
                background: #fff;
                border: 1px solid #c5d0e0;
                border-radius: var(--radius-md);
            }
            .why-used-section .why-used-intro {
                margin: 0 0 var(--space-3) 0;
                padding: 0 0 0 10px;
                border-left: 3px solid #1f4f9a;
            }
            .why-used-section .why-used-heading {
                margin: 0 0 var(--space-1) 0;
                padding: 0;
                font-size: var(--text-xl);
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                color: #1f4f9a;
                letter-spacing: 0.02em;
                line-height: var(--lh-snug);
            }
            .why-used-section .why-used-lead {
                margin: 0;
                padding: 0;
                font-size: var(--text-md);
                font-weight: var(--fw-regular);
                font-family: var(--font-sans);
                color: #333;
                line-height: var(--lh-normal);
            }
            .google-review-badge {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                margin: 10px 0 0 0;
                padding: 4px 12px 4px 10px;
                border: 1px solid #e0c060;
                border-radius: 999px;
                background: #fffaf0;
                text-decoration: none !important;
                font-family: var(--font-sans);
            }
            .google-review-badge:hover {
                background: #fff3dc;
            }
            .google-review-badge:hover .grb-score {
                color: #333 !important;
            }
            .google-review-badge:hover .grb-count {
                color: #666 !important;
            }
            .google-review-badge:hover .grb-star {
                color: #f0a500 !important;
            }
            .google-review-badge .grb-star {
                color: #f0a500;
                font-size: 15px;
                line-height: 1;
            }
            .google-review-badge .grb-score {
                font-size: 14px;
                font-weight: var(--fw-bold);
                color: #333;
            }
            .google-review-badge .grb-count {
                font-size: 12px;
                color: #666;
            }
            .why-used-grid {
                display: flex;
                gap: var(--space-2);
                width: 100%;
                margin: 0 0 var(--space-3) 0;
            }
            .why-used-section .why-card {
                flex: 1 1 0;
                min-width: 0;
                display: flex;
                flex-direction: column;
                padding: var(--space-3);
                box-sizing: border-box;
                background: #f7f9fc;
                border: 1px solid #c5d0e0;
                border-radius: var(--radius-md);
            }
            .why-used-section .why-card-head {
                display: flex;
                align-items: center;
                gap: var(--space-2);
                margin: 0 0 var(--space-2) 0;
            }
            .why-used-section .why-card-num {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 22px;
                height: 22px;
                flex-shrink: 0;
                border-radius: 50%;
                background: #5b8fd4;
                color: #fff;
                font-size: var(--text-sm);
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                line-height: 1;
            }
            .why-used-section .why-card-label {
                margin: 0;
                padding: 0;
                font-size: var(--text-lg);
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                color: #1f4f9a;
                line-height: var(--lh-tight);
            }
            .why-used-section .why-card-desc {
                margin: 0;
                padding: 0;
                font-size: var(--text-md);
                font-weight: var(--fw-regular);
                font-family: var(--font-sans);
                color: #333;
                line-height: var(--lh-normal);
            }
            .why-used-section .why-used-note {
                margin: 0 0 var(--space-3) 0;
                padding: 0;
                font-size: var(--text-md);
                font-weight: var(--fw-regular);
                font-family: var(--font-sans);
                color: #1a2333;
                line-height: var(--lh-normal);
                text-align: center;
            }
            .why-used-section .why-used-ctas {
                text-align: center;
            }
            .why-used-section .why-used-ctas a {
                display: inline-block;
                text-decoration: none;
                font-family: var(--font-sans);
                font-weight: var(--fw-bold);
                font-size: var(--text-sm);
                padding: 6px 12px;
                border-radius: var(--radius-md);
                margin: 0 4px 4px;
                transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
                vertical-align: middle;
            }
            .why-used-section .why-used-ctas .btn-primary {
                background: #f07812;
                color: #fff;
                border: 1px solid #f07812;
            }
            .why-used-section .why-used-ctas .btn-primary:hover {
                background: #de6a08;
                border-color: #de6a08;
                color: #fff;
            }
            .why-used-section .why-used-ctas .btn-secondary {
                background: #fff;
                color: #1f4f9a;
                border: 1px solid #1f4f9a;
            }
            .why-used-section .why-used-ctas .btn-secondary:hover {
                background: #f8fbff;
                color: #173d7a;
                border-color: #173d7a;
            }
            /* T3/T4: 用途は1行4枚・独立セクションの余白は親カードで確保済み */
            .why-used-quick-section .why-used-quick {
                margin: 0;
                padding: 0;
                background: transparent;
                border: none;
                box-sizing: border-box;
            }
            .why-used-quick-section .why-used-quick-label {
                display: block;
                margin: 0 0 6px;
                padding: 0 0 0 8px;
                border-left: 3px solid #1f4f9a;
                font-size: var(--text-md);
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                color: #1f4f9a;
                line-height: var(--lh-snug);
            }
            .why-used-tiles {
                display: -ms-grid;
                display: grid;
                -ms-grid-columns: 1fr 8px 1fr 8px 1fr 8px 1fr;
                grid-template-columns: 1fr 1fr 1fr 1fr;
                gap: var(--space-2);
            }
            a.why-used-tile {
                display: block;
                min-width: 0;
                padding: 8px 10px !important;
                border: 1px solid #c5d0e0;
                border-left: 3px solid #1f4f9a;
                border-radius: var(--radius-md);
                background: #fff;
                text-decoration: none !important;
                color: #1a2333 !important;
                font-family: var(--font-sans);
                cursor: pointer;
                outline: none;
                -webkit-transition: border-color 0.15s ease, background 0.15s ease;
                transition: border-color 0.15s ease, background 0.15s ease;
            }
            a.why-used-tile:link,
            a.why-used-tile:visited,
            a.why-used-tile:active {
                color: #1a2333 !important;
                text-decoration: none !important;
                background: #fff;
            }
            a.why-used-tile:hover,
            a.why-used-tile:focus {
                border-color: #1f4f9a !important;
                border-left-color: #1f4f9a !important;
                background: #f8fbff !important;
                color: #1a2333 !important;
                text-decoration: none !important;
            }
            .why-used-tile-name {
                display: block;
                font-size: var(--text-md);
                font-weight: var(--fw-bold);
                line-height: var(--lh-tight);
                color: #1f4f9a;
            }
            a.why-used-tile:hover .why-used-tile-name,
            a.why-used-tile:focus .why-used-tile-name {
                color: #173d7a !important;
                background: transparent !important;
            }
            .why-used-tile-sub {
                display: block;
                margin-top: 2px;
                font-size: var(--text-sm);
                font-weight: var(--fw-regular);
                line-height: var(--lh-tight);
                color: #333;
            }

            /* サービス一覧（3枚）— 2.2 案A・デザイン統一指針 §インタラクション */
            .services-section {
                width: 600px;
                margin: 0 0 var(--space-2) 0;
                padding: var(--space-3);
                box-sizing: border-box;
                background: #f7f9fc;
                border: 1px solid #c5d0e0;
                border-radius: var(--radius-md);
            }
            .services-section .services-intro {
                margin: 0 0 var(--space-3) 0;
                padding: 0 0 0 10px;
                border-left: 3px solid #1f4f9a;
            }
            .services-section .services-heading {
                margin: 0 0 var(--space-1) 0;
                padding: 0;
                font-size: var(--text-xl);
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                color: #1f4f9a;
                letter-spacing: 0.02em;
                line-height: var(--lh-snug);
            }
            .services-section .services-lead {
                margin: 0;
                padding: 0;
                font-size: var(--text-md);
                font-weight: var(--fw-regular);
                font-family: var(--font-sans);
                color: #444;
                line-height: var(--lh-normal);
            }
            .services-grid {
                display: flex;
                gap: var(--space-2);
                width: 100%;
            }
            a.service-card,
            .service-card--dual {
                flex: 1 1 0;
                min-width: 0;
                display: flex;
                flex-direction: column;
                padding: var(--space-3);
                box-sizing: border-box;
                color: inherit !important;
                background: var(--surface-card);
                border: 1px solid var(--border-card);
                border-radius: var(--radius-md);
                transition: background var(--transition-ui), border-color var(--transition-ui), box-shadow var(--transition-ui);
            }
            a.service-card {
                text-decoration: none !important;
            }
            a.service-card:link,
            a.service-card:visited {
                color: inherit !important;
                text-decoration: none !important;
            }
            a.service-card:hover {
                background: var(--surface-card-hover) !important;
                border-color: var(--border-card-hover) !important;
                box-shadow: var(--shadow-card-hover);
                color: inherit !important;
                text-decoration: none !important;
            }
            a.service-card * {
                pointer-events: none;
            }
            a.service-card :hover,
            a.service-card:hover * {
                text-decoration: none !important;
            }
            a.service-card:hover .service-card-title {
                color: #1f4f9a !important;
            }
            a.service-card:hover .service-card-desc {
                color: #444 !important;
            }
            a.service-card:hover .service-card-arrow {
                color: #c85a10 !important;
            }
            .service-card .service-card-head {
                display: flex;
                align-items: center;
                gap: var(--space-2);
                margin: 0 0 var(--space-2) 0;
            }
            .service-card .service-card-icon {
                width: 22px;
                height: 22px;
                color: #1f4f9a;
                flex-shrink: 0;
                line-height: 0;
            }
            .service-card .service-card-icon svg {
                width: 22px;
                height: 22px;
                display: block;
            }
            .service-card .service-card-title {
                font-size: var(--text-lg);
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                color: #1f4f9a;
                line-height: var(--lh-snug);
                margin: 0;
            }
            .service-card .service-card-desc {
                display: block;
                font-size: var(--text-md);
                font-weight: var(--fw-regular);
                font-family: var(--font-sans);
                color: #444;
                line-height: var(--lh-normal);
                margin: 0 0 var(--space-2) 0;
            }
            .service-card .service-card-arrow {
                margin-top: auto;
                font-size: var(--text-sm);
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                color: #c85a10;
                text-align: right;
                line-height: var(--lh-tight);
            }
            /* 3枚目・2段CTA（試行） */
            .service-card--dual .service-card-ctas {
                display: flex;
                flex-direction: column;
                gap: 6px;
                margin-top: auto;
            }
            .service-card--dual .service-card-cta {
                display: block;
                box-sizing: border-box;
                padding: 5px 6px;
                text-align: center;
                text-decoration: none !important;
                font-size: 12px;
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                line-height: 1.3;
                border-radius: var(--radius-md);
                transition: background var(--transition-ui), border-color var(--transition-ui), color var(--transition-ui);
            }
            .service-card--dual .service-card-cta-primary {
                background: #fff;
                color: #1f4f9a !important;
                border: 1px solid #1f4f9a;
            }
            .service-card--dual .service-card-cta-primary:hover {
                background: #f8fbff;
                border-color: #1f4f9a;
                color: #1f4f9a !important;
                text-decoration: none !important;
            }
            .service-card--dual .service-card-cta-secondary {
                background: #fff;
                color: #1f4f9a !important;
                border: 1px solid #1f4f9a;
            }
            .service-card--dual .service-card-cta-secondary:hover {
                background: #f8fbff;
                color: #173d7a !important;
                border-color: #173d7a;
                text-decoration: none !important;
            }

            /* バナーセクション：特徴4枠（2x2）①画像 ②タイトル ③詳細）
               色寄せ 2026-08-03（紺トーン）。戻すときは下の --fb-* を「旧」値に差し替え。
               旧: bg #f3f4f6 / border #d8dce3 / title #111 / line #222 / icon #555 / icon-fill #f3f4f6 */
            .feature-banner-grid {
                --fb-bg: #f7f9fc;
                --fb-border: #c5d0e0;
                --fb-title: #1f4f9a;
                --fb-line: #333b4a;
                --fb-icon: #1f4f9a;
                --fb-icon-fill: #eef3fa;
                width: 600px;
                border-collapse: separate;
                border-spacing: 3px;
                margin: 0 0 4px 0;
            }
            .feature-banner-grid td {
                width: 296px;
                padding: 0;
                vertical-align: top;
            }
            .feature-banner {
                width: 100%;
                box-sizing: border-box;
                padding: 7px 9px;
                background: var(--fb-bg);
                border: 1px solid var(--fb-border);
                border-radius: var(--radius-md);
                color: var(--fb-line);
                display: block;
            }
            .feature-banner .fb-inner {
                display: flex;
                align-items: flex-start;
                width: 100%;
            }
            .feature-banner .fb-icon {
                flex: 0 0 30px;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-top: 1px;
                padding-right: 5px;
                color: var(--fb-icon);
            }
            .feature-banner .fb-icon svg {
                width: 28px;
                height: 28px;
                display: block;
            }
            .feature-banner .fb-body {
                flex: 1;
                min-width: 0;
                display: flex;
                flex-direction: column;
                gap: 2px;
            }
            .feature-banner .fb-title {
                display: block;
                font-size: var(--text-lg);
                font-weight: var(--fw-bold);
                color: var(--fb-title);
                line-height: var(--lh-tight);
                margin: 0;
                font-family: var(--font-sans);
                -webkit-font-smoothing: antialiased;
                word-break: keep-all;
                overflow-wrap: normal;
            }
            .feature-banner .fb-sub {
                display: flex;
                flex-direction: column;
                gap: 2px;
            }
            .feature-banner .fb-line {
                display: block;
                font-size: var(--text-md);
                color: var(--fb-line);
                line-height: var(--lh-ui);
                font-weight: var(--fw-regular);
                font-family: var(--font-sans);
                -webkit-font-smoothing: antialiased;
                word-break: keep-all;
                overflow-wrap: normal;
            }
            /* ライトサイドバナー：本日発送（正午まで・HTML／紺＋橙） */
            a.ship-today {
                display: block;
                width: 206px;
                box-sizing: border-box;
                margin: 0 0 6px 0;
                border: 1px solid #1f4f9a;
                border-radius: var(--radius-md);
                overflow: hidden;
                background: #1f4f9a;
                text-decoration: none;
                color: #fff;
                text-align: center;
                font-family: var(--font-sans);
            }
            a.ship-today:hover {
                background: #173d7a;
                color: #fff;
                text-decoration: none;
            }
            a.ship-today:hover .ship-today-main {
                background: #fff !important;
                color: #de6a08;
            }
            a.ship-today:hover .ship-today-cond,
            a.ship-today:hover .ship-today-sub {
                color: #fff !important;
            }
            .ship-today-cond {
                display: block;
                padding: 6px 8px 4px;
                font-size: var(--text-sm);
                font-weight: var(--fw-bold);
                line-height: var(--lh-ui);
                color: #fff;
            }
            .ship-today-main {
                display: block;
                background: #fff;
                margin: 0;
                padding: 8px 8px 7px;
                font-size: var(--text-xl);
                font-weight: var(--fw-bold);
                line-height: var(--lh-tight);
                letter-spacing: 0.04em;
                color: #f07812;
            }
            .ship-today-sub {
                display: block;
                padding: 5px 8px 7px;
                font-size: var(--text-sm);
                font-weight: var(--fw-bold);
                line-height: var(--lh-ui);
                color: #fff;
            }
            /* ライトサイドバナー：お支払方法（一目で分かるリスト） */
            /* 幅: .box と同じ外寸（190 + padding10 + border6 = 206） */
            /* 店頭お支払いはリンク外（クリック不可） */
            .pay-methods {
                display: block;
                width: 206px;
                box-sizing: border-box;
                margin: 0 0 6px 0;
                padding: 0 !important;
                border: 2px solid #1f4f9a;
                border-radius: var(--radius-md);
                background: #fff;
                color: #1a2333;
                font-family: var(--font-sans);
                overflow: hidden;
            }
            a.pay-methods-link {
                display: block;
                margin: 0 !important;
                padding: 0 !important;
                border: 0;
                text-decoration: none;
                color: inherit;
                transition: background 0.15s ease;
            }
            a.pay-methods-link:hover {
                background-color: #f8fbff;
                color: #1a2333;
                text-decoration: none;
            }
            a.pay-methods-link * {
                pointer-events: none;
            }
            a.pay-methods-link :hover,
            a.pay-methods-link:hover .pay-methods-item,
            a.pay-methods-link:hover .pay-methods-title {
                text-decoration: none;
            }
            a.pay-methods-link:hover .pay-methods-title {
                background-color: #173d7a;
                color: #fff;
            }
            a.pay-methods-link:hover .pay-methods-item {
                background-color: #fff;
                border-color: #1f4f9a;
                color: #1a2333;
            }
            .pay-methods-title {
                display: block;
                box-sizing: border-box;
                width: auto;
                text-align: center;
                font-size: var(--text-md);
                font-weight: var(--fw-bold);
                line-height: var(--lh-ui);
                /* 外枠(2px)に密着：負マージンで白隙間を消す */
                margin: -2px -2px 0 -2px !important;
                padding: 10px 10px 8px;
                border: 0;
                border-radius: 0;
                background: #1f4f9a;
                color: #fff;
                letter-spacing: 0.04em;
            }
            .pay-methods-list {
                list-style: none;
                margin: 0;
                padding: 8px 8px 4px;
            }
            .pay-methods-item {
                display: flex;
                align-items: center;
                gap: 8px;
                background: #f7f9fc;
                color: #1a2333;
                text-align: left;
                font-size: 12px;
                font-weight: var(--fw-bold);
                line-height: var(--lh-tight);
                padding: 7px 8px;
                margin: 0 0 6px 0;
                border: 1px solid #c5d0e0;
                border-radius: var(--radius-md);
                transition: background 0.15s ease, border-color 0.15s ease;
            }
            .pay-methods-ico {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 22px;
                height: 22px;
                flex-shrink: 0;
                border-radius: 50%;
                background: #5b8fd4;
                color: #fff;
                line-height: 0;
            }
            .pay-methods-ico svg {
                width: 14px;
                height: 14px;
                display: block;
            }
            .pay-methods-label {
                flex: 1 1 auto;
                min-width: 0;
            }
            .pay-methods-store {
                margin: 0 8px 8px;
                padding: 8px;
                background: #eef3fa;
                border: 1px solid #c5d0e0;
                border-radius: var(--radius-md);
                text-align: left;
                cursor: default;
            }
            .pay-methods-store-label {
                display: flex;
                align-items: center;
                gap: 6px;
                font-size: 12px;
                font-weight: var(--fw-bold);
                line-height: var(--lh-tight);
                margin: 0 0 6px 0;
                color: #1f4f9a;
            }
            .pay-methods-chips {
                display: flex;
                flex-wrap: wrap;
                gap: 4px;
            }
            .pay-methods-chip {
                display: inline-block;
                background: #fff;
                color: #1a2333;
                border: 1px solid #c5d0e0;
                border-radius: var(--radius-md);
                font-size: 11px;
                font-weight: var(--fw-bold);
                line-height: 1.25;
                padding: 4px 6px;
            }
            /* 2.4 Phase C — Windows 10→Windows 11 移行告知帯（トップ中央） */
            .win11-ikou-band {
                width: 600px;
                box-sizing: border-box;
                margin: 0 0 12px 0;
                padding: 14px 16px 16px;
                background: #f7f9fc;
                border: 2px solid #1f4f9a;
                border-radius: 8px;
                font-family: var(--font-sans);
                font-size: 14px;
                line-height: 1.7;
                color: #222;
            }
            .win11-ikou-band p {
                margin: 0 0 8px 0;
            }
            .win11-ikou-band p:last-of-type {
                margin-bottom: 12px;
            }
            .win11-ikou-band .wib-ctas {
                display: flex;
                flex-wrap: wrap;
                gap: 8px;
            }
            .win11-ikou-band a.wib-cta-primary {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                padding: 8px 16px;
                background: #fff;
                border: 2px solid #1f4f9a;
                color: #1f4f9a !important;
                font-size: 14px;
                font-weight: 700;
                text-decoration: none !important;
                border-radius: 8px;
                line-height: 1;
                box-sizing: border-box;
            }
            .win11-ikou-band a.wib-cta-primary:hover {
                background: #f8fbff !important;
                color: #1f4f9a !important;
            }
            .win11-ikou-band a.wib-cta-secondary {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                padding: 8px 16px;
                background: #fff;
                color: #1f4f9a !important;
                font-size: 14px;
                font-weight: 700;
                text-decoration: none !important;
                border: 2px solid #1f4f9a;
                border-radius: 8px;
                line-height: 1;
                box-sizing: border-box;
            }
            .win11-ikou-band a.wib-cta-secondary:hover {
                background: #f8fbff !important;
                color: #173d7a !important;
            }
            /* 中央テキスト帯（初回=NAS）— 信頼＝紺のみ。Win11（橙CTA・2px告知）と差別化 */
            .topic-text-band {
                width: 600px;
                box-sizing: border-box;
                margin: 0 0 12px 0;
                padding: 14px 16px 14px 16px;
                background: #eef3fa;
                border: 1px solid #1f4f9a;
                border-left: 4px solid #1f4f9a;
                border-radius: 8px;
                font-family: var(--font-sans);
                font-size: 14px;
                line-height: 1.7;
                color: #222;
            }
            .topic-text-band .ttb-label {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                margin: 0 0 8px 0;
                padding: 4px 8px;
                background: #1f4f9a;
                color: #fff;
                font-size: 11px;
                font-weight: 700;
                line-height: 1;
                letter-spacing: 0.04em;
                border-radius: 4px;
                box-sizing: border-box;
            }
            .topic-text-band .ttb-title {
                margin: 0 0 6px 0;
                font-size: 15px;
                font-weight: 700;
                color: #1f4f9a;
                line-height: 1.4;
            }
            .topic-text-band .ttb-body {
                margin: 0 0 12px 0;
                color: #333;
            }
            .topic-text-band .ttb-links {
                display: flex;
                flex-wrap: wrap;
                gap: 8px 12px;
                align-items: center;
            }
            .topic-text-band a.ttb-link-primary {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                padding: 8px 14px;
                background: #fff;
                color: #1f4f9a !important;
                font-size: 14px;
                font-weight: 700;
                text-decoration: none !important;
                border: 2px solid #1f4f9a;
                border-radius: 8px;
                line-height: 1;
                box-sizing: border-box;
            }
            .topic-text-band a.ttb-link-primary:hover {
                background: #f8fbff !important;
                border-color: #1f4f9a;
                color: #1f4f9a !important;
            }
            .topic-text-band a.ttb-link {
                display: inline;
                padding: 0;
                background: transparent;
                color: #1f4f9a !important;
                font-size: 14px;
                font-weight: 700;
                text-decoration: underline !important;
                border: none;
                border-radius: 0;
                line-height: 1.6;
            }
            .topic-text-band a.ttb-link:hover {
                background: transparent !important;
                color: #173d7a !important;
            }
            /* 下段トピック帯スライド（横にぬるっと） */
            .topic-slide-wrap {
                width: 600px;
                box-sizing: border-box;
                margin: 0 0 12px 0;
            }
            .topic-slide-viewport {
                overflow: hidden;
                width: 100%;
            }
            .topic-slide-track {
                display: flex;
                width: 100%;
                transition: transform 0.55s ease-in-out;
                will-change: transform;
            }
            .topic-slide-wrap .topic-slide {
                flex: 0 0 100%;
                width: 100%;
                box-sizing: border-box;
                margin: 0;
            }
            .topic-slide-wrap .topic-text-band {
                width: 100%;
                margin: 0;
                box-sizing: border-box;
            }
            .topic-slide-dots {
                display: flex;
                gap: 8px;
                justify-content: center;
                align-items: center;
                margin: 8px 0 0 0;
            }
            .topic-slide-dots button {
                width: 8px;
                height: 8px;
                padding: 0;
                border-radius: 50%;
                border: 1px solid #1f4f9a;
                background: #fff;
                cursor: pointer;
                box-sizing: border-box;
            }
            .topic-slide-dots button.is-active {
                background: #1f4f9a;
            }
            .topic-slide-dots button:focus {
                outline: 2px solid #1f4f9a;
                outline-offset: 2px;
            }
            /* 右カラム：事務用・予算別3択（Q63）— 見出し〜3台を紺枠で一塊に */
            .main_sub .pop-picks {
                width: 206px;
                box-sizing: border-box;
                margin: 0 0 8px;
                padding: 8px;
                border: 2px solid #1f4f9a;
                border-radius: var(--radius-md);
                background: #f7f9fc;
                font-family: var(--font-sans);
            }
            .main_sub .pop-picks-title {
                width: 100%;
                box-sizing: border-box;
                margin: 0 0 8px;
                padding: 8px 10px;
                font-size: var(--text-md);
                font-weight: var(--fw-bold);
                font-family: var(--font-sans);
                line-height: var(--lh-ui);
                color: #fff;
                background: #1f4f9a;
                border-radius: var(--radius-md);
                text-align: center;
            }
            a.pop-card {
                display: block;
                width: 100%;
                box-sizing: border-box;
                margin: 0 0 8px;
                padding: 8px !important;
                border: 1px solid #c5d0e0;
                border-radius: var(--radius-md);
                background: #fff;
                text-decoration: none !important;
                color: #1a2333 !important;
                font-family: var(--font-sans);
                cursor: pointer;
                outline: none;
                position: relative;
                transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
            }
            a.pop-card:link,
            a.pop-card:visited,
            a.pop-card:active {
                color: #1a2333 !important;
                text-decoration: none !important;
                background: #fff;
            }
            a.pop-card:hover,
            a.pop-card:focus {
                border-color: #1f4f9a !important;
                background: #f8fbff !important;
                color: #1a2333 !important;
                box-shadow: 0 4px 12px rgba(31, 79, 154, 0.12);
                text-decoration: none !important;
            }
            a.pop-card:hover .pop-card-name,
            a.pop-card:focus .pop-card-name {
                color: #1f4f9a !important;
                background: transparent !important;
            }
            a.pop-card:hover .pop-card-price,
            a.pop-card:focus .pop-card-price,
            a.pop-card:hover .pop-card-meta,
            a.pop-card:focus .pop-card-meta {
                background: transparent !important;
            }
            a.pop-card:hover .pop-card-reason,
            a.pop-card:focus .pop-card-reason {
                color: #555 !important;
                background: transparent !important;
            }
            a.pop-card:hover .pop-card-img,
            a.pop-card:focus .pop-card-img {
                background: #f5f7fb !important;
                opacity: 1;
            }
            .main_sub .pop-picks a.pop-card:last-child {
                margin-bottom: 0;
            }
            .pop-card-tier {
                display: inline-block;
                margin: 0 0 6px;
                padding: 2px 8px;
                font-size: 11px;
                font-weight: var(--fw-bold);
                line-height: 1.3;
                color: #1f4f9a;
                background: #eef3fa;
                border: 1px solid #c5d0e0;
                border-radius: 4px;
            }
            .pop-card-row {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                gap: 8px;
                -webkit-box-align: start;
                -ms-flex-align: start;
                align-items: flex-start;
            }
            .pop-card-img {
                display: block;
                -webkit-box-flex: 0;
                -ms-flex: 0 0 56px;
                flex: 0 0 56px;
                width: 56px;
                height: 42px;
                object-fit: cover;
                border-radius: 4px;
                background: #f5f7fb;
                border: 1px solid #c5d0e0;
            }
            .pop-card-body {
                -webkit-box-flex: 1;
                -ms-flex: 1 1 auto;
                flex: 1 1 auto;
                min-width: 0;
            }
            .pop-card-name {
                display: block;
                margin: 0 0 2px;
                font-size: 12px;
                font-weight: var(--fw-bold);
                line-height: 1.3;
                color: #1a2333;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }
            .pop-card-reason {
                display: block;
                margin: 0 0 4px;
                padding: 0;
                font-size: 11px;
                font-weight: var(--fw-normal);
                line-height: 1.35;
                color: #555;
                background: transparent;
                border-radius: 0;
            }
            .pop-card-meta {
                display: block;
                margin: 0;
            }
            .pop-card-price {
                font-size: 14px;
                font-weight: var(--fw-bold);
                color: #c85a10;
            }
            .pop-card-price-ex {
                display: block;
                font-size: 10px;
                font-weight: var(--fw-normal);
                color: #666;
                line-height: 1.3;
            }