:root {
    --blue:#8db7cd;
    --orange:#e58545;
    --sky:#ddebf8;
    --cream:#fcebd7;
    --ink:#25374a;
    --muted:#526274;
    --line:rgba(37,55,74,.2);
    --paper:#fff;
    --serif:'Noto Serif JP','Yu Mincho','Hiragino Mincho ProN',serif;
    --sans:Arial,'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;
    --radius:4px;
    --content:1160px
}
* {
    box-sizing:border-box
}
html {
    scroll-behavior:smooth;
    scroll-padding-top:96px
}
body {
    margin:0;
    color:var(--ink);
    background:linear-gradient(100deg,var(--sky),#f0ede6 54%,var(--cream));
    font-family:var(--serif);
    font-size:16px;
    line-height:1.95;
    letter-spacing:.055em;
    line-break:strict;
    word-break:normal;
    overflow-wrap:anywhere
}
body,button,a {
    -webkit-tap-highlight-color:transparent
}
img {
    display:block;
    max-width:100%;
    height:auto
}
a {
    color:inherit;
    text-underline-offset:5px
}
button {
    font:inherit;
    color:inherit;
    cursor:pointer
}
button:disabled {
    opacity:.3;
    cursor:default
}
button,a,summary {
    touch-action:manipulation
}
button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible {
    outline:3px solid #476f86;
    outline-offset:5px
}
h1,h2,h3,h4,p,figure {
    margin:0
}
h1,h2,h3,h4 {
    font-weight:500
}
h2 {
    font-size:clamp(1.65rem,3vw,2.5rem);
    line-height:1.8;
    letter-spacing:.09em
}
h3 {
    font-size:1.35rem;
    line-height:1.65
}
p+p {
    margin-top:1.3em
}
h4 {
    font-size:1.03rem
}
.phrase {
    display:inline;
    overflow-wrap:normal
}
/* ヒーローとコンセプトのコピーは、従来の語句単位の配置を保持。 */
.hero .phrase,#concept .phrase {
    display:inline-block;
    max-width:100%
}
.container {
    width:min(var(--content),calc(100% - 80px));
    margin-inline:auto
}
.section {
    padding-block:110px
}
.section-kicker {
    font-family:var(--sans);
    font-size:12px;
    letter-spacing:.22em;
    font-weight:500;
    margin-bottom:24px
}
.section-heading {
    max-width:800px;
    margin-bottom:60px
}
.section-heading h2 {
    margin-bottom:25px
}
.section-heading>p:not(.section-kicker) {
    max-width:720px
}
.center {
    text-align:center;
    margin-inline:auto
}
.center>p {
    margin-inline:auto
}
.note,figcaption {
    font-size:12px;
    line-height:1.85;
    letter-spacing:.02em;
    color:var(--muted)
}
.skip {
    position:absolute;
    z-index:100;
    top:-100px;
    left:12px;
    background:white;
    padding:12px
}
.skip:focus {
    top:8px
}
.site-header {
    height:92px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:18px 5vw;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    z-index:5
}
.brand,.hero-brand,.footer-brand {
    display:flex;
    align-items:center;
    gap:16px;
    text-decoration:none
}
.logo-slot {
    font-size:20px;
    border-bottom:1px solid var(--line);
    min-width:115px;
    letter-spacing:.12em;
    display:inline-block
}
.logo-slot img {
    max-width:180px;
    max-height:64px;
    object-fit:contain
}
.header-cta {
    font-family:var(--sans);
    font-size:14px;
    border-bottom:1px solid var(--ink);
    padding:8px 0;
    text-decoration:none;
    display:flex;
    align-items:center;
    gap:24px
}
.hero {
    position:relative;
    min-height:790px;
    height:min(960px,100svh);
    display:flex;
    align-items:center;
    isolation:isolate;
    overflow:hidden
}
.hero-photo {
    position:absolute;
    inset:0 0 0 43%;
    z-index:-2
}
.hero-photo img {
    height:100%;
    width:100%;
    object-fit:cover;
    object-position:50% 48%
}
.hero:after {
    content:'';
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(90deg,#ddebf8 0%,#e6edeecf 28%,#ebece475 48%,transparent 67%)
}
.hero-copy {
    width:min(1160px,90%);
    margin:auto;
    position:relative;
    padding-top:80px
}
.hero .eyebrow {
    font-size:14px;
    letter-spacing:.12em;
    max-width:500px;
    margin-bottom:30px
}
.hero h1 {
    font-size:clamp(2.3rem,4vw,3.7rem);
    line-height:1.75;
    letter-spacing:.13em
}
.hero-brand {
    margin-top:35px
}
.hero-brand .logo-slot {
    font-size:24px
}
.button {
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    padding:18px 28px;
    border:1px solid var(--ink);
    background:transparent;
    text-decoration:none;
    font-family:var(--sans);
    font-size:15px;
    letter-spacing:.04em;
    border-radius:2px;
    min-height:56px;
    transition:background .25s,transform .25s
}
.button.primary {
    background:var(--orange);
    border-color:var(--orange);
    color:#182d3e;
    box-shadow:0 8px 28px #8f5c2120
}
.button:hover {
    background:#fff9
}
.button.primary:hover {
    background:#eda268;
    transform:translateY(-2px)
}
.hero .button {
    margin-top:42px
}
.scroll-cue {
    position:absolute;
    left:5vw;
    bottom:25px;
    font:11px var(--sans);
    letter-spacing:.2em;
    text-decoration:none;
    display:flex;
    gap:22px;
    align-items:center
}
.scroll-cue span {
    font-size:22px
}
.concept {
    position:relative;
    text-align:center;
    padding:145px 24px;
    overflow:hidden
}
.glow {
    position:absolute;
    left:50%;
    top:50%;
    width:min(600px,90vw);
    height:480px;
    transform:translate(-50%,-50%);
    background:radial-gradient(ellipse at 35% 65%,#8db7cd66,transparent 50%),radial-gradient(ellipse at 65% 35%,#e5b77655,transparent 52%);
    filter:blur(18px);
    z-index:-1;
    pointer-events:none
}
.concept .poem {
    font-size:clamp(1.4rem,2.5vw,2rem);
    line-height:2.2;
    margin:85px 0 45px
}
.concept-body {
    line-height:2.3
}
.concept,.story-center {
    isolation:isolate
}
.powered {
    display:flex;
    align-items:center;
    gap:20px;
    font-family:var(--sans);
    font-size:13px;
    margin-bottom:26px
}
.powered img,.fiber-logo {
    mix-blend-mode:normal
}
.condition {
    display:grid;
    grid-template-columns:240px 1fr 1fr;
    gap:42px;
    padding:48px 0;
    border-top:1px solid var(--line);
    align-items:center
}
.ordinal {
    font-family:var(--serif);
    font-size:54px;
    line-height:1.3;
    font-weight:400;
    color:#49667a
}
.condition-title>p {
    font:11px var(--sans);
    letter-spacing:.15em;
    margin:8px 0 18px
}
.condition-body {
    font-size:15px;
    line-height:2
}
.effect-list>div+div {
    margin-top:22px
}
.effect-list p {
    font-size:13px;
    line-height:1.9;
    margin-top:8px
}
.effect-list .note {
    font-size:12px
}
.condition figure img {
    mix-blend-mode:normal;
    width:100%;
    max-width:320px;
    margin:auto
}
.condition figcaption {
    margin-top:14px
}
.research-note {
    border-top:1px solid var(--line);
    padding-top:25px
}
.story {
    text-align:center
}
.season {
    text-align:left;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:70px;
    line-height:2.3
}
.season img {
    width:360px;
    aspect-ratio:3/2;
    object-fit:cover;
    border-radius:3px
}
.story-center {
    position:relative;
    margin:95px 0 70px;
    padding:60px 0
}
.story-center .fiber-logo {
    margin:0 auto 25px
}
.story-center h2 {
    font-size:clamp(1.35rem,2.3vw,2rem)
}
.story-center .note {
    max-width:750px;
    margin:24px auto 0
}
.experience {
    font-size:clamp(1.1rem,2vw,1.7rem)
}
.materials {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:50px;
    text-align:center
}
.materials img {
    width:240px;
    margin:auto;
    mix-blend-mode:normal
}
.materials figcaption {
    font-size:22px;
    color:var(--ink);
    margin-top:10px
}
.material-note {
    display:flex;
    gap:36px;
    align-items:center;
    border-block:1px solid var(--line);
    padding:24px 0;
    margin-top:60px;
    font-size:14px
}
.material-note strong {
    white-space:nowrap;
    font-weight:500
}
.lineup {
    background:#ffffff32
}
.lineup .section-heading {
    max-width:100%;
    margin-bottom:90px
}
.lineup .section-heading h2 {
    margin-top:32px
}
.collection-intro {
    padding-top:30px;
    font-size:14px
}
.category-head {
    display:flex;
    align-items:center;
    gap:30px;
    border-top:1px solid var(--line);
    padding-top:35px;
    margin:70px 0 50px
}
.category-head p {
    font-size:14px
}
.category-head h2 {
    font-size:30px;
    margin-top:5px
}
.product-group-title {
    margin:45px 0 32px;
    font-size:22px
}
.product-group-title small {
    font-family:var(--sans);
    font-size:12px;
    letter-spacing:.12em;
    display:inline-block;
    margin-left:20px
}
.product-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:45px 30px
}
.product-grid.duvets {
    grid-template-columns:repeat(2,minmax(0,1fr));
    max-width:950px;
    margin:auto
}
.single-product {
    grid-template-columns:minmax(0,450px)
}
.product-card {
    position:relative;
    scroll-margin-top:30px;
    min-width:0
}
.product-image {
    background:transparent;
    padding:30px 16px;
    min-height:230px;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    overflow:hidden;
    border-radius:2px
}
.product-image>img {
    width:100%;
    height:190px;
    object-fit:contain;
    mix-blend-mode:normal;
    transition:transform .6s
}
.product-card:hover .product-image>img {
    transform:scale(1.025)
}
.product-image .material-badge {
    position:absolute;
    right:12px;
    top:12px;
    width:43px;
    height:43px;
    object-fit:contain;
    mix-blend-mode:normal
}
.duvets .product-image {
    min-height:270px
}
.duvets .product-image>img {
    height:240px
}
.product-kind {
    font-size:13px;
    margin-top:24px;
    color:var(--muted)
}
.product-card h4 {
    font-size:22px;
    letter-spacing:.04em;
    margin-top:2px
}
.model {
    font-family:var(--sans);
    font-size:12px;
    margin-left:12px
}
.product-description {
    font-size:14px;
    margin-top:12px
}
.product-link {
    display:inline-block;
    margin-top:14px;
    font:14px var(--sans)
}
.diagnosis {
    background:linear-gradient(115deg,#c8dfed,#f8dcbf);
    position:relative
}
.diagnosis-intro {
    text-align:center;
    margin-bottom:60px
}
.diagnosis-intro h2 {
    font-size:clamp(2rem,3.5vw,3rem);
    margin:28px 0
}
.diagnosis-intro>p:last-child {
    font-size:14px
}
.quiz {
    max-width:700px;
    margin:auto
}
.quiz-card {
    background:#fffefbed;
    border:1px solid #fff;
    border-radius:6px;
    padding:48px;
    box-shadow:0 12px 50px #5264770c;
    margin-top:24px;
    scroll-margin-top:32px
}
.question-top {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:30px;
    font:12px var(--sans);
    letter-spacing:.13em;
    color:var(--muted)
}
.question-top button {
    font:13px var(--sans);
    background:transparent;
    border:0;
    text-decoration:underline;
    text-underline-offset:4px;
    letter-spacing:0
}
.quiz-card h3 {
    font-size:24px;
    line-height:1.75;
    margin-bottom:28px
}
.quiz-options {
    display:grid;
    gap:14px
}
.quiz-choice {
    border:1px solid #b9c5cb;
    background:transparent;
    border-radius:4px;
    padding:20px 24px;
    text-align:left;
    line-height:1.85;
    font-size:16px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    transition:background .25s,border-color .25s
}
.quiz-choice::after {
    content:'→';
    flex:none
}
.quiz-choice:hover,.quiz-choice[aria-pressed=true] {
    background:#e1edf2;
    border-color:#6e98b0
}
.quiz-card.answered {
    padding-block:25px;
    background:#ffffff70;
    box-shadow:none
}
.quiz-card.answered h3 {
    font-size:17px;
    margin-bottom:12px
}
.quiz-card.answered .question-top {
    margin-bottom:14px
}
.chosen-answer {
    font-size:14px;
    color:#40596c
}
.result-card {
    text-align:center
}
.result-card .section-kicker {
    color:#7d4b28
}
.result-card img {
    height:220px;
    width:100%;
    object-fit:contain;
    mix-blend-mode:normal;
    margin:20px auto
}
.result-card .result-reason {
    font-size:17px
}
.result-card .result-kind {
    font-size:13px
}
.result-card .button {
    margin-top:25px
}
.result-advice {
    text-align:left;
    border-top:1px solid var(--line);
    padding-top:24px;
    margin-top:30px;
    font-size:14px
}
.result-advice a {
    display:inline-block;
    margin-top:12px
}
.text-button {
    background:none;
    border:0;
    text-decoration:underline;
    text-underline-offset:5px;
    font:14px var(--sans);
    margin-top:26px;
    padding:12px
}
.split-heading {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:25px;
    margin-bottom:40px
}
.split-heading p:not(.section-kicker) {
    font-size:14px;
    margin-top:18px
}
.carousel-controls {
    display:flex;
    gap:12px;
    flex:none
}
.circle-button {
    width:48px;
    height:48px;
    border:1px solid var(--line);
    border-radius:50%;
    background:#fff5;
    font-size:22px;
    transition:background .2s
}
.circle-button:hover:not(:disabled) {
    background:#fff
}
.carousel {
    display:flex;
    gap:26px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scrollbar-width:thin;
    scrollbar-color:#809dab66 transparent;
    overscroll-behavior-x:contain;
    padding:8px 2px 25px;
    align-items:flex-start
}
.carousel>* {
    scroll-snap-align:start;
    flex-shrink:0;
    min-width:0
}
.voice-card {
    flex-basis:45%;
    background:#fff9;
    border:1px solid #fff;
    padding:34px;
    min-height:280px;
    border-radius:4px
}
.voice-card h3 {
    font-size:21px
}
.voice-tags {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin:18px 0 23px
}
.voice-tags span {
    font:12px var(--sans);
    background:#dce8ec;
    padding:5px 10px;
    letter-spacing:.04em;
    border-radius:2px
}
.voice-text {
    font-size:15px;
    line-height:2.1;
    letter-spacing:.04em
}
.voice-text p {
    white-space:pre-line
}
.voice-text.is-collapsed {
    display:-webkit-box;
    -webkit-line-clamp:5;
    -webkit-box-orient:vertical;
    overflow:hidden
}
.voice-toggle {
    font:13px var(--sans);
    background:none;
    border:0;
    border-bottom:1px solid var(--line);
    padding:8px 0;
    margin-top:18px
}
.carousel-help {
    display:flex;
    justify-content:space-between;
    font:12px var(--sans);
    letter-spacing:.05em;
    margin-top:14px;
    color:var(--muted)
}
.faq-list {
    border-top:1px solid var(--line)
}
.faq-item {
    border-bottom:1px solid var(--line)
}
.faq-item summary {
    list-style:none;
    cursor:pointer;
    display:flex;
    gap:24px;
    padding:26px 12px;
    align-items:center;
    font-size:17px
}
.faq-item summary::-webkit-details-marker {
    display:none
}
.faq-item summary:before {
    content:'Q';
    font-family:var(--serif);
    font-size:24px;
    color:#55778d
}
.faq-item summary:after {
    content:'＋';
    margin-left:auto;
    font-size:22px;
    flex:none
}
.faq-item[open] summary:after {
    content:'−'
}
.faq-answer {
    padding:0 60px 30px;
    font-size:15px;
    line-height:2.15
}
.faq-answer p {
    white-space:pre-line
}
.faq-item[open] {
    background:#fff6
}
.showroom-card {
    flex-basis:35%;
    background:#fff9;
    border-radius:3px;
    overflow:hidden
}
.showroom-card>img {
    width:100%;
    aspect-ratio:1.6;
    object-fit:cover
}
.showroom-body {
    padding:26px
}
.showroom-body h4 {
    font-size:20px;
    margin-bottom:18px
}
.showroom-body p {
    font-size:14px;
    line-height:1.9
}
.showroom-body p+p {
    margin-top:12px
}
.phone-link {
    font-family:var(--sans);
    font-size:15px;
    text-decoration:none;
    display:inline-block;
    padding-block:6px;
    letter-spacing:.07em
}
.dealer-heading {
    margin:85px 0 30px
}
.dealer-heading p {
    font-size:14px;
    margin-top:16px
}
.dealer-table {
    width:100%;
    border-collapse:collapse;
    font-size:13px;
    letter-spacing:.015em
}
.dealer-table th {
    text-align:left;
    font-weight:500;
    padding:18px 10px;
    border-bottom:1px solid var(--line)
}
.dealer-table td {
    padding:18px 10px;
    border-bottom:1px solid var(--line);
    vertical-align:top
}
.dealer-table td:first-child {
    width:32%
}
.dealer-table td:last-child {
    width:155px;
    white-space:nowrap
}
.dealer-table .phone-link {
    font-size:13px;
    padding:0
}
.ec-list {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:20px
}
.ec-link,.ec-pending {
    padding:25px;
    border-block:1px solid var(--line);
    font-size:15px;
    text-align:center
}
.ec-pending small {
    display:block;
    font:12px var(--sans);
    color:var(--muted);
    margin-top:10px
}
footer {
    border-top:1px solid var(--line);
    padding-block:65px 35px;
    text-align:center
}
.footer-brand {
    justify-content:center;
    margin-bottom:30px
}
footer p {
    font-size:12px;
    line-height:2
}
footer small {
    font:11px var(--sans);
    letter-spacing:.06em
}
footer #company-name {
    margin:25px 0 15px;
    font-size:16px
}
.expert {
    border-block:1px solid var(--line);
    padding:35px;
    max-width:880px;
    margin:20px auto 40px;
    background:#fff6
}
.expert img {
    width:110px;
    aspect-ratio:1;
    object-fit:cover;
    float:right;
    margin:0 0 20px 25px
}
.expert p {
    font-size:15px
}
.mobile-break {
    display:none
}
/* 動きの調整はこのブロックで管理。本文はJS無効時にも表示。 */
.fade-delay-0 { --fade-delay: 0ms; }
.fade-delay-1 { --fade-delay: 80ms; }
.fade-delay-2 { --fade-delay: 160ms; }
.fade-delay-3, .fade-delay-4, .fade-delay-5 { --fade-delay: 200ms; }
@keyframes hero-settle {
    from { transform: scale(1.03); }
    to { transform: scale(1); }
}
@media (prefers-reduced-motion: no-preference) {
    #hero-image.hero-motion {
        animation: hero-settle 4.5s cubic-bezier(.22, 1, .36, 1) both;
    }
    .fade-up.is-fade-ready {
        --motion-duration: 1.4s;
        --motion-distance: 16px;
        transition: opacity var(--motion-duration) cubic-bezier(.22, 1, .36, 1) var(--fade-delay, 0ms),
                    translate var(--motion-duration) cubic-bezier(.22, 1, .36, 1) var(--fade-delay, 0ms);
    }
    .hero .fade-up.is-fade-ready {
        --motion-duration: 1.4s;
        --motion-distance: 8px;
    }
    .motion-card.is-fade-ready {
        --motion-duration: 1.2s;
        --motion-distance: 10px;
        --fade-delay: var(--card-delay, 0ms);
    }
    .fade-up.is-fade-ready:not(.is-visible) {
        opacity: 0;
        translate: 0 var(--motion-distance);
    }
    .button.fade-up.is-fade-ready {
        transition: opacity 1.4s cubic-bezier(.22, 1, .36, 1), translate 1.4s cubic-bezier(.22, 1, .36, 1),
                    background .18s ease-out, transform .18s ease-out;
    }
    @media (max-width: 700px) {
        .fade-up.is-fade-ready { --motion-distance: 12px; }
        .hero .fade-up.is-fade-ready { --motion-distance: 8px; }
        .motion-card.is-fade-ready { --motion-distance: 10px; --fade-delay: 0ms; }
    }
}

@media(min-width:1600px) {
    .hero-copy {
        width:1160px
    }
    .hero {
        min-height:900px
    }
}
@media(max-width:1023px) {
    .container {
        width:calc(100% - 48px)
    }
    .section {
        padding-block:80px
    }
    .hero {
        min-height:740px;
        height:90svh
    }
    .hero h1 {
        font-size:40px
    }
    .condition {
        grid-template-columns:190px 1fr;
        gap:30px
    }
    .condition>figure,.condition>.effect-list {
        grid-column:2
    }
    .materials {
        gap:20px
    }
    .voice-card {
        flex-basis:65%
    }
    .showroom-card {
        flex-basis:47%
    }
    .product-grid {
        gap:24px
    }
    .product-image {
        padding:20px 8px
    }
    .product-image>img {
        height:160px
    }
    .dealer-table td:last-child {
        width:125px
    }
}
@media(max-width:640px) {
    html {
        scroll-padding-top:24px
    }
    .container {
        width:calc(100% - 40px)
    }
    .section {
        padding-block:64px
    }
    body {
        letter-spacing:.025em
    }
    .site-header {
        height:74px;
        padding:15px 20px
    }
    .brand {
        gap:9px
    }
    .brand img {
        width:29px;
        height:29px
    }
    .brand .logo-slot {
        font-size:15px;
        min-width:76px
    }
    .header-cta {
        font-size:12px;
        gap:8px
    }
    .hero {
        min-height:740px;
        height:auto;
        align-items:flex-end;
        padding:0 0 68px
    }
    .hero-photo {
        inset:0 0 0 15%
    }
    .hero-photo img {
        object-position:55% center;
        opacity:.9
    }
    .hero:after {
        background:linear-gradient(0deg,#e2ebf3 0%,#e2ebf3ed 10%,#e2ebf380 49%,#e2ebf314 80%)
    }
    .hero-copy {
        width:calc(100% - 40px);
        padding-top:335px
    }
    .hero .eyebrow {
        font-size:12px;
        margin-bottom:17px;
        max-width:300px
    }
    .hero h1 {
        font-size:clamp(27px,7.4vw,38px);
        letter-spacing:.055em;
        line-height:1.8
    }
    .hero-brand {
        margin-top:20px;
        gap:12px
    }
    .hero-brand img {
        width:36px;
        height:36px
    }
    .hero-brand .logo-slot {
        font-size:18px
    }
    .hero .button {
        margin-top:28px;
        font-size:13px;
        padding:17px 20px;
        max-width:100%;
        gap:18px
    }
    .scroll-cue {
        left:20px;
        bottom:20px
    }
    .section-kicker {
        font-size:11px;
        margin-bottom:20px
    }
    .concept {
        padding:90px 20px
    }
    .concept h2 {
        font-size:25px
    }
    .concept .poem {
        font-size:21px;
        margin:58px 0 35px
    }
    .concept-body {
        font-size:14px;
        line-height:2.25
    }
    .section-heading {
        margin-bottom:38px
    }
    .section-heading p:not(.section-kicker) {
        font-size:15px
    }
    .section-heading .note {
        font-size:12px!important
    }
    .condition {
        display:block;
        padding:35px 0
    }
    .condition-title {
        display:grid;
        grid-template-columns:62px 1fr;
        gap:0 12px;
        margin-bottom:26px
    }
    .condition-title .ordinal {
        grid-row:1/3;
        font-size:43px
    }
    .condition-title>p {
        font-size:10px;
        margin:4px 0
    }
    .condition-title h3 {
        font-size:20px
    }
    .condition-title h3 br {
        display:none
    }
    .condition-body {
        font-size:15px
    }
    .condition>figure,.condition>.effect-list {
        margin-top:28px
    }
    .condition figure img {
        max-width:290px
    }
    .effect-list h4 {
        font-size:16px
    }
    .effect-list p {
        font-size:14px
    }
    .research-note {
        font-size:12px
    }
    .season {
        display:block;
        text-align:center;
        font-size:16px
    }
    .season img {
        margin:35px auto 0
    }
    .story-center {
        margin:55px 0 45px;
        padding:35px 0
    }
    .story-center h2 {
        font-size:21px;
        letter-spacing:.025em
    }
    .story-inner>p:last-child {
        font-size:14px
    }
    .materials {
        grid-template-columns:1fr;
        gap:28px
    }
    .materials figure {
        display:flex;
        align-items:center;
        justify-content:center;
        gap:18px
    }
    .materials img {
        width:145px;
        margin:0
    }
    .materials figcaption {
        font-size:20px;
        min-width:155px;
        text-align:left
    }
    .material-note {
        display:block;
        padding:20px 0;
        margin-top:35px
    }
    .material-note p {
        margin-top:12px
    }
    .lineup .section-heading h2 {
        font-size:25px
    }
    .lineup .section-heading p {
        font-size:14px
    }
    .category-head {
        margin:45px 0 30px;
        gap:22px;
        padding-top:26px
    }
    .category-head .ordinal {
        font-size:43px
    }
    .category-head p {
        font-size:12px
    }
    .category-head h2 {
        font-size:26px
    }
    .product-group-title {
        font-size:20px;
        margin:32px 0 24px
    }
    .product-group-title small {
        display:block;
        margin:6px 0 0
    }
    .product-grid,.product-grid.duvets,.single-product {
        grid-template-columns:1fr;
        gap:40px
    }
    .product-image,.duvets .product-image {
        min-height:220px
    }
    .product-image>img,.duvets .product-image>img {
        height:200px
    }
    .product-kind {
        margin-top:18px
    }
    .product-card h4 {
        font-size:22px
    }
    .diagnosis-intro h2 {
        font-size:29px
    }
    .diagnosis-intro p {
        font-size:15px
    }
    .quiz-card {
        padding:28px 22px
    }
    .quiz-card h3 {
        font-size:20px;
        letter-spacing:.025em
    }
    .question-top {
        margin-bottom:22px
    }
    .quiz-choice {
        padding:17px 18px;
        font-size:15px
    }
    .quiz-card.answered h3 {
        font-size:15px
    }
    .result-card img {
        height:175px
    }
    .result-card .button {
        padding:16px;
        font-size:14px;
        gap:12px
    }
    .result-card .result-reason {
        font-size:15px
    }
    .split-heading {
        align-items:flex-end;
        gap:10px;
        margin-bottom:28px
    }
    .split-heading h2 {
        font-size:25px
    }
    .split-heading p:not(.section-kicker) {
        font-size:12px
    }
    .carousel-controls {
        gap:7px
    }
    .circle-button {
        width:38px;
        height:38px;
        font-size:18px
    }
    .carousel {
        gap:16px
    }
    .voice-card {
        flex-basis:92%;
        padding:25px
    }
    .voice-card h3 {
        font-size:20px
    }
    .voice-text {
        font-size:15px
    }
    .showroom-card {
        flex-basis:88%
    }
    .showroom-body {
        padding:23px
    }
    .carousel-help {
        font-size:11px
    }
    .faq-item summary {
        font-size:16px;
        padding:22px 3px;
        gap:14px;
        line-height:1.75
    }
    .faq-item summary:before {
        font-size:22px
    }
    .faq-answer {
        padding:0 12px 24px 38px;
        font-size:14px
    }
    .dealer-heading {
        margin-top:60px
    }
    .dealer-table thead {
        display:none
    }
    .dealer-table,.dealer-table tbody,.dealer-table tr,.dealer-table td {
        display:block;
        width:100%!important;
        white-space:normal!important
    }
    .dealer-table tr {
        border-bottom:1px solid var(--line);
        padding:21px 0
    }
    .dealer-table td {
        border:0;
        padding:4px 0;
        font-size:14px
    }
    .dealer-table td:first-child {
        font-size:16px;
        margin-bottom:6px
    }
    .dealer-table .phone-link {
        font-size:14px;
        padding:8px 0
    }
    .ec-list {
        grid-template-columns:1fr;
        gap:12px
    }
    .ec-link,.ec-pending {
        font-size:14px;
        padding:20px
    }
    .experience {
        font-size:20px
    }
    .mobile-break {
        display:block
    }
    .expert {
        padding:24px
    }
    .expert img {
        float:none;
        margin:0 0 20px
    }
    footer {
        padding-block:45px 25px
    }
}
@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto
    }
    *,*:before,*:after {
        animation:none!important;
        transition:none!important;
        scroll-behavior:auto!important
    }
    .fade-up {
        opacity:1!important;
        translate:none!important
    }
}
/* 本文・見出しは使用できる横幅で通常の折り返し。
   句読点の禁則処理と、HTMLで意図した改行は維持する。 */
p,h1,h2,h3,h4,summary,button {
    text-wrap:wrap;
    word-break:normal;
    line-break:strict
}
.product-card h4 {
    overflow-wrap:normal
}
.voice-text.is-collapsed[aria-hidden=true] {
    display:none
}

/* ============================================================
   今回の調整：文字・写真・ロゴ・素材アイコン
   ============================================================ */
body {
    font-size: 18px;
    font-weight: 500;
}
h1, h2, h3, h4, strong {
    font-weight: 600;
}
.note, figcaption, .research-note {
    font-size: 14px;
    color: #405263;
    font-weight: 500;
}
.section-kicker {
    font-size: 14px;
    font-weight: 600;
}
.concept-body, .condition-body, .voice-text, .faq-answer,
.showroom-body, .dealer-table td, .product-description {
    font-size: 18px;
}
.product-kind, .product-card .model, .voice-tags,
.carousel-help, footer p, .header-cta {
    font-size: 15px;
}
.button, .quiz-choice, .ec-link, .ec-pending {
    font-size: 17px;
}
.effect-list p, .material-note p {
    font-size: 17px;
}
/* アイコン込みのブランド画像。単独アイコンは追加しない。 */
.brand-wordmark-slot {
    display: block;
    flex-shrink: 0;
    line-height: 1;
}
.brand-wordmark-slot > img.brand-wordmark {
    width: 210px;
    height: auto;
    max-height: none;
    object-fit: contain;
}
.hero-brand .brand-wordmark-slot > img.brand-wordmark {
    width: clamp(260px, 27vw, 390px);
    height: auto;
}
/* 横長写真をファーストビュー全幅に。画像自体は変形しない。 */
.hero {
    min-height: 720px;
    height: min(960px, 100svh);
}
.hero-photo {
    inset: 0;
}
.hero-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 56% center;
}
.hero::after {
    background: linear-gradient(90deg, rgba(236,243,247,.86) 0%, rgba(239,242,241,.65) 30%, rgba(240,239,231,.15) 60%, transparent 80%);
}
.hero-copy {
    padding-top: 100px;
}
.hero .eyebrow {
    font-size: 18px;
}
.hero h1 {
    font-size: clamp(38px, 3.8vw, 60px);
}
/* PDFの枠・淡い色・曲線をCSSで再現。文字は編集可能。 */
.condition-title {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-self: start;
    min-height: 210px;
    padding: 20px 12px;
    border: 1px solid #77818a;
    background: #fff;
    text-align: center;
}
.condition-title::before {
    content: '';
    position: absolute;
    z-index: -1;
    top: 0;
    left: -10%;
    width: 120%;
    height: 65%;
    border-radius: 0 0 50% 50%;
    background: linear-gradient(105deg, #ddebf8, #fcebd7);
}
.condition-title .ordinal {
    font-size: 30px;
    line-height: 1.2;
}
.condition-title > p {
    margin: 4px 0 25px;
    font-family: var(--serif);
    font-size: clamp(17px, 1.5vw, 23px);
    letter-spacing: .015em;
}
.condition-title h3 {
    font-size: 17px;
    line-height: 1.8;
}
.feature-underline {
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: .25em;
    font-weight: 600;
}
/* 左：季節の文章／右：女性の睡眠写真 */
.season {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    align-items: center;
    gap: 48px;
    font-size: 20px;
}
#sleep-image-slot img {
    display: block;
    width: 100%;
    height: auto;
    max-width: none;
    margin: 0;
}
.story-center > .kodenshi-logo {
    width: 240px;
    height: auto;
    max-width: 70%;
    margin: 0 auto 28px;
}
.material-intro {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    align-items: center;
    gap: 36px;
    max-width: none;
}
.material-brand-logo {
    width: 240px;
    height: auto;
}
.material-intro-copy > p {
    margin: 0;
}
.material-intro-copy > .note {
    margin-top: 12px;
}
/* 各見出しの間隔を統一。セクション全体の余白とは分離。 */
#voices .section-kicker, #faq .section-kicker, #stores .section-kicker {
    margin-bottom: 8px;
}
#voices .split-heading h2, #faq .section-heading h2,
#stores .section-heading h2 {
    margin-bottom: 8px;
    line-height: 1.55;
}
#voices .split-heading h2 + p {
    margin-top: 8px;
    font-size: 16px;
}
#voices .split-heading, #faq .section-heading, #stores .section-heading {
    margin-bottom: 30px;
}
#stores .split-heading {
    margin-bottom: 22px;
}
/* 商品写真用の高さ指定を、右上の素材アイコンへ適用させない。 */
.product-image {
    position: relative;
    padding-top: 60px;
}
.product-image > img.material-badge,
.duvets .product-image > img.material-badge {
    position: absolute;
    inset: 12px 12px auto auto;
    width: 72px;
    height: auto;
    max-width: 23%;
    max-height: 82px;
    object-fit: contain;
    margin: 0;
    background: transparent;
    z-index: 1;
}
@media (max-width: 700px) {
    body {
        font-size: 17px;
    }
    .concept-body, .condition-body, .voice-text, .faq-answer,
    .showroom-body, .dealer-table td, .product-description,
    .section-heading p:not(.section-kicker), .lineup .section-heading p,
    .story > p:last-child, .effect-list p {
        font-size: 17px;
    }
    .section-heading .note, .note, figcaption, .research-note {
        font-size: 14px !important;
    }
    .site-header {
        padding: 18px 20px;
        height: auto;
        gap: 16px;
    }
    .brand-wordmark-slot > img.brand-wordmark {
        width: 130px;
        height: auto;
    }
    .header-cta {
        font-size: 12px;
        gap: 5px;
        max-width: 145px;
    }
    .hero {
        min-height: 740px;
        height: auto;
        padding-block: 155px 100px;
    }
    .hero-photo {
        inset: 0;
    }
    .hero-photo img {
        object-position: 59% center;
    }
    .hero::after {
        background: linear-gradient(90deg, rgba(237,243,245,.88), rgba(239,242,238,.60) 60%, rgba(240,239,232,.12));
    }
    .hero-copy {
        padding-top: 0;
    }
    .hero .eyebrow {
        font-size: 16px;
        line-height: 2;
    }
    .hero h1 {
        font-size: clamp(27px, 7.2vw, 38px);
    }
    .hero-brand .brand-wordmark-slot > img.brand-wordmark {
        width: min(260px, 74vw);
        height: auto;
    }
    .hero .button {
        font-size: 16px;
        padding: 17px 18px;
    }
    .condition-title {
        width: min(300px, 100%);
        min-height: 210px;
        margin: 0 auto 28px;
    }
    .condition-title .ordinal {
        font-size: 30px;
    }
    .condition-title > p {
        font-size: 23px;
        margin: 4px 0 25px;
    }
    .condition-title h3 {
        font-size: 18px;
    }
    .condition-title h3 br {
        display: initial;
    }
    .season {
        grid-template-columns: 1fr;
        gap: 28px;
        text-align: left;
        font-size: 18px;
    }
    .story-center > .kodenshi-logo {
        width: 200px;
    }
    .material-intro {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .material-brand-logo {
        width: 230px;
        max-width: 80%;
        margin-inline: auto;
    }
    #voices .split-heading p:not(.section-kicker) {
        font-size: 15px;
    }
    .product-image > img.material-badge,
    .duvets .product-image > img.material-badge {
        width: 66px;
        height: auto;
        max-height: 76px;
    }
}


/* ============================================================
   2026-09-24：カード高の統一・説明文の上揃え
   ============================================================ */
/* 各横送り一覧の全カードを最も高いカードに揃える。
   長文の開閉・画面幅・フォント読み込みによる変化にも自動追従する。 */
#voice-track,
#showroom-track {
    align-items: stretch;
    flex-wrap: nowrap;
}

#voice-track > .voice-card,
#showroom-track > .showroom-card {
    align-self: stretch;
    height: auto;
}

/* 写真の表示比率を統一。カード下部の余白で文章量の違いを吸収。 */
#showroom-track > .showroom-card > img {
    width: 100%;
    height: auto;
    aspect-ratio: 1.6;
    object-fit: cover;
}

/* PC・タブレットの説明文を、左側のCONDITIONING枠の上端に揃える。
   スマートフォンの縦並び・本文中の段落間隔は維持する。 */
.condition > .condition-body {
    align-self: start;
    margin-top: 0;
}

/* ============================================================
   2026-09-24 第2版：ロゴ・注記・表示演出・英語見出し・横送り
   ============================================================ */
#conditioning .conditioning-logo {
    width: 240px;
    height: auto;
    max-width: 100%;
    margin-bottom: 18px;
}
#conditioning .trademark-note {
    margin-top: 24px;
}
#conditioning .trademark-note + .note {
    margin-top: 4px;
}

/* 英語名称の直上に読み仮名。名前全体をひとまとまりにする。 */
.product-group-title-bilingual {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 14px 22px;
    line-height: 1.5;
}
.collection-name {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    max-width: 100%;
    line-height: 1.5;
}
.collection-reading {
    display: block;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .10em;
    margin-bottom: 3px;
}
.collection-english {
    display: block;
    font-size: clamp(24px, 2.3vw, 32px);
    font-weight: 500;
    letter-spacing: .045em;
    white-space: nowrap;
}
.result-series {
    font-size: 16px;
    margin-top: 12px;
}

/* 左右の矢印は専用カラムに配置し、カード本文に重ねない。
   中央のスクロール領域だけが横に動く。 */
.carousel-shell {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 48px;
    align-items: center;
    gap: 20px;
    width: 100%;
}
.carousel-shell > .carousel {
    min-width: 0;
    width: 100%;
}
.carousel-shell > .circle-button {
    align-self: center;
    justify-self: center;
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    /* スクロールバー用の下余白を除いた、カードの中央に合わせる。 */
    transform: translateY(-9px);
}
@media (max-width: 700px) {
    #conditioning .conditioning-logo {
        width: 200px;
    }
    .product-group-title-bilingual {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }
    .collection-reading {
        font-size: 11px;
    }
    .collection-english {
        font-size: clamp(22px, 6.5vw, 28px);
        letter-spacing: .025em;
    }
    /* 画面端に矢印を置きながら、カードに使える横幅を確保する。 */
    #voices > .container,
    #stores > .container {
        width: calc(100% - 24px);
    }
    .carousel-shell {
        grid-template-columns: 44px minmax(0, 1fr) 44px;
        gap: 4px;
    }
    .carousel-shell > .circle-button {
        width: 44px;
        height: 44px;
        font-size: 20px;
    }
    .carousel-shell .voice-card,
    .carousel-shell .showroom-card {
        flex-basis: 100%;
    }
    .carousel-shell .voice-card {
        padding: 22px 16px;
    }
    .carousel-shell .showroom-body {
        padding: 22px 16px;
    }
}


/* ============================================================
   2026-09-24 第3版：語句の改行・背景・素材3列・郵便番号
   ============================================================ */
/* 背景は画面幅いっぱい、本文は既存のcontainer幅を維持。 */
#fiber-story {
    background: #f8f1e7;
}

/* 見出し全体の幅を確保し、日本語の語中で分割しない。 */
.condition-title h3 {
    width: 100%;
}
.conditioning-word {
    display: inline-block;
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
    letter-spacing: .025em;
}

/* PCでは住所と同じ行に表示。 */
.dealer-table .postal-code {
    font-size: .8em;
    white-space: nowrap;
}

@media (max-width: 700px) {
    /* PCのコピーの流れを変えず、スマートフォンだけ指定の3行にする。 */
    .hero .eyebrow .hero-copy-line {
        display: block;
        white-space: nowrap;
        word-break: normal;
        overflow-wrap: normal;
    }
    .condition-title h3 {
        font-size: clamp(16px, 4.5vw, 18px);
    }

    /* 3つの素材を縮小して横並び。縦横比を保ち、横送りは使わない。 */
    #material-types .materials {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
        align-items: center;
    }
    #material-types .materials figure {
        display: block;
        min-width: 0;
    }
    #material-types .materials img {
        width: 100%;
        height: auto;
        margin: 0 auto;
    }

    /* 郵便番号と住所を分ける。電話番号などの店舗情報は維持。 */
    .dealer-table .postal-code {
        display: block;
        margin-bottom: 2px;
    }
}


/* 2026-09-25：ショールームの停止位置をカード左端に統一。 */
#showroom-track {
    padding-inline: 0;
    scroll-padding-inline: 0;
}
@media (max-width: 700px) {
    #showroom-track > .showroom-card {
        flex: 0 0 100%;
        scroll-snap-align: start;
        scroll-snap-stop: always;
    }
}

/* 商品紹介のコンパクト表示。既存の色・書体・本文幅を引き継ぐ。 */
.lineup-guide {
    margin: -10px 0 30px;
    font-size: 16px;
}
.diagnosis-shortcut {
    display: inline-block;
    margin-top: 10px;
    font-weight: 600;
}
.series-track {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px;
    max-width: 950px;
    margin-inline: auto;
}
.series-card {
    min-width: 0;
    padding: 26px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff8;
}
.series-card h3 {
    font-size: 28px;
    line-height: 1.5;
}
.series-card .section-kicker {
    margin-bottom: 8px;
    font-size: 12px;
    letter-spacing: .12em;
}
.series-feel {
    margin-top: 8px;
    font-size: 17px;
}
.series-card .product-image {
    min-height: 240px;
    padding: 54px 0 10px;
}
.series-card .product-image > img:not(.material-badge) {
    height: 175px;
}
.series-card .representative-note {
    margin: 0 0 16px;
    font-size: 12px;
}
.series-types {
    margin-bottom: 18px;
    font-size: 16px;
}
.product-details {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}
.product-details > summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 0;
    list-style: none;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
}
.product-details > summary::-webkit-details-marker { display: none; }
.product-details > summary::after {
    content: '+';
    flex: none;
    font-family: var(--sans);
    font-size: 22px;
}
.product-details[open] > summary::after { content: '−'; }
.product-details-body { padding: 0 0 20px; }
.series-product + .series-product,
.mattress-type + .mattress-type {
    border-top: 1px solid var(--line);
    margin-top: 18px;
    padding-top: 18px;
}
.series-product,
.mattress-type { scroll-margin-top: 115px; }
.series-product h4 { font-size: 22px; }
.series-product .product-kind { margin-top: 0; }
.series-product .model { font-size: 14px; }
.series-nav,
.series-help { display: none; }
.mattress-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: start;
    gap: 45px;
    max-width: 950px;
    margin-inline: auto;
}
.mattress-copy { padding-top: 24px; }
.mattress-copy > h4 { margin-bottom: 18px; }
.mattress-types {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    list-style: none;
    margin: 0 0 24px;
    padding: 0;
}
.mattress-types li {
    padding: 6px 15px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    font-size: 16px;
}
.mattress-image-link { display: block; }
.mattress-type h4 { font-size: 20px; }
.mattress-type p { font-size: 16px; }
@media (max-width: 700px) {
    .series-enhanced .series-nav {
        display: flex;
        gap: 10px;
        margin-bottom: 16px;
    }
    .series-nav button {
        flex: 1;
        min-width: 0;
        padding: 12px 8px;
        border: 1px solid var(--line);
        border-radius: var(--radius);
        background: #ffffff80;
        font-size: 15px;
    }
    .series-nav button[aria-pressed=true] {
        background: var(--ink);
        border-color: var(--ink);
        color: #fff;
    }
    .series-track {
        display: flex;
        align-items: flex-start;
        gap: 16px;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x mandatory;
        padding: 6px 0 16px;
    }
    .series-card {
        flex: 0 0 100%;
        scroll-snap-align: start;
        scroll-snap-stop: always;
        padding: 22px 18px;
    }
    .series-card h3 { font-size: 25px; }
    .series-feel,
    .series-types { font-size: 16px; }
    .series-help {
        display: block;
        margin-top: 12px;
        font-size: 12px;
    }
    .series-help span { margin-left: 6px; }
    .lineup-guide { font-size: 15px; }
    .mattress-card {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .mattress-copy { padding-top: 0; }
}

/* コンディショニング：本文はそのまま、表示単位をカードに分ける。 */
.conditioning-group {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    align-items: start;
    gap: clamp(28px, 5vw, 72px);
    border-top: 1px solid var(--line);
    padding: 52px 0 80px;
}
.conditioning-heading {
    position: sticky;
    top: 120px;
    align-self: start;
}
.conditioning-heading .condition-title {
    width: 100%;
    min-height: 210px;
    margin: 0;
}
.conditioning-heading .interview-heading {
    min-height: 140px;
}
.interview-heading h3 {
    font-size: 30px;
    font-weight: 500;
    letter-spacing: .06em;
}
.conditioning-flow { min-width: 0; }
.conditioning-track {
    position: relative;
    display: grid;
    gap: 30px;
}
.conditioning-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    min-height: 330px;
    padding: clamp(28px, 3.5vw, 48px);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #ffffffb3;
    box-shadow: 0 10px 28px #25374a08;
    font-size: 18px;
    line-height: 2;
}
.conditioning-card-body > p + p { margin-top: 22px; }
.conditioning-card h4 {
    margin-bottom: 18px;
    font-size: 25px;
    line-height: 1.7;
}
.conditioning-card > .note { margin-top: 24px; }
.conditioning-research { margin-top: 24px; }
.conditioning-research .research-note {
    border: 0;
    padding-top: 0;
}
.conditioning-diagram figure img {
    width: 100%;
    max-width: 480px;
    height: auto;
    margin-inline: auto;
    mix-blend-mode:normal;
}
.conditioning-diagram figcaption {
    margin-top: 22px;
    font-size: 14px;
    line-height: 1.9;
}
.conditioning-controls,
.conditioning-swipe-help { display: none; }
.interview-person {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    align-items: start;
    gap: 24px;
}
/* 添付画像は加工せず同梱し、写真部分だけをCSSで表示する。 */
.interview-portrait {
    position: relative;
    overflow: hidden;
    width: 120px;
    height: 168px;
    border: 1px solid var(--line);
}
.interview-portrait img {
    position: absolute;
    left: -65px;
    top: -47px;
    width: 1102px;
    height: 246px;
    max-width: none;
}
.interview-profile {
    font-size: 14px;
    line-height: 1.9;
    letter-spacing: .035em;
}
.interview-profile h3 {
    margin: 18px 0 8px;
    font-size: 21px;
    line-height: 1.7;
}
.interview-english {
    display: inline-block;
    font-size: 13px;
    letter-spacing: .02em;
}
.interview-copy {
    margin-top: 30px;
    padding-top: 28px;
    border-top: 1px solid var(--line);
}
.interview-copy p + p { margin-top: 28px; }
@media (max-width: 700px) {
    .conditioning-group {
        display: block;
        padding: 34px 0 46px;
    }
    .conditioning-heading {
        position: static;
        margin-bottom: 24px;
    }
    .conditioning-heading .condition-title {
        width: min(300px, 100%);
        min-height: 180px;
        margin-inline: auto;
        padding-block: 18px;
    }
    .conditioning-heading .interview-heading { min-height: 105px; }
    .conditioning-track {
        display: flex;
        gap: 16px;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x mandatory;
        padding: 6px 0 16px;
    }
    .conditioning-card {
        flex: 0 0 100%;
        min-height: 320px;
        padding: 28px 22px;
        scroll-snap-align: start;
        scroll-snap-stop: always;
        font-size: 17px;
        line-height: 2;
    }
    .conditioning-card h4 { font-size: 22px; }
    .conditioning-enhanced .conditioning-controls:not([hidden]) {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 16px;
        margin-top: 14px;
    }
    .conditioning-controls button {
        width: 44px;
        height: 44px;
        border: 1px solid var(--line);
        border-radius: 50%;
        background: #ffffff80;
        font-size: 20px;
    }
    .conditioning-controls span { font-size: 14px; }
    .conditioning-swipe-help {
        display: block;
        margin-top: 12px;
        font-size: 12px;
    }
    .interview-person { display: block; }
    .interview-person::after { content: ''; display: block; clear: both; }
    .interview-portrait { float: left; margin: 0 18px 14px 0; }
    .interview-profile { font-size: 14px; }
    .interview-profile h3 { clear: both; font-size: 22px; }
    .interview-copy { margin-top: 24px; padding-top: 24px; }
}

/* 2026-10-08：テキスト見出し・PCカード横送り・小物商品の2列配置。 */
.conditioning-heading .condition-title {
    align-items: flex-start;
    justify-content: flex-start;
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
    overflow: visible;
}
.conditioning-heading .condition-title::before { content: none; }
.conditioning-heading .ordinal,
.conditioning-heading .condition-title > p,
.conditioning-heading .condition-title h3 { font-weight: 600; }
.conditioning-heading .condition-title > p { margin: 8px 0 18px; }
.conditioning-heading .condition-title h3 { font-size: 19px; }
.conditioning-heading .interview-heading h3 { font-size: 30px; }
.conditioning-track {
    gap: 24px;
    align-items: start;
}
.conditioning-track[data-card-count="2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.conditioning-track[data-card-count="4"] {
    display: flex;
    align-items: flex-start;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    padding: 6px 0 16px;
}
.conditioning-track[data-card-count="4"] > .conditioning-card {
    flex: 0 0 calc((100% - 24px) / 2);
    scroll-snap-align: start;
    scroll-snap-stop: always;
}
.conditioning-card {
    justify-content: flex-start;
    min-height: 0;
    padding: 28px;
}
.conditioning-card h4 { font-size: 22px; margin-bottom: 14px; }
.conditioning-card-body > p + p { margin-top: 18px; }
.conditioning-diagram figure img { max-width: 100%; }
.conditioning-enhanced .conditioning-controls:not([hidden]) {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-top: 14px;
}
.conditioning-controls button {
    width: 44px;
    height: 44px;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: #ffffff80;
    font-size: 20px;
}
.conditioning-controls span { font-size: 14px; }
.accessory-products {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 48px;
}
.accessory-product { min-width: 0; }
.accessory-product .category-head { margin-top: 0; }
.accessory-product .category-head h2 { font-size: clamp(24px, 2.2vw, 30px); }
.accessory-product .single-product { grid-template-columns: minmax(0, 1fr); }
.series-card .product-details { margin-top: 16px; }
@media (max-width: 700px) {
    .conditioning-heading .condition-title {
        width: 100%;
        min-height: 0;
        margin: 0;
        padding: 0;
    }
    .conditioning-track,
    .conditioning-track[data-card-count="2"],
    .conditioning-track[data-card-count="4"] {
        display: flex;
        align-items: flex-start;
        gap: 16px;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-x: contain;
        scroll-snap-type: x mandatory;
        padding: 6px 0 16px;
    }
    .conditioning-track > .conditioning-card,
    .conditioning-track[data-card-count="4"] > .conditioning-card {
        flex: 0 0 100%;
        padding: 24px 22px;
    }
    .accessory-products { grid-template-columns: 1fr; gap: 56px; }
}

/* セクションの切り替えと、導入・効果のカードを明確に分ける。 */
#conditioning { background: #f8fafc; }
#voices { background: #eaf2f6; }
#faq { background: #fff; }
#stores { background: #faf3e8; }
.conditioning-section-title { margin: 8px 0 28px; }
.conditioning-heading .ordinal { font-size: 20px; margin-bottom: 12px; }
.conditioning-lead { margin-top: 24px; font-size: 15px; line-height: 2; }
.conditioning-intro {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    margin-bottom: 30px;
    padding: 32px;
    background: #fff;
}
.conditioning-intro::before {
    content: '';
    position: absolute;
    z-index: -1;
    inset: 0 0 auto;
    height: 70%;
    background: linear-gradient(105deg, #ddebf8, #fcebd7);
    border-radius: 0 0 50% 50% / 0 0 40% 40%;
}
.conditioning-carousel {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    align-items: center;
    gap: 12px;
}
.conditioning-carousel > .conditioning-track { grid-column: 2; grid-row: 1; }
.conditioning-arrow {
    width: 44px;
    height: 44px;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: #ffffffc0;
    font-size: 20px;
    align-self: center;
    justify-self: center;
}
.conditioning-arrow[hidden] { display: none !important; }
.conditioning-arrow[data-conditioning-direction="-1"] { grid-column: 1; grid-row: 1; }
.conditioning-arrow[data-conditioning-direction="1"] { grid-column: 3; grid-row: 1; }
.conditioning-track[data-card-count="3"] {
    display: flex;
    align-items: stretch;
    gap: 20px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    padding: 6px 0 16px;
}
.conditioning-track[data-card-count="3"] > .conditioning-card {
    flex: 0 0 calc((100% - 72px) / 2);
    scroll-snap-align: start;
    scroll-snap-stop: always;
}
.conditioning-track[data-card-count="3"]::after { content: ''; flex: 0 0 32px; }
.conditioning-track {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.conditioning-track::-webkit-scrollbar { display: none; }
.conditioning-carousel[data-carousel-size="2"] { grid-template-columns: minmax(0, 1fr); }
.conditioning-carousel[data-carousel-size="2"] > .conditioning-track { grid-column: 1; align-items: stretch; }
.conditioning-card { background: #fff; }
.effect-card { border-top: 3px solid var(--blue); }
.effect-card h4 { font-size: 20px; line-height: 1.7; }
.effect-number { display: block; font-size: 13px; color: #49667a; margin-bottom: 6px; }
.conditioning-evidence { margin-top: 24px; }
.conditioning-evidence > .note { font-size: 13px; line-height: 1.9; }
.conditioning-evidence .conditioning-research { margin-top: 16px; }
.horizontal-product {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 30px;
    align-items: center;
}
#polyester.single-product { grid-template-columns: minmax(0, 1fr); max-width: 950px; margin-inline: auto; }
.horizontal-product-copy { min-width: 0; }
.horizontal-product-copy .product-kind { margin-top: 0; }
.accessory-product .horizontal-product { gap: 20px; }
.accessory-product .horizontal-product h4 { font-size: 22px; }
.accessory-product .horizontal-product .product-description { font-size: 16px; }
.accessory-product .horizontal-product .product-image { padding-inline: 0; }
@media (max-width: 1000px) and (min-width: 701px) {
    .conditioning-group { grid-template-columns: 190px minmax(0, 1fr); gap: 24px; }
    .conditioning-card { padding: 22px; }
    .conditioning-track[data-card-count="3"] > .conditioning-card { flex-basis: calc(100% - 44px); }
    .conditioning-track[data-card-count="3"]::after { flex-basis: 24px; }
}
@media (max-width: 700px) {
    .conditioning-intro { padding: 28px 22px; }
    .conditioning-carousel,
    .conditioning-carousel[data-carousel-size="2"] { grid-template-columns: 36px minmax(0, 1fr) 36px; gap: 8px; }
    .conditioning-carousel > .conditioning-track,
    .conditioning-carousel[data-carousel-size="2"] > .conditioning-track { grid-column: 2; align-items: stretch; }
    .conditioning-arrow { width: 36px; height: 36px; font-size: 18px; }
    .conditioning-track[data-card-count="3"] { gap: 16px; }
    .conditioning-track[data-card-count="3"] > .conditioning-card { flex: 0 0 100%; }
    .conditioning-track[data-card-count="3"]::after { content: none; }
    .conditioning-carousel .conditioning-card { padding: 24px 18px; }
    .horizontal-product { grid-template-columns: 1fr; gap: 16px; }
    .accessory-product .horizontal-product { grid-template-columns: 1fr; gap: 16px; }
    .conditioning-lead { margin-top: 18px; }
}

/* 全面グラデーション、素材の補足説明、商品紹介の見出し。 */
.conditioning-intro,
.conditioning-gradient { background: linear-gradient(105deg, #ddebf8, #fcebd7); }
.conditioning-intro::before { content: none; }
.conditioning-heading .condition-title h3 { font-size: 30px; line-height: 1.7; }
.conditioning-group { grid-template-columns: 300px minmax(0, 1fr); }
.material-intro {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: 48px;
}
.material-feature-heading {
    font-size: clamp(21px, 2.2vw, 28px);
    line-height: 1.8;
    letter-spacing: .025em;
}
.material-icon-guide { margin: 0 0 28px; font-size: 14px; line-height: 1.9; }
#material-types .materials { align-items: start; }
#material-types .materials figure { min-width: 0; }
#material-types .materials figcaption { margin-top: 18px; }
#material-types .materials figcaption strong {
    display: block;
    font-size: 20px;
    line-height: 1.7;
    font-weight: 600;
}
#material-types .materials figcaption span {
    display: block;
    margin-top: 8px;
    font-size: 15px;
    line-height: 1.9;
    letter-spacing: .025em;
}
.lineup-section-title { margin: 10px 0 28px; }
.lineup .section-heading .section-kicker { font-size: 14px; }
.lineup-concept-text { margin-top: 22px; font-size: 20px; }
/* 二重に加算されていたマットレス見出しの上余白を外し、
   商品末尾から次の見出しまでの間隔をマットレス下と揃える。 */
#mattress-section > .category-head { margin-top: 0; }
@media (max-width: 1000px) and (min-width: 701px) {
    .conditioning-group { grid-template-columns: 1fr; gap: 28px; }
    .conditioning-heading { position: static; }
    .material-intro { gap: 32px; }
}
@media (max-width: 700px) {
    .conditioning-group { display: block; }
    .material-intro { grid-template-columns: 1fr; gap: 24px; }
    .material-feature-heading { font-size: 21px; }
    .material-icon-guide { font-size: 13px; margin-bottom: 22px; }
    #material-types .materials figcaption { min-width: 0; text-align: center; margin-top: 14px; }
    #material-types .materials figcaption strong { font-size: 15px; letter-spacing: 0; }
    #material-types .materials figcaption span { font-size: 12px; line-height: 1.8; letter-spacing: 0; }
    .lineup-concept-text { font-size: 17px; }
}

/* 共通の見出し：小見出しを近づけ、英語と日本語で色を分ける。 */
:is(#conditioning, #lineup, #voices, #faq, #stores) .section-kicker {
    margin-bottom: 6px;
    color: #25374a;
}
:is(#conditioning, #lineup, #voices, #faq, #stores, #ec) .section-title-block {
    margin-top: 0;
    margin-bottom: 28px;
}
.section-title-block > br { display: none; }
.section-title-en { display: block; color: #4f7185; }
.section-title-ja { display: block; color: #25374a; margin-top: 4px; }
.section-title-ja:first-child { margin-top: 0; }
#lineup > .container > .section-heading,
#ec > .section-heading { text-align: left; margin-inline: 0; }
#material-types .materials figcaption span { margin-top: 0; }

/* 上部メニュー。本文のジャンプ先は固定ヘッダーの下に収める。 */
:root { --navigation-height: 76px; }
html { scroll-padding-top: calc(var(--navigation-height) + 16px); }
.site-navigation {
    position: fixed;
    inset: 0 0 auto;
    z-index: 50;
    height: var(--navigation-height);
    padding: 0;
    background: #fffffff2;
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--line);
}
.site-nav-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: min(1320px, calc(100% - 64px));
    height: 100%;
    margin-inline: auto;
}
.site-menu-brand { display: block; flex: none; }
.site-menu-brand img { width: 140px; height: auto; }
.primary-menu-list,
.nav-submenu { list-style: none; margin: 0; padding: 0; }
.primary-menu-list { display: flex; align-items: center; gap: 20px; }
.primary-menu-list > li > a,
.nav-group > summary {
    display: block;
    padding: 12px 0;
    color: var(--ink);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.primary-menu a:hover { text-decoration: underline; }
.nav-group { position: relative; }
.nav-group > summary { list-style: none; cursor: pointer; }
.nav-group > summary::-webkit-details-marker { display: none; }
.nav-group > summary::after { content: ' ▾'; font-size: 10px; }
.nav-group[open] > summary::after { content: ' ▴'; }
.nav-submenu {
    position: absolute;
    top: 100%;
    left: -16px;
    min-width: 240px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
    box-shadow: 0 10px 28px #25374a1a;
}
.nav-submenu a {
    display: block;
    padding: 10px 12px;
    font-size: 14px;
    line-height: 1.7;
    text-decoration: none;
}
.menu-toggle { display: none; }
.menu-toggle[hidden] { display: none !important; }
@media (max-width: 1100px) {
    :root { --navigation-height: 68px; }
    .site-nav-inner { width: calc(100% - 32px); gap: 16px; }
    .site-menu-brand img { width: 125px; }
    .nav-enhanced .menu-toggle:not([hidden]) {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
        width: 48px;
        height: 48px;
        padding: 8px;
        border: 1px solid var(--line);
        border-radius: var(--radius);
        background: transparent;
    }
    .menu-toggle-icon {
        position: relative;
        width: 22px;
        height: 2px;
        background: var(--ink);
    }
    .menu-toggle-icon::before,
    .menu-toggle-icon::after {
        content: '';
        position: absolute;
        left: 0;
        width: 22px;
        height: 2px;
        background: var(--ink);
    }
    .menu-toggle-icon::before { top: -6px; }
    .menu-toggle-icon::after { top: 6px; }
    .menu-toggle-label { font: 9px var(--sans); letter-spacing: .08em; }
    .is-menu-open .menu-toggle-icon { background: transparent; }
    .is-menu-open .menu-toggle-icon::before { top: 0; transform: rotate(45deg); }
    .is-menu-open .menu-toggle-icon::after { top: 0; transform: rotate(-45deg); }
    .nav-enhanced .primary-menu {
        display: none;
        position: fixed;
        inset: var(--navigation-height) 0 auto;
        max-height: calc(100dvh - var(--navigation-height));
        overflow-y: auto;
        padding: 16px 24px 24px;
        border-bottom: 1px solid var(--line);
        background: #fff;
        box-shadow: 0 12px 24px #25374a14;
    }
    .is-menu-open .primary-menu { display: block; }
    .primary-menu-list { display: block; }
    .primary-menu-list > li { border-bottom: 1px solid var(--line); }
    .primary-menu-list > li > a,
    .nav-group > summary { padding: 15px 0; font-size: 15px; }
    .nav-submenu { position: static; min-width: 0; padding: 0 0 12px 8px; border: 0; box-shadow: none; }
    /* JS無効時も、リンクとネイティブの開閉を利用できる。 */
    .site-navigation:not(.nav-enhanced) { position: relative; height: auto; }
    .site-navigation:not(.nav-enhanced) .site-nav-inner { display: block; padding-block: 16px; }
    .site-navigation:not(.nav-enhanced) .site-menu-brand { margin-bottom: 12px; }
}

/* Interview：生年・肩書を詰め、コメントは両段落を同じ幅で折り返す。 */
.interview-profile h3 { margin-bottom: 4px; }
.interview-profile h3 ~ p {
    margin: 0;
    line-height: 1.5;
    text-wrap: wrap;
    word-break: normal;
}
.interview-profile h3 ~ p + p { margin-top: 4px; }
.interview-copy p {
    width: auto;
    max-width: none;
    text-wrap: wrap;
    word-break: normal;
    line-break: strict;
    overflow-wrap: anywhere;
}
/* SVGはそのまま使い、同じ表示枠・下端に揃える。説明も同じ高さから始まる。 */
#material-types .materials img {
    display: block;
    width: 100%;
    max-width: 240px;
    height: 240px;
    margin: 0 auto;
    object-fit: contain;
    object-position: center bottom;
}
@media (max-width: 700px) {
    #material-types .materials img { height: clamp(90px, 28vw, 196px); }
}

/* Lineupのスマートフォン表示は、本文途中の固定改行を外して自然に流す。
   英語／日本語のタイトル区切りは、既存のブロック表示で保持する。 */
@media (max-width:700px) {
    #lineup > .container > .section-heading > p br { display:none; }
}

/* 診断への導線と選択肢。キーボード・タップでも反応する。 */
.hero .button.primary, #diagnosis .button.primary, .quiz-choice {
    transition: background .18s ease-out, border-color .18s ease-out, transform .18s ease-out;
}
.hero .button.primary:focus-visible, #diagnosis .button.primary:focus-visible, .quiz-choice:focus-visible {
    outline: 3px solid #49667a;
    outline-offset: 4px;
}
.hero .button.primary:focus-visible, #diagnosis .button.primary:focus-visible {
    background: #eda268;
}
.quiz-choice:focus-visible { background: #e1edf2; border-color: #6e98b0; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .quiz-choice:hover { transform: translateY(-2px); }
}
@media (prefers-reduced-motion: no-preference) {
    .hero .button.primary:focus-visible, #diagnosis .button.primary:focus-visible {
        transform: translateY(-2px);
    }
    .hero .button.primary:active, #diagnosis .button.primary:active, .quiz-choice:active {
        transform: translateY(0) scale(.99);
    }
}
.hero .button.primary:active, #diagnosis .button.primary:active { background: #e49a61; }
.quiz-choice:active { background: #d4e5ee; border-color: #6e98b0; }

/* 背景の色だけは「視差効果を減らす」がオンでもスクロールに追従。 */
.scroll-atmosphere { display: none; }
body.atmosphere-enhanced { isolation: isolate; }
.atmosphere-enhanced .scroll-atmosphere {
    display: block;
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
}
.scroll-atmosphere > div { position: absolute; inset: 0; }
.atmosphere-next { opacity: 0; }
.atmosphere-enhanced #conditioning,
.atmosphere-enhanced #fiber-story,
.atmosphere-enhanced .lineup,
.atmosphere-enhanced #diagnosis,
.atmosphere-enhanced #voices,
.atmosphere-enhanced #faq,
.atmosphere-enhanced #stores { background: transparent; }
@media (prefers-reduced-motion: no-preference) {
    .atmosphere-enhanced #conditioning .conditioning-card.is-visible.has-exited {
        opacity: var(--card-exit-opacity, 1);
        transition: opacity 0s, translate .65s cubic-bezier(.22, 1, .36, 1);
    }
    .atmosphere-enhanced #conditioning .conditioning-card:focus-within { opacity: 1; }
}

/* 01導入と02・03の説明だけ濃い単色。図解と効果カードは元のまま。 */
#conditioning .conditioning-intro,
#conditioning .conditioning-gradient {
    background: #49667a;
    color: #fff;
    border-color: #49667a;
}
#conditioning .conditioning-intro::before,
#conditioning .conditioning-gradient::before { display: none; }
#conditioning .conditioning-intro .feature-underline,
#conditioning .conditioning-gradient .feature-underline {
    color: inherit;
    border-color: currentColor;
    text-decoration-color: currentColor;
}

/* 2026-10-15：画像の出し分け、FV配置、表示順。素材アイコンの指定は維持。 */
.hero-photo picture { display: block; width: 100%; height: 100%; }
.hero-copy { width: min(1320px, calc(100% - 64px)); }
.hero h1 { font-size: clamp(32px, 3.2vw, 50px); }
.curtain-section { padding: 48px 0 0; }
.curtain-frame video { display: block; width: 100%; height: auto; background: #e9eeec; }
.series-card .product-details > summary { padding-right: 38px; overflow-wrap: anywhere; }
@keyframes hero-copy-appear {
    from { opacity: 0; translate: 0 8px; }
    to { opacity: 1; translate: 0 0; }
}
@media (prefers-reduced-motion: no-preference) {
    .hero-sequence-pending .hero .eyebrow,
    .hero-sequence-pending .hero h1 { opacity: 0; }

}
@media (max-width: 700px) {
    /* 元の縦長画像全体を収め、手元を切らない。画面の高さではなく画像比率を基準にする。 */
    .hero { height: auto; min-height: max(640px, calc(100vw * 796 / 528)); padding: 100px 0 58px; align-items: flex-start; }
    .hero-photo picture { height: auto; aspect-ratio: 528 / 796; }
    .hero-photo img { height: auto; aspect-ratio: 528 / 796; object-fit: contain; object-position: center top; opacity: 1; }
    .hero { background: #dce7ed; }
    .hero-copy { width: calc(100% - 40px); margin: 0 auto; padding-top: 0; }
    .hero h1 { font-size: clamp(23px, 6vw, 32px); letter-spacing: .04em; }
    .hero .eyebrow { font-size: 13px; margin-bottom: 18px; }
    .hero-brand { margin-top: 22px; }
    .hero-brand .brand-wordmark-slot > img.brand-wordmark { width: min(220px, 64vw); }
    .hero .button { margin-top: 26px; font-size: 13px; padding: 15px 16px; }
    .hero::after { background: linear-gradient(90deg,rgba(237,243,245,.85),rgba(239,242,238,.45) 65%,rgba(240,239,232,.05)); }
    .curtain-section { padding-top: 28px; }
}

/* 白地のロゴ導入→写真→導入文→主見出し→診断ボタン */
.intro-splash { display: none; }
.intro-active .intro-splash {
    display: grid; place-items: center; position: fixed; inset: 0;
    z-index: 10000; background: #fff;
}
.intro-splash img { width: min(300px, 64vw); height: auto; }
.intro-active body > :not(.intro-splash) { visibility: hidden; }
.curtain-media { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: #ebece7; }
.curtain-poster { display: block; width: 100%; height: 100%; object-fit: cover; }
.curtain-media #curtain-video {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
    opacity: 0; pointer-events: none;
}
.curtain-media.is-playing #curtain-video { opacity: 1; }
.curtain-media #curtain-video::-webkit-media-controls { display: none !important; }
.curtain-media #curtain-video::-webkit-media-controls-start-playback-button { display: none !important; }
@keyframes hero-photo-appear { from { opacity: 0; } to { opacity: 1; } }
@keyframes intro-leave { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: no-preference) {
    .intro-leaving .intro-splash {
        display: grid; place-items: center; position: fixed; inset: 0;
        z-index: 10000; background: #fff; pointer-events: none;
        animation: intro-leave .6s ease-out both;
    }
    .hero-sequence-pending .hero .eyebrow,
    .hero-sequence-pending .hero h1,
    .hero-sequence-pending .hero .hero-brand,
    .hero-sequence-pending .hero .button,
    .hero-sequence-pending .hero .scroll-cue { opacity: 0; }
    .hero-sequence-ready .hero-photo { animation: hero-photo-appear 1.2s ease-out both; }
    .hero-sequence-ready .hero .eyebrow { animation: hero-copy-appear 1.3s cubic-bezier(.22,1,.36,1) 1.3s both; }
    .hero-sequence-ready .hero h1 { animation: hero-copy-appear 1.5s cubic-bezier(.22,1,.36,1) 2.8s both; }
    .hero-sequence-ready .hero .hero-brand { animation: hero-copy-appear 1.1s ease-out 3s both; }
    .hero-sequence-ready .hero .button { animation: hero-copy-appear .85s ease-out 4.5s both; }
    .hero-sequence-ready .hero .button:focus-visible { animation: none; opacity: 1; translate: none; }
    .hero-sequence-ready .hero .scroll-cue { animation: hero-copy-appear .6s ease-out 5.3s both; }
}

/* コンセプトの後、動画の前に配置するコンテンツ選択。 */
.content-choices { padding: 60px 0; background: transparent; }
.content-choices-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.content-choice { display: flex; flex-direction: column; min-width: 0; text-decoration: none; color: #25374a; border: 1px solid #d8e1e6; }
.choice-photo { width: 100%; aspect-ratio: 16 / 10; overflow: hidden; background: #fff; }
.choice-photo img { display: block; width: 100%; height: 100%; object-fit: cover; mix-blend-mode: normal; }
.choice-product-photo img { object-fit: contain; padding: 16px; }
.choice-faq-photo img { object-position: center 45%; }
.choice-copy { position: relative; flex: 1; padding: 24px 24px 64px; text-align: center; }
.choice-copy p { font-size: 13px; line-height: 1.8; margin: 0 0 8px; }
.choice-copy h2 { font-size: clamp(18px,1.6vw,24px); line-height: 1.7; letter-spacing: .02em; margin: 0; }
.choice-conditioning .choice-copy { background: #eaf3f7; }
.choice-products .choice-copy { background: #fbe8d1; }
.choice-faq .choice-copy { background: #f7f4ec; }
.choice-arrow { position: absolute; right: 20px; bottom: 16px; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: #49667a; color: #fff; font-family: Arial,sans-serif; }
.content-choice:focus-visible { outline: 3px solid #49667a; outline-offset: 5px; }
@media (hover: hover) {
 .content-choice:hover .choice-arrow { background: #25374a; }
}
@media (max-width:700px) {
 .content-choices { padding: 36px 0; }
 .content-choices-grid { grid-template-columns: 1fr; gap: 24px; }
 .choice-copy { padding: 20px 24px 64px; }
 .choice-copy h2 { font-size: 22px; }
}

/* ①選択セクションは背面の連続グラデーションを表示。画像枠は既存のまま。 */
.faq-diagnosis-link { color: #49667a; text-decoration: underline; text-underline-offset: .2em; }
.faq-diagnosis-link:focus-visible, .company-logo-link:focus-visible { outline: 3px solid #49667a; outline-offset: 4px; }
.company-logo-link { display: inline-block; line-height: 0; }
.company-logo-link img { display: block; width: min(230px,70vw); height: auto; mix-blend-mode: normal; }

/* FAQの質問を一つの文章として折り返す。Q／質問本文／開閉記号の3列。 */
.faq-item summary {
    display: grid;
    grid-template-columns: 1.4em minmax(0, 1fr) 1.5em;
}
.faq-question {
    display: block;
    min-width: 0;
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
}
.faq-question .faq-brand {
    display: inline-block;
    white-space: nowrap;
}

/* 2026-10-16：通常写真へ変更。従来の横長シート用の切り抜き指定を解除。 */
.interview-portrait img {
    position: static;
    left: auto;
    top: auto;
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: cover;
    object-position: 50% 30%;
}
.product-name-link { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.product-name-link::after { content: '↗'; display: inline-block; font: .65em Arial,sans-serif; margin-left: .4em; }
.product-name-link:focus-visible { outline: 3px solid #49667a; outline-offset: 4px; }
@media (max-width: 700px) {
    /* 写真をFV全体に敷き、Scrollを画像内に収める。 */
    .hero { min-height: max(640px, 100vh); min-height: max(640px, 100svh); height: auto; padding: 112px 0 100px; }
    .hero-photo { inset: 0; }
    .hero-photo picture { height: 100%; aspect-ratio: auto; }
    .hero-photo img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; object-position: 50% 50%; }
    .hero .scroll-cue { bottom: 30px; }
}

/* 2026-10-19：PDF指示の配置・画像・商品説明を反映。表示アニメーションの秒数は維持。 */
.hero { --hero-mark-width: clamp(280px, 27vw, 390px); }
.hero-copy { width: min(1320px, calc(100% - 64px)); padding-top: 96px; }
.hero > .eyebrow {
 position: absolute; top: 100px; left: max(32px, calc((100% - 1320px) / 2));
 margin: 0; max-width: calc(100% - 48px); font-size: clamp(11px, 1vw, 14px);
 letter-spacing: .04em; white-space: nowrap;
}
.hero > .eyebrow .hero-copy-line { display: inline; }
.hero h1 { width: var(--hero-mark-width); white-space: nowrap; font-size: calc(var(--hero-mark-width) / 16); letter-spacing: .02em; line-height: 1.7; }
.hero-brand { margin-top: 10px; }
.hero-brand .brand-wordmark-slot > img.brand-wordmark { width: var(--hero-mark-width); height: auto; }
.hero .button { margin-top: 26px; }
.concept-glow { position: absolute; width: min(500px, 86vw); height: auto; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; pointer-events: none; }
#material-types .materials img { max-width: 340px; height: auto; aspect-ratio: 4 / 3; object-fit: contain; }
.series-card h3 { display: flex; align-items: center; gap: 12px; }
.series-emblem { width: 64px; height: 64px; object-fit: contain; flex: none; }
.plus-emblem { width: 64px; height: 64px; object-fit: contain; margin-bottom: 12px; }
.series-card .product-image { padding-top: 85px; min-height: 310px; }
.series-card .product-image > img:not(.material-badge) { height: 225px; }
.product-image > img.material-badge, .duvets .product-image > img.material-badge { width: 88px; max-width: 25%; height: auto; max-height: 88px; }
.series-product { display: grid; grid-template-columns: minmax(0, 1fr) minmax(100px, 38%); gap: 16px; align-items: center; }
.series-product-copy { min-width: 0; }
.series-product-photo { display: block; }
.series-product-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: contain; mix-blend-mode: normal; }
.series-product-photo:focus-visible { outline: 3px solid #49667a; outline-offset: 3px; }
.back-to-top { position: fixed; right: max(20px, env(safe-area-inset-right)); bottom: max(20px, env(safe-area-inset-bottom)); z-index: 80; width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid #ffffff80; border-radius: 50%; background: #49667a; color: #fff; cursor: pointer; box-shadow: 0 3px 14px #283c4b20; }
.back-to-top[hidden] { display: none; }
.back-to-top:hover { background: #344e60; }
.back-to-top:focus-visible { outline: 3px solid #df8849; outline-offset: 3px; }
@media (max-width:700px) {
 .hero { --hero-mark-width: min(280px, 76vw); }
 .hero > .eyebrow { top: 84px; left: 20px; max-width: calc(100% - 40px); font-size: clamp(9px, 2.45vw, 13px); letter-spacing: 0; }
 .hero-copy { width: calc(100% - 40px); padding-top: 0; margin-top: clamp(100px, 25vw, 150px); }
 .hero h1 { font-size: calc(var(--hero-mark-width) / 16); letter-spacing: 0; }
 .hero-brand { margin-top: 8px; }
 .hero-brand .brand-wordmark-slot > img.brand-wordmark { width: var(--hero-mark-width); }
 .concept { padding: 90px 20px; }
 .concept h2 { font-size: clamp(13px, 3.35vw, 18px); letter-spacing: .02em; }
 .concept h2 .phrase { display: inline; white-space: normal; }
 .concept .poem { font-size: clamp(17px, 4.3vw, 23px); line-height: 2.5; margin: 80px 0 72px; }
 .concept-body { font-size: clamp(10px, 2.55vw, 13px); line-height: 2.5; letter-spacing: 0; }
 .concept-glow { top: 47%; width: min(300px, 72vw); }
 .series-emblem, .plus-emblem { width: 52px; height: 52px; }
 .series-card h3 { gap: 8px; }
 .series-card .product-image { min-height: 260px; padding-top: 80px; }
 .series-card .product-image > img:not(.material-badge) { height: 180px; }
 .series-product { grid-template-columns: minmax(0,1fr) minmax(88px,36%); gap: 10px; }
 .series-product h4 { font-size: 20px; }
 .series-product .product-kind { font-size: 13px; }
 .back-to-top { right: max(14px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); }
}

/* 2026-10-19 追加修正①〜⑨。GTM停止および既存の動作時間は維持。 */
/* 色玉を中央3行専用の領域に置き、前後の本文との重なりを防ぐ。 */
.concept { --concept-orb-size: min(500px, 86vw); }
.concept-core { position: relative; isolation: isolate; display: grid; place-items: center; min-height: var(--concept-orb-size); margin: 64px 0; }
.concept-core .concept-glow { width: var(--concept-orb-size); max-width: 100%; height: auto; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.concept .concept-core .poem { margin: 0; }
.concept h2, .concept .concept-body { position: relative; margin-block: 0; }
/* 白背景はVeil/Hugのカードに適用。HarmonyPlusは従来の背景を維持。 */
.series-card { background: #fff; }
/* 同じ画面幅で、Veilと各商品の表示枠・アイコン寸法を統一。 */
:root { --product-stage-width: 407px; --product-art-height: 225px; --product-art-width: 340.664px; }
.product-image, .series-card .product-image, .accessory-product .horizontal-product .product-image {
 box-sizing: border-box; width: var(--product-stage-width); max-width: 100%; height: calc(var(--product-art-height) + 95px); min-height: 0;
 padding: 85px 0 10px; margin-inline: auto; display: flex; align-items: center; justify-content: center;
}
.series-card .product-image { width: 100%; }
.product-image > .main-product-art, .series-card .product-image > img:not(.material-badge) {
 display: block; flex: none; width: min(100%, var(--product-art-width)); max-width: 100%; height: var(--product-art-height); object-fit: contain; mix-blend-mode: normal;
}
.product-image > img.material-badge, .duvets .product-image > img.material-badge {
 width: min(88px, calc(var(--product-stage-width) * .25)); max-width: none; height: auto; max-height: none;
 inset: 12px 12px auto auto; transform: none;
}
/* 広げた画像が本文に重ならないよう、横並びの商品説明に必要な幅を確保。 */
.accessory-products { grid-template-columns: minmax(0,1fr); max-width: 950px; gap: 64px; }
.horizontal-product, .accessory-product .horizontal-product, .mattress-card { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 30px; }
.core-description span { white-space: nowrap; }
/* FVの2つのコピーと診断ボタンを、共通の左右端へ揃える。 */
.hero > .eyebrow { width: var(--hero-mark-width); font-size: calc(var(--hero-mark-width) / 20); letter-spacing: 0; }
.hero > .eyebrow, .hero h1 { text-align: justify; text-align-last: justify; }
.hero .button { box-sizing: border-box; width: var(--hero-mark-width); max-width: 100%; justify-content: center; text-align: center; padding-inline: 12px; font-size: clamp(11px, calc(var(--hero-mark-width) / 23), 16px); white-space: nowrap; }
/* Plusアイコン・商品名・品番を1行に。画像と本文の配置順は維持。 */
.plus-product-heading { display: flex; align-items: center; gap: 10px; min-width: 0; }
.plus-product-heading .plus-emblem { flex: none; width: 52px; height: 52px; margin: 0; }
.plus-product-heading h4 { margin: 0; font-size: clamp(22px, 2.1vw, 30px); min-width: 0; line-height: 1.5; }
.plus-product-heading .product-name-link { white-space: nowrap; }
.plus-product-heading .model { font-size: .6em; }
.plus-product-heading .product-name-link::after { margin-left: .2em; }
/* 英字の直上にフリガナを近接配置する。 */
.collection-name { gap: 0; line-height: 1; }
.collection-reading { margin: 0 0 2px; line-height: 1.1; }
.collection-english { line-height: 1.12; }
@media (max-width:700px) {
 :root { --product-art-height: 180px; --product-art-width: 272.532px; }
 .concept { --concept-orb-size: min(340px, 86vw); }
 .concept-core { margin: 48px 0; }
 .concept .concept-core .poem { font-size: clamp(16px, 4.3vw, 23px); line-height: 2.5; }
 .horizontal-product, .accessory-product .horizontal-product, .mattress-card { grid-template-columns: minmax(0,1fr); gap: 16px; }
 .product-image, .series-card .product-image, .accessory-product .horizontal-product .product-image { height: calc(var(--product-art-height) + 90px); padding-top: 80px; }
 .hero > .eyebrow { font-size: calc(var(--hero-mark-width) / 20); }
 .hero .button { font-size: clamp(11px, 2.9vw, 13px); }
 .plus-product-heading { gap: 8px; }
 .plus-product-heading .plus-emblem { width: 42px; height: 42px; }
 .plus-product-heading h4 { font-size: clamp(19px, 5.8vw, 25px); letter-spacing: 0; }
 .collection-reading { margin-bottom: 1px; line-height: 1.1; }
}

/* 2026-10-20：FV・文字組み・コンテンツ選択・アクセサリー横並びの修正。 */
.concept-body { font-size: 20px; letter-spacing: 0; }
.concept-sentence { display: block; width: max-content; max-width: none; margin-inline: auto; white-space: nowrap; }
.choice-copy { padding: 22px 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.choice-copy p { min-height: 3.6em; display: grid; align-items: center; margin-bottom: 8px; }
.choice-title-row { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; }
.choice-copy h2 { font-size: clamp(13px, 1.4vw, 22px); white-space: nowrap; letter-spacing: 0; line-height: 1.5; }
.choice-title-row .choice-arrow { position: static; flex: none; width: 32px; height: 32px; }
.mobile-heading-break { display: none; }
.heading-part { white-space: nowrap; }
/* PCは左右2列に戻す。商品写真は各列の幅に収める。 */
.accessory-products { grid-template-columns: repeat(2, minmax(0,1fr)); max-width: 1160px; gap: 48px; }
.accessory-product .horizontal-product { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 20px; }
.accessory-product .horizontal-product .product-image { width: 100%; }
.accessory-product .product-image > .main-product-art { max-width: 100%; }
.accessory-product .product-image > .material-badge { width: min(88px, 25%); }
#product-core-liner .product-kind, #product-pillow .product-kind { margin: 0 0 2px; line-height: 1.15; }
#product-core-liner h4, #product-pillow h4 { margin-top: 0; line-height: 1.2; }
@media (max-width:1100px) and (min-width:701px) {
 .accessory-products { gap: 28px; }
 .accessory-product .horizontal-product { gap: 12px; }
 .accessory-product .horizontal-product h4 { font-size: 18px; }
 .accessory-product .horizontal-product .model { font-size: 11px; }
 .accessory-product .horizontal-product .product-description { font-size: 13px; }
}
@media (max-width:700px) {
 .hero { --hero-mark-width: 50vw; }
 .hero h1 { font-size: calc(var(--hero-mark-width) / 16); }
 .hero > .eyebrow { font-size: calc(var(--hero-mark-width) / 20); }
 .hero-brand .brand-wordmark-slot > img.brand-wordmark { width: var(--hero-mark-width); }
 .concept { padding-inline: 12px; }
 .concept-body { font-size: 14px; line-height: 2.5; }
 .choice-copy { padding: 18px 16px; }
 .choice-copy p { min-height: 0; }
 .choice-copy h2 { font-size: clamp(15px, 4.5vw, 22px); }
 .choice-title-row { gap: 8px; }
 .mobile-heading-break { display: block; }
 .desktop-comma { display: none; }
 .accessory-products { grid-template-columns: minmax(0,1fr); gap: 56px; }
 .accessory-product .horizontal-product { grid-template-columns: minmax(0,1fr); gap: 16px; }
 .accessory-product .horizontal-product .product-image { width: var(--product-stage-width); }
 .accessory-product .product-image > .material-badge { width: min(88px, calc(var(--product-stage-width) * .25)); }
}

/* 2026-10-22：遷移先、スマホFV、マットレスの寝心地、固定背景の下端対策。 */
#layer { scroll-margin-top: 12px; }
.mattress-type h4 { font-size: 16px; line-height: 1.4; color: #49667a; letter-spacing: .04em; }
.mattress-type .mattress-feel { margin: 6px 0 0; font-size: 22px; line-height: 1.6; font-weight: 600; color: #25374a; }
.mattress-type .mattress-spec { margin: 6px 0 0; font-size: 14px; line-height: 1.8; color: #526274; }
/* アドレスバーの伸縮で固定背景の端が露出しないよう、最大表示高＋上下の余裕を確保。
   グラデーションの切り替え処理・画像の色・低減設定時の背景変化は維持。 */
.atmosphere-enhanced .scroll-atmosphere {
 inset: -80px 0 auto;
 width: 100%; height: calc(100vh + 160px); height: calc(100lvh + 160px);
 overflow: hidden; contain: paint;
 transform: translateZ(0); backface-visibility: hidden;
}
/* 固定ボタンを46pxの円形の範囲に限定。横長の装飾・背景は持たせない。 */
.back-to-top {
 appearance: none; -webkit-appearance: none;
 box-sizing: border-box; padding: 0; margin: 0;
 width: 46px; min-width: 46px; max-width: 46px;
 height: 46px; min-height: 46px; max-height: 46px;
 overflow: hidden; contain: paint; isolation: isolate;
 border-radius: 50%; background-clip: padding-box;
 transform: translateZ(0); backface-visibility: hidden;
}
.back-to-top::before, .back-to-top::after { content: none; }
.back-to-top svg { display: block; flex: none; width: 22px; height: 22px; }
@media (max-width:700px) {
 .hero-copy { margin-top: clamp(148px, calc(25vw + 64px), 214px); }
 .mattress-type .mattress-feel { font-size: 20px; }
 .mattress-type .mattress-spec { font-size: 13px; }
}

/* キャンペーンリンク */
.campaign-card {
  display: flex;
  max-width: 1200px;
  background-color: #ffffff;
  border-radius: 3px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.campaign-card:hover {
  transform: translateY(-3px);
}

.campaign-thumbnail {
  position: relative;
  width: 300px;
  min-width: 300px;
  background-color: #f0f0f0;
}

.campaign-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.campaign-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 24px;
}

.campaign-title {
  margin: 0 0 10px;
  font-size: 1.2rem;
  font-weight: bold;
  line-height: 1.4;
}

.campaign-caption {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.6;
}
.sp-only {
  display: none;
}
@media (max-width: 600px) {
  .campaign-card {
    flex-direction: column;
  }
  .campaign-thumbnail {
    width: 100%;
    min-width: 0;
  }
	.sp-only {
    display: inline;
  }
}