@charset "UTF-8";
/******************************
    リセット
******************************/
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;}
:where(img,picture,video,canvas,svg){display:block;max-width:100%;height:auto;}
:where(input,button,textarea,select){font:inherit;color:inherit;}

/******************************
    全般
******************************/
html {
    scroll-behavior: smooth;
}

body {
    background: #FFF;
    color: #333;
    line-height: 1.4;
    font-size: 1rem;
    font-family:"Noto Sans JP", sans-serif;
    font-weight: 400;
    -webkit-text-size-adjust: 100%;
}

:root {
    --transition-basic: 0.3s ease-out;
    --link-opacity: 0.6;
    --color-important: #A23636;
    --color-base-01: #F7F3ED;
    --color-base-01-translucent: #F7F3ED4D;
    --color-base-02: #DED7CD;
    --color-base-03: #BEB09C;
    --color-base-04: #9D9995;
    --color-translucent-btn-bg :#BEB09CE6;
}

a,
button,
[tabindex="0"] {
    color: inherit;
    transition: opacity var(--transition-basic);
}

a:hover,
button:hover,
[tabindex="0"]:hover {
    opacity: var(--link-opacity);
}

button,
[tabindex="0"] {
    cursor: pointer;
}

#scroll-top {
    scroll-margin-block-start: var(--sticky-height);
}

.hidden-heading {
    position: absolute;
    inset-block-start: -200vh;
    inset-inline-start: -200vw;
}

.main-content {
    padding-inline: var(--page-padding);
    letter-spacing: 0.03em;
}

@media screen and (max-width: 768px) {
    :root {
        --sticky-height: 85px;
        --page-padding: 15px;
    }

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

@media screen and (min-width: 769px) {
    :root {
        --sticky-height: 180px;
        --page-padding: 88px;
        --page-inner-width: 1200px;
        --page-width: calc(var(--page-inner-width) + var(--page-padding) * 2);
        --page-width-narrow: 60rem;
    }

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

    .main-content {
        width: var(--page-width);
        margin-inline: auto;
    }

    .--pc-narrow {
        width: var(--page-width-narrow);
        max-width: 100%;
        margin-inline: auto;
    }
}

/******************************
    ヘッダー
******************************/
.site-hd {
    position: sticky;
    z-index: 10;
    inset-block-start: 0;
    height: var(--sticky-height);
    background: #FFF;
    border-block-end: 1px solid var(--color-base-02);
}

:where(.site-hd ul) {
    padding: 0;
    list-style-type: none;
}

:where(.site-hd a) {
    text-decoration: none;
}

:where(.site-hd button) {
    appearance: none;
    width: 100%;
    padding: 0;
    background-color: transparent;
    border: none;
    border-radius: 0;
    text-align: start;
}

.hd-info {
    display: flex;
    align-items: center;
    border-image: linear-gradient(#9D9995 0% 100%) 0 fill / auto / 0 100vw;
    color: #FFF;
    text-align: center;
}

.hd-search {
    font-size: 1rem;
}

.hd-search:not(.--no-cate) {
    display: grid;
    grid-template-columns: min-content 1fr;
}

.hd-search form {
    display: contents;
}

.hd-search .__fm-cate {
    appearance: none;
    padding-inline: 0.5em;
    border: 1px solid var(--color-base-02);
    background: var( --color-base-01) calc(100% - 0.5em) calc(50% + 0.1em) no-repeat
        url(../images/jCeQ7XTBwn8Q.svg);
}

.hd-search .__fm-cate option {
    background: #FFF;
}

.hd-search .__fm-kwd {
    width: 100%;
    padding-block: 0.3em;
    border: 1px solid var(--color-base-02);
}

.hd-search:not(.--no-cate) .__fm-kwd {
    border-inline-start: none;
}

.hd-search .__fm-kwd::placeholder {
   color: var(--color-base-04);
}

.hd-search .__fm-submit {
    position: absolute;
    z-index: +1;
    inset-block: 0;
    margin: auto;
    background: center no-repeat
        url(../images/tWqaNXX636Tq.svg);
    text-indent: 110%;
    white-space: nowrap;
    overflow: hidden;
}

.cart-menu .__list {
    display: flex;
}

.cart-menu .__link {
    display: block;
    background: center no-repeat;
    text-align: center;
}

.cart-menu .__link.--login {
    background-image:
        url(../images/6Bjo1RTZkpqN.svg);
}

.cart-menu .__link.--logout {
    background-image:
        url(../images/OiBXR4TvW1Z8.svg);
}

.cart-menu .__link.--mypage {
    background-image:
        url(../images/rozcw6PS9KYn.svg);
}

.cart-menu .__link.--guide {
    background-image:
        url(../images/9W72frMu0EKd.svg);
}

.cart-menu .__link.--search {
    background-image:
        url(../images/tWqaNXX636Tq.svg);
}

.cart-menu .__link.--cart {
    background-image:
        url(../images/SBBknIdHP0BI.svg);
}

.cart-menu .__link.--menu {
    background-image:
        url(../images/DHYRqZS98Dej.svg);
}

.cart-menu .__link:is(.--search, .--menu).--open {
    background-image:
        url(../images/LiILaV27xjmH.svg);
}

@media screen and (max-width:768px) {
    .site-hd {
        padding-inline: 5px;
        display: grid;
        grid-template-columns: minmax(10px, 131px) auto;
        grid-template-rows: min-content 1fr;
        align-items: center;
        gap: 0 10px;
    }

    .hd-info {
        grid-column: 1/3;
        grid-row: 1/2;
        height: 25px;
        margin-inline: -5px;
        padding-inline-start: 5px;
        line-height: 1.2;
        text-align: center;
        font-size: 0.625rem;
        overflow-x: auto;
        overflow-y: hidden;
    }

    .hd-info .__inner {
        position: relative;
        flex: 0 0 calc(100% - 10px);
        white-space: nowrap;
    }

    .hd-info .__inner::after {
        content: "";
        position: absolute;
        inset-inline-start: 100%;
        display: block;
        width: 5px;
        height: 1px;
    }

    .site-logo {
        grid-column: 1/2;
        grid-row: 2/3;
        margin-inline-start: 6px;
        align-self: center;
    }

    :is(.hd-search, .glb-menu) {
        position: absolute;
        z-index: +1;
        inset-inline-start: 0;
        width: 100vw;
        background: #FFF;
        opacity: 0;
        visibility: hidden;
        transition: var(--transition-basic);
        transition-property: opacity, visibility;
    }

    :is(.hd-search, .glb-menu).--open {
        opacity: 1;
        visibility: visible;
    }

    .hd-search {
        inset-block-start: var(--sticky-height);
        padding: 20px var(--page-padding);
        border-block-end: 1px solid var(--color-base-02);
    }

    .hd-search .__fm-cate {
        width: 6.25rem;
        min-width: 88px;
        padding-block: 0.49em;
        padding-inline-end: calc(1rem + 0.8125rem);
        background-size: 0.8125rem;
        border-radius: 10px 0 0 10px;
    }

    .hd-search .__fm-cate option {
        font-size: 0.875rem;
    }

    .hd-search .__fm-kwd {
        padding-inline: 22px calc(1.875rem + 12px);
        border-radius: 10px;
    }

    .hd-search:not(.--no-cate) .__fm-kwd {
        border-radius: 0 10px 10px 0;
    }

    .hd-search .__fm-submit {
        inset-inline-end: calc(12px + var(--page-padding));
        width: 1.875rem;
        height: 1.875rem;
        background-size: 1.375rem;
    }

    .cart-menu {
        grid-column: 2/3;
        grid-row: 2/3;
        margin-inline-start: auto;
    }

    .cart-menu .__list {
        gap: 4px;
    }

    .cart-menu .__link {
        width: fit-content;
        min-width: 46px;
        padding-top: 36px;
        background-position-y: calc(50% - 0.6em);
        font-size: clamp(10px, 0.625rem, 12px);
    }

    .cart-menu .__link.--guide {
        background-size: 25px;
    }

    .cart-menu .__link.--search {
        background-size: 24px;
    }

    .cart-menu .__link.--cart {
        background-size: 26px;
        background-position-x: calc(50% - 2px);
    }

    .cart-menu .__link.--menu {
        background-size: 23px;
    }

    .cart-menu .__link:is(.--search, .--menu).--open {
        background-size: 16px;
    }

    .glb-menu {
        inset-block-start: var(--sticky-height);
        display: flex;
        flex-direction: column;
        height: calc(100vh - var(--sticky-height));
        height: calc(100dvh - var(--sticky-height));
        background: #FFF;
        overflow-y: auto;
        overscroll-behavior: contain;
        font-size: 0.8125rem;
    }

    .glb-menu > *:last-child {
        position: relative;
        flex: 1 0 auto;
    }

    .glb-menu > *:last-child::after {
        content: "";
        position: absolute;
        z-index: +1;
        inset-block-start: 100%;
        inset-inline-start: 0;
        display: block;
        width: 1px;
        height: 100px;
    }

    .sp-mem-menu {
        display: flex;
        justify-content: center;
        gap: 15px;
        padding-block: 17px 22px;
        padding-inline: var(--page-padding);
        background: #FFF;
    }

    .sp-mem-menu .__item {
        flex: 0 1 165px;
    }

    .sp-mem-menu .__link {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100%;
        min-height: 2.5rem;
        padding: 0.3em;
        border: 1px solid var(--color-base-03);
        font-weight: 500;
    }

    .site-menu {
        background: #FFF;
    }

    .site-menu .__title,
    .cate-menu :is(.__ly1-link, .__ly1-title) {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 6px;
        min-height: 2.5rem;
        padding-block: 0.3em;
        padding-inline: var(--page-padding);
        font-weight: 500;
    }

    .site-menu .__title {
        padding-inline: var(--page-padding);
        background: var(--color-base-01);
        border-block-end: 1px solid var(--color-base-02);
    }

    .site-menu .__title.--trig::after {
        content: "";
        display: block;
        width: 0.9375rem;
        height: 0.9375rem;
        flex: 0 0 auto;
        background: var(--color-base-03);
        clip-path: polygon(46.667% 10%, 53.333% 10%, 53.333% 46.667%, 90% 46.667%, 90% 53.333%, 53.333% 53.333%, 53.333% 90%, 46.667% 90%, 46.667% 53.333%, 10% 53.333%, 10% 46.667%, 46.667% 46.667%);
    }

    .site-menu .__title.--trig.--open::after {
        clip-path: polygon(10% 46.667%, 90% 46.667%, 90% 53.333%, 10% 53.333%);
    }

    .cate-menu .__bg {
        display: none;
    }

    .cate-menu .__ly1-item {
        border-block-end: 1px solid var(--color-base-02);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title) {
        position: relative;
        padding-inline-start: 55px;
    }

    .cate-menu :is(.__ly1-link, .__ly1-title)::before {
        content: "";
        position: absolute;
        z-index: +1;
        inset-block: 0;
        inset-inline-start: 15px;
        width: 25px;
        height: 25px;
        margin: auto;
        background: center / contain no-repeat;
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-02::before {
        background-image:
            url(../images/HTpHXRGRH28h.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-01::before {
        background-image:
            url(../images/8arYuj3vkjaT.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-05::before {
        background-image:
            url(../images/bqnb17GXkuwS.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-06::before {
        background-image:
            url(../images/YM2iarWTNoUg.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-03::before {
        background-image:
            url(../images/tN8aO7IyY4ct.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-12::before {
        background-image:
            url(../images/Fmbv20UEJXlA.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-07::before {
        background-image:
            url(../images/ZQtk97mqTw4Y.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-09::before {
        background-image:
            url(../images/oyRnVU2a8nOA.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-13::before {
        background-image:
            url(../images/IiJWYexfdurf.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-26::before {
        background-image:
            url(../images/kCfWSp7zj3me.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-04::before {
        background-image:
            url(../images/Pi9kH7nR4Dli.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-15::before {
        background-image:
            url(../images/Ac8SIdkgVefK.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-16::before {
        background-image:
            url(../images/UitYcyRXhjHa.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-17::before {
        background-image:
            url(../images/FzceOUL2R69d.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-18::before {
        background-image:
            url(../images/eWSzUX9T4gAX.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-19::before {
        background-image:
            url(../images/BBOvHtlyE18h.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-20::before {
        background-image:
            url(../images/ns042CeC5NTe.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-21::before {
        background-image:
            url(../images/JdjgXqg1cUFd.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-ct239::before {
        background-image:
            url(../images/AifN36h7bonD.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-22::before {
        background-image:
            url(../images/NqyNS8ubJKgm.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-ct465::before {
        background-image:
            url(../images/aJX1pFXrbZ3m.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-23::before {
        background-image:
            url(../images/t3r1L9lD54fY.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-24::before {
        background-image:
            url(../images/svIs2W3ZmWzV.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-14::before {
        background-image:
            url(../images/GQ9oxP6hiryM.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-10::before {
        background-image:
            url(../images/56ZCexGIUK7R.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-ct379::before {
        background-image:
            url(../images/6urU130bf2i9.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-25::before {
        background-image:
            url(../images/VcyRQZdG97xo.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-ct157::before {
        background-image:
            url(../images/WlV56F1iwms5.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-ct482::before {
        background-image:
            url(../images/pYEs4xwBlUAB.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title).--code-29::before {
        background-image:
            url(../images/jGBpGUB8WbJa.svg);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title)::after {
        flex: 0 0 auto;
        background: var( --color-base-03);
    }

    .cate-menu .__ly2 {
        display: none;
        padding-inline: 68px var(--page-padding);
        padding-block: 8px 16px;
    }

    .cate-menu .__ly2 > * + * {
        margin-block-start: 16px;
    }
}

@media screen and (min-width:769px) {
    .sp-mem-menu {
        display: none;
    }

    .site-hd {
        display: grid;
        grid-template-columns: auto 1fr auto;
        grid-template-rows: 54px 1fr 54px;
        align-items: start;
        padding-inline: 55px 42px;
        min-width: var(--page-width);
    }

    .hd-info {
        grid-row: 1/2;
        grid-column: 1/4;
        margin-block-end: 14px;
        height: 40px;
        justify-content: center;
        letter-spacing: 0.03em;
        font-size: 0.8125rem;
        overflow: hidden;
    }

    .site-logo,
    .hd-search,
    .cart-menu {
        grid-row: 2/3;
    }

    .site-logo {
        grid-column: 1/2;
        max-width: 250px;
        min-width: 100px;
        margin-inline-end: 75px;
        margin-block-start: 7px;
    }

    .site-logo .__img {
        width: 100%;
        height: auto;
    }

    .hd-search {
        grid-column: 2/3;
        position: relative;
        margin-block-start: 7px;
        width: 36.25rem;
        max-width: 580px;
    }

    .hd-search .__fm-cate {
        width: 6.25rem;
        min-width: 100px;
        padding-block: 0.49em;
        padding-inline-end: calc(1rem + 0.75rem);
        background-size: 0.75rem;
        border-radius: 5px 0 0 5px;
    }

    .hd-search .__fm-cate option {
        font-size: 0.875rem;
    }

    .hd-search .__fm-kwd {
        padding-inline: 21px calc(2.125rem + 10px);
        border-radius: 5px;
    }

    .hd-search:not(.--no-cate) .__fm-kwd {
        border-radius: 0 5px 5px 0;
    }

    .hd-search .__fm-submit {
        inset-inline-end: 10px;
        width: 2.125rem;
        height: 2.125rem;
        background-size: 1.3125rem;
    }

    .cart-menu {
        grid-column: 3/4;
        margin-inline-start: auto;
    }

    .cart-menu .__list {
        gap: 13px;
    }

    .cart-menu .__link {
        width: fit-content;
        min-width: 2.5rem;
        padding-top: 2.5rem;
        background-position-y: calc(50% - 0.6em);
        font-size: clamp(10px, 0.75rem, 16px);
    }

    .cart-menu .__link.--login {
        background-size: 1.5625rem;
        background-position-x: calc(50% - 2px);
    }

    .cart-menu .__link.--logout {
        background-size: 1.5625rem;
        background-position-x: calc(50% + 2px);
    }

    .cart-menu .__link.--mypage {
        background-size: 1.3125rem;
    }

    .cart-menu .__link.--guide {
        background-size: 1.5625rem;
    }

    .cart-menu .__link.--cart {
        background-size: 1.625rem;
        background-position-x: calc(50% - 2px);
    }

    .cart-menu .__title {
        letter-spacing: 0.03em;
        font-weight: 500;
    }

    .glb-menu {
        grid-row: 3/4;
        grid-column: 1/4;
        align-self: end;
        margin-inline: auto;
        padding-block: max(0px, calc(28px - 0.875rem)) max(12px, calc(36px - 0.8rem));
    }

    .site-menu {
        width: var(--page-inner-width);
        margin-inline: auto;
        display: flex;
        justify-content: space-around;
        align-self: center;
    }

    .site-menu .__title {
        position: relative;
        font-size: 0.9375rem;
        font-weight: 500;
        transition-property: color;
    }

    .site-menu .__title:is(:hover, :focus-visible) {
        color: var( --color-base-03);
        opacity: 1;
    }

    .site-menu .__title:is(:hover, :focus-visible)::before {
        content: "";
        position: absolute;
        z-index: -1;
        inset-block-start: calc(100% + 5px);
        display: block;
        width: 100%;
        height: 2px;
        background: var( --color-base-03);
        pointer-events: none;
    }

    .cate-menu {
        display: block !important;
        transition: var(--transition-basic);
        transition-property: opacity, visibility;
    }

    .cate-menu,
    .cate-menu .os-scrollbar-visible {
        opacity: 0;
        visibility: hidden;
    }

    .site-menu .__title:is(:hover, :focus-visible) + .cate-menu,
    .site-menu .__title:is(:hover, :focus-visible) + .cate-menu .os-scrollbar-visible,
    .cate-menu:is(:hover, :focus-within),
    .cate-menu:is(:hover, :focus-within) .os-scrollbar-visible {
        opacity: 1;
        visibility: visible;
    }

    .site-menu .__title.--trig:hover::after {
        content: "";
        position: absolute;
        z-index: +1;
        inset-block: 0;
        inset-inline-start: 0;
        display: block;
        width: 100%;
        height: calc(100% + 25px);
    }

    .cate-menu :is(.__inner, .__bg) {
        position: absolute;
        inset-block-start: var(--sticky-height);
        inset-inline-start: 0;
        width: 100%;
    }

    .cate-menu .__inner {
        z-index: +1;
        background: var(--color-base-01);
    }

    .cate-menu .os-scrollbar-vertical {
        margin: 3px;
    }

    .cate-menu .__pc-column-wrap {
        width: var(--page-width);
        padding-block-start: 40px;
        padding-inline: var(--page-padding);
        margin-inline: auto;
        max-height: 50vh;
        max-height: 50dvh;
        display: grid;
        grid-template-columns: repeat(5, 210px);
        justify-content: space-between;
    }

    .cate-menu .__pc-column {
        padding-block-end: 54px;
    }

    .cate-menu .__bg {
        z-index: -1;
        display: block;
        height: calc(100vh - var(--sticky-height));
        height: calc(100dvh - var(--sticky-height));
        background: rgba(0, 0, 0, 30%);
        pointer-events: none;
    }

    .cate-menu .__ly1 {
        margin-inline: auto;
        letter-spacing: 0.03em;
        font-size: 0.75rem;
    }

    .cate-menu .__ly1-item {
        border-block-end: 1px solid var(--color-base-02);
    }

    .cate-menu .__ly1-item:nth-child(1) {
        border-block-start: 1px solid var(--color-base-02);
    }

    .cate-menu :is(.__ly1-link, .__ly1-title) {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 6px;
        min-height: 2.5rem;
        padding-block: 0.3em;
        padding-inline-start: 11px;
        font-weight: 500;
    }

    .cate-menu :is(.__ly1-link, .__ly1-title)::after {
        flex: 0 0 auto;
        background: var( --color-base-03);
    }

    .cate-menu .__ly2 {
        display: none;
        padding-inline-start: 20px;
        padding-block: 8px 16px;
    }

    .cate-menu .__ly2 > * + * {
        margin-block-start: 16px;
    }
}

/******************************
    検索サジェスト
******************************/
.hd-suggest,
.hd-suggest :is(.__inner-text, .__inner-prod) {
    display: contents;
}

.hd-suggest :is(#expsuggestsdiv, #expsuggestsearchdiv) {
    display: none;
    position: absolute !important;
    z-index: +1 !important;
    height: auto !important;
}

.hd-suggest :is(.__text-outer, #expsuggestsearchdiv) {
    background: var(--color-base-01);
}

.hd-suggest .__inner {
    scrollbar-width: thin;
    scrollbar-color:
        var(--scrollbar-color-handle) var(--scrollbar-color-track);
}

.hd-suggest .__inner::-webkit-scrollbar {
    width: var(---scrollbar-size);
}

.hd-suggest .__inner::-webkit-scrollbar-track {
    background: var(--scrollbar-color-track);
}

.hd-suggest .__inner::-webkit-scrollbar-thumb {
    background: var(--scrollbar-color-handle);
}

.hd-suggest :is(.__title, .__price) {
    font-weight: 700;
}

.hd-suggest .__txt-link {
    text-decoration: underline;
}

.hd-suggest .__photo {
    aspect-ratio: 1;
    overflow: hidden;
}

.hd-suggest .__img {
    object-fit: contain;
    height: 100%;
    margin-inline: auto;
}

@media screen and (max-width:768px) {
    .hd-suggest {
        font-size: 0.8125rem;
    }

    .hd-suggest :is(#expsuggestsdiv, #expsuggestsearchdiv) {
        top: 100% !important;
        left: 0 !important;
        width: 100% !important;
    }

    .hd-suggest :is(.__cate, .__kwd) {
        padding-block-start: 5px;
    }

    .hd-suggest .__kwd {
        margin-block-start: 0.625rem;
    }

    .hd-suggest .__title {
        padding-inline: 5px;
    }

    .hd-suggest :is(.__txt-list, .__prod) {
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        padding-inline-start: 14px;
        padding-block-end: 10px;
    }

    .hd-suggest :is(.__txt-list, .__prod) > *:last-child::after {
        content: "";
        position: absolute;
        inset-inline-start: 100%;
        display: block;
        width: 14px;
        height: 1px;
    }

    .hd-suggest .__txt-list {
        margin-block-start: 10px;
        gap: 21px;
        white-space: nowrap;
    }

    .hd-suggest :is(.__txt-item, .__prod-item) {
        position: relative;
    }

    .hd-suggest .__prod {
        padding-block-start: 16px;
        gap: 19px;
    }

    .hd-suggest .__prod-item {
        flex: 0 0 138px;
    }

    .hd-suggest .__name {
        margin-block: 11px;
        line-height: 1.25;
        font-size: 0.75rem;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .hd-suggest .__num {
        font-size: 0.9375rem;
    }

    .hd-suggest .__tax {
        font-size: 0.875rem;
    }
}

@media screen and (min-width:769px) {
    .hd-suggest {
        font-size: 0.875rem;
    }

    .hd-suggest :is(.__text-outer, #expsuggestsearchdiv) {
        padding: 30px;
        border-radius: 20px;
    }

    .hd-suggest #expsuggestsdiv {
        top: calc(100% + 15px) !important;
        left: -56px !important;
        width: calc(340px + 15px + 500px) !important;
    }

    .hd-suggest .__text-outer {
        width: 340px;
    }

    .hd-suggest #expsuggestsearchdiv {
        top: 0 !important;
        left: calc(340px + 15px) !important;
        width: 500px !important;
    }

    .hd-suggest .__inner {
        min-height: min(60vh, 540px);
        max-height: calc(90vh - var(--sticky-height));
        max-height: calc(90dvh - var(--sticky-height));
        overflow-y: auto;
    }

    .hd-suggest .__cate {
        grid-area: cate;
    }

    .hd-suggest .__kwd {
        grid-area: kwd;
    }

    .hd-suggest .__prod {
        grid-area: prod;
    }

    .hd-suggest .__cate + .__kwd {
        margin-block-start: 38px;
    }

    .hd-suggest .__txt-list {
        margin-block-start: 1.25rem;
        line-height: 1.2857;
    }

    .hd-suggest .__txt-list > * + * {
        margin-block-start: 0.375rem;
    }

    .hd-suggest .__prod > * + * {
        margin-block-start: 0.625rem;
    }

    .hd-suggest .__prod-link {
        display: grid;
        grid-template-columns: 100px 1fr;
        gap: 20px;
    }

    .hd-suggest .__name {
        line-height: 2.143;
    }

    .hd-suggest .__price {
        margin-block-start: 0.875rem;
    }

    .hd-suggest .__num {
        font-size: 1rem;
    }
}

/******************************
    パンくずリスト
******************************/
.breadcrumb .__list {
    margin-block-start: 1rem;
    padding: 0;
    list-style-type: none;
}

.breadcrumb .__item {
    display: inline;
}

.breadcrumb .__item:not(:last-child)::after {
    content: " >";
    display: inline;
    padding-inline: 0.2em;
}

@media screen and (max-width:768px) {
    .breadcrumb {
        font-size: 0.6875rem;
    }
}

@media screen and (min-width:769px) {
    .breadcrumb {
        margin-block-end: 1rem;
        font-size: 0.75rem;
    }
}

/******************************
    ページタイトル
******************************/
.page-title {
    text-align: center;
    font-weight: 700;
}

@media screen and (max-width:768px) {
    .page-title {
        padding-block: 2.75rem 2.5rem;
        font-size: 1.25rem;
    }
}

@media screen and (min-width:769px) {
    .page-title {
        padding-block: 5.375rem 5rem;
        font-size: 1.875rem;
    }
}

/******************************
    共通ボタン
******************************/
.common-btn {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 100%;
    margin-inline: auto;
    padding: 0.3em 1.6em;
    background: transparent;
    border: 1px solid var( --color-base-03);
    text-decoration: none;
    font-weight: 500;
}

a.common-btn:not([href]) {
    opacity: 1 !important;
}

.common-btn.--cv {
    border: none;
    background: var(--color-important);
    color: #FFF;
    font-weight: 700;
}

.common-btn.--cv-disable {
    border: none;
    background: var(--color-base-04);
    color: #FFF;
    font-weight: 700;
}

.common-btn.--icon::before {
    content: "";
    margin-inline-end: 0.8em;
    background: center / contain no-repeat;
}

.common-btn.--cv::before {
    background-image:
        url(../images/QtYdBzVdPzMJ.svg);
}

.common-btn.--restock::before {
    background-image:
        url(../images/zym8D8BQUduT.svg);
}

.common-btn.--search::before {
    background-image:
        url(../images/tWqaNXX636Tq.svg);
}

.common-btn.--favorite::before {
    background-image:
        url(../images/OuIzKJ7tfLCX.svg);
}

.common-btn.--support::before {
    background-image:
        url(../images/OoDIgVtZUAe8.svg);
}

.common-btn.--beginner::before {
    background-image:
        url(../images/XfgCG9MAdFfo.svg);
}

.common-btn.--plus::after {
    content: "";
    position: absolute;
    z-index: +1;
    inset-block: 0;
    margin: auto;
    background: var( --color-base-03);
    clip-path: polygon(46.667% 10%, 53.333% 10%, 53.333% 46.667%, 90% 46.667%, 90% 53.333%, 53.333% 53.333%, 53.333% 90%, 46.667% 90%, 46.667% 53.333%, 10% 53.333%, 10% 46.667%, 46.667% 46.667%);
}

@media screen and (max-width:768px) {
    .common-btn {
        width: 17.1875rem;
        max-width: 275px;
        min-height: 2.5rem;
        border-radius: 1.25rem;
        font-size: 0.8125rem;
    }

    .common-btn:is(.--cv, .--cv-disable) {
        min-height: 3.125rem;
        border-radius: 1.5625rem;
        font-size: 0.9375rem;
    }

    .common-btn.--cv::before {
        width: 2.125rem;
        height: 1.8125rem;
    }

    .common-btn.--restock::before {
        width: 1.1875rem;
        height: 1.375rem;
    }

    .common-btn.--search::before {
        width: 1.3125rem;
        height: 1.3125rem;
    }

    .common-btn:is(.--favorite, .--support, .--beginner) {
        min-height: 2.8125rem;
        border-radius: 1.40625rem;
    }

    .common-btn.--favorite::before {
        width: 1.5625rem;
        height: 1.5625rem;
    }

    .common-btn.--support::before {
        width: 1.5625rem;
        height: 1.5625rem;
    }

    .common-btn.--beginner::before {
        width: 1.25rem;
        height: 1.625rem;
    }

    .common-btn.--plus {
        padding-inline: calc(5px + 0.75rem + 15px);
    }

    .common-btn.--plus::after {
        inset-inline-end: 15px;
        width: 0.75rem;
        height: 0.75rem;
    }
}

@media screen and (min-width:769px) {
    .common-btn {
        width: 31.25rem;
        min-height: 3.75rem;
        border-radius: 1.875rem;
        font-size: 1rem;
    }

    .common-btn:is(.--cv, .--cv-disable) {
        min-height: 4.375rem;
        border-radius: 2.1875rem;
        font-size: 1.125rem;
    }

    .common-btn.--cv::before {
        width: 2.1875rem;
        height: 1.875rem;
    }

    .common-btn.--restock::before {
        width: 1.75rem;
        height: 2.0625rem;
    }

    .common-btn.--search::before {
        width: 1.375rem;
        height: 1.375rem;
    }

    .common-btn:is(.--favorite, .--support, .--beginner) {
        padding-inline: 16px;
        min-height: 3.125rem;
        border-radius: 1.5625rem;
        font-size: 0.875rem;
    }

    .common-btn.--favorite::before {
        width: 1.4375rem;
        height: 1.4375rem;
    }

    .common-btn.--support::before {
        width: 1.375rem;
        height: 1.375rem;
    }

    .common-btn.--beginner::before {
        width: 1.4375rem;
        height: 1.875rem;
    }

    .common-btn.--plus {
        padding-inline: calc(10px + 1rem + 30px);
    }

    .common-btn.--plus::after {
        inset-inline-end: 30px;
        width: 1rem;
        height: 1rem;
    }
}

/******************************
    商品リスト
******************************/
.item-list-wrap {
    position: relative;
}

.item-list .__item {
    font-weight: 500;
}

.item-list .__link {
    display: block;
    text-decoration: none;
}

.item-list .__photo {
    aspect-ratio: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.item-list .__photo-img {
    object-fit: contain;
    max-height: 100%;
}

.item-list .__icon {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
}

.item-list .__name {
    word-break: break-all;
}

.item-list .__price.--sale {
    color: var(--color-important);
}

.item-list .__price .__num {
    font-weight: 700;
}

.item-list-sort .__list {
    display: flex;
    align-items: center;
    padding: 0;
    list-style-type: none;
}

.item-list-sort .__link {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--color-base-03);
    line-height: 1;
    text-decoration: none;
    font-weight: 500;
}

.item-list-sort .__link:not([href]) {
    background: var(--color-base-03);
    color: #FFF;
}

.item-list-hd .__count {
    font-weight: 500;
}

.item-list-empty {
    position: relative;
    text-align: center;
    font-weight: 500;
}

.item-list-empty::before {
    content: "";
    position: absolute;
    inset: 0;
    display: block;
    margin: auto;
    background: center / contain no-repeat
        url(../images/B16cPA199T0V.svg);
}

.item-list-empty .__text {
    display: block;
}

@media screen and (max-width:768px) {
    .item-list-hd {
        margin-block-end: 0.375rem;
        display: flex;
        flex-direction: column-reverse;
        gap: 18px;
    }

    .item-list-sort {
        padding: 10px 9px;
        background: var(--color-base-01);
        font-size: 0.75rem;
    }

    .item-list-sort .__list {
        justify-content: space-around;
        gap: 6px;
    }

    .item-list-sort .__link {
        padding: 0.5em 0.7em;
        text-align: center;
    }

    .item-list-hd .__count {
        font-size: 0.8125rem;
    }

    .item-list-wrap > .item-list:not(.swiper-wrapper) {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 24px 28px;
    }

    .item-list-wrap.--sp-scroll {
        margin-inline: calc(var(--page-padding) * -1);
        padding-inline-start: var(--page-padding);
        padding-block-end: calc(21px + var(--scrollbar-size));
    }

    .item-list-wrap.--sp-scroll .os-scrollbar-horizontal {
        margin-inline: var(--page-padding);
    }

    .item-list-wrap.--sp-scroll .item-list {
        display: flex;
        gap: 13px;
    }

    .item-list-wrap.--sp-scroll .__item {
        position: relative;
        flex: 0 0 142px;
    }

    .item-list-wrap.--sp-scroll .item-list > *:last-child::after {
        content: "";
        position: absolute;
        inset-block-start: 0;
        inset-inline-start: 100%;
        display: block;
        width: var(--page-padding);
        height: 1px;
    }

    .item-list .__item {
        font-size: 0.6875rem;
    }

    .item-list .__photo {
        margin-block-end: 13px;
    }

    .item-list .__photo-img {
        border-radius: 10px;
    }

    .item-list .__icon {
        margin-block-end: 10px;
    }

    .item-list .__icon-img {
        max-height: 18px;
    }

    .item-list .__name {
        line-height: 1.5;
    }

    .item-list .__price {
        margin-block-start: 8px;
    }

    .item-list .__price .__tax {
        font-size: 0.625rem;
    }

    .item-list-empty {
        margin-block-end: 1.6875rem;
        padding-block-start: 85px;
        font-size: 0.875rem;
    }

    *:not(.page-title) + .item-list-empty {
        margin-block-start: 3.625rem;
    }

    .item-list-empty::before {
        width: 54px;
        height: 50px;
        transform: translateY(-1.4em);
    }
}

@media screen and (min-width:769px) {
    .item-list-hd,
    .item-list-sort {
        display: flex;
        align-items: center;
        gap: 20px;
    }

    .item-list-hd {
        justify-content: space-between;
        margin-block-end: 2rem;
        padding-block: 8px;
        padding-inline: 36px 40px;
        background: var(--color-base-01);
    }

    .item-list-sort {
        gap: 40px;
    }

    .item-list-sort .__title {
        font-weight: 700;
    }

    .item-list-sort .__list {
        gap: 20px;
    }

    .item-list-sort .__link {
        padding: 0.5em 1em;
    }

    .item-list:not(.swiper-wrapper) {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 50px 27px;
    }

    .item-list .__item {
        font-size: 1rem;
    }

    .item-list .__photo {
        margin-block-end: 22px;
    }

    .item-list .__photo-img {
        border-radius: 20px;
    }

    .item-list .__icon {
        margin-block-end: 15px;
    }

    .item-list .__icon-img {
        max-height: 25px;
    }

    .item-list .__name {
        line-height: 1.875;
    }

    .item-list .__price {
        margin-block-start: 8px;
    }

    .item-list .__price .__tax {
        font-size: 0.875rem;
    }

    .item-list-wrap.--pc-swiper {
        position: relative;
        margin-inline: -13px;
    }

    .item-list-wrap.--pc-swiper .__item {
        padding-inline: 13px;
    }

    .item-list-wrap.--pc-swiper .__btn {
        position: absolute;
        z-index: +1;
        inset-block-start: calc(274px / 2);
        translate: 0 -50%;
    }

    .item-list-wrap.--pc-swiper .__btn {
        width: 40px;
        height: 40px;
    }

    .item-list-wrap.--pc-swiper .__btn.--prev {
        inset-inline-start: -51px;
    }

    .item-list-wrap.--pc-swiper .__btn.--next {
        inset-inline-end: -51px;
    }

    .item-list-empty {
        margin-block-end: 5rem;
    }

     *:not(.page-title) + .item-list-empty {
        margin-block-start: 4.375rem;
     }

    .item-list-empty .__text {
        padding-block-start: 120px;
    }

    .item-list-empty::before {
        width: 76px;
        height: 70px;
        transform: translateY(-0.7em);
    }
}

/******************************
    レビューの星
******************************/
.reviewRate {
    display: flex;
    align-items: center;
}

.reviewRateStar {
    background: center / contain no-repeat;
    text-indent: 110%;
    white-space: nowrap;
    overflow: hidden;
}

.reviewRateStar.starOn {
    background-image:
        url(../images/vku1BlyA3NpF.svg);
}

.reviewRateStar.starOff {
    background-image:
        url(../images/VEDz73sa0Idr.svg);
}

.reviewRateStar.starHalf {
    background-image:
        url(../images/dXvSn5YRI7gw.svg);
}

@media screen and (max-width:768px) {
    .reviewRate {
        gap: 0.3125rem;
    }

    .reviewRateStar {
        width: 1.125rem;
        height: 1.125rem;
    }
}

@media screen and (min-width:769px) {
    .reviewRate {
        gap: 0.375rem;
    }

    .reviewRateStar {
        width: 1.375rem;
        height: 1.375rem;
    }
}

/******************************
    矢印ボタン
******************************/
.arrow-btn {
    position: relative;
    display: block;
    padding: 0;
    background: #FFF;
    border: 1px solid var( --color-base-03);
    text-indent: 110%;
    white-space: nowrap;
    overflow: hidden;
    transition: var(--transition-basic);
    transition-property: opacity, background-color;
}

.arrow-btn::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: var( --color-base-03);
    transition: var(--transition-basic);
    transition-property: opacity, background-color;
}

.arrow-btn:hover {
    background: var( --color-base-03);
}

.arrow-btn:hover::before {
    background: #FFF;
}

.arrow-btn.--next {
    transform: rotate(180deg);
}

@media screen and (max-width:768px) {
    .arrow-btn {
        width: 30px;
        height: 30px;
    }

    .arrow-btn::before {
        clip-path: polygon(36.667% 50%, 56.667% 33.333%, 60% 36.667%, 43.333% 50%, 60% 63.333%, 56.667% 66.667%);
    }
}

@media screen and (min-width:769px) {
    .arrow-btn {
        width: 50px;
        height: 50px;
    }

    .arrow-btn::before {
        clip-path: polygon(38% 50%, 58% 34%, 60% 36%, 42% 50%, 60% 64%, 58% 66%);
    }
}

/******************************
    アコーディオン アイコン
******************************/
:is(.--acc-trig, .--acc-arrow)::after {
    content: "";
    display: block;
    width: 0.9375rem;
    height: 0.9375rem;
}

.--acc-trig::after {
    clip-path: polygon(46.667% 10%, 53.333% 10%, 53.333% 46.667%, 90% 46.667%, 90% 53.333%, 53.333% 53.333%, 53.333% 90%, 46.667% 90%, 46.667% 53.333%, 10% 53.333%, 10% 46.667%, 46.667% 46.667%);
}

.--acc-trig.--open::after {
    clip-path: polygon(10% 46.667%, 90% 46.667%, 90% 53.333%, 10% 53.333%);
}

.--acc-arrow::after {
    clip-path: polygon(26.667% 13.333%, 80% 50%, 26.667% 86.667%, 23.333% 80%, 70% 50%, 23.333% 20%);
}

@media screen and (max-width:768px) {
    .--acc-trig.--pc::after,
    .--acc-arrow.--pc::after {
        display: none;
    }
}

@media screen and (min-width:769px) {
    .--acc-trig.--sp::after,
    .--acc-arrow.--sp::after {
        display: none;
    }
}

/******************************
    数量入力欄
******************************/
.quantity .__qty {
    border: 1px solid var(--color-base-02);
    border-radius: 0;
    text-align: center;
    font-weight: 500;
}

@media screen and (max-width:768px) {
    .quantity .__qty {
        min-height: 2.1875rem;
        width: 3.75rem;
        font-size: 1rem;
    }

    .quantity .__btn {
        display: none;
    }
}

@media screen and (min-width:769px) {
    .quantity {
        width: fit-content;
        display: grid;
        grid-template-columns: 40px 50px 40px;
    }

    .quantity .__qty {
        order: 2;
        min-height: 2.5rem;
        font-size: 1rem;
    }

    .quantity .__btn {
        background: var(--color-base-02) center / 1rem no-repeat;
        border: none;
        padding: 0;
        line-height: 1;
        text-indent: 110%;
        white-space: nowrap;
        overflow: hidden;
        cursor: pointer;
    }

    .quantity .__btn.--up {
        order: 3;
        background-image:
            url(../images/o4c9WPl8nrdR.svg);
    }

    .quantity .__btn.--down {
        order: 1;
        background-image:
            url(../images/6PR0M0aiKtiO.svg);
    }
}

/******************************
    OverlayScrollbars
******************************/
:root {
    --scrollbar-color-track: #E6E0D8;
    --scrollbar-color-handle: var( --color-base-03);
}

@media screen and (max-width:768px) {
    :root {
        --scrollbar-size: 10px;
    }
}

@media screen and (min-width:769px) {
    :root {
        --scrollbar-size: 15px;
    }
}

.os-scrollbar {
    padding: 0 !important;
}

.os-scrollbar-track {
    border-radius: 0 !important;
    background: var(--scrollbar-color-track) !important;
}

.os-scrollbar-handle {
    border-radius: 0 !important;
    background: var(--scrollbar-color-handle) !important;
}

.os-scrollbar-horizontal {
    height: var(--scrollbar-size) !important;
}

.os-scrollbar-vertical {
    width: var(--scrollbar-size) !important;
}

/******************************
    ページャー
******************************/
.pager .__list {
    padding: 0;
    list-style-type: none;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pager .__item.--num .__link {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--color-base-03);
    text-decoration: none;
}

.pager .__item.--num .__link:not([href]) {
    background: var(--color-base-03);
    color: #FFF;
}

.pager .__item.--num .__link:not([href]):hover {
    opacity: 1;
}

.pager .__item.--next {
    transform: rotate(180deg);
}

.pager .arrow-btn:hover {
    background: inherit;
    color: inherit;
}

.pager .arrow-btn:hover::before {
    background: var(--color-base-03);
}

@media screen and (max-width:768px) {
    .pager {
        margin-block-start: 3.125rem;
    }

    .pager .__item.--num:first-child {
        margin-inline-start: calc(30px + 12px);
    }

    .pager .__item.--num:last-child {
        margin-inline-end: calc(30px + 12px);
    }

    .pager .__list {
        gap: 12px;
    }

    .pager .__link {
        width: 30px;
        height: 30px;
        font-size: 0.8125rem;
    }
}

@media screen and (min-width:769px) {
    .pager {
        margin-block-start: 5rem;
    }

    .pager .__item.--num:first-child {
        margin-inline-start: calc(40px + 25px);
    }

    .pager .__item.--num:last-child {
        margin-inline-end: calc(40px + 25px);
    }

    .pager .__list {
        gap: 25px;
    }

    .pager .__link {
        width: 40px;
        height: 40px;
        font-weight: 500;
    }
}

/******************************
    フッター
******************************/
:where(.site-ft ul) {
    padding: 0;
    list-style-type: none;
}

:where(.site-ft a) {
    text-decoration: none;
}

.ft-sns .__list {
    display: flex;
    justify-content: center;
    align-items: center;
}

.ft-sns .__link {
    display: block;
    background: center / contain no-repeat;
    text-indent: 110%;
    white-space: nowrap;
    overflow: hidden;
}

.ft-sns .__link.--facebook {
    background-image:
        url(../images/TvRD5byMi5Ff.png);
}

.ft-sns .__link.--instagram {
    background-image:
        url(../images/eBceGTgzLv0q.png);
}

.ft-sns .__link.--line {
    background-image:
        url(../images/pk09LqryvH55.png);
}

.ft-guide,
.ft-info {
    background:var(--color-base-04);
    color: #FFF;
}

.ft-guide :is(.__heading, .__title) {
    font-weight: 500;
}

.ft-guide .__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.3em;
}

.back-to-top {
    position: fixed;
    z-index: +1;
    opacity: 0;
    visibility: hidden;
    transition: var(--transition-basic);
    transition-property: opacity, visibility;
}

.back-to-top.--show {
    opacity: 1;
    visibility: visible;
}

.back-to-top .__link {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 1px solid #FFF;
    background: var(--color-base-03);
    color: #FFF;
    font-weight: 700;
}

.back-to-top .__link::before {
    content: "";
    background: center / contain no-repeat
        url(../images/w9ZCrgcFrEbd.svg);
}

@media screen and (max-width:768px) {
    .ft-sns {
        padding-block: 50px;
    }

    .ft-sns .__list {
        gap: 36px;
    }

    .ft-sns .__link {
        width: 2.1875rem;
        height: 2.1875rem;
    }

    .ft-guide,
    .ft-menu .__item {
        border-block-end: 1px solid #FFF;
    }

    .ft-guide .__heading,
    .ft-menu .__link {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 6px;
        min-height: 2.5rem;
        padding-block: 0.3em;
        padding-inline: 30px var(--page-padding);
        font-size: 0.8125rem;
        font-weight: 500;
    }

    .ft-guide .__heading::after,
    .ft-menu .__link::after {
        flex: 0 0 auto;
        background: #FFF;
    }

    .ft-guide .__list {
        padding-block: 13px 30px;
        padding-inline: 30px 35px;
    }

    .ft-guide .__list > * + * {
        margin-block-start: 1.875rem;
    }

    .ft-guide .__title {
        font-size: 0.8125rem;
    }

    .ft-guide .__content {
        margin-block-start: 0.5rem;
        line-height: 1.25;
        font-size: 0.75rem;
    }

    .ft-guide .__btn-wrap {
        margin-block-start: 1.0625rem;
    }

    .ft-guide .__btn {
        width: 8.125rem;
        min-height: 1.875rem;
        border: 1px solid rgba(255, 255, 255, 60%);
        border-radius: 0.9375rem;
        font-size: 0.75rem;
    }

    .ft-copyright {
        display: block;
        padding: 14px 30px;
        text-align: center;
        letter-spacing: 0.01em;
        font-size: 0.8125rem;
    }

    .back-to-top {
        inset-block-end: 0;
        inset-inline-end: 0;
    }

    .back-to-top .__link {
        width: 1.875rem;
        height: 1.875rem;
        font-size: 0.625rem;
    }

    .back-to-top .__link::before {
        width: 0.71875rem;
        height: 0.375rem;
        margin-block-end: 2px;
    }
}

@media screen and (min-width:769px) {
    .site-ft {
        width: var(--page-width);
        padding-inline: var(--page-padding);
        margin-inline: auto;
    }

    .ft-sns {
        padding-block: 80px;
    }

    .ft-sns .__list {
        gap: 36px;
    }

    .ft-sns .__link {
        width: 2.25rem;
        height: 2.25rem;
    }

    .ft-guide,
    .ft-info {
        border-image: linear-gradient(var(--color-base-04) 0% 100%) 0 fill / auto / 0 100vw;
    }

    .ft-guide {
        padding-block: 64px;
    }

    .ft-guide .__heading {
        position: absolute;
        inset-block-start: -200vh;
        inset-inline-start: -200vw;
    }

    .ft-guide .__list {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: 1fr;
        gap: 50px;
    }

    .ft-guide .__title {
        font-size: 0.875rem;
    }

    .ft-guide .__content {
        margin-block-start: 1.125rem;
        line-height: 2;
        font-size: 0.75rem;
    }

    .ft-guide .__btn-wrap {
        margin-block-start: 1.125rem;
    }

    .ft-guide .__btn {
        font-size: 0.75rem;
        width: 8.125rem;
        min-height: 2rem;
        border: 1px solid #FFF;
    }

    .ft-info,
    .ft-menu .__list {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .ft-info {
        gap: 47px;
        padding-block-end: 3.75rem;
    }

    .ft-menu,
    .ft-copyright {
        font-size: 0.75rem;
    }

    .ft-menu {
        flex: 1 1 100%;
    }

    .ft-menu .__list {
        gap: 1em 2ch;
    }

    .ft-copyright {
        white-space: nowrap;
        letter-spacing: 0.05em;
    }

    .back-to-top {
        inset-block-end: 4px;
        inset-inline-end: 4px;
    }

    .back-to-top .__link {
        width: 3.125rem;
        height: 3.125rem;
        font-size: 0.75rem;
    }

    .back-to-top .__link::before {
        width: 1.1875rem;
        height: 0.625rem;
        margin-block-end: 4px;
    }
}

/******************************
    トップページ
******************************/
:where(.top-content a) {
  text-decoration: none;
}

#sb_category,
#ranking {
  scroll-margin-block-start: var(--sticky-height);
}

.top-mv {
  overflow: hidden;
}

.top-mv .swiper {
  margin-inline: auto;
  overflow: visible;
}

.top-mv .__link {
  display: block;
}

:is(.top-mv, .top-contents, .top-brand) .__btn {
  position: absolute;
  z-index: +1;
  inset-block: 0;
  margin: auto;
}

.top-mv .__btn {
  background-color: rgba(255, 255, 255, 90%);
}

.top-mv .__btn:hover {
  background-color: var(--color-translucent-btn-bg);
}

.top-mv .__pg {
  width: fit-content;
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.top-mv .swiper-pagination-bullet {
  background: var(--color-base-02);
  border-radius: 50%;
}

.top-mv .swiper-pagination-bullet-active {
  background: var(--color-base-03);
}

.top-bnr {
  width: fit-content;
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.top-bnr .__item {
  overflow: hidden;
}

.top-bnr .__link {
  display: block;
}

.top-section-wrap > *:nth-child(even) {
  border-image: linear-gradient(var(--color-base-01) 0% 100%) 0 fill / auto / 0 100vw;
}

.top-section-wrap > *:nth-child(odd):last-child {
  padding-block-end: 0;
}

.top-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  letter-spacing: 0;
  font-weight: 500;
}

.top-heading::before {
  content: attr(data-sub);
  letter-spacing: 0.08em;
  font-weight: 700;
}

.top-cate .__link {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  align-items: center;
  text-align: center;
}

.top-cate .__link::before {
  content: "";
  flex: 0 0 auto;
  background: center / contain no-repeat;
}

.top-cate .__link.--01::before {
  background-image:
      url(../images/HTpHXRGRH28h.svg);
}

.top-cate .__link.--02::before {
  background-image:
      url(../images/8arYuj3vkjaT.svg);
}

.top-cate .__link.--03::before {
  background-image:
      url(../images/bqnb17GXkuwS.svg);
}

.top-cate .__link.--04::before {
  background-image:
      url(../images/YM2iarWTNoUg.svg);
}

.top-cate .__link.--05::before {
  background-image:
      url(../images/tN8aO7IyY4ct.svg);
}

.top-cate .__link.--06::before {
  background-image:
      url(../images/Fmbv20UEJXlA.svg);
}

.top-cate .__link.--07::before {
  background-image:
      url(../images/ZQtk97mqTw4Y.svg);
}

.top-cate .__link.--08::before {
  background-image:
      url(../images/oyRnVU2a8nOA.svg);
}

.top-cate .__link.--09::before {
  background-image:
      url(../images/IiJWYexfdurf.svg);
}

.top-cate .__link.--10::before {
  background-image:
      url(../images/kCfWSp7zj3me.svg);
}

.top-cate .__link.--11::before {
  background-image:
      url(../images/Pi9kH7nR4Dli.svg);
}

.top-cate .__link.--12::before {
  background-image:
      url(../images/Ac8SIdkgVefK.svg);
}

.top-cate .__link.--13::before {
  background-image:
      url(../images/UitYcyRXhjHa.svg);
}

.top-cate .__link.--14::before {
  background-image:
      url(../images/FzceOUL2R69d.svg);
}

.top-cate .__link.--15::before {
  background-image:
      url(../images/eWSzUX9T4gAX.svg);
}

.top-cate .__link.--16::before {
  background-image:
      url(../images/BBOvHtlyE18h.svg);
}

.top-cate .__link.--17::before {
  background-image:
      url(../images/ns042CeC5NTe.svg);
}

.top-cate .__link.--18::before {
  background-image:
      url(../images/JdjgXqg1cUFd.svg);
}

.top-cate .__link.--19::before {
  background-image:
      url(../images/AifN36h7bonD.svg);
}

.top-cate .__link.--20::before {
  background-image:
      url(../images/NqyNS8ubJKgm.svg);
}

.top-cate .__link.--21::before {
  background-image:
      url(../images/aJX1pFXrbZ3m.svg);
}

.top-cate .__link.--22::before {
  background-image:
      url(../images/t3r1L9lD54fY.svg);
}

.top-cate .__link.--23::before {
  background-image:
      url(../images/svIs2W3ZmWzV.svg);
}

.top-cate .__link.--24::before {
  background-image:
      url(../images/GQ9oxP6hiryM.svg);
}

.top-cate .__link.--25::before {
  background-image:
      url(../images/56ZCexGIUK7R.svg);
}

.top-cate .__link.--26::before {
  background-image:
      url(../images/6urU130bf2i9.svg);
}

.top-cate .__link.--27::before {
  background-image:
      url(../images/VcyRQZdG97xo.svg);
}

.top-cate .__link.--28::before {
  background-image:
      url(../images/WlV56F1iwms5.svg);
}

.top-cate .__link.--29::before {
  background-image:
      url(../images/pYEs4xwBlUAB.svg);
}

.top-cate .__link.--30::before {
  background-image:
      url(../images/jGBpGUB8WbJa.svg);
}

.top-cate .__title {
  flex: 1 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
}

.top-pick-up .__item {
  width: fit-content;
  margin-inline: auto;
}

.top-pick-up .__link {
  position: relative;
  display: block;
}

.top-pick-up .__title {
  position: absolute;
  z-index: +1;
  inset-inline: 0;
  transform: translateY(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
  padding: 0.3em;
  background: #FFF;
  letter-spacing: 0;
  font-weight: 500;
}

.top-contents .__list {
  position: relative;
}

.top-contents .__link {
  display: block;
}

.top-contents .__item-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
}

/* .top-contents .__list:not(.--swiper) .__item:nth-child(1) {
  grid-column: 1/2;
  grid-row: 1/2;
}

.top-contents .__list:not(.--swiper) .__item:nth-child(2) {
  grid-column: 2/3;
  grid-row: 1/2;
}

.top-contents .__list:not(.--swiper) .__item:nth-child(3) {
  grid-column: 1/2;
  grid-row: 2/3;
}

.top-contents .__list:not(.--swiper) .__item:nth-child(4) {
  grid-column: 2/3;
  grid-row: 2/3;
}

.top-contents .__list:not(.--swiper) .__item:nth-child(5) {
  grid-column: 3/4;
  grid-row: 1/2;
}

.top-contents .__list:not(.--swiper) .__item:nth-child(6) {
  grid-column: 4/5;
  grid-row: 1/2;
}

.top-contents .__list:not(.--swiper) .__item:nth-child(7) {
  grid-column: 3/4;
  grid-row: 2/3;
}

.top-contents .__list:not(.--swiper) .__item:nth-child(7) {
  grid-column: 4/5;
  grid-row: 2/3;
} */

.top-contents :is(.__item-wrap, .__list:not(.--swiper)) {
  gap: 26px;
  padding-inline: 13px;
}

.top-contents .__item {
  position: relative;
  width: fit-content;
  margin-inline: auto;
  overflow: hidden;
}

.top-contents .__title {
  position: absolute;
  z-index: +1;
  inset-block-end: 0;
  inset-inline-start: 0;
  display: block;
  width: 100%;
  background: rgba(0, 0, 0, 50%);
  color: #FFF;
}

.top-ranking {
  position: relative;
}

.top-ranking .__tab-inner {
  display: flex;
}

.top-ranking .__tab-btn {
  appearance: none;
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-block: 0.2em;
  background: transparent;
  border: 1px solid var(--color-base-03);
}

.top-ranking .__tab-btn.--active {
  background: var(--color-base-03);
  color: #FFF;
  opacity: 1;
  pointer-events: none;
}

.top-ranking .item-list-wrap {
  position: absolute;
  inset-block-start: -200vh;
  opacity: 0;
  visibility: hidden;
  transition: var(--transition-basic);
  transition-property: opacity, visibility, position;
  transition-delay: 0s;
}

.top-ranking .item-list-wrap.--show {
  position: static;
  opacity: 1;
  visibility: visible;
  transition-delay: 0.2s;
}

.top-ranking .item-list .__link {
  position: relative;
}

.top-ranking .item-list .__rank-num {
  position: absolute;
  z-index: +2;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--color-base-03);
  color: #FFF;
  font-weight: 500;
}

.top-ranking .item-list .__rank-num.--1 {
  background: #D1B657;
}

.top-ranking .item-list .__rank-num.--2 {
  background: #BEBEBE;
}

.top-ranking .item-list .__rank-num.--3 {
  background: #C18E5B;
}

.top-ranking .item-list .__photo-img {
  border-radius: 0;
}

.top-brand .__list {
  position: relative;
}

.top-brand .__link {
  display: block;
}

.top-brand .__item {
  width: fit-content;
  margin-inline: auto;
}

.top-brand .--col1-3 {
  grid-column: 1 / 3;
}

.top-brand .--col3-5 {
  grid-column: 3 / 5;
}

.top-company .__inner {
  text-align: center;
}

.top-company :is(.__title, .__catch-copy) {
  font-weight: 700;
}

.top-company .__content {
  letter-spacing: 0;
}

.top-company .__content > p + p {
  margin-block-start: 2em;
}

.top-guide .__link {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  border: 1px solid var(--color-base-03);
  text-align: center;
}

.top-guide .__link::before {
  content: "";
  flex: 0 0 auto;
  background: center / contain no-repeat;
}

.top-guide .__link.--1::before {
  background-image:
      url(../images/1vsrlAjt6wD0.svg);
}

.top-guide .__link.--2::before {
  background-image:
      url(../images/PSJIaNnHAvzt.svg);
}

.top-guide .__link.--3::before {
  background-image:
      url(../images/2LJZ4DHSWStD.svg);
}

.top-guide .__link.--4::before {
  background-image:
      url(../images/m0N1STiWXlDz.svg);
}

.top-guide .__title {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
}

.top-news .__link {
  display: grid;
  grid-template-columns: 5.5em 1fr;
  background: #FFF;
}

.top-news .__date {
  letter-spacing: 0.05em;
}

.top-news .__title {
  letter-spacing: 0;
}

.top-review .__item {
  border-block-end: 1px solid var(--color-base-02);
}

.top-review .__photo {
  aspect-ratio: 1;
}

.top-review .__photo-link {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.top-review .__img {
  object-fit: contain;
  max-height: 100%;
}

.top-review .__content {
  word-break: break-all;
}

.top-instagram .__link {
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.top-instagram .__img {
  object-fit: cover;
  max-height: 100%;
}

@media screen and (max-width:768px) {
  .top-mv {
      padding-inline: var(--page-padding);
  }

  .top-mv .swiper {
      margin-block-start: 15px;
      margin-inline: auto;
      max-width: calc(345px + 8px);
  }

  .top-mv .__item {
      padding-inline: 4px;
  }

  .top-mv .__btn.--prev {
      inset-inline-start: -15px;
  }

  .top-mv .__btn.--next {
      inset-inline-end: -15px;
  }

  .top-mv .__pg {
      gap: 20px;
      padding-block: 15px;
  }

  .top-mv .swiper-pagination-bullet {
      width: 0.5rem;
      height: 0.5rem;
  }

  .top-bnr {
      gap: 15px;
  }

  .top-bnr .__item {
      border-radius: 10px;
  }

  .top-section-wrap > * {
      padding-block-end: 50px;
  }

  .top-heading {
      gap: 0 15px;
      padding-block: 50px 25px;
      font-size: 0.9375rem;
  }

  .top-heading::before {
      font-size: 1.25rem;
  }

  .top-cate :is(.__sp-show, .__sp-hide) {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      justify-content: space-between;
      gap: 45px 30px;
  }

  .top-cate .__sp-hide {
      margin-block-start: 45px;
  }

  .top-cate .__link::before {
      width: 58px;
      height: 58px;
  }

  .top-cate .__title {
      line-height: 1.4545;
      font-size: 0.6875rem;
  }

  .top-cate .__btn-wrap {
      margin-block-start: 25px;
  }

  .top-pick-up .__list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: calc(20px + 0.9375rem) 16px;
  }

  .top-pick-up .__img {
      border-radius: 10px;
  }

  .top-pick-up .__title {
      width: calc(100% - 18px);
      min-height: 1.875rem;
      text-align: center;
      font-size: 0.6875rem;
  }

  .top-contents .__list {
      margin-inline: calc(var(--page-padding) * -1);
  }

  .top-contents .__list:not(.--swiper) {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      grid-template-rows: repeat(2, 1fr);
  }

  .top-contents :is(.__item-wrap, .__list:not(.--swiper)) {
      gap: 15px;
      padding-inline: var(--page-padding);
  }

  .top-contents .__item {
      border-radius: 10px;
  }

  .top-contents .__title {
      padding: 6px 8px;
      line-height: 1.4545;
      font-size: 0.6875rem;
      font-weight: 500;
  }

  .top-contents .__btn {
      background-color: rgba(255, 255, 255, 90%);
  }

  .top-contents .__btn:hover {
      background-color: var(--color-translucent-btn-bg);
  }

  .top-contents .__btn.--prev {
      inset-inline-start: 0;
  }

  .top-contents .__btn.--next {
      inset-inline-end: 0;
  }

  .top-ranking .__tab {
      margin-inline: calc(var(--page-padding) * -1);
      padding-inline-start: var(--page-padding);
  }

  .top-ranking .__tab-inner {
      gap: 5px;
  }

  .top-ranking .__tab-inner > *:last-child {
      position: relative;
  }

  .top-ranking .__tab-inner > *:last-child::after {
      content: "";
      position: absolute;
      inset-inline-start: 100%;
      display: block;
      width: var(--page-padding);
      height: 1px;
  }

  .top-ranking [style*="overflow"] .__tab-inner {
      padding-block-end: calc(15px + var(--scrollbar-size));
  }

  .top-ranking .os-scrollbar-horizontal {
      margin-inline: var(--page-padding);
  }

  .top-ranking .__tab-btn {
      padding-inline: 0.75em;
      font-size: 0.6875rem;
  }

  .top-ranking .item-list-wrap {
      margin-block-start: 28px;
  }

  .top-ranking .item-list-wrap .item-list {
      display: flex;
      flex-wrap: wrap;
      gap: 30px 15px;
  }

  .top-ranking .item-list .__item:nth-child(-n+4) {
      flex: 0 0 calc((100% - 15px) / 2);
  }

  .top-ranking .item-list .__item:nth-child(n+5) {
      flex: 0 0 calc((100% - 15px * 2) / 3);
  }

  .top-ranking .item-list .__rank-num {
      width: 1.4375rem;
      height: 1.4375rem;
      font-size: 0.8125rem;
  }

  .top-brand :is(.swiper, .__list:not(.--swiper)) {
      margin-inline: 30px;
  }

  .top-brand * > .__item + .__item {
      margin-block-start: 10px;
  }

  .top-brand .__btn.--prev {
      inset-inline-start: calc(var(--page-padding) * -1);
  }

  .top-brand .__btn.--next {
      inset-inline-end: calc(var(--page-padding) * -1);
  }

  .top-company .__title {
      font-size: 1.0625rem;
  }

  .top-company .__catch-copy {
      margin-block-start: 1.5625rem;
      font-size: 0.875rem;
  }

  .top-company .__content {
      margin-block-start: 2.1875rem;
      line-height: 2;
      font-size: 0.75rem;
  }

  .top-company .__btn-wrap {
      margin-block-start: 40px;
  }

  .top-guide {
      padding-block-start: 50px;
  }

  .top-guide .__list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 15px;
  }

  .top-guide .__item {
      width: 100%;
      max-width: 300px;
      margin-inline: auto;
  }

  .top-guide .__link {
      padding-block: 20px;
      padding-inline: 8px;
      border-radius: 10px;
      letter-spacing: 0;
  }

  .top-guide .__link::before {
      width: 70px;
      height: 50px;
  }

  .top-guide .__title {
      margin-block-start: 7px;
      font-size: 0.8125rem;
  }

  .top-news .__list > * + * {
      margin-block-start: 10px;
  }

  .top-news .__link {
      padding: 20px 15px;
      gap: 19px;
      line-height: 1.45;
      font-size: 0.6875rem;
  }

  .top-news .__date {
      font-weight: 500;
  }

  .top-news .__btn-wrap {
      margin-block-start: 40px;
  }

  .top-review .__item {
      padding-block: 20px;
      display: grid;
      grid-template-columns: 105px 1fr;
      gap: 18px;
      font-size: 0.8125rem;
  }

  .top-review .__img {
      border-radius: 10px;
  }

  .top-review .__reviewer {
      margin-block: 10px 8px;
  }

  .top-review .__content {
      margin-block-start: 8px;
      line-height: 1.538;
  }

  .top-instagram .__list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 15px;
  }
}

@media screen and (min-width:769px) {
  .top-mv {
      min-width: var(--page-width);
  }

  .top-mv .swiper {
      width: calc(var(--page-inner-width) + 6px);
  }

  .top-mv .__item {
      padding-inline: 3px;
  }

  .top-mv .__btn.--prev {
      inset-inline-start: -25px;
  }

  .top-mv .__btn.--next {
      inset-inline-end: -25px;
  }

  .top-mv .__pg {
      gap: 30px;
      padding-block: 30px;
  }

  .top-mv .swiper-pagination-bullet {
      width: 0.625rem;
      height: 0.625rem;
  }

  .top-bnr {
      gap: 20px;
  }

  .top-bnr .__item {
      border-radius: 20px;
  }

  .top-section-wrap > * {
      padding-block-end: 100px;
  }

  .top-heading {
      gap: 0 30px;
      padding-block: 100px 40px;
      font-size: 1.25rem;
  }

  .top-heading::before {
      font-size: 2.125rem;
  }

  .top-cate :is(.__sp-show, .__sp-hide) {
      display: contents !important;
  }

  .top-cate .__list {
      display: grid;
      grid-template-columns: repeat(10, 90px);
      justify-content: space-between;
      gap: 50px 32px;
  }

  .top-cate .__link::before {
      width: 60px;
      height: 60px;
  }

  .top-cate .__title {
      line-height: 2;
      font-size: 0.75rem;
  }

  .top-cate .__btn-wrap {
      display: none;
  }

  .top-pick-up .__list {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 27px;
  }

  .top-pick-up .__img {
      border-radius: 20px;
  }

  .top-pick-up .__title {
      width: calc(100% - 30px);
      min-height: 3.125rem;
  }

  .top-contents .__list {
      margin-inline: -13px;
  }

  .top-contents .__list:not(.--swiper) {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      grid-template-rows: repeat(2, 1fr);
  }

  .top-contents .__item {
      border-radius: 20px;
  }

  .top-contents .__title {
      padding: 13px 20px;
      line-height: 1.5556;
      font-size: 1.125rem;
      font-weight: 700;
  }

  :is(.top-contents, .top-brand) .__btn {
      width: 40px;
      height: 40px;
  }

  .top-contents .__btn.--prev {
      inset-inline-start: -51px;
  }

  .top-contents .__btn.--next {
      inset-inline-end: -51px;
  }

  .top-ranking .__tab-inner {
      gap: 20px;
  }

  .top-ranking [style*="overflow"] .__tab-inner {
      padding-block-end: calc(28px + var(--scrollbar-size));
  }

  .top-ranking .__tab-btn {
      padding-inline: 1em;
  }

  .top-ranking .item-list-wrap {
      margin-block-start: 40px;
  }

  .top-ranking .item-list {
      grid-template-columns: repeat(5, 1fr);
      gap: 38px;
  }

  .top-ranking .item-list .__rank-num {
      width: 1.875rem;
      height: 1.875rem;
  }

  .top-brand :is(.__item-wrap, .__list:not(.--swiper)) {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
  }

  .top-brand .__btn.--prev {
      inset-inline-start: -64px;
  }

  .top-brand .__btn.--next {
      inset-inline-end: -64px;
  }

  .top-company .__title {
      font-size: 1.625rem;
  }

  .top-company .__catch-copy {
      margin-block-start: 2.8125rem;
      font-size: 1.125rem;
  }

  .top-company .__content {
      margin-block-start: 2.875rem;
      line-height: 2.5;
  }

  .top-company .__btn-wrap {
      margin-block-start: 80px;
  }

  .top-guide {
      padding-block-start: 100px;
  }

  .top-guide .__list {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 27px;
  }

  .top-guide .__link {
      padding-block: 45px 40px;
      padding-inline: 20px;
      border-radius: 20px;
  }

  .top-guide .__link::before {
      width: 100px;
      height: 72px;
      margin-block-end: 16px;
  }

  .top-guide .__title {
      font-size: 1.125rem;
  }

  .top-news .__list > * + * {
      margin-block-start: 15px;
  }

  .top-news .__link {
      padding: 22px 30px;
      gap: 44px;
  }

  .top-news .__btn-wrap {
      margin-block-start: 80px;
  }

  .top-review .__list {
      border-block-start: 1px solid var(--color-base-02);
  }

  .top-review .__item {
      padding-block: 30px;
      display: grid;
      grid-template-columns: 180px 1fr;
      gap: 50px;
  }

  .top-review .__img {
      border-radius: 20px;
  }

  .top-review .__reviewer {
      margin-block: 16px 11px;
  }

  .top-review .__content {
      margin-block-start: 15px;
      line-height: 2;
  }

  .top-instagram .__list {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 27px;
  }
}

/*InstagramUGC　ここから*/
.ecbn-selection-page-wrapper .ecbn-selection-title {
  display: flex;
  justify-content: center;
}
html {
  scroll-behavior: initial;
}
/*InstagramUGC　ここまで*/

/*項目入れ替え　ここから*/
.vsm-tile {
  padding-top: 70px;
}
.ecbn-selection-page-wrapper .ecbn-selection-title, .ecbn-selection-wrapper .ecbn-selection-title {
  margin-top: 0 !important;
}

@media screen and (max-width: 768px) {
  .vsm-tile {
      padding-top: 50px;
  }
}
/*項目入れ替え　ここまで*/


/*トップページ改修　ここから*/
/* 各タイトル　ここから*/
.top-heading {
position: relative;
margin-inline: auto;
max-width: -moz-max-content;
max-width: max-content;
}
.top-heading::after {
content: "";
position: absolute;
bottom: 0;
right: 0;
left: 0;
margin-inline: auto;
display: block;
width: 100%;
height: 1px;
background: #333;
}

@media screen and (min-width: 769px) {
.top-heading {
  margin-block-end: 40px;
  padding-block: 100px 10px;
}
}
@media screen and (max-width: 768px) {
.top-heading {
  margin-block-end: 25px;
  padding-block: 50px 10px;
  flex-direction: column;
  align-items: center;
}
}
/* 各タイトル　ここまで*/
/* ランキング　ここから*/
.top-ranking .__tab-btn {
background: #fff;
}
.top-ranking .item-list .__rank-num.--1, .top-ranking .item-list .__rank-num.--2, .top-ranking .item-list .__rank-num.--3 {
top: -15px;
width: 60px;
height: 48px;
font-size: 0;
}
.top-ranking .item-list .__rank-num.--1 {
background: url(../images/YvgF8hGXBRPi.png) no-repeat center center/contain;
}
.top-ranking .item-list .__rank-num.--2 {
background: url(../images/flpTXdZQBCGX.png) no-repeat center center/contain;
}
.top-ranking .item-list .__rank-num.--3 {
background: url(../images/oAe8jyEH0ghO.png) no-repeat center center/contain;
}
.top-ranking .item-list-wrap {
margin-block-start: 50px;
}

@media screen and (min-width: 769px) {
.top-ranking .__tab-inner {
  display: grid;
  grid-template-rows: repeat(2, 1fr);
  grid-template-columns: repeat(8, max-content);
  gap: 15px 10px;
}
.top-ranking .__tab-btn[data-id="01"] {
  grid-column: 1/10;
  max-width: 82px;
}
}
@media screen and (max-width: 768px) {
.top-ranking .__tab-btn {
  padding-block: 0.4em;
  font-size: 0.8875rem;
}
.top-ranking .item-list .__rank-num.--1, .top-ranking .item-list .__rank-num.--2, .top-ranking .item-list .__rank-num.--3 {
  top: -20px;
  width: 50px;
  height: 40px;
}
}
/* ランキング　ここまで*/
/*ブランドで探す　ここから*/
@media screen and (min-width: 769px) {
.top-brand :is(.__item-wrap, .__list:not(.--swiper)) {
  grid-template-columns: repeat(4, 1fr);
  gap: 24px 27px;
}
.top-brand .__btn-wrap {
  margin-block-start: 60px;
}
}
.top-brand .__item {
border-radius: 20px;
overflow: hidden;
}
.top-brand :is(.__hide) {
display: contents;
}

@media screen and (max-width: 768px) {
.top-brand :is(.__item-wrap, .__list:not(.--swiper)) {
  margin-inline: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
}
.top-brand .__item {
  border-radius: 10px;
}
.top-brand .__btn-wrap {
  margin-block-start: 25px;
}
.top-brand * > .__item + .__item {
  margin-block-start: 0;
}
.top-brand .--col3-5 {
  grid-column: 1 / 3;
}
}
/*ブランドで探す　ここまで*/
/*ガイド　ここから*/
.top-guide .__link {
background: #fff;
}

/*ガイド　ここまで*/
/*トップページ改修　ここまで*/



/* 202508特集ジャーナル追加 */
.top-journal__text {
  font-weight: 400;
  line-height: 2.5;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .top-journal__text {
    margin-block-start: 2.1875rem;
    font-size: 0.75rem;
  }
}
@media screen and (min-width: 769px) {
  .top-journal__text {
    margin-block-start: 2.875rem;
    font-size: 1rem;
  }
}
.top-journal__image {
  display: block;
}
@media screen and (max-width: 768px) {
  .top-journal__image {
    margin-top: 2rem;
  }
}
@media screen and (min-width: 769px) {
  .top-journal__image {
    margin-top: 5.6875rem;
  }
}
.top-journal__image img {
  width: 100%;
  height: auto;
}