/* ========== 変数 ========== */
:root {
    --color-red: #841116;
    --color-red-light: #ae1b21;
    --color-red-deep: #7c181c;
    --color-green: #024e34;
    --color-brown: #221815;
    --color-white: #ffffff;
    --font-mincho: 'Shippori Mincho', serif;
    --font-sans: 'Noto Sans JP', sans-serif;
}

/* ========== リセット ========== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

div#outer {
    max-width: unset;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-sans);
    background-color: var(--color-brown);
    line-height: 1.8;
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}

a {
    text-decoration: none;
    color: inherit;
}

.contents {
    width: 100vw;
    overflow-x: clip;
}

.pc {
    display: block;
}

.sp {
    display: none;
}

section {
    width: 100%;
    overflow-x: clip;
    position: relative;
}

/* ========== 共通ボタン ========== */
/* サイト共通CSS（a.btn / a.btn:visited / a.btn:hover）より優先させる */
.contents a.btn,
.contents a.btn:visited,
.contents a.btn:hover {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.556vw;
    margin-top: 0;
    padding: 1.667vw 5.556vw;
    border-radius: 0.556vw;
    box-shadow: none;
    font-family: var(--font-sans);
    font-weight: 400;
    font-size: 1.667vw;
    line-height: 1.4;
    letter-spacing: 0.08em;
    white-space: nowrap;
    box-sizing: border-box;
    transition: opacity 0.2s ease;
}

/* width はバリエーション側で上書きするため弱いセレクタのまま */
.btn {
    width: 25.556vw;
}

.btn:hover {
    opacity: 0.85;
}

.btn__icon {
    width: 1.667vw;
    height: 1.667vw;
    flex-shrink: 0;
    color: inherit;
}

.contents a.btn.btn--outline,
.contents a.btn.btn--outline:visited,
.contents a.btn.btn--outline:hover {
    border: 2px solid var(--color-white);
    background: transparent;
    color: var(--color-white);
}

.btn--outline .btn__icon {
    filter: brightness(0) invert(1);
}

/* サイト共通CSSが color: #fff !important のため !important が必要 */
.contents a.btn.btn--fill,
.contents a.btn.btn--fill:visited,
.contents a.btn.btn--fill:hover {
    border: none;
    background: var(--color-white);
    color: var(--color-green) !important;
}

.btn--fill {
    width: 32.361vw;
}

/* ========== 装飾 ========== */
.deco {
    position: absolute;
    z-index: 10;
    pointer-events: none;
    opacity: 0.7;
}

/* ========== ヒーロー ========== */
.hero {
    width: 100vw;
    height: 48.611vw; /* 700 / 1440 */
    background-color: var(--color-red);
    background-image: url('../images/hero-pc.png');
    background-size: cover;
    background-position: center top;
    position: relative;
    overflow: hidden;
}

.hero__title {
    /* 4294:10741 585.43, 335 — 275×85 */
    position: absolute;
    left: 50%;
    top: 23.264vw; /* 335 / 1440 */
    transform: translateX(-50%);
    margin: 0;
    width: max-content;
    text-align: center;
    white-space: nowrap;
    color: var(--color-white);
    font-family: var(--font-mincho);
    font-weight: 500;
    line-height: 1.6;
    z-index: 2;
}

.hero__title-line {
    display: block;
    font-size: 1.667vw; /* 24 */
    letter-spacing: 0.1em; /* 2.4 / 24 */
}

.hero__title-line--lg {
    font-size: 1.944vw; /* 28 */
    letter-spacing: 0.086em; /* 2.4 / 28 */
}

.hero__title-em {
    font-style: normal;
    text-emphasis: filled dot;
    text-emphasis-position: over right;
    -webkit-text-emphasis: filled dot;
    -webkit-text-emphasis-position: over;
}

/* ========== イントロ ========== */
.intro {
    width: 100vw;
    height: 48.472vw; /* 698 / 1440 */
    padding: 8.333vw 11.111vw; /* 120 / 160 */
    background-color: var(--color-brown);
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
}

.intro__inner {
    position: relative;
    z-index: 2;
    width: 62.361vw; /* 898 / 1440 */
    margin-inline: auto;
}

.intro__text {
    display: flex;
    flex-direction: column;
    gap: 4.444vw; /* 64: copy〜CTA */
    width: 40.764vw; /* 587 */
    flex-shrink: 0;
}

.intro__copy {
    display: flex;
    flex-direction: column;
    gap: 1.667vw; /* 24: title〜lead */
    width: 100%;
    color: var(--color-white);
}

.intro__title {
    font-family: var(--font-mincho);
    font-weight: 600;
    font-size: 2.778vw; /* 40 */
    line-height: 1.6;
    letter-spacing: 0.09em; /* 3.6 / 40 */
    color: var(--color-white);
    padding: 0;
}

.intro__lead {
    font-family: var(--font-sans);
    font-weight: 300;
    font-size: 1.25vw; /* 18 */
    line-height: 1.8;
    letter-spacing: 0.222em; /* 4 / 18 */
    color: var(--color-white);
}

.intro__visual {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}

.intro__tree {
    position: absolute;
    left: 50.243vw; /* 723.5 */
    top: 4.783vw; /* 68.88 */
    width: 33.419vw; /* 481.23 */
    height: auto;
    display: block;
}

.intro__presents {
    position: absolute;
    left: 66.953vw; /* 964.12 */
    top: 31.111vw; /* 448 */
    width: 18.592vw; /* 267.73 */
    height: auto;
    display: block;
}

.intro__presents--alt {
    left: 47.346vw; /* 681.78 */
    top: 32.162vw; /* 463.14 */
    width: 16.074vw; /* 231.46 */
    transform: scaleY(-1) rotate(180deg);
}

/* Figma deco positions (about 1440×698) */
.deco--intro-1 {
    /* Group 8560: 69.65, 23.23, 138.49×139.77 */
    left: 4.837vw;
    top: 1.613vw;
    width: 9.618vw;
    opacity: 0.7;
}

.deco--intro-2 {
    /* Group 8561: 1204.73, 243.12, 123.75×124.88 */
    left: 83.662vw;
    top: 16.883vw;
    width: 8.594vw;
    opacity: 0.7;
}

.deco--intro-3 {
    /* Group 8562: 64.07, 439, 53.55×68.7 */
    left: 4.449vw;
    top: 30.486vw;
    width: 3.719vw;
    opacity: 0.7;
}

.deco--intro-4 {
    /* Group 8563: 681.78, 331.7, 53.55×68.7 */
    left: 47.346vw;
    top: 23.035vw;
    width: 3.719vw;
    opacity: 0.7;
}

.deco--intro-5 {
    /* Group 8564: 1118.95, 38.18, 53.55×68.7 */
    left: 77.705vw;
    top: 2.652vw;
    width: 3.719vw;
    opacity: 0.7;
}

/* ========== 商品紹介 ========== */
.lineup {
    width: 100vw;
    padding: 8.333vw 0; /* 120 */
    background-color: var(--color-red);
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2.778vw; /* 40: title〜body〜CTA */
    overflow: hidden;
}

.lineup__title {
    position: relative;
    z-index: 2;
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 1.667vw; /* 24 */
    letter-spacing: 0.15em; /* 3.6 / 24 */
    color: var(--color-white);
}

.lineup__body {
    position: relative;
    z-index: 2;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.lineup__band {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 5.556vw; /* 80 */
    padding: 2.778vw 11.111vw; /* 40 / 160 */
}

.lineup__band--noel {
    background-image: linear-gradient(137deg, #841116 23%, #ae1b21 93%);
}

.lineup__band--opera {
    background-image: linear-gradient(219deg, #b81d23 15%, #841116 86%);
}

.lineup__band--baked {
    background-image: linear-gradient(223deg, #92141a 6%, #b81d23 34%, #841116 88%);
    gap: 5.556vw;
    padding: 0;
}

.lineup__cta {
    position: relative;
    z-index: 2;
    width: 32.361vw; /* 466 */
}

/* lineup deco — Figma coords / 1440 */
.deco--lineup-1 {
    /* 4284:10430 left top 70.15, 23.23 */
    left: 4.872vw;
    top: 1.613vw;
    width: 9.618vw;
}

.deco--lineup-2 {
    /* 4284:10297 1171, 133 */
    left: 81.319vw;
    top: 9.236vw;
    width: 7.569vw;
}

.deco--lineup-3 {
    /* 4284:10418 1210.75, 359.77 — 167.70×196.78 */
    left: 84.08vw;
    top: 24.984vw;
    width: 11.646vw;
}

.deco--lineup-4 {
    /* 4284:10406 1126, 633 */
    left: 78.194vw;
    top: 43.967vw;
    width: 7.153vw;
}

.deco--lineup-5 {
    /* 16192:6980 109.74, 870.8 — 143.23×134.83 */
    left: 7.621vw;
    top: 60.472vw;
    width: 9.947vw;
}

.deco--lineup-6 {
    /* 4284:10310 オペラ帯内 1096.08, 431.27 — 138.49×139.77 */
    left: 76.117vw;
    top: 29.949vw;
    width: 9.617vw;
}

.deco--lineup-7 {
    /* 4298:10761 オペラ帯内 21.51, 556.39 — 138.49×139.77 */
    left: 1.494vw;
    top: 38.638vw;
    width: 9.617vw;
}

.deco--lineup-8 {
    /* 4284:10334 baked帯内 1212.7, 28 — 107.01×108 */
    left: 84.215vw;
    top: 1.944vw;
    width: 7.431vw;
}

.deco--lineup-9 {
    /* 4284:10346 baked帯内 60.39, 467.88 — 84.34×108.18 */
    left: 4.194vw;
    top: 32.492vw;
    width: 5.857vw;
}

.deco--lineup-10 {
    /* 4289:10718 baked帯内 411.61, 913.35 — 45.37×58.2 */
    left: 28.584vw;
    top: 63.427vw;
    width: 3.151vw;
}

.deco--lineup-11 {
    /* 16192:6981 1020.13, 2976.82 — 78.12×95.08（セクション下端から 109.7） */
    left: 70.842vw;
    bottom: 7.618vw;
    width: 5.425vw;
}

.deco--lineup-12 {
    /* 4289:10725 89.27, 3011.15 — 45.37×58.2（セクション下端から 112.25） */
    left: 6.199vw;
    bottom: 7.795vw;
    width: 3.151vw;
}

.deco--lineup-tree {
    /* 4284:10396 1093, 0 — 272×310 */
    left: 75.903vw;
    top: 0;
    width: 18.868vw;
    opacity: 0.85;
}

.deco--lineup-tree-2 {
    /* 4284:10397 1212.7, 2260 — rotated */
    left: 84.215vw;
    top: 156.944vw;
    width: 15.634vw;
    opacity: 0.85;
}

/* ========== feature ========== */
.feature {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    width: 100%;
}

.feature__media {
    flex-shrink: 0;
}

.feature__media img {
    width: 100%;
    height: auto;
    display: block;
}

.feature__text {
    display: flex;
    flex-direction: column;
    gap: 2.778vw; /* 40 */
    color: var(--color-white);
}

/* サイト共通CSS（article h3 / .articles h3）より優先させる */
.contents .feature__title {
    margin: 0;
    padding: 0;
    border: none;
    color: var(--color-white);
    font-family: var(--font-mincho);
    font-weight: 600;
    font-size: 2.778vw; /* 40 */
    line-height: 1.6;
    letter-spacing: 0.09em;
}

.feature__desc {
    font-family: var(--font-sans);
    font-weight: 300;
    font-size: 1.25vw; /* 18 */
    line-height: 1.8;
    letter-spacing: 0.222em;
}

/* ノエル: テキスト右寄せ、写真 absolute はみ出し */
.feature--noel {
    justify-content: flex-end;
    height: 28.542vw; /* 411 */
    overflow: visible;
}

.feature--noel .feature__media {
    position: absolute;
    left: -3.121vw; /* -44.94 relative to band padding edge → approx */
    top: -3.363vw; /* -48.43 */
    width: 31.48vw; /* 453.31 */
    z-index: 1;
}

.feature--noel .feature__text {
    width: 45.694vw; /* 658 */
    position: relative;
    z-index: 2;
}

/* オペラ: テキスト左、写真右 absolute はみ出し */
.feature--opera {
    align-items: flex-start;
    min-height: 18.056vw;
    overflow: visible;
}

.feature--opera .feature__media {
    position: absolute;
    left: 38.092vw; /* 548.52 */
    top: -11.604vw; /* -167.1 */
    width: 50.799vw; /* 731.48: 書き出し画像は画面右端(1440)で切れている */
    z-index: 1;
}

.feature--opera .feature__text {
    width: 45.694vw;
    position: relative;
    z-index: 2;
}

/* シュトーレン: 画像左端密着 */
.feature--stollen {
    gap: 5.556vw; /* 80 */
    align-items: center;
    padding-right: 11.111vw;
}

.feature--stollen .feature__media {
    width: 40.556vw; /* 584 */
}

.feature--stollen .feature__text {
    width: 42.778vw; /* 616 */
    gap: 1.667vw; /* 24 */
}

.feature--stollen .feature__desc {
    font-size: 1.389vw; /* 20 */
}

/* カップ: テキスト左（pl160）、画像右端密着 */
.feature--cup {
    justify-content: space-between;
    align-items: center;
    padding-left: 11.111vw; /* 160 */
    min-height: 31.319vw; /* 451 */
    position: relative;
}

.feature--cup .feature__media {
    position: absolute;
    right: 0;
    top: 0;
    width: 40.486vw; /* 583 */
}

.feature--cup .feature__text {
    width: 43.472vw; /* 626 */
    gap: 1.667vw; /* 24 */
    position: relative;
    z-index: 2;
}

.feature--cup .feature__desc {
    font-size: 1.389vw; /* 20 */
}

/* ========== diagram ========== */
.diagram {
    position: relative;
    z-index: 2;
    width: 100%;
    display: flex;
    justify-content: center;
}

.diagram__picture {
    display: contents;
}

.diagram__image {
    width: 77.778vw; /* 1120 */
    max-width: 100%;
    height: auto;
    display: block;
}

.diagram__image--opera {
    width: 77.778vw; /* cake-label-container 1120 */
}

/* ========== 商品説明 ========== */
.detail {
    width: 100vw;
    padding: 8.333vw 0;
    background-color: var(--color-green);
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5.556vw;
    overflow: hidden;
}

.detail__title {
    position: relative;
    z-index: 2;
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 1.667vw;
    letter-spacing: 0.15em;
    color: var(--color-white);
}

.detail__list {
    position: relative;
    z-index: 2;
    width: 66.667vw;
    display: flex;
    flex-direction: column;
    gap: 5.556vw;
}

.deco--detail-1 {
    /* 16199:6982 1195.92, 84.88 — 130.52×120.44 */
    left: 83.05vw;
    top: 5.894vw;
    width: 9.064vw;
}

.deco--detail-2 {
    /* 4284:10499 67.52, 606.95 — 96.63×129.05 */
    left: 4.689vw;
    top: 42.149vw;
    width: 6.711vw;
}

.deco--detail-3 {
    /* 4284:10523 1193.71, 736 — 71.47×91.68 */
    left: 82.896vw;
    top: 51.111vw;
    width: 4.963vw;
}

.deco--detail-4 {
    /* 4298:10932 16.62, 1259 — 113.67×122.89 */
    left: 1.154vw;
    top: 87.431vw;
    width: 7.894vw;
}

.deco--detail-5 {
    /* 4284:10487 1215.38, 1429 — 95.62×88.24 */
    left: 84.402vw;
    top: 99.236vw;
    width: 6.64vw;
}

.deco--detail-6 {
    /* 4284:10475 80.91, 1823.5 — 125.75×126.91 */
    left: 5.619vw;
    top: 126.632vw;
    width: 8.733vw;
}

.deco--detail-7 {
    /* 4284:10463 1216.58, 2431.18 — 141.82×143.12 */
    left: 84.485vw;
    top: 168.832vw;
    width: 9.849vw;
}

.deco--detail-tree {
    /* 4284:10401 152.38, 0 — 207.25×236.6 */
    left: 10.582vw;
    top: 0;
    width: 14.393vw;
    opacity: 1;
}

.deco--detail-tree-2 {
    /* 4284:10403 右端から吊り下げ 1182〜1440, 1216.5 — 258×226 */
    right: 0;
    top: 84.479vw;
    width: 17.917vw;
    opacity: 1;
}

/* ========== product-card ========== */
.product-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2.778vw;
    width: 100%;
}

.product-card--reverse {
    flex-direction: row-reverse;
}

.product-card__image {
    width: 29.514vw;
    flex-shrink: 0;
    overflow: hidden;
}

.product-card__image img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

.product-card__body {
    width: 33.542vw;
    display: flex;
    flex-direction: column;
    gap: 2.778vw;
    color: var(--color-white);
}

.product-card__header {
    display: flex;
    align-items: center;
    gap: 1.111vw;
}

.product-card__main {
    display: flex;
    flex-direction: column;
    gap: 0.556vw;
    flex: 1;
    min-width: 0;
}

.product-card__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    border: 1px solid var(--color-white);
    border-radius: 0.278vw;
    padding: 0.278vw 1.111vw;
    font-family: var(--font-sans);
    font-weight: 400;
    font-size: 1.389vw;
    line-height: 1.2;
    white-space: nowrap;
}

/* サイト共通CSS（article h3）より優先させる */
.contents .product-card__name {
    margin: 0;
    padding: 0;
    border: none;
    color: white;
    font-family: var(--font-mincho);
    font-weight: 600;
    font-size: 2.222vw;
    line-height: 1.6;
}

.product-card__sub {
    font-family: var(--font-mincho);
    font-weight: 400;
    font-size: 1.25vw;
    line-height: 1.6;
}

.product-card__price {
    display: flex;
    align-items: flex-end;
    gap: 0.556vw;
}

.product-card__price-num {
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 4.167vw;
    line-height: 1;
}

.product-card__price-yen {
    font-family: var(--font-sans);
    font-weight: 400;
    font-size: 1.667vw;
    line-height: 1;
    padding-bottom: 0.5vw;
}

.product-card__limit {
    flex-shrink: 0;
    background-color: var(--color-red-deep);
    padding: 1.389vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.556vw;
    min-width: 11.458vw;
}

.product-card__limit-label {
    font-family: var(--font-sans);
    font-weight: 400;
    font-size: 1.111vw;
    line-height: 1;
}

.product-card__limit-value {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 0;
}

.product-card__limit-num {
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 4.167vw;
    line-height: 1;
}

.product-card__limit-unit {
    font-family: var(--font-sans);
    font-weight: 400;
    font-size: 1.111vw;
    line-height: 1;
    padding-bottom: 0.4vw;
}

.product-card__spec {
    font-family: var(--font-sans);
    font-weight: 300;
    font-size: 1.389vw;
    line-height: 1.4;
    letter-spacing: 0.18em;
}

.product-card__spec div {
    display: block;
}

.product-card__spec dt,
.product-card__spec dd {
    display: inline;
    margin: 0;
}

.product-card__footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.556vw;
    width: 100%;
}

.product-card__note {
    font-family: var(--font-sans);
    font-weight: 400;
    font-size: 1.528vw;
    line-height: 1.4;
    letter-spacing: 0.16em;
    text-align: center;
    white-space: nowrap;
}

.product-card__footer .btn {
    width: 100%;
}

/* ========== SP ========== */
@media (max-width: 780px) {
    .pc {
        display: none;
    }

    .sp {
        display: block;
    }

    /* CTA */
    .contents a.btn,
    .contents a.btn:visited,
    .contents a.btn:hover {
        padding: 4.267vw 8vw;
        gap: 1.6vw;
        border-radius: 2.133vw;
        font-size: 4.267vw;
    }

    .btn {
        width: 86.667vw;
    }

    .btn__icon {
        width: 4.267vw;
        height: 4.267vw;
    }

    .contents a.btn.btn--outline,
    .contents a.btn.btn--outline:visited,
    .contents a.btn.btn--outline:hover {
        border-width: 1px;
    }

    .btn--fill {
        width: 100%;
    }

    /* ヒーロー — Figma SP 375×700 */
    .hero {
        height: 186.667vw;
        background-image: url('../images/hero-sp.png');
        background-size: cover;
        background-position: center top;
    }

    .hero__title {
        /* 4298:10862 50.82, 303.66 — 275×85 */
        top: 80.977vw; /* 303.66 / 375 */
    }

    .hero__title-line {
        font-size: 6.4vw; /* 24 */
    }

    .hero__title-line--lg {
        font-size: 7.467vw; /* 28 */
    }

    .deco {
        opacity: 0.55;
    }

    /* イントロ — 縦積み: テキスト → CTA → ツリー */
    .intro {
        height: auto;
        min-height: unset;
        padding: 10vw 6.667vw 20vw;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 5.333vw;
        overflow: hidden;
    }

    /* 中身（コピー・CTA）を .intro の直接の子として並べ、order で順番を入れ替える */
    .intro__inner,
    .intro__text {
        display: contents;
    }

    .intro__copy {
        order: 0;
        width: 100%;
        gap: 4.267vw;
        align-items: center;
    }

    .intro .btn {
        order: 2;
    }

    .intro__title {
        font-size: 6.4vw;
        letter-spacing: 0.08em;
        text-align: left;
        width: 100%;
        z-index: 10;
    }

    .intro__lead {
        font-size: 3.733vw;
        letter-spacing: 0.1em;
        text-align: left;
        width: 100%;
    }

    .intro__visual {
        position: relative;
        inset: auto;
        width: 80vw;
        height: 92vw;
        order: 1;
        flex-shrink: 0;
    }

    .intro__tree {
        position: absolute;
        left: 8%;
        top: 0;
        width: 84%;
    }

    .intro__presents {
        position: absolute;
        left: 48%;
        top: 57.6%; /* PC同様ツリー高さの約69% */
        width: 48%;
        z-index: 2;
    }

    .intro__presents--alt {
        left: 0;
        top: 59.8%; /* PC同様ツリー高さの約71% */
        width: 42%;
        z-index: 1;
    }

    .deco--intro-1 {
        left: -5vw;
        top: 2vw;
        width: 22vw;
    }

    .deco--intro-2 {
        right: -4vw;
        left: auto;
        top: 40vw;
        width: 18vw;
    }

    .deco--intro-3,
    .deco--intro-4,
    .deco--intro-5 {
        display: none;
    }

    /* 商品紹介 — 縦積み */
    .lineup {
        padding: 10vw 0 16vw;
        gap: 0;
    }

    .lineup__title {
        font-size: 5.333vw;
        letter-spacing: 0.12em;
    }

    .lineup__band {
        gap: 10.667vw;
        padding: 10.667vw 0;
    }

    .lineup__band--baked {
        gap: 13.333vw;
        padding: 10.667vw 0;
    }

    .lineup__cta {
        width: 86.667vw;
    }

    .deco--lineup-1 {
        left: -8vw;
        top: 2vw;
        width: 22vw;
    }

    .deco--lineup-2 {
        left: auto;
        right: -6vw;
        top: 8vw;
        width: 18vw;
    }

    .deco--lineup-3,
    .deco--lineup-4,
    .deco--lineup-5,
    .deco--lineup-6,
    .deco--lineup-7,
    .deco--lineup-8,
    .deco--lineup-9,
    .deco--lineup-10,
    .deco--lineup-11,
    .deco--lineup-12,
    .deco--lineup-tree,
    .deco--lineup-tree-2 {
        display: none;
    }

    .feature,
    .feature--noel,
    .feature--opera,
    .feature--stollen,
    .feature--cup {
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 6.667vw;
        height: auto;
        min-height: 0;
        padding: 0 6.667vw;
        overflow: visible;
    }

    .feature--stollen,
    .feature--cup {
        padding-left: 0;
        padding-right: 0;
    }

    .feature__media,
    .feature--noel .feature__media,
    .feature--opera .feature__media,
    .feature--cup .feature__media {
        position: relative;
        left: auto;
        right: auto;
        top: auto;
        width: 86.667vw;
    }

    .feature--stollen .feature__media,
    .feature--cup .feature__media {
        width: 100vw;
    }

    .feature__text,
    .feature--noel .feature__text,
    .feature--opera .feature__text,
    .feature--stollen .feature__text,
    .feature--cup .feature__text {
        width: 86.667vw;
        gap: 4.267vw;
    }

    .contents .feature__title {
        font-size: 5.867vw;
        letter-spacing: 0.06em;
    }

    .feature__desc,
    .feature--stollen .feature__desc,
    .feature--cup .feature__desc {
        font-size: 3.467vw;
        letter-spacing: 0.08em;
    }

    .feature__desc br {
        display: none;
    }

    .diagram {
        padding: 0;
    }

    .diagram__image,
    .diagram__image--opera {
        width: 100%;
    }

    /* 商品説明 */
    .detail {
        padding: 10vw 0 16vw;
        gap: 10.667vw;
    }

    .detail__title {
        font-size: 5.333vw;
        letter-spacing: 0.12em;
    }

    .detail__list {
        width: 86.667vw;
        gap: 13.333vw;
    }

    .deco--detail-1 {
        left: auto;
        right: -5vw;
        top: 4vw;
        width: 16vw;
    }

    .deco--detail-2 {
        left: -6vw;
        top: 80vw;
        width: 16vw;
    }

    .deco--detail-3,
    .deco--detail-4,
    .deco--detail-5,
    .deco--detail-6,
    .deco--detail-7,
    .deco--detail-tree,
    .deco--detail-tree-2 {
        display: none;
    }

    .product-card,
    .product-card--reverse {
        flex-direction: column;
        align-items: center;
        gap: 6.667vw;
    }

    .product-card__image {
        width: 100%;
    }

    .product-card__body {
        width: 100%;
        gap: 5.333vw;
    }

    .product-card__header {
        gap: 2.667vw;
        align-items: flex-start;
    }

    .product-card__badge {
        border-radius: 1.067vw;
        padding: 1.067vw 3.2vw;
        font-size: 3.467vw;
    }

    .contents .product-card__name {
        font-size: 5.333vw;
    }

    .product-card__sub {
        font-size: 3.2vw;
    }

    .product-card__price-num {
        font-size: 10.667vw;
    }

    .product-card__price-yen {
        font-size: 4.267vw;
        padding-bottom: 1.2vw;
    }

    .product-card__limit {
        padding: 3.2vw;
        min-width: 28vw;
        gap: 1.6vw;
    }

    .product-card__limit-label {
        font-size: 3.2vw;
    }

    .product-card__limit-num {
        font-size: 9.6vw;
    }

    .product-card__limit-unit {
        font-size: 3.2vw;
        padding-bottom: 1vw;
    }

    .product-card__spec {
        font-size: 3.467vw;
        letter-spacing: 0.06em;
        line-height: 1.6;
    }

    .product-card__note {
        font-size: 3.467vw;
        letter-spacing: 0.04em;
        white-space: normal;
    }
}