@charset "UTF-8";

/* theme */

:root {
    /* Container */
    --container-max-width: 100%;
    --container-xxs-max-width: 27.5rem;
    /* 440px */
    --container-xs-max-width: 42.5rem;
    /* 680px */
    --container-sm-max-width: 61.25rem;
    /* 980px */
    --container-md-max-width: 71.875rem;
    /* 1150px */
    --container-lg-max-width: 78.75rem;
    /* 1260px */
    --container-xl-max-width: 85rem;
    /* 1360px */
    --container-gutter: 1.25rem;

    --section-vertical-spacing: 2.5rem;
    --section-vertical-spacing-tight: 2.5rem;

    --section-stack-gap: 2.25rem;
    --section-stack-gap-tight: 2.25rem;

    /* Form settings */
    --form-gap: 1.25rem;
    /* Gap between fieldset and submit button */
    --fieldset-gap: 1rem;
    /* Gap between each form input within a fieldset */
    --form-control-gap: 0.625rem;
    /* Gap between input and label (ignored for floating label) */
    --checkbox-control-gap: 0.75rem;
    /* Horizontal gap between checkbox and its associated label */
    --input-padding-block: 0.65rem;
    /* Vertical padding for input, textarea and native select */
    --input-padding-inline: 0.8rem;
    /* Horizontal padding for input, textarea and native select */
    --checkbox-size: 0.875rem;
    /* Size (width and height) for checkbox */

    /* Other sizes */
    --sticky-area-height: calc(var(--announcement-bar-is-sticky, 0) * var(--announcement-bar-height, 0px) + var(--header-is-sticky, 0) * var(--header-is-visible, 1) * var(--header-height, 0px));

    /* RTL support */
    --transform-logical-flip: 1;
    --transform-origin-start: left;
    --transform-origin-end: right;
}

*,
:before,
:after {
    box-sizing: border-box;
    border-style: solid;
    border-width: 0;
    border-color: rgb(var(--border-color));
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

html {
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    scroll-padding-top: var(--sticky-area-height);
    interpolate-size: allow-keywords;
    line-height: 1.5
}

body {
    background: rgb(var(--page-background));
    font: var(--text-font-style) var(--text-font-weight) var(--text-base) / 1.65 var(--text-font-family);
    letter-spacing: var(--text-letter-spacing);
    margin: 0;
    position: relative
}

hr {
    border-top-width: 1px;
    justify-self: stretch;
    height: 0
}

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

b,
strong {
    font-weight: bolder
}

code,
kbd,
samp,
pre {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
    font-size: 1em
}

table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    font-weight: inherit;
    font-style: inherit;
    line-height: inherit;
    text-transform: inherit;
    color: inherit;
    margin: 0;
    padding: 0
}

input[type=submit] {
    cursor: pointer
}

button,
select {
    text-transform: none
}

button,
[type=button],
[type=reset],
[type=submit] {
    -webkit-appearance: button;
    background-color: #0000;
    background-image: none
}

button,
label,
summary,
[role=button],
[type=checkbox],
[type=radio] {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    cursor: pointer
}

:-moz-focusring {
    outline: auto
}

:-moz-ui-invalid {
    box-shadow: none
}

::-webkit-inner-spin-button {
    height: auto
}

::-webkit-outer-spin-button {
    height: auto
}

::-webkit-date-and-time-value {
    text-align: start
}

[type=date] {
    min-height: 3rem
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

summary {
    list-style-type: none
}

summary::-webkit-details-marker {
    display: none
}

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
    margin: 0
}

fieldset {
    margin: 0;
    padding: 0
}

legend {
    padding: 0
}

ul,
ol,
menu {
    margin: 0;
    padding: 0
}

.unstyled-list {
    margin: 0;
    padding: 0;
    list-style: none
}

textarea {
    resize: vertical;
    field-sizing: content;
    min-height: 4lh
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    opacity: 1;
    color: rgb(var(--text-color) / .65)
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    opacity: 1;
    color: rgb(var(--text-color) / .65)
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    opacity: 1;
    color: rgb(var(--text-color) / .65)
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
    opacity: 1;
    color: rgb(var(--text-color) / .65)
}

input::placeholder,
textarea::placeholder {
    opacity: 1;
    color: rgb(var(--text-color) / .65)
}

:disabled {
    cursor: default !important
}

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
    vertical-align: middle;
    display: block
}

img {
    color: #0000;
    max-width: 100%;
    height: auto
}

[role=img] svg {
    display: initial
}

picture source {
    display: contents
}

video {
    max-width: 100%;
    height: auto
}

:focus:not(:focus-visible) {
    outline: none
}

[hidden] {
    display: none !important
}

height-observer {
    display: block
}

.color-scheme {
    background-color: rgb(var(--background));
    background-image: var(--background-gradient);
    color: rgb(var(--text-color));
    border-color: rgb(var(--border-color))
}

.color-scheme--with-image-overlay {
    --border-color: var(--text-color) / .6
}

.color-scheme--with-image-overlay .button--outline {
    --border-color: var(--text-color)
}

.accordion {
    box-sizing: content-box;
    display: block
}

.accordion {
    border-block-width: 1px
}

.accordion :is(svg) {
    transition: transform .2s
}

.accordion+.accordion {
    border-block-start-width: 0
}

.accordion__toggle {
    justify-content: space-between;
    align-items: center;
    -moz-column-gap: .625rem;
    column-gap: .625rem;
    padding-block: 1.25rem;
    display: flex
}

.accordion__content {
    -webkit-margin-before: -.25rem;
    margin-block-start: -.25rem;
    -webkit-padding-after: 1.25rem;
    padding-block-end: 1.25rem;
    -webkit-padding-end: 1.25rem;
    padding-inline-end: 1.25rem
}

@media screen and (min-width: 1000px) {
    .accordion__toggle.text-lg {
        padding-block: 1.5rem
    }

    .accordion--lg .accordion__toggle {
        padding-block: 2rem
    }

    .accordion--lg .accordion__content {
        -webkit-margin-before: -.5rem;
        margin-block-start: -.5rem
    }
}

.accordion-group>*+*>.accordion {
    border-block-start-width: 0
}

.blog-post-card {
    align-content: start;
    gap: 1.25rem;
    display: grid
}

.blog-post-card__info {
    justify-items: start;
    row-gap: 1rem;
    display: grid
}

.blog-post-card__meta {
    flex-wrap: wrap;
    align-items: center;
    -moz-column-gap: .5rem;
    column-gap: .5rem;
    display: flex
}

.blog-post-card__meta>*+:before {
    content: "\2022";
    -webkit-margin-end: .5rem;
    margin-inline-end: .5rem
}

.blog-post-list {
    --blog-post-list-items-per-row: 1;
    --blog-post-list-column-gap: 1.875rem;
    --blog-post-list-row-gap: var(--section-stack-gap);
    --blog-post-list-card-width: calc(100% / var(--blog-post-list-items-per-row) - var(--blog-post-list-column-gap) * (var(--blog-post-list-items-per-row) - 1) / var(--blog-post-list-items-per-row));
    grid: auto / repeat(auto-fit, var(--blog-post-list-card-width));
    align-items: start;
    -moz-column-gap: var(--blog-post-list-column-gap);
    column-gap: var(--blog-post-list-column-gap);
    row-gap: var(--blog-post-list-row-gap);
    display: grid
}

.featured-blog-post {
    grid-column: 1 / -1;
    display: none
}

@media screen and (min-width: 700px) {
    .blog-post-list {
        --blog-post-list-items-per-row: 2
    }
}

@media screen and (max-width: 999px) {
    .blog-post-list--carousel {
        --blog-post-list-card-width: 40vw;
        grid: auto / auto-flow var(--blog-post-list-card-width)
    }
}

@media screen and (max-width: 699px) {
    .blog-post-list--carousel {
        --blog-post-list-card-width: 74vw
    }
}

@media screen and (min-width: 1000px) {
    .blog-post-list {
        --blog-post-list-items-per-row: 3;
        --blog-post-list-column-gap: 3.75rem
    }

    .featured-blog-post {
        display: block
    }

    .featured-blog-post+.blog-post-card {
        display: none
    }
}

@media screen and (min-width: 1150px) {
    .blog-post-list {
        --blog-post-list-row-gap: 3.75rem
    }
}

.shopify-challenge__button,
.shopify-payment-button__button--unbranded {
    all: revert
}

.button,
.shopify-challenge__button,
.shopify-payment-button__button--unbranded {
    --initial-gradient: linear-gradient(rgb(var(--button-background)), rgb(var(--button-background)));
    --hover-gradient: linear-gradient(transparent, transparent);
    --initial-background-position: var(--transform-origin-end);
    --hover-background-position: var(--transform-origin-start);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-transform: var(--button-text-transform);
    font: var(--button-font);
    letter-spacing: var(--button-letter-spacing);
    text-shadow: none;
    text-align: center;
    cursor: pointer;
    color: rgb(var(--button-text-color));
    border: 1px solid rgb(var(--button-outline-color, var(--button-background)));
    border-radius: var(--button-border-radius);
    background-color: #0000;
    background-image: var(--initial-gradient), var(--hover-gradient);
    background-size: 101% 101%, 0 101%;
    background-position: var(--initial-background-position);
    background-repeat: no-repeat;
    justify-content: center;
    align-items: center;
    -moz-column-gap: 1.125rem;
    column-gap: 1.125rem;
    padding: .65rem 1.75rem;
    transition: background-size .45s cubic-bezier(.785, .135, .15, .86), background-position .45s step-end, color .45s cubic-bezier(.785, .135, .15, .86), border .45s cubic-bezier(.785, .135, .15, .86);
    display: inline-flex;
    position: relative
}

.shopify-payment-button__button--unbranded {
    border: 1px solid rgb(var(--button-outline-color, var(--button-background))) !important;
    border-radius: var(--button-border-radius) !important;
    background-color: #0000 !important;
    transition: background-size .45s cubic-bezier(.785, .135, .15, .86), background-position .45s step-end, color .45s cubic-bezier(.785, .135, .15, .86), border .45s cubic-bezier(.785, .135, .15, .86) !important
}

.shopify-payment-button__button--unbranded:not(:hover) {
    color: rgb(var(--button-text-color)) !important
}

.button--outline {
    --initial-gradient: linear-gradient(transparent, transparent);
    --hover-gradient: linear-gradient(rgb(var(--button-background)), rgb(var(--button-background)));
    --initial-background-position: var(--transform-origin-start);
    --hover-background-position: var(--transform-origin-end);
    color: rgb(var(--button-background, var(--text-color)));
    border-color: rgb(var(--button-outline-color, var(--border-color)))
}

.button--subdued.button--outline {
    color: rgb(var(--button-background) / .65);
    border-color: rgb(var(--border-color))
}

.button--sm {
    font-size: var(--text-xs);
    padding: .5rem .75rem
}

@media screen and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .features--button-transition :is(.button, .shopify-challenge__button, .shopify-payment-button__button--unbranded):not([disabled]):hover {
        color: rgb(var(--button-background));
        background-position: var(--hover-background-position);
        border-color: rgb(var(--button-background));
        background-size: 0 101%, 101% 101%
    }

    .features--button-transition .shopify-payment-button__button--unbranded:not([disabled]):hover {
        background-color: #0000
    }

    .features--button-transition .button--outline:not([disabled]):hover {
        color: rgb(var(--button-text-color))
    }
}

.button-group {
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    display: flex
}

.button-group>* {
    margin: 0 !important
}

.button-group:has(.link):has(.button) {
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem
}

@media screen and (min-width: 700px) {
    .button-group {
        gap: 1.25rem
    }

    .button-group:has(.link):not(:has(.button)) {
        -moz-column-gap: 2rem;
        column-gap: 2rem
    }

    .button-group--same-width {
        grid-auto-columns: minmax(0, 1fr);
        grid-auto-flow: column;
        display: grid
    }
}

.additional-checkout-buttons {
    width: 100%
}

.shopify-payment-button__button {
    vertical-align: top;
    width: 100%;
    min-height: calc(1lh + 1.3rem + 2px)
}

shopify-accelerated-checkout,
shopify-accelerated-checkout-cart {
    --shopify-accelerated-checkout-button-block-size: 44px;
    --shopify-accelerated-checkout-button-border-radius: var(--button-border-radius);
    --shopify-accelerated-checkout-button-box-shadow: none
}

@-webkit-keyframes animateIconInline {
    0% {
        opacity: 1;
        transform: translate(0)
    }

    50% {
        opacity: 0;
        transform: translate(100%)
    }

    51% {
        opacity: 0;
        transform: translate(-100%)
    }

    to {
        opacity: 1;
        transform: translate(0)
    }
}

@keyframes animateIconInline {
    0% {
        opacity: 1;
        transform: translate(0)
    }

    50% {
        opacity: 0;
        transform: translate(100%)
    }

    51% {
        opacity: 0;
        transform: translate(-100%)
    }

    to {
        opacity: 1;
        transform: translate(0)
    }
}

@-webkit-keyframes animateIconBlock {
    0% {
        opacity: 1;
        transform: translateY(0)
    }

    50% {
        opacity: 0;
        transform: translateY(100%)
    }

    51% {
        opacity: 0;
        transform: translateY(-100%)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes animateIconBlock {
    0% {
        opacity: 1;
        transform: translateY(0)
    }

    50% {
        opacity: 0;
        transform: translateY(100%)
    }

    51% {
        opacity: 0;
        transform: translateY(-100%)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.circle-button {
    --circle-button-size: 2.75rem;
    width: var(--circle-button-size);
    height: var(--circle-button-size);
    background: rgb(var(--circle-button-background));
    color: rgb(var(--circle-button-text-color));
    border-radius: var(--rounded-full);
    box-shadow: 0 .125rem .625rem rgb(var(--circle-button-text-color) / .15);
    place-items: center;
    display: grid
}

.circle-button>svg {
    width: .75rem
}

.circle-button>.icon-zoom {
    width: .875rem
}

@media screen and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .circle-button.hover\:animate-icon-inline:hover svg {
        -webkit-animation: .35s ease-in-out forwards animateIconInline;
        animation: .35s ease-in-out forwards animateIconInline
    }

    .circle-button.hover\:animate-icon-block:hover svg {
        -webkit-animation: .35s ease-in-out forwards animateIconBlock;
        animation: .35s ease-in-out forwards animateIconBlock
    }
}

.circle-button--sm {
    --circle-button-size: 2.25rem
}

.circle-button--lg,
.circle-button--xl {
    --circle-button-size: 3.125rem
}

:is(.circle-button--lg, .circle-button--xl)>svg {
    width: 1rem
}

@media screen and (min-width: 700px) {
    .circle-button--xl {
        --circle-button-size: 3.5rem
    }
}

.content-over-media {
    --content-over-media-gap: 1.25rem;
    --content-over-media-calculated-row-gap: var(--content-over-media-row-gap, var(--content-over-media-gap));
    --content-over-media-calculated-column-gap: var(--content-over-media-column-gap, var(--content-over-media-gap));
    grid-template: [full-start] 0 [content-start] minmax(0, 1fr) [content-end] 0 [full-end] / [full-start] minmax(0, 1fr) [content-start] minmax(0, min(var(--container-max-width), 100% - var(--content-over-media-column-gap, var(--content-over-media-gap, var(--container-gutter))) * 2)) [content-end] minmax(0, 1fr) [full-end];
    row-gap: var(--content-over-media-calculated-row-gap);
    -moz-column-gap: var(--content-over-media-calculated-column-gap);
    column-gap: var(--content-over-media-calculated-column-gap);
    min-height: var(--content-over-media-height, auto);
    place-items: center;
    display: grid;
    position: relative;
    overflow: hidden
}

.content-over-media:before {
    content: "";
    background: var(--content-over-media-gradient-overlay, rgb(var(--content-over-media-overlay)));
    border-radius: inherit;
    z-index: 1;
    pointer-events: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.content-over-media>picture,
.content-over-media>image-parallax picture {
    display: contents
}

.content-over-media>:is(img, video, iframe, svg, video-media),
.content-over-media>picture img,
.content-over-media>image-parallax img {
    height: var(--content-over-media-height, auto);
    overflow-wrap: anywhere;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    border-radius: inherit;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    grid-area: full-start / full-start / full-end / full-end;
    min-width: 100%;
    min-height: 100%;
    max-height: 100%
}

.content-over-media>:not(img, video, iframe, svg, video-media, picture, image-parallax) {
    max-width: var(--content-over-media-content-max-width, 48rem);
    z-index: 1;
    text-shadow: 0 1px rgb(var(--content-over-media-text-shadow) / 50%);
    grid-area: content-start / content-start / content-end / content-end;
    position: relative
}

.content-over-media:has(>.prose):not(:has(>.prose .button:last-child)) {
    row-gap: calc(var(--content-over-media-calculated-row-gap) - .5rem)
}

@supports (row-gap: 1lh) {
    .content-over-media:has(>.prose):not(:has(>.prose .button:last-child)) {
        row-gap: calc(var(--content-over-media-calculated-row-gap) - .5lh)
    }
}

.content-over-media>video-media:not([autoplay])~:not(img, video, iframe, svg, video-media, picture, image-parallax) {
    pointer-events: none;
    transition: opacity .2s ease-in-out, visibility .2s ease-in-out
}

.content-over-media>video-media:not([autoplay])[loaded]~:not(img, video, iframe, svg, video-media, picture, image-parallax) {
    opacity: 0;
    visibility: hidden
}

.content-over-media:has(video-media:not([autoplay])) .play-button {
    transition: transform .2s ease-in-out
}

.content-over-media:has(video-media:not([autoplay])):hover .play-button {
    transform: scale(1.1)
}

.shopify-section:first-child [allow-transparent-header]>.content-over-media>:not(img, video, iframe, svg, video-media, picture, image-parallax) {
    -webkit-padding-before: var(--header-height, 0px);
    padding-block-start: var(--header-height, 0px)
}

.content-over-media--xs {
    --content-over-media-height: clamp(15rem, 65vw, 25rem)
}

.content-over-media--sm {
    --content-over-media-height: clamp(20rem, 85vw, 32rem)
}

.content-over-media--md {
    --content-over-media-height: clamp(25rem, 100vw, 36rem)
}

.content-over-media--lg {
    --content-over-media-height: clamp(30rem, 125vw, 42rem)
}

.content-over-media--fill {
    --content-over-media-height: calc(100vh - var(--sticky-area-height))
}

.shopify-section:first-child .content-over-media--fill {
    --content-over-media-height: calc(100vh - (var(--announcement-bar-height, 0px) + var(--header-height, 0px)))
}

.shopify-section:first-child:has([allow-transparent-header]) .content-over-media--fill {
    --content-over-media-height: calc(100vh - (var(--announcement-bar-height, 0px)))
}

@supports (height: 100svh) {
    .content-over-media--fill {
        --content-over-media-height: calc(100svh - var(--sticky-area-height))
    }

    .shopify-section:first-child .content-over-media--fill {
        --content-over-media-height: calc(100svh - (var(--announcement-bar-height, 0px) + var(--header-height, 0px)))
    }

    .shopify-section:first-child:has([allow-transparent-header]) .content-over-media--fill {
        --content-over-media-height: calc(100svh - (var(--announcement-bar-height, 0px)))
    }
}

@media screen and (min-width: 700px) {
    .content-over-media {
        --content-over-media-gap: 2rem
    }
}

@media screen and (min-width: 1000px) {
    .content-over-media {
        --content-over-media-gap: 3rem
    }
}

.page-dots {
    --dot-size: .375rem;
    flex-wrap: wrap;
    justify-content: center;
    gap: .5rem 1rem;
    display: flex
}

.page-dots>* {
    width: var(--dot-size);
    height: var(--dot-size);
    border-radius: var(--rounded-full);
    place-content: center;
    display: grid
}

.page-dots>*:after {
    content: "";
    border-radius: inherit;
    opacity: .4;
    background: currentColor;
    transition: opacity .25s, background .25s;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.page-dots>*[aria-current=true]:after {
    opacity: 1
}

.page-dots--narrow {
    -moz-column-gap: .5rem;
    column-gap: .5rem
}

.page-dots--autoplay>[aria-current=false]:after,
.page-dots--autoplay>[aria-current=true] .circular-progress {
    transition-delay: .15s
}

.page-dots--autoplay>[aria-current=true]:after,
.page-dots--autoplay>[aria-current=false] .circular-progress {
    opacity: 0
}

.page-dots--autoplay>[aria-current=true] .circular-progress circle:last-child {
    -webkit-animation: animateCircularProgress var(--slideshow-progress-duration) linear var(--slideshow-progress-play-state) both;
    animation: animateCircularProgress var(--slideshow-progress-duration) linear var(--slideshow-progress-play-state) both
}

.prev-next-button {
    transition: opacity .15s ease-in-out, transform .15s ease-in-out, visibility .15s ease-in-out
}

.prev-next-button[disabled] {
    opacity: 0;
    visibility: hidden
}

@media screen and (pointer: fine) {
    .prev-next-button--prev:hover svg {
        animation-direction: reverse !important
    }
}

@media screen and (pointer: fine) {
    .floating-controls-container {
        padding-inline: 4.625rem;
        display: block;
        position: relative
    }

    .floating-controls-container:not(:has(.is-scrollable)) .floating-controls-container__control {
        display: none
    }

    .floating-controls-container--inside {
        --floating-controls-inset-inline: 1.5rem;
        padding-inline: 0
    }

    .floating-controls-container--on-hover>.floating-controls-container__control {
        opacity: 0;
        transform: translateY(-10px)
    }

    .floating-controls-container--on-hover:hover>.floating-controls-container__control:not(:has([disabled])) {
        opacity: 1;
        transform: translateY(0)
    }

    .floating-controls-container__control {
        z-index: 2;
        transition: opacity .2s, transform .2s;
        display: grid;
        position: absolute;
        inset-block-start: calc(50% - 1.5625rem)
    }

    .floating-controls-container__control:first-child {
        inset-inline-start: var(--floating-controls-inset-inline, 0)
    }

    .floating-controls-container__control:last-child {
        inset-inline-end: var(--floating-controls-inset-inline, 0)
    }
}

@media not screen and (pointer: fine) {
    .floating-controls-container>.floating-controls-container__control {
        display: none
    }
}

:where(x-drawer, x-modal, x-popover):not(:defined) {
    display: none
}

:where(.modal, .drawer, .popover, .header-search) {
    z-index: 999;
    display: none;
    position: relative
}

:where(.modal, .drawer, .popover, .header-search)::part(overlay) {
    background: rgb(var(--page-overlay));
    min-height: 100vh;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

:where(.modal, .drawer, .popover, .header-search)::part(close-button) {
    color: currentColor;
    cursor: pointer;
    background: none;
    border: none;
    place-items: center;
    padding: 0;
    display: grid
}

:where(.modal, .drawer, .popover, .header-search)::part(close-button)>svg {
    display: block
}

@media screen and (pointer: fine) {
    :where(.modal, .drawer, .popover, .header-search)::part(close-button) {
        opacity: .6;
        transition: all .2s ease-in
    }

    :where(.modal, .drawer, .popover, .header-search)::part(close-button):hover {
        opacity: 1
    }
}

:where(.modal, .drawer, .popover, .header-search)::part(tap-area) {
    position: relative
}

:where(.modal, .drawer, .popover, .header-search)::part(tap-area):before {
    content: "";
    position: absolute;
    top: -.65rem;
    right: -.65rem;
    bottom: -.65rem;
    left: -.65rem
}

.modal {
    --distance-to-bleed: var(--modal-body-padding-inline);
    --modal-header-padding-block: .875rem;
    --modal-header-padding-inline: 1.25rem;
    --modal-body-padding-block: 1.25rem;
    --modal-body-padding-inline: 1.25rem;
    --modal-body-max-width: 30rem
}

.modal::part(base) {
    place-items: end center;
    width: 100%;
    height: 100%;
    display: grid;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.modal::part(content) {
    width: 100%;
    max-width: var(--modal-body-max-width);
    background-color: rgb(var(--background));
    background-image: var(--background-gradient);
    max-height: 75vh;
    color: rgb(var(--text-color));
    isolation: isolate;
    overflow: auto
}

@supports (height: 100dvh) {
    .modal::part(content) {
        max-height: 85dvh
    }
}

.modal::part(header) {
    background: inherit;
    -webkit-border-after: 1px solid rgb(var(--border-color));
    border-block-end: 1px solid rgb(var(--border-color));
    text-align: center;
    z-index: 2;
    align-items: center;
    -webkit-padding-before: var(--modal-header-padding-block);
    padding-block-start: var(--modal-header-padding-block);
    -webkit-padding-after: var(--modal-header-padding-block);
    padding-block-end: var(--modal-header-padding-block);
    -webkit-padding-start: var(--modal-header-padding-inline);
    padding-inline-start: var(--modal-header-padding-inline);
    -webkit-padding-end: var(--modal-header-padding-inline);
    padding-inline-end: var(--modal-header-padding-inline);
    display: grid;
    position: -webkit-sticky;
    position: sticky;
    inset-block-start: 0
}

.modal::part(close-button) {
    position: absolute;
    inset-inline-end: var(--modal-header-padding-inline)
}

.modal::part(body) {
    -webkit-padding-before: var(--modal-body-padding-block);
    padding-block-start: var(--modal-body-padding-block);
    -webkit-padding-after: var(--modal-body-padding-block);
    padding-block-end: var(--modal-body-padding-block);
    -webkit-padding-start: var(--modal-body-padding-inline);
    padding-inline-start: var(--modal-body-padding-inline);
    -webkit-padding-end: var(--modal-body-padding-inline);
    padding-inline-end: var(--modal-body-padding-inline)
}

@media screen and (min-width: 700px) {
    .modal {
        --modal-header-padding-block: 1.125rem;
        --modal-header-padding-inline: 2rem;
        --modal-body-padding-block: 2rem;
        --modal-body-padding-inline: 2rem
    }

    .modal::part(base) {
        place-items: center
    }

    .modal--lg {
        --modal-body-max-width: 45rem
    }
}

.drawer {
    --distance-to-bleed: var(--drawer-body-padding-inline);
    --drawer-header-padding-block: 1rem;
    --drawer-header-padding-inline: 1.25rem;
    --drawer-body-padding-block: 1.25rem;
    --drawer-body-padding-inline: 1.25rem;
    --drawer-footer-padding-block: 1rem;
    --drawer-footer-padding-inline: 1.25rem;
    --drawer-max-width: min(92vw, 28.125rem)
}

.drawer::part(base) {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.drawer::part(content) {
    width: 100%;
    height: 100%;
    max-width: var(--drawer-max-width);
    background-color: rgb(var(--background));
    background-image: var(--background-gradient);
    color: rgb(var(--text-color));
    grid-auto-rows: auto minmax(0, 1fr) auto;
    align-content: start;
    display: grid;
    position: relative
}

.drawer::part(header) {
    min-height: min(var(--header-height), 5rem);
    -webkit-border-after: 1px solid rgb(var(--border-color));
    border-block-end: 1px solid rgb(var(--border-color));
    box-sizing: border-box;
    justify-content: space-between;
    align-items: center;
    -moz-column-gap: 1rem;
    column-gap: 1rem;
    -webkit-padding-before: var(--drawer-header-padding-block);
    padding-block-start: var(--drawer-header-padding-block);
    -webkit-padding-after: var(--drawer-header-padding-block);
    padding-block-end: var(--drawer-header-padding-block);
    -webkit-padding-start: var(--drawer-header-padding-inline);
    padding-inline-start: var(--drawer-header-padding-inline);
    -webkit-padding-end: var(--drawer-header-padding-inline);
    padding-inline-end: var(--drawer-header-padding-inline);
    display: flex
}

.drawer::part(body) {
    overscroll-behavior-y: contain;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    -webkit-padding-before: var(--drawer-body-padding-block);
    padding-block-start: var(--drawer-body-padding-block);
    -webkit-padding-after: var(--drawer-body-padding-block);
    padding-block-end: var(--drawer-body-padding-block);
    -webkit-padding-start: var(--drawer-body-padding-inline);
    padding-inline-start: var(--drawer-body-padding-inline);
    -webkit-padding-end: var(--drawer-body-padding-inline);
    padding-inline-end: var(--drawer-body-padding-inline);
    display: grid;
    overflow: hidden auto
}

.drawer::part(footer) {
    background-color: rgb(var(--background));
    background-image: var(--background-gradient);
    -webkit-border-before: 1px solid rgb(var(--border-color));
    border-block-start: 1px solid rgb(var(--border-color));
    -webkit-padding-before: var(--drawer-footer-padding-block);
    padding-block-start: var(--drawer-footer-padding-block);
    -webkit-padding-after: var(--drawer-footer-padding-block);
    padding-block-end: var(--drawer-footer-padding-block);
    -webkit-padding-start: var(--drawer-footer-padding-inline);
    padding-inline-start: var(--drawer-footer-padding-inline);
    -webkit-padding-end: var(--drawer-footer-padding-inline);
    padding-inline-end: var(--drawer-footer-padding-inline)
}

.drawer--sm {
    --drawer-max-width: min(92vw, 25rem)
}

.drawer--center-body::part(body) {
    align-self: center
}

@media screen and (min-width: 1000px) {
    .drawer {
        --drawer-header-padding-block: 1.125rem;
        --drawer-header-padding-inline: 2rem;
        --drawer-body-padding-block: 2rem;
        --drawer-body-padding-inline: 2rem;
        --drawer-footer-padding-block: 2rem;
        --drawer-footer-padding-inline: 2rem
    }
}

.popover {
    --distance-to-bleed: var(--popover-body-padding-inline);
    --popover-header-padding-block: .875rem;
    --popover-header-padding-inline: 1.25rem;
    --popover-body-padding-block: 1.25rem;
    --popover-body-padding-inline: 1.25rem
}

.popover::part(content) {
    background: rgb(var(--background));
    width: 100%;
    max-height: 75vh;
    color: rgb(var(--text-color));
    isolation: isolate;
    overflow: auto
}

@supports (height: 100dvh) {
    .popover::part(content) {
        max-height: 85dvh
    }
}

.popover::part(header) {
    background: inherit;
    -webkit-border-after: 1px solid rgb(var(--border-color));
    border-block-end: 1px solid rgb(var(--border-color));
    text-align: center;
    z-index: 2;
    align-items: center;
    -webkit-padding-before: var(--popover-header-padding-block);
    padding-block-start: var(--popover-header-padding-block);
    -webkit-padding-after: var(--popover-header-padding-block);
    padding-block-end: var(--popover-header-padding-block);
    -webkit-padding-start: var(--popover-header-padding-inline);
    padding-inline-start: var(--popover-header-padding-inline);
    -webkit-padding-end: var(--popover-header-padding-inline);
    padding-inline-end: var(--popover-header-padding-inline);
    display: grid;
    position: -webkit-sticky;
    position: sticky;
    inset-block-start: 0
}

.popover::part(close-button) {
    position: absolute;
    inset-inline-end: var(--popover-header-padding-inline)
}

.popover::part(body) {
    -webkit-padding-before: var(--popover-body-padding-block);
    padding-block-start: var(--popover-body-padding-block);
    -webkit-padding-after: var(--popover-body-padding-block);
    padding-block-end: var(--popover-body-padding-block);
    -webkit-padding-start: var(--popover-body-padding-inline);
    padding-inline-start: var(--popover-body-padding-inline);
    -webkit-padding-end: var(--popover-body-padding-inline);
    padding-inline-end: var(--popover-body-padding-inline)
}

.popover__value-list {
    text-align: start;
    justify-items: start;
    gap: .75rem;
    display: grid;
    position: relative
}

.popover__value-list>* {
    text-align: inherit;
    width: 100%;
    color: rgb(var(--text-color) / .65);
    transition: color .2s ease-in-out
}

.popover__value-list>*[aria-selected=true],
.popover__value-list>*:hover {
    color: rgb(var(--text-color))
}

.popover__value-list>*:has(:checked) {
    color: rgb(var(--text-color))
}

.popover__value-option {
    text-align: inherit;
    width: 100%;
    color: rgb(var(--text-color) / .65);
    transition: color .2s ease-in-out
}

.popover__value-option[aria-selected=true],
.popover__value-option:hover {
    color: rgb(var(--text-color))
}

@media screen and (max-width: 999px) {
    .popover::part(base) {
        place-items: end center;
        width: 100%;
        height: 100%;
        display: grid;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0
    }
}

@media screen and (min-width: 1000px) {
    .popover {
        --popover-block-offset: .75rem;
        position: absolute
    }

    .popover::part(content) {
        border: 1px solid rgb(var(--border-color));
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        max-width: 18.75rem;
        max-height: min(60vh, 25rem);
        box-shadow: 2px 2px 6px rgb(var(--text-color) / .05)
    }

    .popover::part(overlay),
    .popover::part(header) {
        display: none
    }

    .popover:has(.popover__value-list)::part(body) {
        -webkit-padding-end: 2.5rem;
        padding-inline-end: 2.5rem
    }

    .popover--top-start {
        inset-block-end: calc(100% + var(--popover-block-offset));
        inset-inline-start: 0
    }

    .popover--top-end {
        inset-block-end: calc(100% + var(--popover-block-offset));
        inset-inline-end: 0
    }

    .popover--bottom-start {
        inset-block-start: calc(100% + var(--popover-block-offset));
        inset-inline-start: 0
    }

    .popover--bottom-end {
        inset-block-start: calc(100% + var(--popover-block-offset));
        inset-inline-end: 0
    }
}

.pop-in {
    z-index: 10;
    padding: 2rem;
    display: none;
    position: fixed;
    inset-block-end: 1rem;
    inset-inline: 1rem
}

.pop-in__close-button {
    inset-block-start: 1.25rem;
    inset-inline-end: 1.25rem;
    position: absolute !important
}

@media screen and (min-width: 700px) {
    .pop-in {
        inset-block-end: 2rem;
        inset-inline: 2rem
    }
}

.banner {
    font-size: var(--text-base);
    color: rgb(var(--banner-color));
    background: rgb(var(--banner-background));
    text-shadow: none;
    padding: .625rem 1.25rem
}

.banner:has(.banner__text-with-button) {
    padding-block: 1.25rem
}

.banner--error {
    --banner-background: var(--error-background);
    --banner-color: var(--error-text);
    --button-background: var(--error-text);
    --button-text-color: var(--error-background)
}

.banner--success {
    --banner-background: var(--success-background);
    --banner-color: var(--success-text);
    --button-background: var(--success-text);
    --button-text-color: var(--success-background)
}

.banner--warning {
    --banner-background: var(--warning-background);
    --banner-color: var(--warning-text);
    --button-background: var(--warning-text);
    --button-text-color: var(--warning-background)
}

.banner__text-with-button {
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: .8rem 1.5rem;
    display: flex
}

.form {
    align-content: start;
    row-gap: var(--form-gap);
    display: grid
}

.form-row {
    gap: var(--fieldset-gap);
    flex-wrap: wrap;
    display: flex
}

.form-row>.form-control {
    flex: 1 0 var(--fieldset-row-control-width, 14rem)
}

.form-row>button {
    flex-grow: 1
}

.fieldset {
    gap: var(--fieldset-gap);
    display: grid
}

.fieldset-row {
    gap: inherit;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    display: grid
}

.form-control {
    gap: var(--form-control-gap);
    display: grid;
    position: relative
}

.form-control>label {
    justify-self: start
}

.form-control__max-characters-count {
    -webkit-margin-before: -.375rem;
    margin-block-start: -.375rem
}

.checkbox-control {
    align-items: flex-start;
    -moz-column-gap: var(--checkbox-control-gap);
    column-gap: var(--checkbox-control-gap);
    text-align: start;
    display: flex;
    position: relative
}

.input,
.textarea,
.select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    padding: var(--input-padding-block) var(--input-padding-inline);
    border-radius: var(--input-border-radius);
    background: rgb(var(--input-background, transparent));
    color: rgb(var(--input-text-color, var(--text-color)));
    text-align: start;
    border-width: 1px;
    transition: border-color .1s ease-in-out
}

:is(.input, .textarea, .select)::-webkit-input-placeholder {
    color: rgb(var(--input-text-color, var(--text-color)) / .6)
}

:is(.input, .textarea, .select)::-moz-placeholder {
    color: rgb(var(--input-text-color, var(--text-color)) / .6)
}

:is(.input, .textarea, .select):-ms-input-placeholder {
    color: rgb(var(--input-text-color, var(--text-color)) / .6)
}

:is(.input, .textarea, .select)::-ms-input-placeholder {
    color: rgb(var(--input-text-color, var(--text-color)) / .6)
}

:is(.input, .textarea, .select)::placeholder {
    color: rgb(var(--input-text-color, var(--text-color)) / .6)
}

:is(.input:focus, .textarea:focus, .select:focus-visible) {
    border-color: currentColor;
    outline: none
}

.select {
    box-shadow: 0 1px 3px rgb(var(--text-color) / .08);
    -webkit-padding-end: calc(var(--input-padding-inline) * 2 + 10px);
    padding-inline-end: calc(var(--input-padding-inline) * 2 + 10px)
}

.select:required:invalid {
    color: rgb(var(--input-text-color, var(--text-color)) / .6)
}

.select~svg,
.select>svg {
    transition: transform .2s;
    position: absolute;
    inset-block-start: calc(50% - 3.5px);
    inset-inline-end: calc(var(--input-padding-inline) + 1px)
}

.select[aria-expanded=true]>svg {
    transform: rotate(180deg)
}

.form-control:has(.select):before {
    content: "";
    width: calc(var(--input-padding-inline) * 2 + 35px);
    background-image: linear-gradient(to var(--transform-origin-start), rgb(var(--background)) calc(var(--input-padding-inline) + 20px), rgb(var(--background-without-opacity) / 0));
    pointer-events: none;
    height: calc(100% - 2px);
    position: absolute;
    inset-block-start: 1px;
    inset-inline-end: 1px
}

.form-control:has(.select):not(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
    border-top-right-radius: var(--input-border-radius);
    border-bottom-right-radius: var(--input-border-radius)
}

.form-control:has(.select):is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
    border-top-left-radius: var(--input-border-radius);
    border-bottom-left-radius: var(--input-border-radius)
}

.floating-label {
    z-index: 1;
    background: rgb(var(--background));
    color: rgb(var(--input-text-color, var(--text-color)) / .6);
    opacity: 0;
    pointer-events: none;
    padding: 0 .25rem;
    transition: opacity .2s ease-in-out, transform .2s ease-in-out;
    position: absolute;
    inset-block-start: calc(-1 * var(--input-padding-block) + 1px);
    inset-inline-start: calc(var(--input-padding-inline) - .25rem + 1px);
    transform: translateY(3px)
}

:-webkit-autofill~.floating-label {
    color: #000
}

:-webkit-any(:-webkit-any(.input, .textarea):not(:placeholder-shown) ~ .floating-label, :-webkit-any(.input, .textarea, .select):-webkit-autofill ~ .floating-label, .select:valid ~ .floating-label) {
    opacity: 1;
    transform: translateY(0)
}

:is(:is(.input, .textarea):not(:placeholder-shown)~.floating-label, :is(.input, .textarea, .select):autofill~.floating-label, .select:valid~.floating-label) {
    opacity: 1;
    transform: translateY(0)
}

.input-suffix {
    transition: opacity .2s ease-in-out, visibility .2s ease-in-out;
    position: absolute;
    inset-block-start: var(--input-padding-block);
    inset-inline-end: var(--input-padding-inline)
}

.form-control:has(:focus-within)+.input-suffix.hide-on-focus {
    opacity: 0;
    visibility: hidden
}

.checkbox {
    --checkbox-baseline-distance: 1.6em;
    --checkbox-offset: calc((var(--checkbox-baseline-distance) - var(--checkbox-size)) / 2);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: var(--checkbox-size);
    height: var(--checkbox-size);
    border-width: 1px;
    border-color: rgb(var(--text-color) / .8);
    background: var(--checkmark-svg-url) no-repeat center / 0;
    border-radius: 2px;
    flex-shrink: 0;
    transition: background-color .2s ease-in-out, border-color .2s ease-in-out;
    position: relative;
    inset-block-start: var(--checkbox-offset)
}

@supports (width: 1lh) {
    .checkbox {
        inset-block-start: calc(.5lh - var(--checkbox-size) / 2)
    }
}

.checkbox:checked {
    background-color: rgb(var(--accent));
    border-color: rgb(var(--accent));
    background-size: 10px 8px
}

.checkbox:checked~label {
    opacity: 1
}

.checkbox:disabled,
.checkbox:disabled~label {
    opacity: .5;
    cursor: default
}

.checkbox:not(:disabled, :checked)~label {
    opacity: .7
}

.checkbox~label {
    transition: all .2s ease-in-out
}

.dot-checkbox {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: rgb(var(--text-color));
    opacity: 0;
    pointer-events: none;
    border-radius: 100%;
    width: 6px;
    height: 6px;
    transition: opacity .2s;
    display: block;
    position: absolute;
    inset-block-start: calc(.5em + 1.5px)
}

.dot-checkbox~label {
    opacity: .65;
    transition: opacity .2s, transform .2s;
    position: relative
}

.dot-checkbox~label:hover {
    opacity: 1
}

.dot-checkbox:checked {
    opacity: 1
}

.dot-checkbox:checked~label {
    opacity: 1;
    transform: translate(calc(var(--transform-logical-flip) * 1.125rem))
}

.dot-checkbox:focus~label {
    outline: 5px auto highlight;
    outline: 5px auto -webkit-focus-ring-color
}

.switch {
    --switch-height: 1rem;
    --switch-width: 2.25rem;
    --switch-padding: .1875rem;
    --switch-toggle-size: .625rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: var(--switch-height);
    width: var(--switch-width);
    padding: var(--switch-padding);
    border-radius: var(--rounded-full);
    background: rgb(var(--text-color) / .2);
    align-self: center;
    transition: background .2s ease-in-out;
    display: grid
}

.switch:after {
    content: "";
    width: var(--switch-toggle-size);
    height: var(--switch-toggle-size);
    background: rgb(var(--background));
    border-radius: var(--rounded-full);
    transition: transform .2s ease-in-out;
    box-shadow: 0 1px 1px #0003
}

.switch:checked {
    background: rgb(var(--accent))
}

.switch:checked:after {
    transform: translate(calc(var(--transform-logical-flip) * (var(--switch-width) - var(--switch-toggle-size) - var(--switch-padding) * 2)))
}

.shopify-section:not(:first-child) .bordered-section {
    border-block-start-width: 1px
}

.shopify-section:not(:has(.section-spacing))+.shopify-section {
    border-block-start-width: 0
}

.container {
    --distance-to-bleed: max(var(--container-gutter), 50% - var(--container-max-width) / 2);
    -webkit-margin-start: max(var(--container-gutter), 50% - var(--container-max-width) / 2);
    margin-inline-start: max(var(--container-gutter), 50% - var(--container-max-width) / 2);
    -webkit-margin-end: max(var(--container-gutter), 50% - var(--container-max-width) / 2);
    margin-inline-end: max(var(--container-gutter), 50% - var(--container-max-width) / 2)
}

.container--xxs {
    --container-max-width: var(--container-xxs-max-width)
}

.container--xs {
    --container-max-width: var(--container-xs-max-width)
}

.container--sm {
    --container-max-width: var(--container-sm-max-width)
}

.container--md {
    --container-max-width: var(--container-md-max-width)
}

.container--lg {
    --container-max-width: var(--container-lg-max-width)
}

.container--xl {
    --container-max-width: var(--container-xl-max-width)
}

.section-spacing {
    -webkit-padding-before: calc(var(--section-vertical-spacing-override, var(--section-vertical-spacing)) + var(--section-vertical-spacing-block-start-compensation, 0px));
    padding-block-start: calc(var(--section-vertical-spacing-override, var(--section-vertical-spacing)) + var(--section-vertical-spacing-block-start-compensation, 0px));
    -webkit-padding-after: var(--section-vertical-spacing-override, var(--section-vertical-spacing));
    padding-block-end: var(--section-vertical-spacing-override, var(--section-vertical-spacing))
}

.shopify-section:has(.section-spacing) {
    scroll-padding-block-start: calc(var(--announcement-bar-is-sticky, 0) * var(--announcement-bar-height, 0px) + var(--header-is-sticky, 0) * var(--header-height, 0px))
}

.section-spacing--tight {
    --section-vertical-spacing: var(--section-vertical-spacing-tight);
    --section-stack-gap: var(--section-stack-gap-tight)
}

.shopify-section:empty {
    display: none
}

.section-stack {
    gap: var(--section-stack-gap);
    grid-auto-columns: minmax(0, 1fr);
    display: grid
}

.section-header {
    max-width: min(var(--container-xs-max-width), 100%);
    -webkit-margin-start: var(--container-gutter);
    margin-inline-start: var(--container-gutter);
    -webkit-margin-end: var(--container-gutter);
    margin-inline-end: var(--container-gutter)
}

.container .section-header {
    margin-inline: 0
}

.v-stack {
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    display: grid
}

.h-stack {
    align-items: center;
    display: flex
}

.bleed,
.full-bleed {
    -webkit-margin-start: calc(-1 * var(--distance-to-bleed));
    margin-inline-start: calc(-1 * var(--distance-to-bleed));
    -webkit-margin-end: calc(-1 * var(--distance-to-bleed));
    margin-inline-end: calc(-1 * var(--distance-to-bleed))
}

.bleed {
    scroll-padding-inline: var(--distance-to-bleed);
    -webkit-padding-start: var(--distance-to-bleed);
    padding-inline-start: var(--distance-to-bleed);
    -webkit-padding-end: var(--distance-to-bleed);
    padding-inline-end: var(--distance-to-bleed)
}

@media screen and (min-width: 700px) {
    .sm\:unbleed {
        margin-inline: 0;
        padding-inline: 0;
        scroll-padding-inline: 0
    }
}

@media screen and (min-width: 1000px) {
    .md\:unbleed {
        margin-inline: 0;
        padding-inline: 0;
        scroll-padding-inline: 0
    }
}

@media screen and (min-width: 1150px) {
    .lg\:unbleed {
        margin-inline: 0;
        padding-inline: 0;
        scroll-padding-inline: 0
    }
}

.empty-state {
    text-align: center;
    place-content: center;
    padding-block: 6.25rem;
    display: grid
}

@media screen and (min-width: 1000px) {
    .empty-state {
        padding-block: 12.5rem
    }
}

@media screen and (min-width: 1400px) {
    .empty-state {
        padding-block: 15.625rem
    }
}

.shopify-section--announcement-bar,
.shopify-section--header {
    transform: translateY(calc(((var(--announcement-bar-height, 0px) + var(--header-height, 0px)) * -1) * var(--hide-header-group, 0)));
    transition: transform .25s ease-in-out
}

video-media,
model-media {
    border-radius: inherit;
    aspect-ratio: var(--aspect-ratio, var(--default-aspect-ratio));
    width: 100%;
    display: block;
    position: relative;
    container: media / inline-size
}

@supports not (aspect-ratio: 1) {
    :is(video-media, model-media):before {
        content: "";
        -webkit-padding-after: calc(100% / (var(--aspect-ratio, var(--default-aspect-ratio))));
        padding-block-end: calc(100% / (var(--aspect-ratio, var(--default-aspect-ratio))));
        display: block
    }

    :is(video-media, model-media)>* {
        height: 100%;
        top: 0;
        left: 0;
        position: absolute !important
    }
}

@container media (width >=32rem) {
    :is(video-media, model-media)::part(play-button) {
        width: 4rem;
        height: 4rem
    }
}

video-media {
    --default-aspect-ratio: 16 / 9
}

video-media[host] {
    align-items: center;
    display: grid
}

video-media[show-play-button]:not([loaded]),
video-media:not([autoplay]) {
    cursor: pointer
}

video-media>:is(video, iframe, img) {
    border-radius: inherit;
    width: 100%;
    height: 100%;
    transition: opacity .2s ease-in-out
}

video-media>video[controls] {
    pointer-events: auto
}

video-media>:-webkit-any(video:not(:-webkit-full-screen), img) {
    object-fit: cover;
    object-position: center;
    margin: 0 !important
}

video-media>:is(video:not(:-webkit-full-screen), img) {
    object-fit: cover;
    object-position: center;
    margin: 0 !important
}

video-media>:is(video:not(:-ms-fullscreen), img) {
    object-fit: cover;
    object-position: center;
    margin: 0 !important
}

video-media>:is(video:not(:fullscreen), img) {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    margin: 0 !important
}

video-media>:is(iframe, img) {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

video-media:not([loaded])>:is(video, iframe),
video-media[loaded]>img,
video-media[loaded]::part(play-button) {
    opacity: 0;
    pointer-events: none
}

video-media[suspended]~* {
    pointer-events: none
}

video-media::part(play-button) {
    z-index: 1;
    will-change: scale;
    transition: scale .2s ease-in-out, opacity .2s ease-in-out;
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%
}

video-media:hover::part(play-button) {
    scale: 1.1
}

model-media {
    --default-aspect-ratio: 1
}

model-media model-viewer,
model-media .shopify-model-viewer-ui {
    vertical-align: top;
    width: 100%;
    height: 100%
}

@media screen and (max-width: 699px) {

    .order-summary__header,
    .order-summary__body td:nth-child(n+2),
    .order-summary__footer td:first-child {
        display: none
    }

    .order-summary__body td {
        border-width: 0
    }

    .order-summary__body tr:last-child td {
        border-block-end-width: 1px
    }

    .order-summary__body tr:first-child td {
        -webkit-padding-before: 0;
        padding-block-start: 0
    }

    .order-summary__body tr:last-child td {
        -webkit-padding-after: calc(var(--table-cell-padding-block) * 2);
        padding-block-end: calc(var(--table-cell-padding-block) * 2)
    }
}

@media screen and (min-width: 700px) {
    .order-summary .line-item-info {
        max-width: 500px
    }
}

.line-item {
    --line-item-media-width: 4.375rem;
    align-items: center;
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem;
    display: flex
}

.line-item__media {
    width: var(--line-item-media-width);
    flex-shrink: 0
}

@media screen and (min-width: 700px) {
    .line-item {
        --line-item-media-width: 7.5rem
    }
}

.discount-badge {
    background: rgb(var(--on-sale-badge-background));
    color: rgb(var(--on-sale-badge-text));
    align-items: center;
    -moz-column-gap: .5rem;
    column-gap: .5rem;
    padding: .125rem .5rem;
    display: flex
}

.shipping-estimator__form {
    gap: var(--fieldset-gap);
    display: grid
}

@media screen and (min-width: 700px) {
    .shipping-estimator__form {
        flex-wrap: wrap;
        display: flex
    }

    .shipping-estimator__form .select {
        max-width: 15rem
    }
}

.pagination {
    border-block-end-width: 1px;
    grid-auto-rows: minmax(0, 2.8125rem);
    grid-auto-columns: minmax(0, 2.625rem);
    grid-auto-flow: column;
    justify-self: center;
    display: inline-grid
}

.pagination__link {
    place-content: center;
    display: grid;
    position: relative
}

.pagination__link[aria-current=page] {
    box-shadow: 0 1px, inset 0 -2px
}

@media screen and (min-width: 700px) {
    .pagination {
        grid-auto-columns: minmax(0, 2.8rem)
    }
}

.pswp {
    --pswp-bg: var(--background);
    --pswp-root-z-index: 100000;
    width: 100%;
    height: 100%;
    z-index: var(--pswp-root-z-index);
    touch-action: none;
    opacity: .003;
    contain: layout style size;
    -webkit-tap-highlight-color: #0000;
    outline: 0;
    display: none;
    position: fixed;
    top: 0;
    left: 0
}

.pswp:focus {
    outline: 0
}

.pswp--open {
    display: block
}

.pswp img {
    max-width: none
}

.pswp,
.pswp__bg {
    will-change: opacity;
    transform: translateZ(0)
}

.pswp__bg {
    opacity: .005;
    background: rgb(var(--pswp-bg))
}

.pswp,
.pswp__scroll-wrap {
    overflow: hidden
}

.pswp__scroll-wrap,
.pswp__bg,
.pswp__container,
.pswp__item,
.pswp__img,
.pswp__zoom-wrap {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.pswp__img,
.pswp__zoom-wrap {
    width: auto;
    height: auto
}

.pswp--click-to-zoom.pswp--zoom-allowed .pswp__img {
    cursor: zoom-in
}

.pswp--click-to-zoom.pswp--zoomed-in .pswp__img {
    cursor: -webkit-grab;
    cursor: grab
}

.pswp--click-to-zoom.pswp--zoomed-in .pswp__img:active {
    cursor: -webkit-grabbing;
    cursor: grabbing
}

.pswp--no-mouse-drag.pswp--zoomed-in .pswp__img,
.pswp--no-mouse-drag.pswp--zoomed-in .pswp__img:active,
.pswp__img {
    cursor: zoom-out
}

.pswp__container,
.pswp__img,
.pswp__button,
.pswp__counter {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.pswp__item {
    z-index: 1;
    overflow: hidden
}

.pswp__hidden {
    display: none !important
}

.pswp .pswp__hide-on-close {
    opacity: .005;
    will-change: opacity;
    z-index: 10;
    pointer-events: none;
    transition: opacity .3s cubic-bezier(.4, 0, .22, 1), transform .3s cubic-bezier(.4, 0, .22, 1);
    transform: translateY(15px)
}

.pswp--ui-visible .pswp__hide-on-close {
    opacity: 1;
    pointer-events: auto;
    transition-delay: .3s;
    transform: translateY(0)
}

.pswp__top-bar {
    z-index: 10;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    -moz-column-gap: .75rem;
    column-gap: .75rem;
    width: 100%;
    display: flex;
    position: absolute;
    bottom: 2.5rem;
    left: 0;
    pointer-events: none !important
}

.pswp__top-bar>.circle-button {
    pointer-events: auto;
    transition: transform .2s ease-in-out
}

@media screen and (pointer: fine) {
    .pswp__top-bar>.circle-button:hover {
        transform: scale(1.1)
    }
}

.pswp__preloader {
    display: none
}

@media screen and (min-width: 700px) {
    .pswp__top-bar {
        -moz-column-gap: 1.125rem;
        column-gap: 1.125rem
    }
}

.range {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: none;
    width: 100%
}

.range::-webkit-slider-thumb {
    -webkit-appearance: none
}

.range::-webkit-slider-thumb {
    background: rgb(var(--text-color));
    cursor: pointer;
    z-index: 1;
    width: .625rem;
    height: .625rem;
    box-shadow: none;
    border-radius: 100%;
    -webkit-margin-before: -.25rem;
    margin-block-start: -.25rem;
    position: relative
}

.range::-webkit-slider-runnable-track {
    cursor: pointer;
    background: rgb(var(--text-color) / .12);
    border: none;
    border-radius: 2px;
    width: 100%;
    height: 2px
}

.range::-moz-range-thumb {
    background: rgb(var(--text-color));
    cursor: pointer;
    border: none;
    border-radius: 100%;
    width: .625rem;
    height: .625rem
}

.range::-moz-range-progress {
    cursor: pointer;
    border: none;
    border-radius: 2px;
    width: 100%;
    height: 2px
}

.range::-moz-range-track {
    cursor: pointer;
    border: none;
    border-radius: 2px;
    width: 100%;
    height: 2px
}

.range::-moz-range-progress {
    background-color: rgba(var(--text-color))
}

.range::-moz-range-track {
    background-color: rgb(var(--border-color))
}

@media not screen and (pointer: fine) {
    .range::-webkit-slider-thumb {
        width: 1rem;
        height: 1rem;
        -webkit-margin-before: -.4375rem;
        margin-block-start: -.4375rem
    }

    .range::-moz-range-thumb {
        width: 1rem;
        height: 1rem
    }
}

.range-group {
    background: linear-gradient(to var(--transform-origin-end), rgb(var(--text-color) / .12) var(--range-min), rgb(var(--text-color)) var(--range-min), rgb(var(--text-color)) var(--range-max), rgb(var(--text-color) / .12) var(--range-max));
    border-radius: 2px;
    height: 2px
}

.range-group .range {
    pointer-events: none;
    vertical-align: top;
    height: 2px
}

.range-group .range::-webkit-slider-runnable-track {
    background: none
}

.range-group .range::-webkit-slider-thumb {
    pointer-events: auto
}

.range-group .range::-moz-range-progress {
    background: none
}

.range-group .range::-moz-range-track {
    background: none
}

.range-group .range::-moz-range-thumb {
    pointer-events: auto
}

.range-group .range:last-child {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0
}

.input-group {
    align-items: center;
    -moz-column-gap: .75rem;
    column-gap: .75rem;
    display: flex
}

.input-prefix {
    border-radius: min(.625rem, var(--button-border-radius));
    border: 1px solid rgb(var(--text-color) / .12);
    flex: 1 0 0;
    justify-content: space-between;
    align-items: center;
    min-width: 0;
    padding: .4375rem;
    display: flex
}

.input-prefix:focus-within {
    border-color: rgb(var(--text-color));
    box-shadow: inset 0 0 0 1px rgb(var(--text-color))
}

.input-prefix>.field {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
    text-align: end;
    background: none;
    border: none;
    width: 100%;
    min-width: 0;
    -webkit-margin-start: .625rem;
    margin-inline-start: .625rem;
    padding: 0
}

.input-prefix>.field:focus {
    outline: none
}

.input-prefix>.field::-webkit-outer-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0
}

.input-prefix>.field::-webkit-inner-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0
}

.price-range {
    -webkit-padding-before: .25rem;
    padding-block-start: .25rem;
    display: block
}

.price-range>.range-group {
    -webkit-margin-after: 1.125rem;
    margin-block-end: 1.125rem;
    position: relative
}

@media not screen and (pointer: fine) {
    .price-range {
        -webkit-padding-before: .625rem;
        padding-block-start: .625rem
    }
}

.product-card {
    scroll-snap-align: start;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    gap: 1.25rem;
    display: grid;
    position: relative
}

.product-card__figure {
    position: relative
}

.product-card__figure>.badge-list {
    z-index: 1;
    position: absolute;
    inset-block-start: .25rem;
    inset-inline-start: .25rem
}

.product-card__media {
    isolation: isolate;
    display: block
}

.product-card__image {
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
    margin-inline: auto;
    transition: opacity .1s ease-in-out
}

.product-card__image--secondary {
    width: 100%;
    height: 100%;
    display: none;
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0
}

.product-card__quick-add-button {
    background: rgb(var(--circle-button-background));
    color: rgb(var(--circle-button-text-color));
    z-index: 1;
    padding: .625rem;
    position: absolute;
    inset-block-end: .5rem;
    inset-inline-end: .5rem
}

@media screen and (pointer: fine) {
    .product-card__quick-add-button {
        opacity: 0;
        transition: opacity .2s ease-in-out, transform .2s ease-in-out;
        transform: translateY(5px)
    }

    .product-card__quick-add-button :is(svg) {
        transition: transform .2s ease-in-out
    }

    .product-card__quick-add-button:hover svg {
        transform: rotate(90deg)
    }

    .product-card:hover .product-card__quick-add-button {
        opacity: 1;
        transform: translateY(0)
    }
}

.product-card__info {
    text-align: center;
    align-content: start;
    justify-items: center;
    gap: .75rem;
    display: grid
}

.product-card__info :is(.price-list, .rating-badge) {
    justify-content: center
}

.product-card__info .color-swatch {
    --swatch-size: 1.375rem
}

@media screen and (pointer: fine) {
    .product-card__image--secondary {
        opacity: 0;
        mix-blend-mode: plus-lighter;
        display: block
    }

    .product-card__figure:has(.product-card__image--secondary):hover>.product-card__media .product-card__image--primary {
        opacity: 0
    }

    .product-card__figure:has(.product-card__image--secondary):hover>.product-card__media .product-card__image--secondary {
        opacity: 1
    }
}

@media screen and (min-width: 700px) {
    .product-card__figure>.badge-list {
        inset-block-start: .5rem;
        inset-inline-start: .5rem
    }
}

.horizontal-product-card {
    scroll-snap-align: start;
    scroll-snap-stop: always;
    align-items: center;
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem;
    display: flex;
    position: relative;
    container: horizontal-product-card / inline-size
}

.horizontal-product-card__figure {
    flex-shrink: 0;
    width: 6.25rem
}

.horizontal-product-card__info {
    flex-grow: 1;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-columns: auto;
    justify-items: start;
    gap: .625rem;
    display: grid
}

.\@large\:horizontal-product-card__button {
    display: none
}

@media screen and (min-width: 700px) {
    .horizontal-product-card {
        -moz-column-gap: 2rem;
        column-gap: 2rem
    }
}

@container horizontal-product-card (width >=450px) {
    .horizontal-product-card__info {
        grid-auto-flow: column;
        align-items: center
    }

    .\@narrow\:horizontal-product-card__button {
        display: none
    }

    .\@large\:horizontal-product-card__button {
        display: block
    }
}

.product-list {
    --product-list-max-items-per-row-allowed: 2;
    --product-list-calculated-items-per-row: min(var(--product-list-max-items-per-row-allowed), var(--product-list-items-per-row));
    --product-list-default-row-gap: 2.1875rem;
    --product-list-default-column-gap: .625rem;
    --product-list-calculated-row-gap: clamp(var(--section-vertical-spacing) / 4, var(--product-list-default-row-gap) * var(--product-list-vertical-spacing-factor, 1), var(--section-vertical-spacing) * 2);
    --product-list-calculated-column-gap: clamp(var(--container-gutter) / 4, var(--product-list-default-column-gap) * var(--product-list-horizontal-spacing-factor, 1), var(--container-gutter) * 2);
    --product-list-card-width: calc(100% / var(--product-list-calculated-items-per-row) - var(--product-list-calculated-column-gap, 0px) * (var(--product-list-calculated-items-per-row) - 1) / var(--product-list-calculated-items-per-row));
    grid: auto / repeat(auto-fit, var(--product-list-card-width));
    align-items: start;
    -moz-column-gap: var(--product-list-calculated-column-gap);
    column-gap: var(--product-list-calculated-column-gap);
    row-gap: var(--product-list-calculated-row-gap);
    display: grid
}

.product-list--carousel {
    --product-list-default-column-gap: 1.25rem;
    grid: auto / auto-flow var(--product-list-card-width);
    justify-content: safe center
}

@media screen and (max-width: 699px) {
    .product-list:not(.product-list--carousel) {
        margin-inline: -.625rem
    }

    .product-list--carousel {
        --product-list-card-width: min(300px, 65%)
    }
}

@media screen and (min-width: 700px) {
    .product-list {
        --product-list-max-items-per-row-allowed: 3;
        --product-list-default-row-gap: 3rem;
        --product-list-default-column-gap: 1.5rem
    }

    .product-list--compact {
        --product-list-max-items-per-row-allowed: 4
    }
}

@media screen and (min-width: 1000px) {
    .product-list {
        --product-list-max-items-per-row-allowed: 4;
        --product-list-default-row-gap: 4rem;
        --product-list-default-column-gap: 3rem
    }

    .product-list--compact {
        --product-list-max-items-per-row-allowed: 5
    }

    .product-list--carousel {
        -ms-scroll-snap-type: x mandatory;
        scroll-snap-type: x mandatory
    }
}

@media screen and (min-width: 1150px) {
    .product-list {
        --product-list-max-items-per-row-allowed: var(--product-list-items-per-row)
    }
}

@media screen and (min-width: 1400px) {
    .product-list {
        --product-list-default-row-gap: 4rem;
        --product-list-default-column-gap: 3.75rem
    }
}

.quick-buy-modal {
    --modal-body-max-width: 55.625rem
}

.quick-buy-modal::part(content) {
    position: relative
}

.quick-buy-modal__content {
    grid-template-columns: minmax(0, 1fr);
    display: grid
}

.quick-buy-modal__close-button {
    position: absolute;
    inset-block-start: 1.875rem;
    inset-inline-end: 1.875rem
}

.quick-buy-modal__view-more {
    -webkit-margin-before: 2rem;
    margin-block-start: 2rem;
    display: inline-block
}

@media screen and (max-width: 699px) {
    .quick-buy-modal::part(body) {
        padding-inline: 0
    }

    .quick-buy-modal__gallery-wrapper,
    .quick-buy-modal__info-wrapper {
        -webkit-padding-start: var(--modal-body-padding-inline);
        padding-inline-start: var(--modal-body-padding-inline);
        -webkit-padding-end: var(--modal-body-padding-inline);
        padding-inline-end: var(--modal-body-padding-inline)
    }

    .quick-buy-modal__gallery-wrapper .price-list {
        justify-content: center
    }

    .quick-buy-modal__gallery-wrapper .price-list .h6 {
        font-size: .6875rem
    }

    .quick-buy-modal__mobile-info {
        -webkit-margin-before: 1.25rem;
        margin-block-start: 1.25rem
    }

    .quick-buy-modal__info-wrapper {
        border-block-start-width: 1px;
        -webkit-margin-before: 1.25rem;
        margin-block-start: 1.25rem
    }

    .quick-buy-modal__info-wrapper .product-info__block-item:is([data-block-type=vendor], [data-block-type=title], [data-block-type=price], [data-block-type=rating], [data-block-type=separator]),
    .quick-buy-modal__info-wrapper .product-info__block-group[data-group-type=text-with-rating] {
        display: none
    }

    .quick-buy-modal__info-wrapper .product-info__block-item[data-block-type=variant-picker] {
        --product-info-gap: 1.25rem
    }

    .quick-buy-modal__info-wrapper .product-info__block-item[data-block-type=buy-buttons] {
        --product-info-gap: 1.5rem
    }
}

@media screen and (min-width: 700px) {
    .quick-buy-modal {
        --modal-body-padding-inline: 3.125rem;
        --modal-body-padding-block: 3.125rem
    }

    .quick-buy-modal::part(header) {
        display: none
    }

    .quick-buy-modal__content {
        grid-template-columns: minmax(0, .9fr) minmax(0, 1fr);
        align-items: center;
        -moz-column-gap: 2.5rem;
        column-gap: 2.5rem;
        display: grid
    }

    .quick-buy-modal__content .product-info {
        top: unset;
        position: relative
    }
}

.prose {
    overflow-wrap: anywhere
}

.prose :first-child,
.prose .sr-only:first-child+* {
    -webkit-margin-before: 0 !important;
    margin-block-start: 0 !important
}

.prose :last-child {
    -webkit-margin-after: 0 !important;
    margin-block-end: 0 !important
}

.prose :where(:not(meta, span)+*) {
    -webkit-margin-before: 1rem;
    margin-block-start: 1rem
}

.prose :where(*+span:not(:empty, .metafield-multi_line_text_field)),
.prose :is(.link, img) {
    display: inline-block
}

.prose :is(.link+.link) {
    -webkit-margin-start: .75rem;
    margin-inline-start: .75rem
}

.prose :is(.button, .button-group:has(.button)) {
    -webkit-margin-before: 1.5rem;
    margin-block-start: 1.5rem
}

.prose :is(p img:not([style*=float]):only-child, div img:not([style*=float]):only-child, figure, video, object, blockquote, table) {
    margin-block: 1.6rem
}

.prose :is(iframe[src*=youtube], iframe[src*="youtu.be"], iframe[src*=vimeo]) {
    aspect-ratio: 16 / 9;
    width: 100%;
    height: auto
}

.prose .play-button {
    margin: 2rem auto;
    display: block
}

.prose :is(ol, ul) :is(ol, ul) {
    -webkit-margin-before: 0 !important;
    margin-block-start: 0 !important
}

.prose :is(ol, ul) {
    row-gap: .4em;
    display: grid
}

.prose br {
    margin-block: 0 !important
}

.prose figcaption {
    font-style: italic;
    font-size: var(--text-sm);
    color: rgb(var(--text-color) / .65);
    -webkit-margin-before: .5em;
    margin-block-start: .5em
}

.prose blockquote {
    border-inline-start-width: 3px;
    padding: .375rem 0 .375rem 1rem;
    font-size: 1.15rem;
    line-height: 1.75
}

@media screen and (min-width: 1000px) {
    .prose:not(.prose--tight) :where(:not(meta, span)+*) {
        -webkit-margin-before: 1.25rem;
        margin-block-start: 1.25rem
    }

    .prose:not(.prose--tight) :is(.button, .button-group:has(.button)) {
        -webkit-margin-before: 2rem;
        margin-block-start: 2rem
    }

    .prose:not(.prose--tight) .play-button {
        margin-block: 2.5rem
    }

    .prose:not(.prose--tight) blockquote {
        -webkit-margin-start: 2rem;
        margin-inline-start: 2rem;
        -webkit-padding-start: 2rem;
        padding-inline-start: 2rem
    }
}

.link {
    background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.35em) / 100% 1px no-repeat;
    text-decoration: none;
    transition: background-size .3s ease-in-out
}

.prose a:not(.h1, .h2, .h3, .h4, .h5, .h6, .button, .link-faded, .link-faded-reverse, :has(img)) {
    background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.35em) / 100% 1px no-repeat;
    text-decoration: none;
    transition: background-size .3s ease-in-out
}

@supports (height: 1lh) {
    .prose a:not(.h1, .h2, .h3, .h4, .h5, .h6, .button, .link-faded, .link-faded-reverse, :has(img)) {
        background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.2lh) / 100% 1px no-repeat
    }
}

@media screen and (pointer: fine) {
    .prose a:not(.h1, .h2, .h3, .h4, .h5, .h6, .button, .link-faded, .link-faded-reverse, :has(img)):hover {
        background-size: 0 1px
    }
}

@supports (height: 1lh) {
    .link {
        background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.2lh) / 100% 1px no-repeat
    }
}

@media screen and (pointer: fine) {
    .link:hover {
        background-size: 0 1px
    }
}

.link-reverse {
    background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.35em) / 0 1px no-repeat;
    text-decoration: none;
    transition: background-size .3s ease-in-out
}

@supports (height: 1lh) {
    .link-reverse {
        background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.2lh) / 0 1px no-repeat
    }
}

@media screen and (pointer: fine) {
    .link-reverse:hover {
        background-size: 100% 1px
    }
}

.link-faded {
    color: rgb(var(--text-color) / .65);
    transition: color .2s ease-in-out
}

@media screen and (pointer: fine) {
    .link-faded:hover {
        color: rgb(var(--text-color))
    }
}

.link-faded-reverse {
    transition: color .2s ease-in-out
}

@media screen and (pointer: fine) {
    .link-faded-reverse:hover {
        color: rgb(var(--text-color) / .65)
    }
}

table {
    --table-cell-padding-block: .75rem;
    --table-cell-padding-inline: .5rem;
    --table-foot-cell-padding-block: .75rem;
    --table-foot-cell-padding-inline: .5rem;
    width: 100%
}

table caption {
    text-align: inherit;
    -webkit-margin-after: .5rem;
    margin-block-end: .5rem
}

th {
    text-align: start
}

:where(td, th):not(:empty) {
    border-block-width: 1px
}

:where(th):not(:empty) {
    border-block-start-width: 0
}

td:not(:empty)+td {
    border-inline-start-width: 1px
}

th,
td {
    padding: var(--table-cell-padding-block) var(--table-cell-padding-inline)
}

table:not(.table--bordered) :is(th, td):first-child,
table:not(.table--bordered) :is(th, td):empty+td {
    -webkit-padding-start: 0;
    padding-inline-start: 0
}

:is(th, td):last-child {
    -webkit-padding-end: 0;
    padding-inline-end: 0
}

th {
    opacity: .6;
    line-height: 1.7;
    font-size: var(--text-h6);
    font-family: var(--heading-font-family);
    font-weight: var(--heading-font-weight);
    font-style: var(--heading-font-style);
    letter-spacing: var(--heading-letter-spacing);
    text-transform: var(--heading-text-transform);
    padding-block: 0 .625rem
}

tfoot td {
    padding: var(--table-foot-cell-padding-block) var(--table-foot-cell-padding-inline)
}

tr[onclick] {
    cursor: pointer;
    transition: background .2s
}

tr[onclick]:hover {
    background: rgb(var(--text-color) / .05)
}

@media screen and (min-width: 700px) {
    table {
        --table-cell-padding-block: 1rem;
        --table-cell-padding-inline: .75rem;
        --table-foot-cell-padding-block: 1rem;
        --table-foot-cell-padding-inline: .75rem
    }
}

.table--bordered {
    --table-cell-padding-inline: .75rem
}

.table--bordered td {
    border-width: 1px
}

.table--reduce-border :is(td)+td {
    border-inline-start-width: 0
}

.table--no-border td {
    border: none
}

.table--sm {
    --table-cell-padding-block: .35rem;
    --table-cell-padding-inline: .5rem
}

.table--lg {
    --table-cell-padding-block: 1.5rem;
    --table-cell-padding-inline: .5rem
}

@media screen and (min-width: 700px) {
    .table--lg {
        --table-cell-padding-block: 2rem;
        --table-cell-padding-inline: .75rem
    }
}

.social-media--list {
    align-items: center;
    gap: var(--social-media-list-gap, .75rem 2rem);
    flex-wrap: wrap;
    display: flex
}

.social-media--list .social-media__item {
    opacity: .65;
    transition: opacity .2s, color .2s
}

.social-media--list svg {
    width: var(--social-media-icon-size, 1.25rem)
}

@media screen and (pointer: fine) {
    .social-media--list .social-media__item:hover {
        opacity: 1
    }
}

.social-media--block {
    grid-template-columns: repeat(auto-fit, minmax(0, .33fr));
    gap: 1px;
    display: grid
}

.social-media--block:has(:nth-child(4)) {
    grid-template-columns: repeat(auto-fit, minmax(0, .25fr))
}

.social-media--block .social-media__item {
    outline: 1px solid rgb(var(--border-color));
    z-index: 0;
    width: 100%;
    transition: background .15s, color .15s, outline .15s, z-index .15s
}

.social-media--block a {
    padding-block: .625rem;
    display: block
}

.social-media--block svg {
    margin-inline: auto
}

@media screen and (pointer: fine) {
    .social-media--block .social-media__item:hover {
        background: rgb(var(--branding-background));
        outline-color: rgb(var(--branding-background));
        color: rgb(var(--branding-color));
        z-index: 1
    }
}

@media not screen and (pointer: fine) {
    .social-media--block .social-media__item {
        background: rgb(var(--branding-background));
        outline-color: rgb(var(--branding-background));
        color: rgb(var(--branding-color))
    }
}

@media screen and (min-width: 700px) {
    .social-media--block {
        grid-template-columns: repeat(auto-fit, minmax(0, 3.75rem))
    }
}

.branding-colors--facebook {
    --branding-background: 24 119 242;
    --branding-color: 255 255 255
}

.branding-colors--twitter {
    --branding-background: 29 161 242;
    --branding-color: 255 255 255
}

.branding-colors--instagram {
    --branding-background: 195 42 163;
    --branding-color: 255 255 255
}

.branding-colors--pinterest {
    --branding-background: 189 8 28;
    --branding-color: 255 255 255
}

.branding-colors--youtube {
    --branding-background: 255 0 0;
    --branding-color: 255 255 255
}

.branding-colors--tiktok {
    --branding-background: 1 1 1;
    --branding-color: 255 255 255
}

.branding-colors--vimeo {
    --branding-background: 26 183 234;
    --branding-color: 255 255 255
}

.branding-colors--linkedin {
    --branding-background: 10 102 194;
    --branding-color: 255 255 255
}

.branding-colors--whatsapp {
    --branding-background: 79 206 93;
    --branding-color: 255 255 255
}

.branding-colors--snapchat {
    --branding-background: 255 252 0;
    --branding-color: 0 0 0
}

.branding-colors--tumblr {
    --branding-background: 54 70 93;
    --branding-color: 255 255 255
}

.branding-colors--wechat {
    --branding-background: 9 184 62;
    --branding-color: 255 255 255
}

.branding-colors--reddit {
    --branding-background: 255 69 0;
    --branding-color: 255 255 255
}

.branding-colors--line {
    --branding-background: 6 199 85;
    --branding-color: 255 255 255
}

.branding-colors--spotify {
    --branding-background: 30 215 96;
    --branding-color: 255 255 255
}

.branding-colors--21buttons {
    --branding-background: 0 0 0;
    --branding-color: 255 255 255
}

.branding-colors--email {
    --branding-background: var(--text-color);
    --branding-color: var(--background)
}

.color-swatch {
    --swatch-offset: 2px;
    --swatch-size: 2.125rem;
    --swatch-border-size: 1px;
    --swatch-disabled-strike-color: rgb(var(--border-color));
    width: var(--swatch-size);
    height: var(--swatch-size);
    padding: var(--swatch-offset);
    border: var(--swatch-border-size) solid transparent;
    background: content-box var(--swatch-background) no-repeat center / cover;
    place-items: center;
    display: grid;
    position: relative
}

.color-swatch.is-disabled:before {
    content: "";
    margin: var(--swatch-disabled-margin, var(--swatch-offset));
    background: linear-gradient(to bottom right, transparent calc(50% - .5px), var(--swatch-disabled-strike-color) calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px));
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

:disabled+.color-swatch {
    display: none
}

:checked+.color-swatch,
.color-swatch.is-selected {
    --swatch-disabled-margin: 0;
    --swatch-disabled-strike-color: currentColor;
    border-color: currentColor
}

:focus-visible+.color-swatch {
    outline-offset: calc(var(--swatch-offset))
}

.thumbnail-swatch {
    --swatch-size: 3rem;
    --swatch-disabled-strike-color: rgb(var(--border-color));
    width: var(--swatch-size);
    height: var(--swatch-size);
    border-radius: min(4px, var(--input-border-radius));
    border-width: 1px;
    display: block;
    position: relative
}

:checked+.thumbnail-swatch,
.thumbnail-swatch.is-selected {
    --swatch-disabled-strike-color: currentColor;
    border-color: currentColor
}

.thumbnail-swatch.is-disabled:before {
    content: "";
    background: linear-gradient(to bottom right, transparent calc(50% - .5px), var(--swatch-disabled-strike-color) calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px));
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

:disabled+.thumbnail-swatch {
    display: none
}

.thumbnail-swatch>img {
    border-radius: inherit;
    height: 100%
}

:focus-visible+.thumbnail-swatch {
    outline-offset: 2px
}

@media screen and (min-width: 700px) {
    .thumbnail-swatch {
        --swatch-size: 4.25rem
    }
}

.block-swatch {
    --swatch-border-size: 1px;
    --swatch-padding: calc(var(--input-padding-block) - var(--swatch-border-size) * 2) .875rem;
    --swatch-disabled-strike-color: rgb(var(--border-color));
    padding: var(--swatch-padding);
    border-width: var(--swatch-border-size);
    border-radius: var(--input-border-radius);
    min-width: 2.5rem;
    color: rgb(var(--text-color) / .65);
    justify-content: center;
    align-items: center;
    -moz-column-gap: .875rem;
    column-gap: .875rem;
    display: flex;
    position: relative
}

.block-swatch.is-disabled {
    color: rgb(var(--text-color) / .5)
}

:checked+.block-swatch,
.block-swatch.is-selected {
    --swatch-disabled-strike-color: currentColor;
    color: var(--text-color);
    border-color: currentColor
}

.block-swatch.is-disabled:before {
    content: "";
    background: linear-gradient(to bottom right, transparent calc(50% - .5px), var(--swatch-disabled-strike-color) calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px));
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

:disabled+.block-swatch {
    display: none
}

:focus-visible+.block-swatch {
    outline-offset: 2px
}

.block-swatch__color {
    background: var(--swatch-background) center / cover;
    width: 1rem;
    height: 1rem
}

.image-filter {
    --image-filter-width: 3rem;
    grid-template-columns: var(--image-filter-width) minmax(0, 1fr);
    align-items: center;
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem;
    display: grid
}

.image-filter__image {
    width: var(--image-filter-width);
    height: var(--image-filter-width);
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center
}

.image-filter__label {
    grid-column-start: 2
}

:checked+.image-filter .image-filter__image {
    outline: 1px solid rgb(var(--text-color))
}

:checked+.image-filter .image-filter__label {
    color: rgb(var(--text-color))
}

.content-tabs::part(tab-list) {
    -webkit-border-after: 1px solid rgb(var(--border-color));
    border-block-end: 1px solid rgb(var(--border-color));
    white-space: nowrap;
    grid-auto-flow: column;
    justify-content: start;
    gap: 2.5rem;
    -webkit-margin-after: 1.5rem;
    margin-block-end: 1.5rem;
    display: grid
}

.content-tabs [role=tab] {
    box-shadow: 0 1px rgb(var(--text-color));
    -webkit-padding-after: .625rem;
    padding-block-end: .625rem;
    transition: opacity .2s ease-in, box-shadow .2s ease-in
}

.content-tabs [role=tab]:not([aria-selected=true]) {
    opacity: .6;
    box-shadow: 0 1px #0000
}

.content-tabs--center::part(tab-list) {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    margin-inline: auto
}

.content-tabs--center::part(tab-panel-list) {
    text-align: center;
    width: min(800px, 100%);
    margin-inline: auto;
    display: block
}

@media screen and (min-width: 1000px) {
    .content-tabs::part(tab-list) {
        gap: 4.375rem;
        -webkit-margin-after: 2rem;
        margin-block-end: 2rem
    }
}

.constrained-image {
    width: var(--image-mobile-max-width, var(--image-max-width));
    max-width: 100%
}

@media screen and (min-width: 700px) {
    .constrained-image {
        width: var(--image-max-width)
    }
}

.text-with-icon {
    align-items: center;
    gap: .625rem;
    display: flex
}

.text-with-icon>svg {
    flex-shrink: 0
}

.icon {
    vertical-align: middle;
    height: auto;
    transition: transform .2s;
    display: block
}

.group[aria-expanded=true] .icon.group-expanded\:rotate {
    transform: rotate(180deg)
}

[dir=rtl] .icon--direction-aware {
    scale: -1
}

.offset-icon {
    --icon-baseline-distance: .825em;
    top: var(--icon-baseline-distance);
    position: relative;
    translate: 0 -50%
}

@supports (top: 1lh) {
    .offset-icon {
        top: .5lh
    }
}

.price-list {
    flex-wrap: wrap;
    align-items: baseline;
    -moz-column-gap: .5rem;
    column-gap: .5rem;
    display: flex
}

.price-list--product {
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

.localization-selectors {
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: .75rem 1.75rem;
    display: flex
}

.localization-selectors__separator {
    background: rgb(var(--border-color));
    width: 1px;
    height: .5rem
}

.localization-selectors__separator:last-child {
    display: none
}

.localization-toggle {
    align-items: center;
    -moz-column-gap: .625rem;
    column-gap: .625rem;
    display: flex
}

.localization-toggle>svg {
    transition: transform .2s
}

.localization-toggle[aria-expanded=true]>svg {
    transform: rotate(180deg)
}

.country-flag {
    width: 20px;
    height: 15px
}

.payment-methods {
    flex-wrap: wrap;
    gap: 1rem;
    display: flex
}

.badge {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    font-family: var(--heading-font-family);
    font-weight: var(--heading-font-weight);
    font-style: var(--heading-font-style);
    letter-spacing: var(--heading-letter-spacing);
    text-transform: uppercase;
    align-items: center;
    padding: .0625rem .3125rem;
    font-size: .625rem;
    display: flex
}

.badge--on-sale {
    background: rgb(var(--on-sale-badge-background));
    color: rgb(var(--on-sale-badge-text))
}

.badge--sold-out {
    background: rgb(var(--sold-out-badge-background));
    color: rgb(var(--sold-out-badge-text))
}

.badge--custom {
    background: rgb(var(--custom-badge-background));
    color: rgb(var(--custom-badge-text))
}

@media screen and (min-width: 700px) {
    .badge {
        font-size: .6875rem
    }
}

.badge-list {
    flex-wrap: wrap;
    gap: .25rem;
    display: flex
}

.badge-list--vertical {
    flex-direction: column
}

.feature-badge {
    font-size: var(--text-xs);
    align-items: center;
    -moz-column-gap: .5rem;
    column-gap: .5rem;
    padding: .375rem .5rem;
    display: inline-flex
}

.feature-badge :is(svg, img) {
    flex-shrink: 0
}

.feature-badge-list {
    flex-wrap: wrap;
    gap: .5rem;
    display: flex
}

.rating-badge {
    flex-wrap: wrap;
    align-items: center;
    -moz-column-gap: .5rem;
    column-gap: .5rem;
    line-height: normal;
    display: flex
}

.rating-badge__stars {
    -moz-column-gap: .125rem;
    column-gap: .125rem;
    display: flex;
    position: relative;
    top: -.5px
}

.text-with-rating {
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: .75rem .5rem;
    display: flex
}

.inventory {
    row-gap: .5rem;
    font-style: italic;
    display: grid
}

.progress-bar {
    background: rgb(var(--text-color) / .1);
    height: 2px;
    display: block;
    position: relative
}

.progress-bar:before {
    content: "";
    width: 100%;
    height: 100%;
    transform: scaleX(var(--progress, 0));
    transform-origin: var(--transform-origin-start);
    background: currentColor;
    transition: transform .45s ease-in-out;
    display: block
}

[data-tooltip] {
    --tooltip-text-color: var(--text-color);
    --tooltip-background: var(--background);
    position: relative
}

@media screen and (pointer: fine) {
    [data-tooltip]:after {
        content: attr(data-tooltip);
        inset-block-end: calc(100% + var(--tooltip-offset, .5rem));
        border-radius: min(1.5rem, var(--button-border-radius));
        background: rgb(var(--tooltip-text-color));
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        max-width: 15rem;
        color: rgb(var(--tooltip-background));
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
        justify-self: center;
        padding: .125rem .5rem;
        font-size: .6875rem;
        transition: opacity .1s ease-in-out, visibility .1s ease-in-out, scale .1s ease-in-out;
        position: absolute;
        left: 50%;
        translate: -50%;
        scale: .9
    }

    [data-tooltip]:hover:after {
        visibility: visible;
        opacity: 1;
        scale: 1
    }
}

.separator-dot {
    --dot-size: .25rem;
    width: var(--dot-size);
    height: var(--dot-size);
    background: currentColor;
    border-radius: 100%
}

.animated-plus {
    --animated-plus-size: .625rem;
    width: var(--animated-plus-size);
    height: var(--animated-plus-size);
    display: block;
    position: relative
}

.animated-plus:before,
.animated-plus:after {
    content: "";
    background-color: currentColor;
    transition: transform .25s ease-in-out, opacity .25s ease-in-out;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-90deg)
}

.animated-plus:before {
    width: var(--animated-plus-size);
    opacity: 1;
    height: 1px
}

.animated-plus:after {
    width: 1px;
    height: var(--animated-plus-size)
}

.group[aria-expanded=true] .animated-plus.group-expanded\:rotate:before {
    opacity: 0
}

.group[aria-expanded=true] .animated-plus.group-expanded\:rotate:before,
.group[aria-expanded=true] .animated-plus.group-expanded\:rotate:after {
    transform: translate(-50%, -50%) rotate(90deg)
}

@media (pointer: fine) {
    .is-scrollable[allow-drag] {
        cursor: -webkit-grab;
        cursor: grab
    }

    .is-scrollable[allow-drag]:active {
        cursor: -webkit-grabbing;
        cursor: grabbing;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -ms-scroll-snap-type: none;
        scroll-snap-type: none
    }
}

@media screen and (min-width: 700px) {
    .play-button svg {
        width: 5rem;
        height: 5rem
    }
}

.quantity-selector {
    --quantity-selector-height: 2.4rem;
    --quantity-selector-input-width: 2.5rem;
    --tooltip-offset: calc(-1 * var(--quantity-selector-height) / 2 + 1rem);
    grid-template-columns: var(--quantity-selector-height) auto var(--quantity-selector-height);
    grid-auto-rows: var(--quantity-selector-height);
    border-width: 1px;
    align-items: center;
    display: inline-grid
}

.quantity-selector__button {
    place-content: center;
    min-height: 100%;
    display: grid
}

.quantity-selector__button svg {
    transition: opacity .2s
}

.quantity-selector__button[disabled] svg,
.quantity-selector__button:hover svg {
    opacity: .65
}

.quantity-selector__input-wrapper {
    place-items: center;
    display: grid
}

.quantity-selector__input-wrapper>* {
    grid-area: 1 / -1
}

.quantity-selector__input {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
    min-width: var(--quantity-selector-input-width);
    width: var(--quantity-selector-character-count, 1ch);
    text-align: center;
    background: none;
    transition: opacity .2s ease-in-out .2s
}

.quantity-selector__input:focus {
    outline: none
}

.quantity-selector__input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.quantity-selector__input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

@media screen and (min-width: 700px) {
    .quantity-selector {
        --quantity-selector-height: 2.7rem
    }
}

.quantity-selector--sm {
    --quantity-selector-height: 2.2rem;
    --quantity-selector-input-width: 2rem
}

@-webkit-keyframes quantitySelectorSpinner {
    0% {
        -webkit-animation-timing-function: cubic-bezier(.45, 0, .55, 1);
        animation-timing-function: cubic-bezier(.45, 0, .55, 1);
        transform: rotate(0)
    }

    50% {
        -webkit-animation-timing-function: cubic-bezier(.4, 0, .6, 1);
        animation-timing-function: cubic-bezier(.4, 0, .6, 1);
        transform: rotate(360deg)
    }

    to {
        -webkit-animation-timing-function: cubic-bezier(.45, 0, .55, 1);
        animation-timing-function: cubic-bezier(.45, 0, .55, 1);
        transform: rotate(720deg)
    }
}

@keyframes quantitySelectorSpinner {
    0% {
        -webkit-animation-timing-function: cubic-bezier(.45, 0, .55, 1);
        animation-timing-function: cubic-bezier(.45, 0, .55, 1);
        transform: rotate(0)
    }

    50% {
        -webkit-animation-timing-function: cubic-bezier(.4, 0, .6, 1);
        animation-timing-function: cubic-bezier(.4, 0, .6, 1);
        transform: rotate(360deg)
    }

    to {
        -webkit-animation-timing-function: cubic-bezier(.45, 0, .55, 1);
        animation-timing-function: cubic-bezier(.45, 0, .55, 1);
        transform: rotate(720deg)
    }
}

.quantity-selector__spinner {
    transform-origin: center;
    opacity: 0;
    transition: opacity .2s ease-in-out, translate .2s ease-in-out, display .2s ease-in-out allow-discrete;
    -webkit-animation: 2.5s cubic-bezier(.4, 0, .6, 1) infinite quantitySelectorSpinner;
    animation: 2.5s cubic-bezier(.4, 0, .6, 1) infinite quantitySelectorSpinner;
    display: none;
    translate: 0 4px
}

.quantity-selector__input-wrapper[aria-busy=true] .quantity-selector__spinner {
    opacity: 1;
    display: block;
    translate: none
}

@starting-style {
    .quantity-selector__input-wrapper[aria-busy=true] .quantity-selector__spinner {
        opacity: 0;
        translate: 0 4px
    }
}

.quantity-selector__input-wrapper[aria-busy=true] .quantity-selector__input {
    opacity: 0;
    transition-delay: 0s
}

.breadcrumb {
    display: none
}

.breadcrumb__list {
    align-items: center;
    -moz-column-gap: .5rem;
    column-gap: .5rem;
    line-height: 1;
    display: flex
}

.breadcrumb__list-item+.breadcrumb__list-item:before {
    content: "/";
    color: rgb(var(--text-color) / .65);
    -webkit-margin-end: .375rem;
    margin-inline-end: .375rem;
    font-size: .625rem;
    display: inline-block
}

@media screen and (min-width: 1000px) {
    .breadcrumb {
        display: block
    }
}

.breadcrumb--floating {
    position: absolute;
    inset-block-start: 1.25rem;
    inset-inline-start: var(--container-gutter)
}

.bordered-box {
    border-width: 1px;
    padding: 2.5rem 1.25rem 1.25rem;
    position: relative
}

.bordered-box__title {
    inset-block-start: 0;
    text-align: center;
    background: rgb(var(--background));
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    padding-inline: .5rem;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%)
}

@media screen and (min-width: 1000px) {
    .bordered-box {
        padding: 3rem
    }
}

.loading-bar {
    z-index: 2000;
    pointer-events: none;
    mix-blend-mode: exclusion;
    width: 100%;
    height: 2px;
    transform-origin: var(--transform-origin-start);
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    transform: scaleX(0)
}

@media screen and (min-width: 700px) {
    .loading-bar {
        height: 3px
    }
}

@-webkit-keyframes animateCircularProgress {
    0% {
        stroke-dashoffset: var(--stroke-dasharray)
    }

    to {
        stroke-dashoffset: 0
    }
}

@keyframes animateCircularProgress {
    0% {
        stroke-dashoffset: var(--stroke-dasharray)
    }

    to {
        stroke-dashoffset: 0
    }
}

.circular-progress {
    transition: opacity .25s;
    transform: rotate(-90deg)
}

.circular-progress circle:last-child {
    stroke-dasharray: var(--stroke-dasharray);
    stroke-dashoffset: var(--stroke-dasharray)
}

@media (prefers-reduced-motion: no-preference) {
    image-parallax img {
        transform: scale(1.3) translateY(-11.5385%)
    }
}

.scroll-margin-offset {
    scroll-margin-block-start: 20px
}

.share-buttons {
    align-items: center;
    gap: .875rem;
    display: flex
}

.share-buttons .social-media {
    --social-media-icon-size: 1rem;
    --social-media-list-gap: .75rem
}

.share-buttons--native:not([hidden])+.share-buttons {
    display: none
}

product-rerender {
    display: contents
}

.customer-account-box {
    min-height: calc(100vh - var(--section-vertical-spacing) * 2 - var(--announcement-bar-height, 0px) - var(--header-height, 0px));
    text-align: center;
    align-items: center;
    display: grid
}

.customer-account-category {
    border-block-end-width: 1px;
    -webkit-padding-after: .625rem;
    padding-block-end: .625rem
}

.customer-account-overview {
    grid-gap: 2.5rem 3rem;
    display: grid
}

.customer-account-order-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
    display: grid
}

@media screen and (min-width: 1000px) {
    .customer-account-overview {
        grid-template-columns: minmax(0, 1fr) 14rem
    }
}

@media screen and (min-width: 1150px) {
    .customer-account-overview {
        grid-template-columns: minmax(0, 1fr) 18rem;
        -moz-column-gap: 3.75rem;
        column-gap: 3.75rem
    }
}

.customer-address-list {
    --addresses-per-row: 1;
    grid-template-columns: repeat(var(--addresses-per-row), minmax(0, 1fr));
    gap: 3rem 3.75rem;
    display: grid
}

@media screen and (min-width: 700px) {
    .customer-address-list {
        --addresses-per-row: 2
    }
}

@media screen and (min-width: 1000px) {
    .customer-address-list {
        --addresses-per-row: 3
    }
}

.customer-order {
    grid: auto / minmax(0, 1fr);
    gap: 3rem;
    display: grid
}

.customer-order__details {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 3rem;
    display: grid
}

.customer-order__address-list {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    align-content: start;
    gap: 2.5rem 3.75rem;
    display: grid
}

@media screen and (min-width: 1150px) {
    .customer-order {
        grid: auto / auto-flow minmax(0, 1fr) 14rem;
        -moz-column-gap: 3.75rem;
        column-gap: 3.75rem
    }
}

@media screen and (min-width: 1400px) {
    .customer-order {
        grid-auto-columns: minmax(0, 1fr) 18rem
    }
}

.announcement-bar {
    --announcement-bar-gutter: .625rem;
    text-align: center;
    font-size: var(--announcement-bar-font-size);
    place-content: center;
    -moz-column-gap: .75rem;
    column-gap: .75rem;
    padding-block: 1em;
    -webkit-padding-start: max(var(--announcement-bar-gutter), 50% - var(--container-max-width) / 2);
    padding-inline-start: max(var(--announcement-bar-gutter), 50% - var(--container-max-width) / 2);
    -webkit-padding-end: max(var(--announcement-bar-gutter), 50% - var(--container-max-width) / 2);
    padding-inline-end: max(var(--announcement-bar-gutter), 50% - var(--container-max-width) / 2);
    display: flex
}

.announcement-bar__carousel {
    flex-grow: 1;
    place-items: center;
    max-width: 35rem;
    display: grid
}

.announcement-bar__carousel>* {
    grid-area: 1 / -1
}

.announcement-bar__carousel>:not(.is-selected) {
    visibility: hidden
}

@media screen and (min-width: 700px) {
    .announcement-bar {
        --announcement-bar-gutter: var(--container-gutter);
        justify-content: center;
        -moz-column-gap: 2.5rem;
        column-gap: 2.5rem
    }
}

.before-after {
    --before-after-content-inset-inline: 1.25rem;
    --before-after-content-inset-block: 1rem;
    --before-after-cursor-size: 3.125rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    display: grid;
    position: relative
}

.before-after>* {
    grid-area: 1 / -1
}

.before-after__after-image {
    z-index: 1
}

.before-after__content-wrapper {
    position: absolute
}

.before-after__cursor {
    pointer-events: auto;
    -webkit-filter: drop-shadow(0 1px 1px #0000000d) drop-shadow(0 1px 1px #0000000d);
    filter: drop-shadow(0 1px 1px #0000000d) drop-shadow(0 1px 1px #0000000d);
    z-index: 1;
    display: grid;
    position: relative
}

.before-after__cursor:before {
    content: "";
    background: rgb(var(--before-after-cursor-background));
    z-index: -1;
    position: absolute
}

.before-after__cursor svg {
    width: var(--before-after-cursor-size);
    height: var(--before-after-cursor-size)
}

.before-after--horizontal {
    cursor: ew-resize
}

.before-after--horizontal .before-after__after-image {
    -webkit-clip-path: inset(0 0 0 var(--before-after-cursor-position, 0%));
    clip-path: inset(0 0 0 var(--before-after-cursor-position, 0%))
}

[dir=rtl] :is(.before-after--horizontal .before-after__after-image) {
    -webkit-clip-path: inset(0 var(--before-after-cursor-position, 0%) 0 0);
    clip-path: inset(0 var(--before-after-cursor-position, 0%) 0 0)
}

.before-after--horizontal .before-after__before-image .before-after__content-wrapper {
    justify-items: start;
    inset-block-end: var(--before-after-content-inset-block);
    inset-inline-start: var(--before-after-content-inset-inline)
}

.before-after--horizontal .before-after__after-image .before-after__content-wrapper {
    text-align: end;
    justify-items: end;
    inset-block-end: var(--before-after-content-inset-block);
    inset-inline-end: var(--before-after-content-inset-inline)
}

.before-after--horizontal .before-after__cursor {
    justify-self: start;
    place-items: center start;
    inset-inline-start: calc(var(--before-after-cursor-position, 0%) - var(--before-after-cursor-size) / 2)
}

.before-after--horizontal .before-after__cursor:before {
    width: .125rem;
    height: 100%;
    inset-inline-start: calc(var(--before-after-cursor-size) / 2)
}

.before-after--vertical {
    cursor: ns-resize
}

.before-after--vertical .before-after__after-image {
    -webkit-clip-path: inset(var(--before-after-cursor-position, 0%) 0 0 0);
    clip-path: inset(var(--before-after-cursor-position, 0%) 0 0 0)
}

.before-after--vertical .before-after__before-image .before-after__content-wrapper {
    justify-items: start;
    inset-block-start: var(--before-after-content-inset-block);
    inset-inline-start: var(--before-after-content-inset-inline)
}

.before-after--vertical .before-after__after-image .before-after__content-wrapper {
    justify-items: start;
    inset-block-end: var(--before-after-content-inset-block);
    inset-inline-start: var(--before-after-content-inset-inline)
}

.before-after--vertical .before-after__cursor {
    align-self: start;
    place-items: start center;
    inset-block-start: calc(var(--before-after-cursor-position, 0%) - var(--before-after-cursor-size) / 2)
}

.before-after--vertical .before-after__cursor:before {
    width: 100%;
    height: .125rem;
    inset-block-start: calc(var(--before-after-cursor-size) / 2)
}

@media screen and (max-width: 699px) {
    .before-after {
        --before-after-cursor-size: 2.5rem
    }

    .before-after .button {
        padding: .45rem 1.5rem
    }
}

@media screen and (min-width: 700px) {
    .before-after {
        --before-after-content-inset-inline: 2.5rem;
        --before-after-content-inset-block: 2rem
    }

    .before-after__content-wrapper:has(.button) {
        --before-after-content-inset-block: 2.5rem
    }
}

.blog-tags {
    flex-wrap: wrap;
    justify-content: center;
    gap: .5rem 1.5rem;
    display: flex
}

.article {
    --article-wrapper-offset: 0px;
    --article-wrapper-padding-inline: 0px;
    -webkit-padding-after: var(--section-vertical-spacing);
    padding-block-end: var(--section-vertical-spacing)
}

.article__toolbar {
    visibility: hidden;
    z-index: 1;
    width: 100vw;
    padding-block: 1rem;
    transition: transform .2s, visibility .2s, inset-block-start .15s ease-in-out;
    position: fixed;
    inset-block-start: var(--sticky-area-height);
    transform: translateY(-100%)
}

.article__toolbar.is-visible {
    visibility: visible;
    transform: translateY(0)
}

.article__toolbar .social-media {
    gap: .75rem 1rem
}

.article__toolbar .social-media svg {
    width: 1rem;
    height: 1rem
}

.article__image {
    overflow: hidden
}

.article__image img {
    height: var(--article-image-height);
    -o-object-fit: cover;
    object-fit: cover
}

.article__wrapper {
    padding: 1.5rem var(--article-wrapper-padding-inline) 0;
    background: rgb(var(--background));
    gap: 5rem;
    -webkit-margin-start: max(var(--container-gutter), 50% - var(--container-max-width) / 2 - var(--article-wrapper-padding-inline));
    margin-inline-start: max(var(--container-gutter), 50% - var(--container-max-width) / 2 - var(--article-wrapper-padding-inline));
    -webkit-margin-end: max(var(--container-gutter), 50% - var(--container-max-width) / 2 - var(--article-wrapper-padding-inline));
    margin-inline-end: max(var(--container-gutter), 50% - var(--container-max-width) / 2 - var(--article-wrapper-padding-inline));
    display: grid;
    position: relative
}

.article__image+.article__wrapper {
    -webkit-margin-before: var(--article-wrapper-offset);
    margin-block-start: var(--article-wrapper-offset)
}

.article__comments {
    gap: inherit;
    scroll-margin-block-start: calc(var(--sticky-area-height) + 20px);
    display: grid
}

.article__author {
    border-block-width: 1px;
    align-items: start;
    -moz-column-gap: 1rem;
    column-gap: 1rem;
    padding-block: 1.5rem;
    display: flex
}

.article__author-image {
    border-radius: 100%;
    flex-shrink: 0;
    width: 3.75rem
}

.article__footer-bottom {
    gap: 2.5rem;
    display: grid
}

.article__author+.article__footer-bottom {
    -webkit-margin-before: 1.75rem;
    margin-block-start: 1.75rem
}

@media screen and (min-width: 700px) {
    .article {
        --article-wrapper-offset: -2.75rem;
        --article-wrapper-padding-inline: 3.125rem
    }

    .article__wrapper {
        gap: 6.25rem;
        -webkit-padding-before: 2.5rem;
        padding-block-start: 2.5rem
    }

    .article__footer-bottom {
        grid: auto / auto-flow minmax(0, 1fr);
        align-items: center
    }
}

@media screen and (min-width: 1000px) {
    .article {
        --article-wrapper-offset: -4.375rem
    }
}

.comment {
    gap: 1.125rem;
    display: grid
}

.comment:not(:first-child) {
    -webkit-padding-before: 2rem;
    padding-block-start: 2rem
}

.cart-page {
    align-items: start;
    row-gap: max(4rem, var(--section-vertical-spacing-tight));
    display: grid
}

.cart-footer {
    flex-direction: column;
    gap: 1.5rem;
    display: flex
}

.cart-recap {
    gap: .5rem;
    display: grid
}

.cart-recap [type=submit] {
    -webkit-margin-before: 1rem;
    margin-block-start: 1rem
}

@media screen and (min-width: 700px) {
    .cart-footer {
        flex-direction: row;
        gap: 3rem
    }

    .cart-footer>:not(:only-child) {
        width: min(24rem, 100%)
    }

    .cart-recap {
        text-align: end;
        justify-items: end;
        -webkit-margin-start: auto;
        margin-inline-start: auto
    }
}

@media screen and (min-width: 1000px) {
    .cart-page {
        row-gap: max(6rem, var(--section-vertical-spacing-tight))
    }
}

.cart-drawer::part(body) {
    padding-block: 0
}

:is(.cart-drawer:has(.cart-drawer__order-note[open])::part(header), .cart-drawer:has(.cart-drawer__order-note[open])::part(body)) {
    opacity: .4;
    pointer-events: none;
    transition: opacity .2s
}

.cart-drawer:not(:has(.cart-drawer__footer:only-child))::part(footer) {
    -webkit-padding-before: calc(var(--drawer-footer-padding-block) - .5rem);
    padding-block-start: calc(var(--drawer-footer-padding-block) - .5rem)
}

.cart-drawer .free-shipping-bar {
    font-size: var(--text-sm);
    border-block-end-width: 1px;
    -webkit-margin-start: calc(-1 * var(--drawer-body-padding-inline));
    margin-inline-start: calc(-1 * var(--drawer-body-padding-inline));
    -webkit-margin-end: calc(-1 * var(--drawer-body-padding-inline));
    margin-inline-end: calc(-1 * var(--drawer-body-padding-inline));
    padding-block: .5rem;
    -webkit-padding-start: var(--drawer-body-padding-inline);
    padding-inline-start: var(--drawer-body-padding-inline);
    -webkit-padding-end: var(--drawer-body-padding-inline);
    padding-inline-end: var(--drawer-body-padding-inline)
}

.cart-drawer__items {
    gap: 1.5rem;
    -webkit-padding-before: var(--drawer-body-padding-block);
    padding-block-start: var(--drawer-body-padding-block);
    -webkit-padding-after: var(--drawer-body-padding-block);
    padding-block-end: var(--drawer-body-padding-block);
    display: grid
}

.cart-drawer__complementary-products {
    padding-inline: var(--drawer-body-padding-inline);
    border-block-start-width: 1px;
    padding-block: 1.25rem;
    margin-inline: calc(-1 * var(--drawer-body-padding-inline)) !important;
    row-gap: 1.25rem !important
}

.cart-drawer__button-price {
    align-items: center;
    display: flex
}

.cart-drawer__button-price:before {
    content: "";
    background: currentColor;
    border-radius: 100%;
    width: 3px;
    height: 3px;
    -webkit-margin-end: 1.125rem;
    margin-inline-end: 1.125rem
}

.cart-drawer__footer {
    align-items: start;
    gap: 1rem;
    display: grid
}

.cart-drawer__order-note {
    background-color: rgb(var(--background));
    background-image: var(--background-gradient);
    width: 100%;
    box-shadow: 1px 0 6px rgb(var(--border-color));
    z-index: 2;
    border-block-start-width: 1px;
    -webkit-padding-before: calc(var(--drawer-footer-padding-block) - .5rem);
    padding-block-start: calc(var(--drawer-footer-padding-block) - .5rem);
    -webkit-padding-after: var(--drawer-footer-padding-block);
    padding-block-end: var(--drawer-footer-padding-block);
    -webkit-padding-start: var(--drawer-body-padding-inline);
    padding-inline-start: var(--drawer-body-padding-inline);
    -webkit-padding-end: var(--drawer-body-padding-inline);
    padding-inline-end: var(--drawer-body-padding-inline);
    display: none;
    position: absolute;
    inset-block-end: 0;
    inset-inline-start: 0
}

@media screen and (min-width: 700px) {
    .cart-drawer__complementary-products {
        padding-block: 2rem;
        row-gap: 1rem !important
    }
}

.collection-banner {
    display: block;
    position: relative
}

.collection-banner .breadcrumb {
    z-index: 2
}

.collection {
    --collection-gap: 2rem;
    --collection-grid-template: minmax(0, 1fr);
    --collection-sidebar-width: 15rem;
    grid-template-columns: var(--collection-grid-template);
    align-items: start;
    gap: var(--collection-gap);
    -webkit-margin-after: var(--section-vertical-spacing);
    margin-block-end: var(--section-vertical-spacing);
    scroll-margin-block-start: calc(var(--collection-toolbar-height, 0px) + 20px);
    display: grid
}

.collection:only-child {
    -webkit-margin-before: 1.5rem;
    margin-block-start: 1.5rem
}

.collection__main {
    row-gap: var(--section-stack-gap);
    display: grid
}

.collection .product-list[collection-mobile-layout=medium] {
    --product-list-items-per-row: var(--collection-items-per-row-medium)
}

.collection .product-list[collection-mobile-layout=large] {
    --product-list-items-per-row: var(--collection-items-per-row-large)
}

@media screen and (min-width: 700px) {
    .collection:only-child {
        -webkit-margin-before: 3rem;
        margin-block-start: 3rem
    }

    .collection .product-list[collection-desktop-layout=compact] {
        --product-list-items-per-row: var(--collection-items-per-row-compact)
    }

    .collection .product-list[collection-desktop-layout=compact] .product-card__info {
        display: none
    }

    .collection .product-list[collection-desktop-layout=medium] {
        --product-list-items-per-row: var(--collection-items-per-row-medium)
    }

    .collection .product-list[collection-desktop-layout=large] {
        --product-list-items-per-row: var(--collection-items-per-row-large)
    }
}

@media screen and (min-width: 1150px) {
    .collection {
        --collection-gap: 3.125rem
    }
}

.collection-toolbar {
    min-height: 3em;
    box-shadow: 0 1px rgb(var(--border-color)), 0 -1px rgb(var(--border-color));
    background-color: rgb(var(--background));
    z-index: 2;
    transition: inset-block-start .15s ease-in-out;
    display: flex;
    position: -webkit-sticky;
    position: sticky;
    inset-block-start: var(--sticky-area-height);
    inset-inline-start: 0
}

.collection-toolbar .popover {
    --popover-block-offset: 0px;
    inset-inline-end: -1px
}

.collection-toolbar__button-list {
    flex-grow: 1;
    display: flex
}

.collection-toolbar__button {
    padding-block: .75rem
}

.collection-toolbar__button :is(svg) {
    transition: transform .2s
}

.collection-toolbar__button[aria-expanded=true] svg {
    transform: rotate(180deg)
}

.collection-toolbar__button-container {
    width: 100%;
    position: relative
}

.collection-toolbar__button-container+.collection-toolbar__button-container {
    border-inline-start-width: 1px
}

.collection-toolbar__layout-switch-list {
    border-inline-start-width: 1px;
    justify-content: flex-end;
    align-items: center;
    gap: 1rem;
    padding-inline: 1.25rem;
    display: flex
}

.collection-toolbar__button {
    opacity: .5;
    transition: opacity .2s
}

.collection-toolbar__button:hover,
.collection-toolbar__button.is-active {
    opacity: 1
}

@media screen and (min-width: 700px) {
    .collection-toolbar {
        flex-direction: row-reverse;
        justify-content: space-between
    }

    .collection-toolbar__button {
        padding-block: 1.125rem
    }

    .collection-toolbar__button-list {
        flex-direction: row-reverse;
        flex: none
    }

    .collection-toolbar__button-container {
        border-inline-start-width: 1px
    }

    .collection-toolbar__button-container>.collection-toolbar__button {
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        padding-inline: 2.875rem
    }

    .collection-toolbar__layout-switch-list {
        border-inline-width: 0 1px;
        padding-inline: 1.875rem
    }

    .collection-toolbar__products-count {
        position: absolute;
        inset-block-start: 50%;
        inset-inline-start: 50%;
        transform: translate(-50%, -50%)
    }
}

.facets .accordion-list .accordion:first-child {
    border-block-start-width: 0
}

.facets .accordion-list .accordion:first-child .accordion__toggle {
    -webkit-padding-before: 0;
    padding-block-start: 0
}

.facets .accordion-list .accordion:last-child {
    border-block-end-width: 0
}

.facets .accordion-list .accordion:last-child .accordion__content {
    -webkit-padding-after: 0;
    padding-block-end: 0
}

.active-facets {
    flex-wrap: wrap;
    align-items: center;
    gap: .625rem;
    display: flex
}

.removable-facet {
    font-size: var(--text-sm);
    border-width: 1px;
    align-items: center;
    -moz-column-gap: .375rem;
    column-gap: .375rem;
    padding: .375rem .625rem;
    display: flex
}

.facets-clear-all {
    -webkit-margin-start: .625rem;
    margin-inline-start: .625rem
}

@media screen and (min-width: 700px) {
    .removable-facet {
        font-size: var(--text-base);
        -moz-column-gap: .625rem;
        column-gap: .625rem;
        padding: .625rem .875rem
    }
}

@media screen and (min-width: 1000px) {
    .facets-sidebar {
        top: calc(var(--sticky-area-height) + var(--collection-toolbar-height, 0px) + 20px);
        width: var(--collection-sidebar-width);
        grid-column-end: -2;
        display: block;
        position: -webkit-sticky;
        position: sticky
    }
}

.collection-list {
    gap: var(--collection-list-gap, 0px);
    display: flex
}

.collection-list .collection-card {
    flex-basis: var(--collection-list-item-size, calc(100% / var(--collection-list-items-per-row) - var(--collection-list-gap, 0px) * (var(--collection-list-items-per-row) - 1) / var(--collection-list-items-per-row)))
}

.collection-list--text-outside {
    row-gap: 3rem
}

.collection-card {
    align-content: start;
    gap: 1.5rem;
    display: grid
}

.countdown {
    gap: var(--section-stack-gap);
    display: grid
}

.countdown__timer {
    text-transform: uppercase;
    text-align: center;
    grid: auto / auto-flow minmax(0, 1fr) auto;
    align-items: center;
    -moz-column-gap: .75rem;
    column-gap: .75rem;
    display: grid
}

.countdown__timer-item {
    display: grid
}

.countdown__timer-flip {
    --heading-letter-spacing: 0;
    justify-content: center;
    -moz-column-gap: 2px;
    column-gap: 2px;
    display: flex
}

.countdown__timer-flip::part(digit) {
    color: rgb(var(--countdown-timer-flip-text-color))
}

.countdown__timer-flip--background::part(digit) {
    background: rgb(var(--countdown-timer-flip-background));
    border-radius: .25rem;
    padding: .375rem .5rem
}

@media screen and (max-width: 699px) {
    .countdown__content {
        text-align: center
    }

    .countdown__timer {
        justify-content: center
    }
}

@media screen and (min-width: 700px) {
    .countdown {
        grid-template-columns: minmax(250px, 570px) -webkit-max-content;
        grid-template-columns: minmax(250px, 570px) max-content;
        justify-content: space-between;
        gap: 4rem;
        width: 100%
    }

    .countdown__timer-item {
        row-gap: .5rem
    }

    .countdown--reverse {
        grid-template-columns: -webkit-max-content minmax(250px, 570px);
        grid-template-columns: max-content minmax(250px, 570px)
    }

    .countdown--reverse .countdown__timer {
        order: -1
    }
}

@media screen and (min-width: 1000px) {
    .countdown__timer {
        -moz-column-gap: 1rem;
        column-gap: 1rem
    }
}

.countdown-condensed {
    -moz-column-gap: 2.25rem;
    column-gap: 2.25rem;
    justify-content: var(--countdown-condensed-justify-content, space-between);
    padding: 1rem var(--container-gutter);
    display: flex
}

.countdown-condensed__text {
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem 1.5rem;
    display: flex
}

.countdown-condensed__timer {
    font-family: var(--heading-font-family);
    font-weight: var(--heading-font-weight);
    font-style: var(--heading-font-style);
    letter-spacing: .2em;
    text-transform: uppercase;
    text-align: center;
    flex-shrink: 0;
    align-items: center;
    -moz-column-gap: .25rem;
    column-gap: .25rem;
    display: flex
}

.countdown-condensed__timer-item {
    display: grid
}

.countdown-condensed__timer-flip {
    font-size: .625rem;
    font-weight: bolder
}

.countdown-condensed__timer-unit {
    font-size: .5rem
}

@media screen and (max-width: 699px) {
    .countdown-condensed .h6 {
        font-size: .625rem
    }
}

@media screen and (min-width: 700px) {
    .countdown-condensed {
        -moz-column-gap: 5rem;
        column-gap: 5rem
    }

    .countdown-condensed__timer {
        -moz-column-gap: .75rem;
        column-gap: .75rem
    }

    .countdown-condensed__timer-flip {
        font-size: .75rem
    }

    .countdown-condensed__timer-unit {
        font-size: .625rem
    }
}

.footer {
    background: rgb(var(--background));
    background-image: var(--background-gradient);
    color: rgb(var(--text-color));
    -webkit-padding-before: var(--section-vertical-spacing);
    padding-block-start: var(--section-vertical-spacing);
    -webkit-padding-after: min(var(--section-vertical-spacing), 3rem);
    padding-block-end: min(var(--section-vertical-spacing), 3rem)
}

.footer__inner {
    row-gap: min(var(--section-vertical-spacing), 3rem);
    display: grid
}

.footer__block-list {
    justify-content: start;
    align-items: start;
    gap: min(var(--section-vertical-spacing), 2.5rem);
    display: grid
}

.footer__aside {
    text-align: center;
    justify-content: center;
    align-items: center;
    gap: 1.5rem;
    display: grid
}

.footer__aside .payment-methods {
    justify-content: center;
    max-width: 30rem
}

@media screen and (min-width: 700px) {
    .footer__block-list {
        justify-content: var(--footer-content-justify-items);
        flex-wrap: wrap;
        gap: 3rem;
        display: flex
    }

    .footer__block {
        flex: auto
    }

    .footer__block--links,
    .footer__block--image {
        flex-grow: 0;
        max-width: 14rem
    }

    .footer__block--newsletter,
    .footer__block--app {
        flex-basis: 14rem;
        max-width: 18rem
    }

    .footer__block--text {
        flex-basis: 14rem;
        max-width: 24rem
    }
}

@media screen and (min-width: 1000px) {
    .footer__aside {
        grid-auto-flow: column;
        justify-content: space-between
    }

    .footer__aside .payment-methods {
        justify-content: end
    }
}

@media screen and (min-width: 1150px) {
    .footer__block-list {
        justify-content: var(--footer-content-justify-items);
        -moz-column-gap: 3.75rem;
        column-gap: 3.75rem
    }
}

@media screen and (min-width: 1400px) {
    .footer__block-list {
        -moz-column-gap: 5rem;
        column-gap: 5rem
    }
}

.gift-card__image {
    max-width: 16.875rem;
    margin-inline: auto
}

.gift-card__redeem-info {
    padding: 1.5rem
}

.gift-card__save {
    place-items: center;
    gap: 1.5rem;
    display: grid
}

.gift-card__qr-code {
    width: 5rem;
    height: 5rem
}

@media screen and (min-width: 700px) {
    .gift-card__redeem-info {
        padding: 2rem
    }

    .gift-card__save {
        grid-auto-flow: column
    }
}

.faq {
    justify-content: center;
    align-items: start;
    -moz-column-gap: 3.75rem;
    column-gap: 3.75rem;
    display: flex
}

.faq__toc {
    align-content: start;
    justify-items: start;
    gap: .75rem;
    min-width: 150px;
    max-width: 300px;
    transition: inset-block-start .15s ease-in-out;
    display: grid;
    position: -webkit-sticky;
    position: sticky;
    inset-block-start: calc(var(--sticky-area-height) + 1.25rem)
}

.faq__toc-item {
    background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.35em) / 0 1px no-repeat;
    text-decoration: none;
    transition: background-size .3s ease-in-out
}

.faq__toc-item.is-active {
    background-size: 100% 1px
}

.faq__content {
    flex-basis: 650px
}

.faq__category {
    flex-wrap: wrap;
    align-items: center;
    -moz-column-gap: 1rem;
    column-gap: 1rem;
    scroll-margin-block-start: 1.25rem;
    display: flex
}

.faq__category+.accordion {
    -webkit-margin-before: 1.25rem;
    margin-block-start: 1.25rem
}

.accordion+.faq__category {
    -webkit-margin-before: 3rem;
    margin-block-start: 3rem
}

.featured-collections-navigation {
    grid-auto-columns: -webkit-max-content;
    grid-auto-columns: max-content;
    grid-auto-flow: column;
    justify-content: safe center;
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem;
    display: grid
}

.featured-collections-navigation>button:not(:only-child) {
    -webkit-padding-after: 2px;
    padding-block-end: 2px;
    position: relative
}

.featured-collections-navigation>button:not(:only-child):after {
    content: "";
    width: calc(100% - var(--heading-letter-spacing));
    height: 1px;
    transform-origin: var(--transform-origin-start);
    background: currentColor;
    transition: transform .3s;
    position: absolute;
    inset-block-end: 0;
    inset-inline-start: 0;
    transform: scaleX(0)
}

.featured-collections-navigation>button:not(:only-child)[aria-current=true]:after {
    transform: scaleX(1)
}

@media screen and (min-width: 700px) {
    .featured-collections-navigation {
        -moz-column-gap: 2.5rem;
        column-gap: 2.5rem
    }
}

.featured-collections-carousel {
    display: grid;
    position: relative
}

.featured-collections-carousel>* {
    grid-area: 1 / -1
}

.featured-collections-carousel__item {
    gap: var(--section-stack-gap);
    grid-template-columns: minmax(0, 1fr);
    display: grid
}

.featured-collections-carousel__item:not(.is-selected) {
    display: none
}

.header {
    --header-show-transparent-logo: 0;
    grid: var(--header-grid);
    justify-content: center;
    align-items: center;
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem;
    row-gap: var(--header-padding-block);
    box-shadow: 0 -1px rgb(var(--header-separation-border-color)) inset;
    -webkit-padding-before: var(--header-padding-block);
    padding-block-start: var(--header-padding-block);
    -webkit-padding-after: var(--header-padding-block);
    padding-block-end: var(--header-padding-block);
    -webkit-padding-start: var(--container-gutter);
    padding-inline-start: var(--container-gutter);
    -webkit-padding-end: var(--container-gutter);
    padding-inline-end: var(--container-gutter);
    transition: background .2s, color .2s, border .2s, box-shadow .2s, transform .15s ease-in-out;
    display: grid;
    position: relative
}

.header.is-hidden {
    transform: translateY(-100%)
}

.shopify-section--header:has(.header.is-hidden) {
    pointer-events: none
}

:has(.shopify-section:first-child [allow-transparent-header]):not(:has(.shopify-section--header~.shopify-section-group-header-group)) .header {
    -webkit-margin-after: calc(-1 * var(--header-height, 0px));
    margin-block-end: calc(-1 * var(--header-height, 0px))
}

:has(.shopify-section:first-child [allow-transparent-header]):not(:has(.shopify-section--header~.shopify-section-group-header-group)) .header:not(:hover, .is-solid, :has(.header__primary-nav [open], .header__secondary-nav [open], .header-search[open])) {
    --header-show-transparent-logo: 1;
    --header-separation-border-color: 0 0 0 / 0;
    --background: 0 0 0 / 0;
    --background-gradient: 0 0 0 / 0;
    --border-color: 0 0 0 / 0;
    --text-color: var(--header-transparent-header-text-color)
}

:has(.shopify-section:first-child [allow-transparent-header]):not(:has(.shopify-section--header~.shopify-section-group-header-group)) .header:not(:hover, .is-solid, :has(.header__primary-nav [open], .header__secondary-nav [open], .header-search[open])) .link-faded {
    color: currentColor;
    transition: none
}

.header__cart-dot {
    width: .5rem;
    height: .5rem;
    box-shadow: 0 0 0 2px rgb(var(--background));
    background-color: currentColor;
    border-radius: 100%;
    transition: transform .2s ease-in-out;
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: -.125rem;
    transform: scale(0)
}

.header__cart-dot.is-visible {
    transform: scale(1)
}

@media screen and (min-width: 700px) {
    .header {
        -moz-column-gap: 2.5rem;
        column-gap: 2.5rem
    }
}

.header__logo {
    grid-area: logo;
    justify-self: start;
    position: relative
}

.header__logo-image {
    width: var(--header-logo-width);
    max-width: 100%;
    height: auto
}

.header__logo-image:where(:not(:only-of-type)) {
    opacity: calc(1 - var(--header-show-transparent-logo));
    transition: opacity .2s
}

.header__logo-image--transparent {
    opacity: var(--header-show-transparent-logo);
    pointer-events: none;
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0
}

.header__logo-text {
    display: block
}

.header__primary-nav {
    flex-wrap: wrap;
    grid-area: primary-nav;
    align-items: center;
    gap: .625rem 1.25rem;
    display: flex
}

.header__primary-nav-item:before {
    content: attr(data-title);
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    height: 2px;
    transform-origin: var(--transform-origin-start);
    background: rgb(var(--text-color));
    color: #0000;
    font-size: var(--text-h6);
    font-family: var(--heading-font-family);
    font-weight: var(--heading-font-weight);
    font-style: var(--heading-font-style);
    letter-spacing: var(--heading-letter-spacing);
    text-transform: var(--heading-text-transform);
    pointer-events: none;
    transition: transform .2s ease-in-out;
    position: absolute;
    inset-block-end: 0;
    transform: scaleX(0)
}

.header__primary-nav-item:hover:before {
    transform: scaleX(1)
}

.header__primary-nav-item:has(.header__dropdown-menu):before {
    display: none
}

@media screen and (max-width: 699px) {
    .header__nav-icon {
        width: 1.375rem
    }
}

@media screen and (min-width: 1000px) {
    .header__primary-nav--center {
        justify-content: safe center
    }
}

@media screen and (min-width: 1150px) {
    .header__primary-nav {
        -moz-column-gap: 2.5rem;
        column-gap: 2.5rem
    }
}

.header__secondary-nav {
    flex-wrap: wrap;
    grid-area: secondary-nav;
    justify-content: end;
    justify-self: end;
    align-items: center;
    gap: .625rem .9rem;
    display: flex
}

.header__secondary-nav .localization-selectors:not(:only-child) {
    -webkit-margin-end: .625rem;
    margin-inline-end: .625rem
}

@media screen and (min-width: 700px) {
    .header__secondary-nav {
        -moz-column-gap: 1.25rem;
        column-gap: 1.25rem
    }
}

.header__dropdown-menu {
    background: rgb(var(--background));
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    min-width: 12.5rem;
    max-width: 17.5rem;
    color: rgb(var(--text-color));
    box-shadow: 2px 2px 6px rgb(var(--text-color) / .05);
    border-width: 0 1px 1px;
    padding-block: 1.125rem;
    position: absolute;
    inset-block-start: calc(100% - 2px)
}

.header__dropdown-menu:not(:has(.header__dropdown-menu)) {
    max-height: calc(100vh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 20px);
    overflow: auto
}

.header__dropdown-menu:before {
    content: "";
    width: 100%;
    height: 2px;
    transform-origin: var(--transform-origin-start);
    background: rgb(var(--text-color));
    transition: transform .25s ease-in-out 50ms;
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    transform: scaleX(0)
}

[aria-expanded=true]>.header__dropdown-menu:before {
    transform: scaleX(1)
}

.header__dropdown-menu :is(a, summary) {
    padding: .375rem 1.5625rem;
    display: block
}

.header__dropdown-menu .header__menu-disclosure {
    position: relative
}

.header__dropdown-menu--restrictable {
    max-height: calc(100vh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 40px);
    overflow-y: auto
}

.header__dropdown-menu .header__dropdown-menu {
    border-width: 1px;
    inset-block-start: calc(-1.125rem - 1px);
    inset-inline-start: 100%
}

.header__dropdown-menu .header__dropdown-menu:before {
    display: none
}

.header-search {
    z-index: -1;
    width: 100%;
    display: none;
    position: absolute;
    inset-block-start: 100%;
    inset-inline-start: 0
}

.header-search::part(overlay) {
    min-height: calc(100vh - var(--sticky-area-height));
    inset-block-start: var(--sticky-area-height)
}

.header-search::part(content) {
    max-height: calc(100vh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 1.25rem);
    background: rgb(var(--background));
    color: rgb(var(--text-color));
    overflow: auto
}

@supports (max-height: 100dvh) {
    .header-search::part(content) {
        max-height: min(var(--header-search-max-height, 100vh), 100dvh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 1.25rem)
    }
}

.header-search__form-control {
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    -moz-column-gap: .75rem;
    column-gap: .75rem;
    padding-block: .75rem;
    display: grid
}

.header-search__input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: none
}

.header-search__input:focus {
    outline: none
}

.header-search__input::-webkit-search-decoration {
    display: none
}

.header-search__input::-webkit-search-cancel-button {
    display: none
}

.header-search__input::-webkit-search-results-button {
    display: none
}

.header-search__input::-webkit-search-results-decoration {
    display: none
}

@media screen and (min-width: 700px) {
    .header-search__form-control {
        -moz-column-gap: 1.25rem;
        column-gap: 1.25rem;
        padding-block: 1.5rem
    }
}

.predictive-search {
    display: block
}

.predictive-search__no-results {
    text-align: center;
    padding-block: 2.5rem 4rem
}

.predictive-search__results {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.5rem;
    padding-block: 1.25rem 2rem;
    display: grid
}

.predictive-search__suggestions {
    grid-template-columns: minmax(0, 1fr);
    justify-items: start;
    gap: .75rem 1.5rem;
    display: grid
}

.predictive-search__suggestions mark {
    background: none;
    font-weight: bolder
}

.predictive-search__tabs::part(tab-list-scrollable) {
    scrollbar-width: none;
    -webkit-margin-start: calc(-1 * var(--distance-to-bleed));
    margin-inline-start: calc(-1 * var(--distance-to-bleed));
    -webkit-margin-end: calc(-1 * var(--distance-to-bleed));
    margin-inline-end: calc(-1 * var(--distance-to-bleed));
    -webkit-padding-start: var(--distance-to-bleed);
    padding-inline-start: var(--distance-to-bleed);
    -webkit-padding-end: var(--distance-to-bleed);
    padding-inline-end: var(--distance-to-bleed);
    display: flex;
    overflow: auto
}

.predictive-search__tabs::part(tab-list) {
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
    min-width: 100%
}

.predictive-search__category {
    border-block-end-width: 1px;
    -webkit-padding-after: .625rem;
    padding-block-end: .625rem
}

.predictive-search__products {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 1.25rem;
    display: grid
}

.predictive-search__blog-posts {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem 2.5rem;
    display: grid
}

.predictive-search__blog-posts .blog-post-card__info {
    row-gap: .75rem
}

.predictive-search__collections {
    align-items: start;
    gap: var(--container-gutter);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    display: grid
}

@media screen and (max-width: 699px) {
    .predictive-search__suggestions {
        grid: auto / auto-flow -webkit-max-content;
        grid: auto / auto-flow max-content;
        row-gap: 1.25rem
    }

    .predictive-search__products .horizontal-product-card__figure {
        max-width: 4.375rem
    }

    .predictive-search__blog-posts .blog-post-card {
        grid-template-columns: minmax(0, 160px) minmax(0, 1fr);
        align-items: center
    }
}

@media screen and (min-width: 700px) {
    .predictive-search__no-results {
        padding-block: 4.75rem 6.25rem
    }

    .predictive-search__results {
        padding-block: 1.5rem 3rem
    }

    .predictive-search__blog-posts {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .predictive-search__blog-posts .blog-post-card__category {
        font-size: .6875rem
    }
}

@media screen and (min-width: 1000px) {
    .predictive-search__results--with-suggestions {
        grid-template-columns: 250px minmax(0, 1fr)
    }

    .predictive-search__products {
        grid-template-columns: repeat(var(--product-list-items-per-row, 4), minmax(0, 1fr))
    }

    .predictive-search__blog-posts {
        grid-template-columns: repeat(var(--blog-post-list-items-per-row, 4), minmax(0, 1fr))
    }

    .predictive-search__collections {
        grid-template-columns: repeat(var(--collection-list-items-per-row), minmax(0, 1fr))
    }
}

.mega-menu {
    --mega-menu-gap: 2.5rem;
    --mega-menu-linklist-gap: 2.5rem;
    --mega-menu-promo-gap: 2rem;
    width: 100%;
    max-height: calc(100vh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 20px);
    justify-content: safe center;
    align-items: start;
    -moz-column-gap: var(--mega-menu-gap);
    column-gap: var(--mega-menu-gap);
    background: rgb(var(--background));
    color: rgb(var(--text-color));
    border-block-end-width: 1px;
    padding-block: 2.5rem;
    -webkit-padding-start: var(--container-gutter);
    padding-inline-start: var(--container-gutter);
    -webkit-padding-end: var(--container-gutter);
    padding-inline-end: var(--container-gutter);
    display: flex;
    position: absolute;
    inset-block-start: 100%;
    inset-inline-start: 0;
    overflow-y: auto
}

.mega-menu--reverse {
    flex-direction: row-reverse
}

.mega-menu--reverse .mega-menu__promo {
    justify-content: flex-start
}

.mega-menu__linklist {
    gap: var(--mega-menu-linklist-gap);
    flex-wrap: wrap;
    flex: 0 auto;
    display: flex
}

.mega-menu__linklist>* {
    max-width: 280px
}

.mega-menu__promo {
    justify-content: flex-end;
    -moz-column-gap: var(--mega-menu-promo-gap);
    column-gap: var(--mega-menu-promo-gap);
    flex: 0 auto;
    display: flex
}

.mega-menu__promo>* {
    flex: 315px;
    min-width: 240px;
    max-width: 315px
}

@media screen and (min-width: 1400px) {
    .mega-menu {
        --mega-menu-gap: 6.25rem;
        --mega-menu-linklist-gap: 2.5rem 6.25rem
    }

    .mega-menu:has(.mega-menu__linklist>:nth-child(5)) {
        --mega-menu-linklist-gap: 2.5rem 4rem
    }
}

.header-sidebar {
    --header-linklist-padding-block: 1rem
}

.header-sidebar::part(close-button) {
    opacity: 1
}

.header-sidebar::part(header) {
    -webkit-border-after: none;
    border-block-end: none
}

.header-sidebar::part(content) {
    box-sizing: border-box;
    overflow-x: hidden
}

.header-sidebar::part(panel-list) {
    position: relative
}

.header-sidebar__scroller {
    -webkit-padding-after: var(--drawer-body-padding-block);
    padding-block-end: var(--drawer-body-padding-block);
    -webkit-padding-start: var(--drawer-body-padding-inline);
    padding-inline-start: var(--drawer-body-padding-inline);
    -webkit-padding-end: var(--drawer-body-padding-inline);
    padding-inline-end: var(--drawer-body-padding-inline);
    overflow-y: auto
}

.header-sidebar__linklist-button {
    text-align: start;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    -webkit-padding-before: calc(var(--header-linklist-padding-block) / 2);
    padding-block-start: calc(var(--header-linklist-padding-block) / 2);
    -webkit-padding-after: calc(var(--header-linklist-padding-block) / 2);
    padding-block-end: calc(var(--header-linklist-padding-block) / 2);
    transition: color .2s;
    display: flex
}

@media screen and (pointer: fine) {
    .header-sidebar__main-panel li:has([aria-expanded=true])~li .header-sidebar__linklist-button {
        color: rgb(var(--text-color) / .65)
    }

    .header-sidebar__main-panel li:has(~li [aria-expanded=true]):not(:has([aria-expanded=true])) .header-sidebar__linklist-button {
        color: rgb(var(--text-color) / .65)
    }
}

.header-sidebar__sub-panel li:has([aria-expanded=true])~li .header-sidebar__linklist-button {
    color: rgb(var(--text-color) / .65)
}

.header-sidebar__sub-panel li:has(~li [aria-expanded=true]):not(:has([aria-expanded=true])) .header-sidebar__linklist-button {
    color: rgb(var(--text-color) / .65)
}

.header-sidebar__sub-panel li:has([aria-expanded=true]) .header-sidebar__linklist-button {
    color: rgb(var(--text-color)) !important
}

.header-sidebar__back-button {
    width: 100%;
    border-block-end-width: 1px;
    -webkit-margin-after: 1rem;
    margin-block-end: 1rem;
    -webkit-padding-before: var(--header-linklist-padding-block);
    padding-block-start: var(--header-linklist-padding-block);
    -webkit-padding-after: 1rem;
    padding-block-end: 1rem
}

.header-sidebar__back-button.is-divided {
    -webkit-margin-after: .5rem;
    margin-block-end: .5rem
}

.header-sidebar__nested-linklist {
    border-inline-start-width: 1px;
    row-gap: .75rem;
    margin-block: 2px 1.125rem;
    -webkit-margin-start: .5rem;
    margin-inline-start: .5rem;
    -webkit-padding-start: 1.5rem;
    padding-inline-start: 1.5rem;
    display: grid
}

.header-sidebar__main-panel {
    background-color: rgb(var(--background));
    background-image: var(--background-gradient);
    grid-template-rows: minmax(0, 1fr);
    grid-template-columns: minmax(0, 1fr);
    grid-auto-columns: -webkit-max-content;
    grid-auto-columns: max-content;
    height: 100%;
    display: grid
}

.header-sidebar__footer {
    position: relative
}

.header-sidebar__footer:before {
    content: "";
    background: linear-gradient(transparent, rgb(var(--background)));
    width: 100%;
    height: 2.5rem;
    position: absolute;
    inset-block-end: 100%;
    inset-inline-start: 0
}

.header-sidebar__footer>* {
    padding-block: 1.25rem;
    -webkit-padding-start: var(--drawer-footer-padding-inline);
    padding-inline-start: var(--drawer-footer-padding-inline);
    -webkit-padding-end: var(--drawer-footer-padding-inline);
    padding-inline-end: var(--drawer-footer-padding-inline)
}

.header-sidebar__footer .localization-selectors {
    border-block-start-width: 1px;
    justify-content: flex-start;
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem
}

.header-sidebar__collapsible-panel {
    height: 100%;
    width: var(--drawer-max-width);
    background-color: rgb(var(--background));
    background-image: var(--background-gradient);
    display: none;
    position: absolute;
    inset-block-start: 0
}

.header-sidebar__promo {
    grid-auto-flow: column;
    gap: 2rem 1.25rem;
    -webkit-margin-before: 1.25rem;
    margin-block-start: 1.25rem;
    display: flex
}

.header-sidebar__promo>* {
    min-width: 12.5rem
}

.header-sidebar__promo>*:only-child {
    min-width: 100%
}

.header-sidebar__linklist.divide-y .header-sidebar__linklist-button {
    -webkit-padding-before: var(--header-linklist-padding-block);
    padding-block-start: var(--header-linklist-padding-block);
    -webkit-padding-after: var(--header-linklist-padding-block);
    padding-block-end: var(--header-linklist-padding-block)
}

.header-sidebar__linklist.divide-y .header-sidebar__back-button {
    -webkit-padding-after: var(--header-linklist-padding-block);
    padding-block-end: var(--header-linklist-padding-block)
}

.header-sidebar__linklist.divide-y .header-sidebar__nested-linklist {
    -webkit-margin-after: calc(.5rem + var(--header-linklist-padding-block));
    margin-block-end: calc(.5rem + var(--header-linklist-padding-block))
}

.header-sidebar__linklist.divide-y .header-sidebar__promo {
    -webkit-margin-before: .75rem;
    margin-block-start: .75rem
}

@media screen and (min-width: 700px) {
    .header-sidebar {
        --header-linklist-padding-block: 1.25rem
    }
}

@media screen and (min-width: 1000px) {
    .header-sidebar::part(panel-list) {
        position: static
    }

    .header-sidebar::part(content) {
        overflow-x: visible
    }

    .header-sidebar:has(.header-sidebar__collapsible-panel[aria-activedescendant])::part(content) {
        -webkit-border-end: 1px solid rgb(var(--border-color));
        border-inline-end: 1px solid rgb(var(--border-color))
    }

    .header-sidebar__main-panel {
        z-index: 1;
        position: relative
    }

    .header-sidebar__collapsible-panel .header-sidebar__scroller {
        width: 100%;
        inset-block: min(var(--header-height), 5rem) 0;
        position: absolute
    }

    .header-sidebar__promo {
        flex-direction: column
    }

    .header-sidebar__promo>* {
        min-width: 100%
    }
}

.image-with-text {
    display: grid;
    overflow: hidden
}

.image-with-text>.prose {
    box-sizing: content-box;
    max-width: var(--image-with-text-content-max-width);
    margin-block: 1.5rem;
    -webkit-padding-start: var(--container-gutter);
    padding-inline-start: var(--container-gutter);
    -webkit-padding-end: var(--container-gutter);
    padding-inline-end: var(--container-gutter)
}

.image-with-text>:is(svg, img) {
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%;
    height: 100%
}

@media screen and (max-width: 699px) {
    .image-with-text>.prose {
        margin-inline: auto
    }
}

@media screen and (min-width: 700px) {
    .image-with-text {
        --image-with-text-gap: 2.5rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: center
    }

    .image-with-text>.prose {
        -webkit-padding-start: var(--image-with-text-gap);
        padding-inline-start: var(--image-with-text-gap)
    }

    .image-with-text:not(.image-with-text--reverse) picture {
        -webkit-margin-start: auto;
        margin-inline-start: auto
    }

    .image-with-text--reverse>:is(picture, svg, img) {
        order: 9999
    }

    .image-with-text--reverse>.prose {
        -webkit-margin-start: auto;
        margin-inline-start: auto;
        -webkit-padding-end: var(--image-with-text-gap);
        padding-inline-end: var(--image-with-text-gap)
    }
}

@media screen and (min-width: 1000px) {
    .image-with-text {
        --image-with-text-gap: 6rem
    }
}

.image-with-text-block>:not(img, svg, picture) {
    background: rgb(var(--background));
    padding: 2.375rem 1.25rem;
    box-shadow: 0 1px 20px #3636364d
}

@media screen and (min-width: 700px) {
    .image-with-text-block>:not(img, svg, picture) {
        padding: 3rem 1rem
    }
}

.image-with-text-block--parallax {
    min-height: var(--content-over-media-height, auto);
    aspect-ratio: var(--image-with-text-block-aspect-ratio);
    transform: unset;
    -webkit-clip-path: inset(0);
    clip-path: inset(0)
}

@media (prefers-reduced-motion: no-preference) {

    .image-with-text-block--parallax>svg,
    .image-with-text-block--parallax>picture img {
        pointer-events: none;
        min-height: 100vh;
        position: fixed;
        top: 0;
        left: 0
    }

    @supports (min-height: 100lvh) {
        :is(.image-with-text-block--parallax>svg, .image-with-text-block--parallax>picture img) {
            min-height: 100lvh
        }
    }
}

.images-with-text-scroll {
    --sticky-area-height: calc(var(--announcement-bar-is-sticky, 0) * var(--announcement-bar-height, 0px) + var(--header-is-sticky, 0) * var(--header-height, 0px));
    align-items: start;
    display: grid;
    position: relative
}

.images-with-text-scroll:before {
    content: "";
    background: rgb(var(--images-with-text-scroll-overlay));
    z-index: 1;
    pointer-events: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.images-with-text-scroll__image-background,
.images-with-text-scroll__container {
    grid-area: 1 / -1
}

.images-with-text-scroll__image-background {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    width: 100%;
    height: 100%;
    max-height: 100vh;
    position: -webkit-sticky;
    position: sticky;
    inset-block-start: 0
}

.images-with-text-scroll__container {
    z-index: 1;
    place-items: start center;
    row-gap: 2rem;
    -webkit-padding-before: var(--section-vertical-spacing);
    padding-block-start: var(--section-vertical-spacing);
    -webkit-padding-after: var(--section-vertical-spacing);
    padding-block-end: var(--section-vertical-spacing);
    display: grid
}

.images-with-text-scroll__item {
    display: contents
}

.images-with-text-scroll__item:not(:first-child)>.images-with-text-scroll__image {
    opacity: 0
}

.images-with-text-scroll__image {
    grid-area: 1 / 1;
    align-self: center
}

.images-with-text-scroll__text {
    text-align: center;
    grid-area: 2 / 1;
    max-width: 375px
}

@media screen and (min-width: 700px) {
    .images-with-text-scroll__container {
        row-gap: 3rem
    }
}

@media screen and (max-width: 999px) {
    .images-with-text-scroll__item:not(.is-selected) {
        visibility: hidden
    }

    .images-with-text-scroll__image {
        width: min(56vw, 27.5rem)
    }
}

@media screen and (min-width: 1000px) {
    .images-with-text-scroll {
        min-height: calc(100vh - var(--sticky-area-height))
    }

    .images-with-text-scroll__container {
        --image-width: min(50vw - var(--container-gutter), 575px);
        --image-height: min(var(--image-width), var(--image-width) / var(--images-with-text-scroll-master-image-ratio));
        --content-padding: calc((100vh - var(--image-height) - var(--sticky-area-height)) / 2);
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: minmax(0, 1fr);
        align-items: center;
        -webkit-padding-before: var(--content-padding);
        padding-block-start: var(--content-padding);
        -webkit-padding-after: var(--content-padding);
        padding-block-end: var(--content-padding)
    }

    .images-with-text-scroll__image {
        height: var(--image-height);
        -o-object-fit: contain;
        object-fit: contain;
        -o-object-position: center;
        object-position: center;
        position: -webkit-sticky;
        position: sticky;
        inset-block-start: calc(var(--content-padding) + var(--sticky-area-height))
    }

    .images-with-text-scroll__text {
        text-align: var(--images-with-text-scroll-text-alignment);
        grid-area: auto / 2
    }

    .images-with-text-scroll--reverse .images-with-text-scroll__image {
        grid-column: 2
    }

    .images-with-text-scroll--reverse .images-with-text-scroll__text {
        grid-column: 1
    }
}

.logo-list {
    grid: var(--logo-list-grid);
    justify-content: safe center;
    gap: var(--logo-list-gap);
    display: grid
}

.logo-list__item {
    outline: 1px solid rgb(var(--logo-list-item-border-color));
    place-items: center;
    padding: 1.25rem;
    display: grid
}

@media screen and (min-width: 700px) {
    .logo-list__item {
        padding: 2rem 1.5rem
    }
}

.media-grid {
    --media-grid-column-count: 2;
    align-items: start;
    gap: var(--media-grid-gap);
    grid: auto-flow dense var(--media-grid-row-height) / repeat(var(--media-grid-column-count), minmax(0, 1fr));
    display: grid
}

.media-grid__item {
    grid-area: span min(2, var(--media-grid-item-row-span)) / span 2;
    height: 100%;
    container-type: inline-size
}

.media-grid__item>* {
    height: 100%
}

@media screen and (min-width: 700px) {
    .media-grid {
        --media-grid-column-count: 12
    }

    .media-grid__item {
        grid-area: span var(--media-grid-item-row-span) / span var(--media-grid-item-column-span)
    }
}

.multi-column {
    grid: var(--multi-column-grid);
    -moz-column-gap: var(--multi-column-gap);
    column-gap: var(--multi-column-gap);
    row-gap: var(--section-stack-gap);
    justify-content: var(--multi-column-content-alignment);
    display: grid
}

.multi-column__item {
    align-content: start;
    gap: 2rem;
    display: grid
}

.multi-column__item--overlap {
    gap: 0
}

.multi-column__item--overlap>.prose {
    isolation: isolate;
    -webkit-margin-before: -.875rem;
    margin-block-start: -.875rem
}

.multiple-media-with-text {
    --multiple-media-with-text-gap: 2rem;
    grid: var(--multiple-media-with-text-grid);
    gap: var(--multiple-media-with-text-gap);
    display: grid
}

.multiple-media-with-text__media-wrapper {
    grid-area: media-wrapper;
    grid: var(--multiple-media-with-text-media-grid);
    -moz-column-gap: var(--multiple-media-with-text-media-gap);
    column-gap: var(--multiple-media-with-text-media-gap);
    display: grid
}

.multiple-media-with-text__media-wrapper>* {
    grid-row: 1 / -1
}

.multiple-media-with-text__content-wrapper {
    grid-area: content-wrapper
}

@media screen and (min-width: 1000px) {
    .multiple-media-with-text {
        --multiple-media-with-text-gap: 2rem 4rem
    }
}

@media screen and (min-width: 1150px) {
    .multiple-media-with-text {
        --multiple-media-with-text-gap: 2rem 7.5rem
    }
}

.multiple-media-with-text--overlap .multiple-media-with-text__media-wrapper>:first-child {
    grid-column: 1 / 3
}

.multiple-media-with-text--overlap .multiple-media-with-text__media-wrapper>:nth-child(2) {
    grid-column: 2 / 4
}

@media screen and (min-width: 700px) {
    .multiple-media-with-text--overlap.multiple-media-with-text--reverse .multiple-media-with-text__media-wrapper>:first-child {
        grid-column: 2 / 4
    }

    .multiple-media-with-text--overlap.multiple-media-with-text--reverse .multiple-media-with-text__media-wrapper>:nth-child(2) {
        grid-column: 1 / 3
    }
}

@media screen and (min-width: 700px) {
    .newsletter .form {
        width: 35rem
    }
}

@media screen and (min-width: 700px) {
    .newsletter-popup {
        width: 23.75rem;
        inset-inline-start: auto
    }
}

.password {
    position: relative
}

.password__inner {
    isolation: isolate;
    align-content: space-between;
    row-gap: 3rem;
    min-height: 100vh;
    padding-block: 1.6rem;
    display: grid
}

@supports (height: 100dvh) {
    .password__inner {
        min-height: 100dvh
    }
}

.password__header {
    justify-items: center;
    display: grid
}

.password__header>* {
    grid-area: 1 / -1
}

.password__password-button {
    -webkit-margin-start: auto;
    margin-inline-start: auto
}

.password__block-list {
    justify-self: center;
    row-gap: .625rem;
    width: min(100%, 30rem);
    display: grid
}

.password__content,
.password__social {
    padding: 1.25rem
}

.password__social {
    display: grid
}

.password__social .social-media {
    justify-content: center
}

.password__footer {
    flex-wrap: wrap;
    justify-content: center;
    gap: .75rem;
    display: flex
}

@media screen and (min-width: 700px) {
    .password__content {
        padding: 2.5rem
    }

    .password__footer {
        justify-content: space-between
    }
}

.prev-next-blog-posts {
    gap: 3.125rem;
    display: grid
}

@media screen and (min-width: 700px) {
    .prev-next-blog-posts {
        grid: auto / auto-flow minmax(-webkit-min-content, 31.25rem);
        grid: auto / auto-flow minmax(min-content, 31.25rem);
        justify-content: center;
        gap: 1.875rem
    }
}

@media screen and (min-width: 1150px) {
    .prev-next-blog-posts {
        gap: 3.75rem
    }
}

@media screen and (min-width: 700px) {
    .privacy-banner {
        width: 31.25rem
    }
}

.shopify-section--main-product .section-spacing {
    -webkit-padding-before: 0;
    padding-block-start: 0
}

.product {
    grid: var(--product-grid, none);
    align-items: start;
    gap: var(--product-gap, 1.875rem);
    display: grid
}

@media screen and (min-width: 1000px) {
    .shopify-section--main-product .section-spacing {
        -webkit-padding-before: var(--container-gutter);
        padding-block-start: var(--container-gutter)
    }

    .product {
        --product-gap: 3.5rem
    }
}

@media screen and (min-width: 1150px) {
    .product {
        --product-gap: 5rem
    }
}

.product-gallery {
    --product-gallery-gap: 1.5rem;
    --product-gallery-thumbnail-list-gap: 1rem .5rem;
    --product-gallery-thumbnail-size: 3.5rem;
    flex-direction: var(--product-gallery-flex-direction, column);
    align-items: start;
    gap: var(--product-gallery-gap) var(--product-gap, 0px);
    grid-area: product-gallery;
    display: flex;
    position: relative
}

.product-gallery__zoom-button {
    z-index: 1;
    transition: opacity .2s, visibility .2s;
    position: absolute;
    inset-block-start: 1.25rem;
    inset-inline-end: 0
}

.product-gallery__zoom-button--hidden {
    opacity: 0;
    visibility: hidden
}

.product-gallery__image-list {
    row-gap: var(--product-gallery-gap);
    grid-auto-rows: -webkit-max-content;
    grid-auto-rows: max-content;
    grid-auto-columns: minmax(0, 1fr);
    width: 100%;
    display: grid
}

.product-gallery__carousel {
    grid: var(--product-gallery-carousel-grid, auto / auto-flow 100%);
    align-items: start;
    gap: var(--product-gallery-carousel-gap, 1.5rem min(1.5rem, var(--container-gutter)));
    -ms-scroll-snap-type: var(--product-gallery-carousel-scroll-snap-type, x mandatory);
    scroll-snap-type: var(--product-gallery-carousel-scroll-snap-type, x mandatory);
    display: grid;
    position: relative
}

.product-gallery[allow-zoom] .product-gallery__media {
    cursor: var(--cursor-zoom-in-svg-url) 18 18, zoom-in
}

.product-gallery__media>* {
    width: 100%
}

.product-gallery__thumbnail-list {
    flex-shrink: 0;
    max-width: 100%;
    position: relative
}

.product-gallery__thumbnail-scroller {
    grid-auto-columns: var(--product-gallery-thumbnail-size);
    grid-auto-flow: var(--product-gallery-thumbnail-list-grid-auto-flow, column);
    align-content: start;
    align-items: start;
    gap: var(--product-gallery-thumbnail-list-gap);
    max-height: var(--product-gallery-thumbnail-list-max-height, none);
    -ms-scroll-snap-type: both mandatory;
    scroll-snap-type: both mandatory;
    -ms-scroll-chaining: none;
    overscroll-behavior: contain;
    scrollbar-width: none;
    grid-template-columns: none;
    display: grid;
    position: relative;
    overflow: auto
}

.product-gallery__thumbnail-scroller::-webkit-scrollbar {
    display: none
}

.product-gallery__thumbnail {
    border: 1px solid #0000;
    padding: 1px;
    transition: border-color .1s;
    position: relative
}

.product-gallery__thumbnail[aria-current=true] {
    border-color: currentColor
}

.product-gallery__media-badge {
    position: absolute;
    inset-block-start: 3px;
    inset-inline-end: 3px
}

@media screen and (max-width: 999px) {
    .product-gallery__carousel-with-arrows {
        align-items: center;
        display: flex
    }

    .product-gallery__carousel-with-arrows .product-gallery__media {
        width: 45vw;
        margin-inline: auto
    }
}

@media screen and (min-width: 1000px) {
    .product-gallery__thumbnail-list {
        position: -webkit-sticky;
        position: sticky;
        inset-block-start: calc(var(--sticky-area-height) + 20px)
    }

    .product-gallery__media {
        scroll-margin-block-start: 1.25rem
    }
}

.product-info {
    --product-info-gap: 1rem;
    z-index: 2;
    grid-area: product-info
}

.product-info__block-list>:not(:nth-child(1 of:not(:empty))) {
    -webkit-margin-before: var(--product-info-gap);
    margin-block-start: var(--product-info-gap)
}

.product-info__block-list>:not(:last-child) {
    -webkit-margin-after: var(--product-info-gap);
    margin-block-end: var(--product-info-gap)
}

.product-info__block-item:empty {
    display: none
}

.product-info__block-item:is([data-block-type=vendor], [data-block-type=title], [data-block-type=sku], [data-block-type=price]) {
    --product-info-gap: .5rem
}

.product-info__block-group:has(.product-info__block-item:is([data-block-type=vendor], [data-block-type=title], [data-block-type=sku], [data-block-type=price])) {
    --product-info-gap: .5rem
}

.product-info__block-item:is([data-block-type=variant-picker], [data-block-type=product-variations], [data-block-type=separator], [data-block-type=description], [data-block-type=text], [data-block-type=liquid], [data-block-type=share-buttons]) {
    --product-info-gap: 1.5rem
}

.product-info__block-group:has(.product-info__block-item:is([data-block-type=variant-picker], [data-block-type=product-variations], [data-block-type=separator], [data-block-type=description], [data-block-type=text], [data-block-type=liquid], [data-block-type=share-buttons])) {
    --product-info-gap: 1.5rem
}

.product-info__block-item:is([data-block-type=inventory], [data-block-type=buy-buttons], [data-block-type=pickup-availability], [data-block-type=more-information], [data-block-type=offers]) {
    --product-info-gap: 2rem
}

.product-info__block-group:has(.product-info__block-item:is([data-block-type=inventory], [data-block-type=buy-buttons], [data-block-type=pickup-availability], [data-block-type=more-information], [data-block-type=offers])) {
    --product-info-gap: 2rem
}

.product-info__block-item[data-block-type=complementary-products] {
    --product-info-gap: 3rem
}

.product-info__block-group:has(.product-info__block-item[data-block-type=complementary-products]) {
    --product-info-gap: 3rem
}

@media screen and (max-width: 699px) {
    .product-info--center :is([data-block-type=vendor], [data-block-type=title], [data-block-type=sku], [data-block-type=price]) {
        text-align: center
    }

    .product-info--center :is(.badge-list, .price-list, .rating-badge) {
        justify-content: center
    }

    .product-info--center .text-with-rating {
        flex-direction: column;
        justify-content: center
    }
}

@media screen and (min-width: 1000px) {
    .product-info {
        position: -webkit-sticky;
        position: sticky;
        inset-block-start: calc(var(--sticky-area-height) + 20px)
    }
}

.product-content-below-gallery {
    grid-area: product-content
}

.product-content-below-gallery :is(product-recommendations:not(:first-child)) {
    -webkit-margin-before: max(48px, var(--product-gap, 0px));
    margin-block-start: max(48px, var(--product-gap, 0px))
}

.product-content-below-gallery :is(product-recommendations:not(:last-child)) {
    -webkit-margin-after: max(48px, var(--product-gap, 0px));
    margin-block-end: max(48px, var(--product-gap, 0px))
}

.product-content-below-gallery__description:not(:last-child) {
    -webkit-margin-after: 1.25rem;
    margin-block-end: 1.25rem
}

.product-info__more-info {
    border-block-width: 1px;
    justify-content: space-between;
    align-items: center;
    padding: .9375rem;
    display: flex
}

.product-info__more-info>svg {
    transition: transform .2s ease-in-out
}

@media screen and (pointer: fine) {
    .product-info__more-info:hover>svg {
        transform: translate(5px)
    }
}

.variant-picker .popover {
    --popover-block-offset: .5rem;
    --popover-body-padding-inline: 1.25rem;
    width: 100%
}

.variant-picker .popover::part(content) {
    width: 100%;
    max-width: none
}

@media (scripting: none) {
    .variant-picker__option {
        display: none
    }
}

.buy-buttons {
    row-gap: 1rem;
    display: grid
}

.pickup-location {
    align-items: start;
    gap: .25rem;
    display: grid
}

.pickup-location+.pickup-location {
    -webkit-padding-before: 1rem;
    padding-block-start: 1rem
}

.product-offers .page-dots {
    -webkit-padding-after: 1.5rem;
    padding-block-end: 1.5rem
}

.product-offers__item {
    padding: 1.5rem
}

.product-offers__list--carousel {
    grid: auto / auto-flow 100%;
    display: grid
}

.complementary-products {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 1.875rem;
    max-width: 40rem;
    margin-inline: auto;
    display: grid
}

.complementary-products__header {
    text-align: center;
    justify-content: center;
    align-items: center;
    display: flex
}

.complementary-products__header--align-start {
    text-align: start;
    justify-content: space-between
}

.complementary-products__product-list {
    gap: 1.25rem;
    display: grid;
    position: relative
}

.complementary-products__product-list--carousel {
    grid: auto / auto-flow 100%
}

@media screen and (max-width: 699px) {
    .complementary-products__product-list--carousel .product-card__figure {
        max-width: 11.25rem;
        margin-inline: auto
    }
}

@media screen and (min-width: 700px) {
    .complementary-products {
        row-gap: 1rem
    }

    .complementary-products__header {
        text-align: start;
        justify-content: space-between
    }
}

.product-sticky-bar {
    width: 100%;
    opacity: 0;
    visibility: hidden;
    z-index: 3;
    transition: opacity .2s, visibility .2s, inset-block .15s ease-in-out;
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    background: #fff;
    padding: 0
}

.sticky_button_area .buy-buttons .button {
    background: #fc0;
    border-color: #fc0;
    color: #703117;
    border-radius: 8px;
    width: 100%;
    font-weight: 700
}

.sticky_button_area .wishlist_area {
    text-align: center
}

.sticky_button_area {
    width: 100%;
    box-sizing: border-box;
    padding: 10px;
    display: grid;
    grid-template-columns: auto 50px;
    align-items: center;
    gap: 10px
}

.sticky_button_area .swym-button.swym-add-to-wishlist-view-product {
    font-family: swym-font !important;
    height: 40px;
    width: 40px;
    border: 1px solid #713117;
    border-radius: 50%
}

.sticky_button_area .swym-added.swym-add-to-wishlist-view-product:after {
    color: #713117 !important
}

.sticky_button_area .swym-add-to-wishlist-view-product:after {
    color: #713117 !important
}

.product-sticky-bar .product-sticky-bar__info {
    display: none
}

.product-sticky-bar.is-visible {
    bottom: 76px;
    visibility: visible;
    opacity: 1
}

.product-sticky-bar__info img {
    width: 3.75rem
}

@media screen and (min-width: 700px) {
    .product-sticky-bar {
        display: none !important
    }
}

@media screen and (max-width: 699px) {
    .quick-order-list__table {
        display: block
    }

    .quick-order-list__table-head th:nth-child(2),
    .quick-order-list__table-head th:nth-child(3),
    .quick-order-list__table-body td:nth-child(2),
    .quick-order-list__table-body td:nth-child(3) {
        display: none
    }

    .quick-order-list__table-foot {
        --table-foot-cell-padding-inline: 0px;
        display: block
    }

    .quick-order-list__table-foot tr {
        flex-direction: column-reverse;
        display: flex
    }

    .quick-order-list__table-foot td:first-child {
        padding-block: .125rem 0
    }

    .quick-order-list__variant-image {
        align-self: start
    }
}

@media screen and (min-width: 700px) {
    .quick-order-list__table {
        --table-cell-padding-block: .625rem;
        --table-foot-cell-padding-block: 1.5rem
    }

    .quick-order-list__table-body tr:first-child {
        --table-cell-padding-block: .75rem
    }

    .quick-order-list__table-body tr:not(:only-child):last-child td {
        -webkit-padding-after: 1.5rem;
        padding-block-end: 1.5rem
    }

    .quick-order-list__table-body tr:first-child+tr td {
        -webkit-padding-before: 0;
        padding-block-start: 0
    }

    .quick-order-list__table-body tr~tr td:first-child {
        -webkit-padding-start: 88px;
        padding-inline-start: 88px
    }

    .quick-order-list__table-body tr~tr td:not(:has(img)):first-child {
        -webkit-padding-start: 20px;
        padding-inline-start: 20px
    }

    .quick-order-list__table-foot {
        background: rgb(var(--background));
        box-shadow: 0 -.5px rgb(var(--border-color));
        position: -webkit-sticky;
        position: sticky;
        inset-block-end: 0
    }

    .quick-order-list__quantity-actions {
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
        align-items: center;
        -moz-column-gap: .625rem;
        column-gap: .625rem;
        display: grid
    }

    .quick-order-list__quantity-selector {
        grid-column: 2;
        grid-template-columns: minmax(0, 1fr);
        row-gap: .5rem;
        display: grid
    }

    .quick-order-list__remove-variant {
        justify-self: start;
        -webkit-margin-start: .625rem;
        margin-inline-start: .625rem
    }
}

.quantity-breaks-table {
    list-style: none
}

.quantity-breaks-table li {
    padding-block: .5rem
}

.quantity-breaks-table li:last-child {
    -webkit-padding-after: 0;
    padding-block-end: 0
}

@media screen and (min-width: 1000px) {
    .popover--quantity-breaks {
        inset-block-start: -1rem;
        inset-inline-end: 1.5rem
    }
}

.scrolling-content {
    text-align: start;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: block;
    position: relative;
    overflow: hidden
}

.scrolling-content[direction=right] {
    text-align: end
}

.scrolling-content::part(scroller) {
    min-width: -webkit-max-content;
    min-width: -moz-max-content;
    min-width: max-content;
    display: inline-flex;
    position: relative
}

.scrolling-content__item {
    flex-shrink: 0;
    align-items: center;
    display: flex
}

.scrolling-content__item>* {
    -webkit-margin-start: calc(var(--scrolling-content-content-gap) / 2);
    margin-inline-start: calc(var(--scrolling-content-content-gap) / 2);
    -webkit-margin-end: calc(var(--scrolling-content-content-gap) / 2);
    margin-inline-end: calc(var(--scrolling-content-content-gap) / 2)
}

.scrolling-content__image>img {
    max-width: 1.5em
}

.main-search-form {
    min-width: 18.75rem
}

.main-search__linklist {
    text-align: center;
    max-width: 25rem;
    margin-inline: auto
}

.shop-the-look__carousel {
    z-index: 2;
    grid: auto / auto-flow 100%;
    align-items: start;
    gap: .625rem;
    display: grid;
    position: relative;
    overflow: visible
}

.shop-the-look__carousel.is-expanded {
    overflow: hidden
}

.shop-the-look__image-wrapper {
    position: relative;
    overflow: hidden
}

.shop-the-look__hot-spot-list {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0
}

.shop-the-look__hot-spot {
    --hot-spot-size: 1rem;
    top: calc(var(--shop-the-look-hot-spot-top) - (var(--hot-spot-size) / 2));
    left: calc(var(--shop-the-look-hot-spot-left) - (var(--hot-spot-size) / 2));
    width: var(--hot-spot-size);
    height: var(--hot-spot-size);
    border-radius: var(--rounded-full);
    transition: transform .2s ease-in-out;
    position: absolute
}

.shop-the-look__hot-spot:after {
    --hot-spot-after-size: calc(var(--hot-spot-size) * 2.5);
    content: "";
    top: calc(50% - var(--hot-spot-after-size) / 2);
    left: calc(50% - var(--hot-spot-after-size) / 2);
    width: var(--hot-spot-after-size);
    height: var(--hot-spot-after-size);
    background: radial-gradient(50% 50% at 50% 50%, rgb(var(--background) / 0), rgb(var(--background) / .3));
    border-radius: var(--rounded-full);
    -webkit-animation: 2s ease-in-out infinite alternate ping;
    animation: 2s ease-in-out infinite alternate ping;
    position: absolute
}

.shop-the-look__hot-spot[aria-current=true] {
    transform: scale(1.3)
}

.shop-the-look__item-carousel {
    grid: auto / auto-flow 100%;
    justify-items: center;
    display: grid;
    position: relative
}

.shop-the-look__item {
    position: relative
}

.shop-the-look__popover .product-card__figure {
    width: 100%;
    max-width: 10rem;
    margin-inline: auto
}

.shop-the-look__popover::part(base) {
    height: auto;
    inset: auto auto 0 0
}

.shop-the-look__popover::part(overlay) {
    display: none
}

@media screen and (max-width: 699px) {
    .shopify-section--shop-the-look:before {
        content: "";
        opacity: 0;
        pointer-events: none;
        background: rgb(var(--background));
        z-index: 2;
        width: 100%;
        height: 100%;
        transition: opacity .4s;
        position: fixed;
        inset-block-start: 0;
        inset-inline-start: 0
    }

    .shopify-section--shop-the-look:has(.shop-the-look__carousel.is-expanded):before {
        opacity: 1
    }
}

@media screen and (min-width: 1000px) {
    .shop-the-look__carousel {
        grid: none;
        align-items: center
    }

    .shop-the-look__item {
        max-width: var(--container-sm-max-width);
        grid: auto / min(550px, 60%) minmax(0, 1fr);
        grid-area: 1 / -1;
        align-items: center;
        gap: .3125rem;
        margin-inline: auto;
        display: grid
    }

    .shop-the-look__item:not(.is-selected) {
        visibility: hidden
    }

    .shop-the-look__item-product {
        grid-area: 1 / -1;
        max-width: 16.875rem
    }

    .shop-the-look__item-product:not(.is-selected) {
        visibility: hidden
    }

    .shop-the-look__item-content {
        opacity: 0;
        justify-items: center;
        gap: 1.5rem;
        display: grid
    }
}

@media screen and (pointer: fine) {
    .shop-the-look__hot-spot:hover {
        transform: scale(1.3)
    }
}

.slideshow {
    --slideshow-controls-spacing: var(--container-gutter);
    background: rgb(var(--slideshow-background));
    display: block;
    position: relative
}

.slideshow .page-dots {
    z-index: 1;
    position: absolute;
    inset-block-end: var(--slideshow-controls-spacing);
    inset-inline-end: var(--slideshow-controls-spacing)
}

.shopify-section--slideshow:first-child .slideshow[allow-transparent-header] {
    --content-over-media-row-gap: 4rem
}

.slideshow:has(.page-dots, .slideshow__volume-control) {
    --content-over-media-row-gap: 4rem
}

.slideshow__slide:not(.is-selected) {
    visibility: hidden;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.slideshow__slide-content--boxed {
    padding: 1.5rem
}

.slideshow__slide-content--with-border {
    outline: 1px solid rgb(var(--border-color))
}

.slideshow__slide-content--with-border-offset {
    outline-offset: -.75rem;
    padding: 2.25rem
}

.slideshow__volume-control {
    z-index: 1;
    display: grid;
    position: absolute;
    inset-block-end: var(--slideshow-controls-spacing);
    inset-inline-start: var(--slideshow-controls-spacing)
}

.slideshow__next-section-button {
    z-index: 2;
    position: absolute;
    inset-block-end: calc(-1 * var(--circle-button-size) / 2);
    inset-inline-start: calc(50% - var(--circle-button-size) / 2)
}

.shopify-section:has(.slideshow__next-section-button)+.shopify-section {
    --section-vertical-spacing-block-start-compensation: 1.5625rem
}

@media screen and (min-width: 700px) {
    .slideshow:has(.page-dots, .slideshow__volume-control) {
        --content-over-media-row-gap: 5rem
    }

    .slideshow__slide-content--boxed {
        padding: 3.5rem
    }

    .slideshow__slide-content--with-border-offset {
        outline-offset: -1rem
    }
}

.shopify-section--testimonials {
    --section-vertical-spacing-override: calc(var(--section-vertical-spacing) + 20px)
}

.testimonial-list {
    gap: var(--section-stack-gap);
    justify-items: center;
    display: grid
}

.testimonial-item {
    max-width: 34rem;
    font-size: var(--testimonials-font-size);
    grid-area: 1 / -1;
    align-content: start;
    justify-items: center;
    gap: 2rem;
    display: grid
}

.testimonial-item:not(.is-selected) {
    opacity: 0;
    visibility: hidden
}

.testimonial-carousel {
    display: grid
}

.testimonial-list__thumbnail-scroller {
    flex-wrap: wrap;
    justify-content: center;
    gap: 2rem 5.625rem
}

.testimonial-list__thumbnail {
    transition: opacity .2s ease-in-out
}

.testimonial-list__thumbnail[aria-current=false] {
    opacity: .25
}

.testimonial-list__thumbnail img {
    max-width: var(--image-max-width)
}

.testimonial-list__thumbnail .placeholder {
    width: var(--image-max-width)
}

.shopify-challenge__container,
.shopify-email-marketing-confirmation__container {
    max-width: 56.25rem;
    -webkit-margin-before: var(--section-vertical-spacing);
    margin-block-start: var(--section-vertical-spacing);
    -webkit-margin-after: var(--section-vertical-spacing);
    margin-block-end: var(--section-vertical-spacing)
}

.shopify-policy__container {
    gap: var(--section-stack-gap);
    max-width: 56.25rem;
    grid-auto-columns: minmax(0, 1fr);
    -webkit-margin-before: var(--section-vertical-spacing-tight);
    margin-block-start: var(--section-vertical-spacing-tight);
    -webkit-margin-after: var(--section-vertical-spacing-tight);
    margin-block-end: var(--section-vertical-spacing-tight);
    display: grid
}

.shopify-challenge__container {
    gap: 1rem;
    display: grid
}

.shopify-challenge__container>form {
    display: contents
}

.shopify-email-marketing-confirmation__container {
    text-align: center
}

.shopify-policy__title h1 {
    font: inherit
}

.text-with-icons {
    --text-with-icons-items-per-row: 2;
    --text-with-icons-column-gap: 1.5rem;
    --text-with-icons-row-gap: 2rem;
    justify-content: center;
    gap: var(--text-with-icons-row-gap) var(--text-with-icons-column-gap);
    flex-wrap: wrap;
    display: flex
}

.text-with-icons>* {
    flex-basis: min(18.75rem, calc(100% / var(--text-with-icons-items-per-row) - var(--text-with-icons-column-gap, 0px) * (var(--text-with-icons-items-per-row) - 1) / var(--text-with-icons-items-per-row)))
}

.text-with-icons>:only-child {
    flex-basis: min(18.75rem, 100%)
}

@media screen and (max-width: 699px) {
    .text-with-icons:not(.text-with-icons--stacked) {
        grid: auto / auto-flow 100%;
        gap: 0;
        display: grid
    }

    .text-with-icons:not(.text-with-icons--stacked)>* {
        grid-area: 1 / -1;
        padding-inline: 2.5rem
    }

    .text-with-icons:not(.text-with-icons--stacked)>:not(.is-selected) {
        visibility: hidden
    }
}

@media screen and (min-width: 700px) {
    .text-with-icons {
        --text-with-icons-items-per-row: 3;
        --text-with-icons-row-gap: 2.5rem
    }
}

@media screen and (min-width: 1000px) {
    .text-with-icons {
        --text-with-icons-items-per-row: 5
    }

    .text-with-icons:not(:has(>:nth-child(5))) {
        --text-with-icons-items-per-row: 4;
        --text-with-icons-column-gap: 3.75rem
    }
}

.timeline__carousel,
.timeline__item {
    display: grid
}

:is(.timeline__carousel, .timeline__item)>* {
    grid-area: 1 / -1
}

.timeline__item:not(.is-selected) {
    visibility: hidden
}

.timeline__item-image-wrapper {
    overflow: hidden
}

.timeline__item-image-wrapper :is(img, svg) {
    scale: 1.05
}

.timeline__item-content {
    padding: var(--container-gutter)
}

@media screen and (max-width: 699px) {
    .shopify-section--timeline {
        --section-vertical-spacing: 0;
        border-block-start-width: 0
    }

    .timeline__carousel {
        position: relative
    }

    .timeline__carousel:after {
        content: "";
        background: #0006;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0
    }

    .timeline__item {
        --text-color: var(--timeline-item-mobile-text-color);
        color: rgb(var(--text-color))
    }

    .timeline__item-content {
        text-align: center;
        z-index: 1;
        align-self: center;
        padding-block: 3.75rem
    }
}

@media screen and (min-width: 700px) {
    .timeline__item {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .timeline__item>* {
        grid-area: unset
    }

    .timeline__item-content {
        align-self: end
    }
}

.timeline__nav {
    white-space: nowrap;
    grid-auto-flow: column;
    justify-content: safe center;
    align-items: center;
    -moz-column-gap: 2.5rem;
    column-gap: 2.5rem;
    display: grid
}

.timeline__nav>button {
    height: var(--text-h4);
    line-height: 1;
    transition: opacity .25s ease-in-out, font-size .25s ease-in-out;
    position: relative
}

.timeline__nav>button:after {
    content: "";
    width: calc(100% - var(--heading-letter-spacing));
    height: 3px;
    transform-origin: var(--transform-origin-start);
    background: currentColor;
    transition: transform .25s ease-in-out;
    position: absolute;
    inset-block-end: -1.25rem;
    inset-inline-start: 0;
    transform: scaleX(0)
}

.timeline__nav>[aria-current=false] {
    opacity: .65
}

.timeline__nav>[aria-current=true] {
    font-size: var(--text-h4)
}

.timeline__nav>[aria-current=true]:after {
    transform: scaleX(1)
}

@media screen and (max-width: 699px) {
    .timeline__nav {
        background: rgb(var(--timeline-nav-mobile-background));
        color: rgb(var(--timeline-nav-mobile-text-color));
        padding-block: 1.25rem;
        overflow: auto hidden
    }
}

@media screen and (min-width: 700px) {
    .timeline__nav {
        -webkit-margin-before: var(--section-stack-gap);
        margin-block-start: var(--section-stack-gap)
    }

    .timeline__nav>button:after {
        inset-block-end: -.5rem
    }
}

.sr-only {
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden
}

:is(.sr-only[type=checkbox]:focus-visible+label, .sr-only[type=radio]:focus-visible+label) {
    outline: 2px solid highlight;
    outline: 2px solid -webkit-focus-ring-color
}

.skip-to-content:focus-visible {
    z-index: 9999;
    clip: auto;
    color: #fff;
    background: #000;
    width: auto;
    height: auto;
    padding: 6px 12px;
    font-weight: 700;
    overflow: auto
}

.tap-area {
    position: relative
}

.tap-area:before {
    content: "";
    position: absolute;
    top: -.5rem;
    right: -.5rem;
    bottom: -.5rem;
    left: -.5rem
}

@media print {
    .print\:hidden {
        display: none
    }
}

@-webkit-keyframes ping {
    0% {
        transform: scale(1)
    }

    to {
        transform: scale(.8)
    }
}

@keyframes ping {
    0% {
        transform: scale(1)
    }

    to {
        transform: scale(.8)
    }
}

@media screen and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .features--zoom-image .zoom-image {
        transform-origin: center;
        transition: scale 8s cubic-bezier(.25, .46, .45, .94)
    }

    .features--zoom-image .group:hover .group-hover\:zoom {
        scale: 1.2
    }
}

@media (prefers-reduced-motion: no-preference) {
    [reveal-on-scroll=true] {
        opacity: 0
    }
}

@media (scripting: none) {
    [reveal-on-scroll=true] {
        opacity: 1
    }
}

.border {
    border-width: 1px;
    border-color: rgb(var(--border-color))
}

.border-x {
    border-inline-width: 1px
}

.border-y {
    border-block-width: 1px
}

.border-t {
    border-block-start-width: 1px
}

.border-b {
    border-block-end-width: 1px
}

.divide-x>:not([hidden])~:not([hidden]) {
    border-inline-start-width: 1px
}

.divide-y>:not([hidden])~:not([hidden]) {
    border-block-start-width: 1px
}

.rounded-full {
    border-radius: var(--rounded-full)
}

.text-success {
    color: rgb(var(--success-text))
}

.text-warning {
    color: rgb(var(--warning-text))
}

.text-error {
    color: rgb(var(--error-text))
}

.text-subdued {
    color: rgb(var(--text-color) / .65)
}

.text-on-sale {
    color: rgb(var(--on-sale-text))
}

.text-stroke {
    -webkit-text-stroke: 1px currentColor;
    -webkit-text-fill-color: transparent
}

.text-gradient {
    background-image: var(--gradient);
    color: #0000;
    -webkit-background-clip: text;
    background-clip: text
}

.text-stroke.text-gradient {
    color: rgb(var(--background));
    -webkit-text-stroke-color: transparent;
    -webkit-text-fill-color: unset
}

.bg-error,
.bg-success,
.bg-warning {
    --border-color: var(--text-color) / .15
}

.bg-error {
    background: rgb(var(--error-background))
}

.bg-success {
    background: rgb(var(--success-background))
}

.bg-warning {
    background: rgb(var(--warning-background))
}

.opacity-0 {
    opacity: 0
}

.backdrop-blur {
    -webkit-backdrop-filter: blur(var(--backdrop-blur, 0px));
    backdrop-filter: blur(var(--backdrop-blur, 0px))
}

.filter-invert {
    -webkit-filter: invert();
    filter: invert()
}

.lock {
    overflow: hidden
}

.pointer-events-none {
    pointer-events: none
}

.scroll-area {
    scrollbar-width: none;
    overscroll-behavior-x: contain;
    overflow: auto hidden
}

.hide-scrollbar {
    scrollbar-width: none
}

.scroll-area::-webkit-scrollbar {
    display: none
}

.hide-scrollbar::-webkit-scrollbar {
    display: none
}

.snap-x {
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory
}

.snap-y {
    -ms-scroll-snap-type: y mandatory;
    scroll-snap-type: y mandatory
}

.snap-start {
    scroll-snap-align: start;
    scroll-snap-stop: always
}

.snap-center {
    scroll-snap-align: center;
    scroll-snap-stop: always
}

.hidden,
.empty\:hidden:empty {
    display: none
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.grid {
    display: grid
}

.contents {
    display: contents
}

@media screen and (min-width: 700px) {
    .sm\:hidden {
        display: none
    }

    .sm\:block {
        display: block
    }

    .sm\:grid {
        display: grid
    }

    .sm\:flex {
        display: flex
    }

    .sm\:table {
        display: table
    }

    .sm\:table-cell {
        display: table-cell
    }
}

@media screen and (min-width: 1000px) {
    .md\:hidden {
        display: none
    }

    .md\:block {
        display: block
    }

    .md\:grid {
        display: grid
    }

    .md\:flex {
        display: flex
    }

    .md\:table {
        display: table
    }

    .md\:table-cell {
        display: table-cell
    }
}

@media screen and (min-width: 1150px) {
    .lg\:hidden {
        display: none
    }

    .lg\:block {
        display: block
    }

    .lg\:grid {
        display: grid
    }

    .lg\:flex {
        display: flex
    }

    .lg\:table {
        display: table
    }

    .lg\:table-cell {
        display: table-cell
    }
}

@media screen and (max-width: 699px) {
    .sm-max\:hidden {
        display: none
    }
}

@media screen and (max-width: 999px) {
    .md-max\:hidden {
        display: none
    }
}

@media screen and (max-width: 1149px) {
    .lg-max\:hidden {
        display: none
    }
}

@media screen and (max-width: 1399px) {
    .xl-max\:hidden {
        display: none
    }
}

@media (prefers-reduced-motion: reduce) {
    .motion-reduce\:hidden {
        display: none
    }

    .motion-reduce\:block {
        display: block
    }
}

.visibility-hidden {
    visibility: hidden
}

.relative {
    position: relative
}

.wrap {
    flex-wrap: wrap
}

.grow {
    flex-grow: 1
}

.shrink-0 {
    flex-shrink: 0
}

.text-start {
    text-align: start
}

.text-center {
    text-align: center
}

.text-end {
    text-align: end
}

.justify-start {
    justify-content: start
}

.justify-center {
    justify-content: safe center
}

.justify-end {
    justify-content: end
}

.justify-between {
    justify-content: space-between
}

.justify-evenly {
    justify-content: space-evenly
}

.justify-items-start {
    justify-items: start
}

.justify-items-center {
    justify-items: safe center
}

.justify-items-end {
    justify-items: end
}

.justify-self-start {
    justify-self: start
}

.justify-self-center {
    justify-self: center
}

.justify-self-end {
    justify-self: end
}

.align-start {
    align-items: start
}

.align-center {
    align-items: center
}

.align-end {
    align-items: end
}

.align-baseline {
    align-items: baseline
}

.align-self-start {
    align-self: start
}

.align-self-center {
    align-self: center
}

.align-self-end {
    align-self: end
}

.place-self-start {
    place-self: start
}

.place-self-start-center {
    place-self: start center
}

.place-self-start-end {
    place-self: start end
}

.place-self-center {
    place-self: center
}

.place-self-center-start {
    place-self: center start
}

.place-self-center-end {
    place-self: center end
}

.place-self-end {
    place-self: end
}

.place-self-end-start {
    place-self: end start
}

.place-self-end-center {
    place-self: end center
}

@media screen and (min-width: 700px) {
    .sm\:text-start {
        text-align: start
    }

    .sm\:text-center {
        text-align: center
    }

    .sm\:text-end {
        text-align: end
    }

    .sm\:justify-start {
        justify-content: start
    }

    .sm\:justify-center {
        justify-content: safe center
    }

    .sm\:justify-end {
        justify-content: end
    }

    .sm\:justify-between {
        justify-content: space-between
    }

    .sm\:justify-evenly {
        justify-content: space-evenly
    }

    .sm\:justify-items-start {
        justify-items: start
    }

    .sm\:justify-items-center {
        justify-items: safe center
    }

    .sm\:justify-items-end {
        justify-items: end
    }

    .sm\:justify-self-start {
        justify-self: start
    }

    .sm\:justify-self-center {
        justify-self: center
    }

    .sm\:justify-self-end {
        justify-self: end
    }

    .sm\:align-start {
        align-items: start
    }

    .sm\:align-center {
        align-items: center
    }

    .sm\:align-end {
        align-items: end
    }

    .sm\:align-baseline {
        align-items: baseline
    }

    .sm\:align-self-start {
        align-self: start
    }

    .sm\:align-self-center {
        align-self: center
    }

    .sm\:align-self-end {
        align-self: end
    }

    .sm\:place-self-start {
        place-self: start
    }

    .sm\:place-self-start-center {
        place-self: start center
    }

    .sm\:place-self-start-end {
        place-self: start end
    }

    .sm\:place-self-center {
        place-self: center
    }

    .sm\:place-self-center-start {
        place-self: center start
    }

    .sm\:place-self-center-end {
        place-self: center end
    }

    .sm\:place-self-end {
        place-self: end
    }

    .sm\:place-self-end-start {
        place-self: end start
    }

    .sm\:place-self-end-center {
        place-self: end center
    }
}

.vertical-align-top {
    vertical-align: top
}

.vertical-align-middle {
    vertical-align: middle
}

.vertical-align-bottom {
    vertical-align: bottom
}

.w-full {
    width: 100%
}

.h-full {
    height: 100%
}

.w-0 {
    width: 0
}

.min-w-full {
    min-width: 100%
}

.min-h-full {
    min-height: 100%
}

.mx-auto {
    margin-inline: auto
}

.my-auto {
    margin-block: auto
}

.aspect-short {
    aspect-ratio: 4 / 3
}

.aspect-portrait {
    aspect-ratio: 4 / 5
}

.aspect-tall {
    aspect-ratio: 2 / 3
}

.aspect-square {
    aspect-ratio: 1
}

.aspect-video {
    aspect-ratio: 16 / 9
}

.gap-0\.5 {
    gap: .125rem
}

.gap-1 {
    gap: .25rem
}

.gap-1\.5 {
    gap: .375rem
}

.gap-2 {
    gap: .5rem
}

.gap-2\.5 {
    gap: .625rem
}

.gap-3 {
    gap: .75rem
}

.gap-3\.5 {
    gap: .875rem
}

.gap-4 {
    gap: 1rem
}

.gap-4\.5 {
    gap: 1.125rem
}

.gap-5 {
    gap: 1.25rem
}

.gap-5\.5 {
    gap: 1.375rem
}

.gap-6 {
    gap: 1.5rem
}

.gap-7 {
    gap: 1.75rem
}

.gap-8 {
    gap: 2rem
}

.gap-10 {
    gap: 2.5rem
}

.gap-12 {
    gap: 3rem
}

.gap-14 {
    gap: 3.5rem
}

.gap-16 {
    gap: 4rem
}

@media screen and (min-width: 700px) {
    .sm\:gap-0\.5 {
        gap: .125rem
    }

    .sm\:gap-1 {
        gap: .25rem
    }

    .sm\:gap-1\.5 {
        gap: .375rem
    }

    .sm\:gap-2 {
        gap: .5rem
    }

    .sm\:gap-2\.5 {
        gap: .625rem
    }

    .sm\:gap-3 {
        gap: .75rem
    }

    .sm\:gap-3\.5 {
        gap: .875rem
    }

    .sm\:gap-4 {
        gap: 1rem
    }

    .sm\:gap-4\.5 {
        gap: 1.125rem
    }

    .sm\:gap-5 {
        gap: 1.25rem
    }

    .sm\:gap-5\.5 {
        gap: 1.375rem
    }

    .sm\:gap-6 {
        gap: 1.5rem
    }

    .sm\:gap-7 {
        gap: 1.75rem
    }

    .sm\:gap-8 {
        gap: 2rem
    }

    .sm\:gap-10 {
        gap: 2.5rem
    }

    .sm\:gap-12 {
        gap: 3rem
    }

    .sm\:gap-14 {
        gap: 3.5rem
    }

    .sm\:gap-16 {
        gap: 4rem
    }
}

.object-cover {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center
}

.object-contain {
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center
}

.image-cover {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    width: 100%;
    height: 100%
}

.image-background {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    width: 100%;
    height: 100%;
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0
}

.overflow-hidden {
    overflow: hidden
}

.overflow-clip {
    overflow: clip
}

.placeholder {
    background: rgb(var(--background-without-opacity));
    fill: rgb(var(--text-color) / .5);
    color: rgb(var(--text-color) / .5);
    display: block
}

.placeholder--invert {
    background: rgb(var(--text-color));
    fill: rgb(var(--background-without-opacity));
    color: rgb(var(--background-without-opacity))
}

.bold {
    font-weight: 700
}

.smallcaps {
    text-transform: uppercase;
    letter-spacing: var(--heading-letter-spacing);
    font-size: .625rem
}

.text-xxs {
    font-size: .6875rem
}

.text-xs {
    font-size: var(--text-xs)
}

.text-sm {
    font-size: var(--text-sm)
}

.text-base {
    font-size: var(--text-base)
}

.text-lg {
    font-size: var(--text-lg)
}

.text-xl {
    font-size: var(--text-xl)
}

.heading,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.prose :where(h1, h2, h3, h4, h5, h6) {
    font-family: var(--heading-font-family);
    font-weight: var(--heading-font-weight);
    font-style: var(--heading-font-style);
    letter-spacing: var(--heading-letter-spacing);
    text-transform: var(--heading-text-transform);
    overflow-wrap: anywhere
}

.h1,
:where(.prose h1) {
    font-size: var(--text-h1);
    line-height: 1.5
}

.h2,
:where(.prose h2) {
    font-size: var(--text-h2);
    line-height: 1.5
}

.h3,
:where(.prose h3) {
    font-size: var(--text-h3);
    line-height: 1.6
}

.h4,
:where(.prose h4) {
    font-size: var(--text-h4);
    line-height: 1.6
}

.h5,
:where(.prose h5) {
    font-size: var(--text-h5);
    line-height: 1.7
}

.h6,
:where(.prose h6) {
    font-size: var(--text-h6);
    line-height: 1.7
}

.prose blockquote {
    line-height: 1.75
}

@media screen and (min-width: 700px) {
    .sm\:text-xs {
        font-size: var(--text-xs)
    }

    .sm\:text-sm {
        font-size: var(--text-sm)
    }

    .sm\:text-base {
        font-size: var(--text-base)
    }

    .sm\:text-lg {
        font-size: var(--text-lg)
    }

    .sm\:h1 {
        font-size: var(--text-h1);
        line-height: 1.5
    }

    .sm\:h2 {
        font-size: var(--text-h2);
        line-height: 1.5
    }

    .sm\:h3 {
        font-size: var(--text-h3);
        line-height: 1.6
    }

    .sm\:h4 {
        font-size: var(--text-h4);
        line-height: 1.6
    }

    .sm\:h5 {
        font-size: var(--text-h5);
        line-height: 1.7
    }

    .sm\:h6 {
        font-size: var(--text-h6);
        line-height: 1.7
    }
}

@media screen and (min-width: 1150px) {

    .h1,
    :where(.prose h1) {
        line-height: 1.3
    }

    .h2,
    :where(.prose h2) {
        line-height: 1.4
    }

    .h3,
    :where(.prose h3) {
        line-height: 1.5
    }
}

ol {
    -webkit-margin-start: 2ch;
    margin-inline-start: 2ch
}

ul {
    -webkit-margin-start: 1em;
    margin-inline-start: 1em
}

:where(ol, ul):not(.unstyled-list) li {
    -webkit-padding-start: .25rem;
    padding-inline-start: .25rem;
    -webkit-margin-before: 0 !important;
    margin-block-start: 0 !important
}

:where(.text-center, .text-end) :is(ol, ul) {
    margin-inline: 0;
    list-style-position: inside
}

:where(.text-center, .text-end) :is(ol, ul) li {
    -webkit-padding-start: 0;
    padding-inline-start: 0
}

.line-through {
    text-decoration: line-through
}

.break-all {
    word-break: break-all
}

.hyphenate {
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto
}

.truncate-text {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: var(--truncate-text-max-width, 100%);
    overflow: hidden
}

.line-clamp {
    -webkit-line-clamp: var(--line-clamp-count, 2);
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden
}

@font-face {
    font-family: flexslider-icon;
    src:url('{{ "flexslider-icon.eot" | asset_url }}');
    src:url('{{ "flexslider-icon.eot?#iefix" | asset_url }}') format("embedded-opentype"),
    url('{{ "flexslider-icon.woff" | asset_url }}') format("woff"),
    url('{{ "flexslider-icon.ttf" | asset_url }}') format("truetype"),
    url('{{ "flexslider-icon.svg#flexslider-icon" | asset_url }}') format("svg");
    font-weight: 400;
    font-style: normal
}

.btn--loading {
    position: relative;
    text-indent: -9999px;
    background-color: rgb(var(--button-background));
    color: rgb(var(--button-text-color))
}

.btn--loading:active,
.btn--loading:hover {
    background-color: rgb(var(--button-background));
    color: rgb(var(--button-text-color))
}

.btn--loading:before {
    content: "";
    display: block;
    width: 22px;
    height: 22px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -11px;
    margin-top: -11px;
    border-radius: 50%;
    border: 3px solid;
    border-color: rgb(var(--button-text-color));
    border-top-color: transparent;
    animation: spin 1s linear infinite
}

.btn--loading.btn--secondary {
    color: rgb(var(--text-color));
    background: transparent
}

.btn--loading.btn--secondary:before {
    border-color: rgb(var(--text-color));
    border-top-color: transparent
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.cf-fields-container .cf-field a {
    text-decoration: underline
}

.ngc__modal__companyName {
    display: none;
    visibility: hidden
}

/*# sourceMappingURL=/cdn/shop/t/4/assets/theme.css.map?v=162618763347742353821755117721 */


/* na_naDeliciousness */

@media only screen and (min-width: 769px) {
    .c-pageTtl {
        background: url(/cdn/shop/files/mv-pc.jpg?v=1749488523) no-repeat center top;
        background-size: cover
    }

    .l-contents .c-pageTtl__naDeliciousness {
        background: url("/html/user_data/assets/img/na/mv-pc-deliciousness.webp") no-repeat center top;
        background-size: cover
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl {
        background: url(/cdn/shop/files/mv-sp.jpg?v=1749488522);
        background-size: cover
    }

    .l-contents .c-pageTtl__naDeliciousness {
        background: url("/html/user_data/assets/img/na/mv-sp-deliciousness.webp");
        background-size: cover
    }
}

@media only screen and (min-width: 769px) {
    .materialConts {
        padding: 88px 0 188px
    }
}

@media only screen and (max-width: 768px) {
    .materialConts {
        padding: 8vw 0 33.07vw
    }
}

@media only screen and (min-width: 769px) {
    .blend {
        margin-bottom: 104px
    }
}

@media only screen and (max-width: 768px) {
    .blend {
        margin-bottom: 17.07vw
    }
}

@media only screen and (max-width: 768px) {
    .blend .p-simpleTwoClm__ttl {
        text-align: left
    }
}

@media only screen and (min-width: 769px) {
    .blend .p-simpleTwoClm__left {
        width: 600px
    }
}

@media only screen and (min-width: 769px) {
    .blend .p-simpleTwoClm__right {
        width: 379px
    }
}

@media only screen and (max-width: 768px) {
    .blend .p-simpleTwoClm__right .p-simpleTwoClm__figure {
        margin-top: 2em
    }
}

@media only screen and (min-width: 769px) {
    .blend .p-simpleTwoClm__txt {
        margin-bottom: 0
    }
}

@media only screen and (min-width: 769px) {
    .blend .p-simpleTwoClm__txt.-small {
        margin-top: 1em
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-01 {
        margin-bottom: 104px
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-01 {
        margin-bottom: 17.07vw
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-01 .p-simpleTwoClm__ttl {
        margin-bottom: 25px
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-01 .p-simpleTwoClm__ttl {
        text-align: left
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-01 .p-simpleTwoClm__txt {
        margin-bottom: .5em
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-01 .deliciousness-01__txt {
        width: 1000px;
        margin: 1em auto 0;
        font-size: 16px;
        line-height: 2
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-01 .deliciousness-01__txt {
        width: 84vw;
        margin: 2em auto 0;
        font-size: 4vw;
        line-height: 1.9
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-02 {
        margin-bottom: 104px !important
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-02 {
        margin-bottom: 17.07vw !important
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-02 .p-centerTxtsBlock__ttl {
        text-align: left
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-02 .p-centerTxtsBlock__txt {
        margin-bottom: 0;
        width: 1000px
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-02 .p-centerTxtsBlock__txt {
        margin-bottom: 2em
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-02 .p-centerTxtsBlock__figure {
        margin-top: 25px
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-02 .p-centerTxtsBlock__figure {
        width: 84vw;
        margin: 0 auto 1em
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-03 {
        margin-bottom: 104px !important
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-03 {
        margin-bottom: 17.07vw !important
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-03 .p-centerTxtsBlock__ttl {
        text-align: left
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-03 .p-centerTxtsBlock__figure {
        width: 84vw;
        margin: 0 auto 2em
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-03 .p-centerTxtsBlock {
        margin-bottom: 2em
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-03 .-image {
        margin-bottom: 50px
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-03 .-image {
        margin-bottom: 10.67vw
    }
}

@media only screen and (min-width: 769px) {

    .deliciousness-03 .-image .p-simpleTwoClm__left,
    .deliciousness-03 .-image .p-simpleTwoClm__right {
        text-align: center
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-03 .p-centerTxtsBlock__txt {
        width: 1000px
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-03 .p-centerTxtsBlock__txt {
        margin-bottom: 2em
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-03 .definitionList {
        margin-bottom: 2em
    }
}

.deliciousness-03 .definitionList dt {
    font-weight: 600;
    color: #2f3c0d;
    border-bottom: 2px solid #2f3c0d
}

@media only screen and (min-width: 769px) {
    .deliciousness-03 .definitionList dt {
        font-size: 18px;
        padding-bottom: 20px;
        margin-bottom: 20px
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-03 .definitionList dt {
        font-size: 4.8vw;
        padding-bottom: 3.74vw;
        margin-bottom: 6.67vw;
        border-bottom: 2px solid #2f3c0d
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-03 .definitionList dd {
        margin: 0 auto;
        font-size: 16px;
        line-height: 2
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-03 .definitionList dd {
        font-size: 4vw;
        line-height: 1.9
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-03 .p-simpleTwoClm .p-centerTxtsBlock__txt {
        margin-bottom: 1em
    }
}

.deliciousness-03 .p-simpleTwoClm .p-centerTxtsBlock__txt.-small {
    line-height: 2
}

@media only screen and (min-width: 769px) {
    .deliciousness-03 .p-simpleTwoClm .p-centerTxtsBlock__txt.-small {
        font-size: 12px
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-03 .p-simpleTwoClm .p-centerTxtsBlock__txt.-small {
        font-size: 3.47vw;
        margin-bottom: 0
    }
}

@media only screen and (min-width: 769px) {
    .deliciousness-04 {
        margin-bottom: 104px !important
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-04 {
        margin-bottom: 17.07vw !important
    }
}

@media only screen and (max-width: 768px) {
    .deliciousness-04 .p-simpleTwoClm__left {
        margin-bottom: 2em
    }
}

@media only screen and (min-width: 769px) {
    .aboutFirst {
        width: 1000px;
        margin: 0 auto 80px
    }
}

@media only screen and (max-width: 768px) {
    .aboutFirst {
        width: 86vw;
        margin: 70px auto 17.07vw
    }
}

@media only screen and (min-width: 769px) {
    .aboutFirst .aboutFirst__head {
        text-align: center;
        margin-bottom: 25px
    }
}

@media only screen and (max-width: 768px) {
    .aboutFirst .aboutFirst__head {
        margin-bottom: 8vw
    }
}

@media only screen and (min-width: 769px) {
    .aboutFirst .aboutFirst__head .c-smallTxt {
        margin-top: 10px
    }
}

@media only screen and (max-width: 768px) {
    .aboutFirst .aboutFirst__head .c-smallTxt {
        margin-top: 3.74vw
    }
}

@media only screen and (min-width: 769px) {
    .aboutFirst .aboutFirst__figure {
        margin-bottom: 64px
    }
}

@media only screen and (max-width: 768px) {
    .aboutFirst .aboutFirst__figure {
        margin-bottom: 8.54vw
    }
}

@media only screen and (max-width: 768px) {
    .aboutFirst .p-simpleTwoClm .p-simpleTwoClm__txt {
        margin-bottom: 1em
    }
}

@media only screen and (min-width: 769px) {
    .aboutMaterial .aboutMaterial__head {
        width: 1000px;
        margin: 0 auto 48px
    }
}

@media only screen and (max-width: 768px) {
    .aboutMaterial .aboutMaterial__head {
        width: 84vw;
        margin: 0 auto 8.54vw
    }
}

.aboutMaterial .aboutMaterial__head .c-ttl-01 {
    text-align: left
}

@media only screen and (min-width: 769px) {
    .aboutMaterial .aboutMaterial__btm {
        margin-top: 80px
    }
}

@media only screen and (max-width: 768px) {
    .aboutMaterial .aboutMaterial__btm {
        margin-top: 10.67vw
    }
}

.aboutMaterial .aboutMaterial__btm .-brown {
    margin-bottom: 1em
}

@media only screen and (max-width: 768px) {
    .aboutMaterial .p-simpleTwoClm .p-simpleTwoClm__left {
        margin-bottom: 10.67vw
    }
}

@media only screen and (min-width: 769px) {
    .aboutMaterial .aboutMaterial__btm .p-simpleTwoClm {
        align-items: center
    }
}

@media only screen and (min-width: 769px) {
    .aboutMaterial .aboutMaterial__btm .p-simpleTwoClm .p-simpleTwoClm__left {
        width: 660px
    }
}

@media only screen and (min-width: 769px) {
    .aboutMaterial .aboutMaterial__btm .p-simpleTwoClm .p-simpleTwoClm__right {
        width: 314px
    }
}

@media only screen and (min-width: 769px) {
    .aboutMaterial .aboutMaterial__btm .p-simpleTwoClm .p-simpleTwoClm__figure img {
        width: 100%
    }
}

@media only screen and (max-width: 768px) {
    .l-bgDark {
        margin-top: 0
    }
}

@media only screen and (min-width: 769px) {
    .l-shop {
        padding: 80px 0 160px
    }
}

/*# sourceMappingURL=/cdn/shop/t/4/assets/from-oldsite-202505.na_naDeliciousness.css.map?v=134320761017396605041755615470 */


/* na_na */

@media only screen and (min-width: 769px) {
    .c-pageTtl {
        background: url(../../images/na/na/mv-pc.jpg) no-repeat center top;
        background-size: cover
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl {
        background: url(/cdn/shop/files/mv-sp_209b151c-d6af-4b24-a888-de44c0ba8fd0.jpg?v=1749488569);
        background-size: cover
    }

    .aboutIndex .c-pageTtl__na {
        background: url("/html/user_data/assets/img/na/mv-sp-na.webp") !important;
        background-size: cover !important
    }

    .aboutIndex .c-pageTtl__na .c-pageTtl__ttl {
        background: none
    }
}

.aboutIntro {
    background: url("/html/user_data/assets/img/na/bg_section-05.webp") center bottom no-repeat
}

@media only screen and (min-width: 769px) {
    .aboutIntro {
        height: 46vw;
        min-height: 650px;
        background-size: 100%
    }
}

@media only screen and (max-width: 768px) {
    .aboutIntro {
        width: 100vw;
        height: 135vw;
        overflow-x: hidden;
        background-size: 240%
    }
}

@media only screen and (min-width: 769px) {
    .aboutIntro .l-basicSection__txt {
        margin-bottom: 67px
    }
}

.aboutIntro .l-basicSection__txt .l-basicSection__txt__note {
    display: block
}

@media only screen and (min-width: 769px) {
    .aboutIntro .l-basicSection__txt .l-basicSection__txt__note {
        margin-top: 20px
    }
}

@media only screen and (max-width: 768px) {
    .aboutIntro .l-basicSection__txt .l-basicSection__txt__note {
        margin-top: 5.34vw
    }
}

@media only screen and (min-width: 769px) {
    .details {
        padding: 80px 0 0
    }
}

@media only screen and (max-width: 768px) {
    .details {
        padding: 16vw 0 0
    }
}

.details .details__box {
    display: flex;
    justify-content: center;
    position: relative
}

@media only screen and (min-width: 769px) {
    .details .details__box {
        width: 1057px;
        margin: 0 auto
    }
}

@media only screen and (max-width: 768px) {
    .details .details__box {
        flex-wrap: wrap;
        width: 88vw;
        margin: 0 auto
    }
}

.details .details__box .details__box__item {
    box-sizing: border-box
}

@media only screen and (min-width: 769px) {
    .details .details__box .details__box__item {
        width: 33.3333333333%;
        padding: 0 28.5px;
        border-left: 1px solid #9d9889;
        margin-top: 0
    }

    .details .details__box .details__box__item:first-child {
        border-left: 0
    }
}

@media only screen and (max-width: 768px) {
    .details .details__box .details__box__item {
        margin-top: 7.47vw;
        padding-top: 8.54vw;
        border-top: 1px solid #9d9889
    }

    .details .details__box .details__box__item:first-child {
        margin-top: 0;
        padding-top: 0;
        border-top: 0
    }
}

@media only screen and (max-width: 768px) {
    .details .details__box .details__box__item.-oneImage {
        margin-top: 0;
        border-top: 0
    }
}

.details .details__box .details__box__item .details__box__item__caption {
    line-height: 1.5;
    font-family: "Noto Serif JP", serif !important;
    font-weight: 700
}

@media only screen and (min-width: 769px) {
    .details .details__box .details__box__item .details__box__item__caption {
        margin-top: 24px;
        font-size: 20px
    }
}

@media only screen and (max-width: 768px) {
    .details .details__box .details__box__item .details__box__item__caption {
        margin-top: 5.34vw;
        font-size: 4.8vw
    }
}

.details .details__box .details__box__item .details__box__item__lead {
    line-height: 1.6
}

@media only screen and (min-width: 769px) {
    .details .details__box .details__box__item .details__box__item__lead {
        margin-top: 24px;
        font-size: 16px
    }
}

@media only screen and (max-width: 768px) {
    .details .details__box .details__box__item .details__box__item__lead {
        margin-top: 5.34vw;
        font-size: 3.74vw
    }
}

.details .details__box .details__box__item .details__box__item__lead small {
    display: block;
    line-height: 1.6
}

@media only screen and (min-width: 769px) {
    .details .details__box .details__box__item .details__box__item__lead small {
        font-size: 12px
    }
}

@media only screen and (max-width: 768px) {
    .details .details__box .details__box__item .details__box__item__lead small {
        margin-top: 5.34vw;
        font-size: 3.2vw
    }
}

.l-aboutIntro__btn {
    display: block
}

@media only screen and (min-width: 769px) {
    .l-aboutIntro__btn {
        width: 500px;
        height: 47px;
        margin: 80px auto 0;
        font-size: 15px
    }
}

@media only screen and (max-width: 768px) {
    .l-aboutIntro__btn {
        width: 84vw;
        height: 18.67vw;
        margin: 8.54vw auto 0;
        font-size: 4.27vw
    }
}

.pointList {
    padding-bottom: 80px
}

@media only screen and (max-width: 768px) {
    .pointList {
        padding-top: 12.27vw;
        padding-bottom: 16vw
    }
}

.pointList .pointList__list {
    position: relative;
    display: flex;
    justify-content: space-between
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__list {
        width: 1000px;
        margin: 90px auto 0
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__list {
        flex-wrap: wrap;
        width: 88vw;
        margin: 52px auto 0
    }
}

.pointList .pointList__item {
    position: relative;
    background: #fff9;
    color: #703117;
    text-align: center;
    transition: all .6s cubic-bezier(.19, 1, .22, 1)
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item {
        width: 230px;
        height: 230px;
        font-size: 20px;
        padding-top: 96px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item {
        width: 42.67vw;
        height: 45.34vw;
        font-size: 3.74vw;
        padding-top: 18.67vw
    }
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:hover {
        background: #fffc;
        transform: translateY(4px)
    }

    .pointList .pointList__item:hover:after {
        bottom: 12px
    }
}

.pointList .pointList__item:before {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    transform: translate(-50%)
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:first-child {
        margin-bottom: 18.14vw
    }
}

.pointList .pointList__item:first-child:before {
    background: url(/cdn/shop/files/img-01.png?v=1749488570)
}

.pointList .pointList__item__01:first-child:before {
    background: url("/html/user_data/assets/img/na/img-01.webp") !important;
    background-size: 232px 141px !important
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:first-child:before {
        width: 232px;
        height: 141px;
        background-size: 232px 141px !important;
        top: -50px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:first-child:before {
        width: 45.87vw;
        height: 28vw;
        background-size: 45.87vw 28vw !important;
        top: -10.66vw
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:nth-child(2) {
        margin-bottom: 18.14vw
    }
}

.pointList .pointList__item:nth-child(2):before {
    background: url(/cdn/shop/files/img-02.png?v=1749488569)
}

.pointList .pointList__item__02:nth-child(2):before {
    background: url("/html/user_data/assets/img/na/img-02.webp") !important;
    background-size: 157px 154px !important
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:nth-child(2):before {
        width: 157px;
        height: 154px;
        background-size: 157px 154px !important;
        top: -60px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:nth-child(2):before {
        width: 31.74vw;
        height: 31.2vw;
        background-size: 31.74vw 31.2vw !important;
        top: -13.33vw
    }
}

.pointList .pointList__item:nth-child(3):before {
    background: url(/cdn/shop/files/img-03.png?v=1749488569)
}

.pointList .pointList__item__03:nth-child(3):before {
    background: url("/html/user_data/assets/img/na/img-03.webp") !important;
    background-size: 163px 136px !important
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:nth-child(3):before {
        width: 163px;
        height: 136px;
        background-size: 163px 136px !important;
        top: -55px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:nth-child(3):before {
        width: 33.6vw;
        height: 28.27vw;
        background-size: 33.6vw 28.27vw !important;
        top: -10.66vw
    }
}

.pointList .pointList__item:last-child:before {
    background: url(/cdn/shop/files/img-04.png?v=1749488569)
}

.pointList .pointList__item__04:last-child:before {
    background: url("/html/user_data/assets/img/na/img-04.webp") !important;
    background-size: 183px 142px !important
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:last-child:before {
        width: 183px;
        height: 142px;
        background-size: 183px 142px !important;
        top: -61px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:last-child:before {
        width: 37.87vw;
        height: 29.34vw;
        background-size: 37.87vw 29.34vw !important;
        top: -12.53vw
    }
}

.pointList .pointList__item:after {
    content: "";
    display: block;
    position: absolute;
    background: url(../common/images/icon_arrow-dark.svg);
    left: 50%;
    transform: translate(-50%) rotate(90deg)
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:after {
        width: 8px;
        height: 15px;
        background-size: 8px 15px !important;
        bottom: 16px;
        transition: bottom .6s cubic-bezier(.19, 1, .22, 1)
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:after {
        width: 2.14vw;
        height: 4vw;
        background-size: 2.14vw 4vw !important;
        bottom: 4vw
    }
}

.pointList .pointList__num {
    font-family: Crimson Text, serif
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__num {
        font-size: 28px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__num {
        font-size: 5.34vw
    }
}

.pointList .pointList__ancker {
    display: block;
    width: 100%;
    height: 100%;
    background: none !important
}

.pointList .pointList__ancker span {
    display: block;
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    width: 100%;
    line-height: 1.4;
    letter-spacing: .04em
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__ancker span {
        bottom: 39px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__ancker span {
        bottom: 9.34vw
    }
}

@media only screen and (max-width: 768px) {
    .p-bgTwoClm .p-bgTwoClm__ttl {
        text-align: center;
        line-height: 1.4
    }
}

@media only screen and (min-width: 769px) {
    .p-bgTwoClm .p-bgTwoClm__btn {
        width: 378px
    }
}

@media only screen and (max-width: 768px) {
    .p-bgTwoClm .p-bgTwoClm__btn {
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 4vw;
        width: 84vw;
        height: 18.67vw;
        line-height: 1.4
    }
}

@media only screen and (min-width: 769px) {
    .commitment01 {
        background: url("/html/user_data/assets/img/na/bg_section-01-pc.jpg") !important;
        background-size: cover !important;
        min-height: 520px !important;
        padding: 88px 0 89px !important;
        background-position: 50% 50% !important;
        -webkit-margin-before: 0rem !important;
        margin-block-start: 0rem !important
    }
}

@media only screen and (max-width: 768px) {
    .commitment01 {
        background: url("/html/user_data/assets/img/na/bg_section-01-sp.jpg") !important;
        background-size: cover !important;
        padding: 16vw 0 85.87vw !important;
        -webkit-margin-before: 0rem !important;
        margin-block-start: 0rem !important
    }
}

.commitment02 {
    background: url("/html/user_data/assets/img/na/bg_section-02-pc.png") no-repeat !important;
    -webkit-margin-before: 0rem !important;
    margin-block-start: 0rem !important
}

@media only screen and (min-width: 769px) {
    .commitment02 {
        background-position: 80% center !important;
        min-height: 437px !important;
        padding: 96px 0 88px !important;
        -webkit-margin-before: 0rem !important;
        margin-block-start: 0rem !important
    }
}

@media only screen and (max-width: 768px) {
    .commitment02 {
        background-size: 73.6vw 78.94vw !important;
        background-position: 32.54vw center !important;
        padding-bottom: 16vw !important;
        -webkit-margin-before: 0rem !important;
        margin-block-start: 0rem !important
    }
}

@media only screen and (max-width: 768px) {
    .commitment02 .l-bgTwoClm__ttl {
        line-height: 1.6
    }
}

@media only screen and (min-width: 769px) {
    .commitment02.p-bgTwoClm .p-bgTwoClm__btn {
        width: 415px
    }
}

@media only screen and (min-width: 769px) {
    .commitment03 {
        background: url("/html/user_data/assets/img/na/bg_section-03-pc.webp") !important;
        background-size: cover !important;
        min-height: 548px !important;
        padding: 88px 0 142px !important;
        background-position: 50% 50% !important;
        -webkit-margin-before: 0rem !important;
        margin-block-start: 0rem !important
    }
}

@media only screen and (max-width: 768px) {
    .commitment03 {
        background: url("/html/user_data/assets/img/na/bg_section-03-sp.webp") no-repeat center top !important;
        background-size: 100vw auto !important;
        padding: 75.47vw 0 17.07vw !important;
        -webkit-margin-before: 0rem !important;
        margin-block-start: 0rem !important
    }
}

@media only screen and (max-width: 768px) {
    .commitment03 .l-bgTwoClm__ttl {
        line-height: 1.6
    }
}

@media only screen and (min-width: 769px) {
    .commitment04 {
        background: url("/html/user_data/assets/img/na/bg_section-04-pc.webp") !important;
        background-size: cover !important;
        min-height: 595px !important;
        padding: 88px 0 142px !important;
        background-position: 50% 50% !important;
        -webkit-margin-before: 0rem !important;
        margin-block-start: 0rem !important
    }
}

@media only screen and (max-width: 768px) {
    .commitment04 {
        background: url("/html/user_data/assets/img/na/bg_section-04-sp.webp") !important;
        background-size: cover !important;
        padding: 75.47vw 0 29.07vw !important;
        -webkit-margin-before: 0rem !important;
        margin-block-start: 0rem !important
    }
}

@media only screen and (max-width: 768px) {
    .commitment04 .l-bgTwoClm__ttl {
        line-height: 1.6
    }
}

@media only screen and (max-width: 768px) {
    .l-bgDark {
        margin-top: 0
    }
}

@media only screen and (min-width: 769px) {
    .l-shop {
        padding: 80px 0 160px
    }
}

/*# sourceMappingURL=/cdn/shop/t/4/assets/from-oldsite-202505.na_na.css.map?v=23253935202606267321754978782 */




/* na_naNatural */

@media only screen and (min-width: 769px) {
    .c-pageTtl {
        background: url(../../images/na/natural_authority/mv-pc.jpg) no-repeat center top;
        background-size: cover
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl {
        background: url(../../images/na/natural_authority/mv-sp.jpg);
        background-size: cover
    }
}

@media only screen and (min-width: 769px) {
    .naturalConts {
        padding: 88px 0 188px
    }
}

@media only screen and (max-width: 768px) {
    .naturalConts {
        padding: 14.94vw 0 33.07vw
    }
}

@media only screen and (min-width: 769px) {
    .lead {
        height: 707px;
        background: url("/html/user_data/assets/img/na/bg_chicken-pc.png") no-repeat center bottom;
        background-size: 100% auto
    }

    .lead__chicken {
        height: 707px;
        background: url("/html/user_data/assets/img/na/bg_chicken-pc.png") no-repeat center bottom !important;
        background-size: 100% auto
    }
}

@media only screen and (max-width: 768px) {
    .lead {
        background: url(/html/user_data/assets/img/na/bg_chicken-sp.jpg) no-repeat center bottom !important;
        background-size: 100vw auto !important
    }

    .lead__chicken {
        background: url(/html/user_data/assets/img/na/bg_chicken-sp.jpg) no-repeat center bottom !important;
        background-size: 100vw auto
    }
}

@media only screen and (min-width: 769px) {
    .lead .p-simpleTwoClm__left {
        width: 500px
    }
}

@media only screen and (max-width: 768px) {
    .lead .p-simpleTwoClm__left {
        margin-bottom: 69.34vw
    }
}

@media only screen and (max-width: 768px) {
    .lead .p-simpleTwoClm__left .p-simpleTwoClm__figure {
        margin: 0 auto 1em
    }
}

@media only screen and (min-width: 769px) {
    .lead .p-simpleTwoClm__right {
        width: 435px
    }
}

@media only screen and (min-width: 769px) {
    .lead .p-simpleTwoClm__ttl {
        letter-spacing: 0
    }
}

.lead .p-simpleTwoClm__txt {
    margin-bottom: 2em
}

@media only screen and (min-width: 769px) {
    .lead .p-simpleTwoClm__txt.-small {
        font-size: 12px
    }
}

@media only screen and (max-width: 768px) {
    .lead .p-simpleTwoClm__txt.-small {
        font-size: 13px
    }
}

@media only screen and (min-width: 769px) {
    .natural {
        margin: 104px 0 !important
    }
}

@media only screen and (max-width: 768px) {
    .natural {
        margin: 17.07vw auto 18.67vw !important;
        width: 84vw !important
    }
}

@media only screen and (max-width: 768px) {
    .natural .p-centerTxtsBlock__ttl {
        text-align: left
    }
}

@media only screen and (min-width: 769px) {
    .natural .p-centerTxtsBlock__txt {
        width: 1000px;
        text-align: left;
        margin-bottom: 2em
    }
}

@media only screen and (max-width: 768px) {
    .natural .p-centerTxtsBlock__txt {
        margin-bottom: 2em
    }
}

.natural .p-centerTxtsBlock__att {
    text-align: left
}

@media only screen and (max-width: 768px) {
    .natural .p-simpleTwoClm__left .p-simpleTwoClm__figure {
        margin-bottom: 8.54vw
    }
}

.natural .p-simpleTwoClm__txt {
    margin-bottom: 2em
}

@media only screen and (min-width: 769px) {
    .natural .p-simpleTwoClm__txt.-small {
        font-size: 12px
    }
}

@media only screen and (max-width: 768px) {
    .natural .p-simpleTwoClm__txt.-small {
        font-size: 13px
    }
}

@media only screen and (max-width: 768px) {
    .l-bgDark {
        margin-top: 0
    }
}

@media only screen and (min-width: 769px) {
    .l-shop {
        padding: 80px 0 160px
    }
}

/*# sourceMappingURL=/cdn/shop/t/4/assets/from-oldsite-202505.na_naNatural.css.map?v=5223701072786480721755016133 */



/* na_naNutrition */

@media only screen and (min-width: 769px) {
    .c-pageTtl {
        background: url("/html/user_data/assets/img/na/mv-pc-nutrition.webp") no-repeat center top;
        background-size: cover
    }

    .c-pageTtl__eiyou {
        background: url("/html/user_data/assets/img/na/mv-pc-nutrition.webp") !important;
        background-size: cover !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl {
        background: url(/cdn/shop/files/mv-sp_8cbe0c1d-7649-4abe-b555-53a8b0eebd58.jpg?v=1749488726);
        background-size: cover
    }

    .c-pageTtl__eiyou {
        background: url("/html/user_data/assets/img/na/mv-sp-nutrition.jpg") !important;
        background-size: cover !important
    }

    .c-pageTtl__eiyou .c-pageTtl__ttl {
        background: none !important
    }
}

@media only screen and (min-width: 769px) {
    .nutritionConts {
        padding: 88px 0 188px
    }
}

@media only screen and (max-width: 768px) {
    .nutritionConts {
        padding: 14.94vw 0 33.07vw
    }
}

@media only screen and (min-width: 769px) {
    .balance {
        margin-bottom: 104px !important
    }
}

@media only screen and (max-width: 768px) {
    .balance {
        margin-bottom: 17.07vw !important
    }
}

@media only screen and (max-width: 768px) {
    .balance .p-centerTxtsBlock__ttl {
        text-align: left
    }
}

.balance .p-centerTxtsBlock__txt {
    margin-bottom: 2em
}

@media only screen and (min-width: 769px) {
    .balance .p-centerTxtsBlock__txt {
        width: 1000px
    }
}

@media only screen and (min-width: 769px) {
    .nutritional {
        margin-bottom: 104px !important
    }
}

@media only screen and (max-width: 768px) {
    .nutritional {
        margin-bottom: 17.07vw !important
    }
}

.logos {
    display: flex;
    justify-content: space-between
}

@media only screen and (min-width: 769px) {
    .logos {
        width: 465px;
        margin-left: 15px
    }
}

@media only screen and (min-width: 769px) {
    .logos .logos--01 {
        width: 283px
    }
}

@media only screen and (max-width: 768px) {
    .logos .logos--01 {
        width: 48.8vw
    }
}

.logos .logos--01 img {
    width: 100%
}

@media only screen and (min-width: 769px) {
    .logos .logos--02 {
        width: 129px
    }
}

@media only screen and (max-width: 768px) {
    .logos .logos--02 {
        width: 29.34vw
    }
}

@media only screen and (min-width: 769px) {
    .logos.-sp {
        display: none
    }
}

@media only screen and (max-width: 768px) {
    .logos.-sp {
        display: flex
    }
}

@media only screen and (min-width: 769px) {
    .laboratory {
        width: 1000px;
        margin: 0 auto 104px
    }
}

@media only screen and (max-width: 768px) {
    .laboratory {
        width: 84vw;
        margin: 0 auto 17.07vw
    }
}

.laboratory .laboratory__ttl {
    font-weight: 600;
    font-family: "Noto Serif JP", serif !important
}

@media only screen and (min-width: 769px) {
    .laboratory .laboratory__ttl {
        font-size: 25px;
        text-align: center;
        margin-bottom: 40px
    }
}

@media only screen and (max-width: 768px) {
    .laboratory .laboratory__ttl {
        font-size: 5.87vw;
        text-align: left;
        margin-bottom: 8vw
    }
}

@media only screen and (min-width: 769px) {
    .nutritional-02 {
        margin-bottom: 104px
    }
}

@media only screen and (max-width: 768px) {
    .nutritional-02 {
        margin-bottom: 17.07vw
    }
}

@media only screen and (max-width: 768px) {
    .nutritional-02 .p-centerTxtsBlock__ttl {
        text-align: left
    }
}

@media only screen and (min-width: 769px) {
    .nutritional-02 .p-simpleTwoClm {
        margin-bottom: 2em
    }
}

@media only screen and (max-width: 768px) {
    .nutritional-02 .p-simpleTwoClm__txt {
        margin-bottom: 2em
    }
}

@media only screen and (max-width: 768px) {
    .nutritional-02 .p-simpleTwoClm__left {
        margin-bottom: 2em
    }
}

@media only screen and (min-width: 769px) {
    .allergy {
        margin-bottom: 104px !important
    }
}

@media only screen and (max-width: 768px) {
    .allergy {
        margin-bottom: 18.14vw !important
    }
}

@media only screen and (max-width: 768px) {
    .allergy .p-simpleTwoClm__ttl {
        text-align: left
    }
}

@media only screen and (min-width: 769px) {
    .allergy.p-simpleTwoClm {
        flex-direction: row-reverse
    }
}

@media only screen and (max-width: 768px) {
    .allergy .p-simpleTwoClm__right {
        margin-bottom: 2em
    }
}

@media only screen and (min-width: 769px) {
    .nutritional-03 {
        margin-bottom: 104px !important
    }
}

@media only screen and (max-width: 768px) {
    .nutritional-03 {
        margin-bottom: 17.07vw !important
    }
}

@media only screen and (max-width: 768px) {
    .l-bgDark {
        margin-top: 0
    }
}

@media only screen and (min-width: 769px) {
    .l-shop {
        padding: 80px 0 160px
    }
}

/*# sourceMappingURL=/cdn/shop/t/4/assets/from-oldsite-202505.na_naNutrition.css.map?v=99006308359051309981753561953 */


/* na_naPhilosophy */

/** Shopify CDN: Minification failed

Line 72:2 Unexpected ".3point_01"
Line 107:2 Unexpected ".3point_01"

**/
@media only screen and (min-width: 769px) {
    .c-pageTtl {
        background: url(../../images/na/philosophy/mv-pc.jpg) no-repeat center top;
        background-size: cover;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl {
        background: url(../../images/na/philosophy/mv-sp.jpg);
        background-size: cover;
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection {
        padding-bottom: 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection .l-basicSection__head {
        width: 84vw;
        margin: 0 auto 10.67vw;
        text-align: left;
    }
}

@media only screen and (min-width: 769px) {
    .philosophyConts {
        padding: 10px 0 188px;
    }
}

@media only screen and (max-width: 768px) {
    .philosophyConts {
        padding: 6.4vw 0 33.07vw;
    }
}

@media only screen and (min-width: 769px) {
    .lead {
        background: url(../../images/na/philosophy/bg_field-pc.png) no-repeat center bottom;
        background-size: cover;
        min-height: 1198px;
    }
}

/*210720???L---------------------*/


@media only screen and (min-width: 769px) {
    .nafood_title_img {
        width: 300px;
        margin: 10px 0;
    }

    .na_food_img {
        width: 400px;
        margin: -10px 0 0;
    }

    #point_3 {
        font-size: 17px;
        width: 753px;
        margin: 0 auto;
    }

    .3point_01,
    .3point_02,
    .3point_03 {}

    .na_subtitle_img_01 {
        width: 200px;
        margin: 50px 0 20px;
    }

    .na_subtitle_img_02 {
        width: 250px;
        margin: 50px 0 20px;
    }

    .na_subtitle_img_03 {
        width: 300px;
        margin: 50px 0 20px;
    }
}

@media only screen and (max-width: 768px) {
    .nafood_title_img {
        width: 60%;
        margin: -40px 0 10px;
    }

    .l-basicSection {
        font-size: 4vw;
        line-height: 1.9;
    }

    .na_food_img {
        width: 80%;
        margin-top: 60px;
    }

    #point_3 {
        width: 84vw;
        margin: 7.4vw auto 20vw;
        font-size: 4vw;
        line-height: 1.9;
    }

    .3point_01,
    .3point_02,
    .3point_03 {
        margin: 0 0 10vw;
    }

    .na_subtitle_img_01 {
        width: 40vw;
        margin: 50px 0 10px;
    }

    .na_subtitle_img_02 {
        width: 55vw;
        margin: 50px 0 10px;
    }

    .na_subtitle_img_03 {
        width: 65vw;
        margin: 50px 0 10px;
    }
}

/*210720???L---------------------?I*/

@media only screen and (max-width: 768px) {
    .aboutNaturalfood {
        padding-top: 88vw;
        background: url("/html/user_data/assets/img/na/bg_pats-sp.png") no-repeat center top;
        background-size: 159.47vw auto;
        margin-bottom: 10.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .aboutNaturalfood.p-centerTxtsBlock {
        width: auto;
        background: url("/html/user_data/assets/img/na/bg_pats-pc.png") no-repeat center;
    }
}

@media only screen and (max-width: 768px) {
    .aboutNaturalfood .p-centerTxtsBlock__ttl {
        text-align: left;
    }
}

.aboutNaturalfood .aboutNaturalfood__list {
    text-align: left;
    font-size: 15px;
    line-height: 2;
    padding: 0 8vw;
}

@media only screen and (min-width: 769px) {
    .aboutNaturalfood .aboutNaturalfood__list {
        width: 358px;
        margin: 0 auto;
        font-size: 16px;
        padding: 0;
    }
}

.aboutNaturalfood .aboutNaturalfood__list .aboutNaturalfood__item {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .aboutNaturalfood .aboutNaturalfood__list .aboutNaturalfood__item {
        padding-left: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .aboutNaturalfood .aboutNaturalfood__list .aboutNaturalfood__item {
        padding-left: 3.47vw;
    }
}

.aboutNaturalfood .aboutNaturalfood__list .aboutNaturalfood__item::before {
    content: '';
    display: block;
    position: absolute;
    background: #5D5446;
    border-radius: 50%;
    left: 0;
}

@media only screen and (min-width: 769px) {
    .aboutNaturalfood .aboutNaturalfood__list .aboutNaturalfood__item::before {
        width: 8px;
        height: 8px;
        top: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .aboutNaturalfood .aboutNaturalfood__list .aboutNaturalfood__item::before {
        width: 1.6vw;
        height: 1.6vw;
        top: 2.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .promise {
        width: 1000px;
        margin: 104px auto 64px;
    }
}

@media only screen and (max-width: 768px) {
    .promise {
        width: 84vw;
        margin: 14.4vw auto 10.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .promise .promise__head {
        text-align: center;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .promise .promise__head {
        text-align: left;
        margin-bottom: 8vw;
    }
}

.promise .promise__ttl {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .promise .promise__ttl {
        font-size: 26px;
        margin-bottom: 32px;
    }
}

@media only screen and (max-width: 768px) {
    .promise .promise__ttl {
        font-size: 5.87vw;
        margin-bottom: 4.8vw;
    }
}

@media only screen and (min-width: 769px) {
    .promise .promise__catch {
        font-size: 16px;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .promise .promise__catch {
        font-size: 15px;
        line-height: 1.9;
    }
}

@media only screen and (min-width: 769px) {
    .philosophyTbl {
        width: 1000px;
        margin: 40px auto 104px;
    }
}

@media only screen and (max-width: 768px) {
    .philosophyTbl {
        width: 84vw;
        margin: 10.67vw auto 18.67vw;
    }
}

.philosophyTbl .-small {
    margin-top: 3px;
}

@media only screen and (min-width: 769px) {
    .philosophyTbl .-small {
        text-align: right;
        font-size: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .philosophyTbl .-small {
        font-size: 3.47vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-bgDark {
        margin-top: 0;
    }
}

@media only screen and (min-width: 769px) {
    .l-shop {
        padding: 80px 0 160px;
    }
}


/* philosophy髢｢騾｣ 2025-08-05霑ｽ險� */
@media only screen and (min-width: 769px) {
    .aboutPhilosophy .l-basicSection .l-basicSection__txt-02 {
        font-size: 16px;
        width: 753px;
        margin: 0 auto 2em;
        line-height: 2;
    }

    .aboutPhilosophy .-logoImg img {
        width: 150px;
        margin-left: 260px;
    }

    .aboutNaturalfood__list {
        font-size: 16px;
        line-height: 2;
    }

    #main .philosophyTbl table {
        width: 100%;
    }

    .aboutPhilosophy .promise {
        padding: 65px 0 0;
    }
}

@media only screen and (max-width: 768px) {
    .aboutPhilosophy .l-basicSection p {
        text-align: left;
    }

    .aboutPhilosophy .l-basicSection .l-basicSection__txt-02 {
        font-size: 15px;
        line-height: 1.9;
        padding: 0 8vw;
        margin-bottom: 2em;
    }

    .aboutPhilosophy .-logoImg img {
        width: 53.34vw;
        margin: 0 auto;
    }

    #main .philosophyTbl table {
        width: 84vw;
        margin: 0px auto;
    }

    .aboutPhilosophy .p-centerTxtsBlock__att {
        padding: 0 8vw;
    }

    .aboutPhilosophy .promise {
        padding: 10px 0 0;
    }

    .sp_center {
        text-align: center;
    }
}

.aboutPhilosophy .promise:before {
    content: none;
}

@media only screen and (min-width: 769px) {
    .aboutPhilosophy .c-pointTbl_01 {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
}

.aboutPhilosophy .p-movie .p-movie__inner {
    aspect-ratio: 16 / 9;
}

.aboutPhilosophy .p-movie .p-movie__inner__cover {
    width: 100%;
    height: auto;
}

.aboutPhilosophy .p-movie .p-movie__inner__play {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    /* 16:9縺ｮ豈皮紫��9/16 = 0.5625�� */
    height: 0;
    overflow: hidden;
}

.aboutPhilosophy .p-movie .p-movie__inner__play iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.aboutPhilosophy .p-movie .p-movie__inner__cover:before {
    content: "";
    display: block;
    position: absolute;
    background: url("/html/user_data/assets/img/na/icon_play.svg");
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@media only screen and (max-width: 768px) {
    .aboutPhilosophy .p-movie .p-movie__inner__cover::before {
        width: 13.34vw;
        height: 13.34vw;
        background-size: 13.34vw 13.34vw;
    }
}

/*# sourceMappingURL=maps/naPhilosophy.min.css.map */




/* na_naSafety */

@media only screen and (min-width: 769px) {
    .c-pageTtl {
        background: url("/html/user_data/assets/img/na/mv-pc_f8b75c01-48ae-4044-ba6f-21f314c6d467") no-repeat center top;
        background-size: cover
    }

    .l-contents .c-pageTtl__quality {
        background: url("/html/user_data/assets/img/na/mv-pc-safety.webp") no-repeat center top !important;
        background-size: cover !important
    }

    .l-contents.aboutPhilosophy .c-pageTtl__quality {
        background: url("/html/user_data/assets/img/na/mv-pc-philosophy.webp") no-repeat center top !important;
        background-size: cover !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl {
        background: url(/cdn/shop/files/mv-sp_5e11f353-fe4a-431a-b93e-a36ff06290b8.jpg?v=1749489034);
        background-size: cover
    }

    .l-contents .c-pageTtl__quality {
        background: url(/html/user_data/assets/img/na/mv-sp-safety.webp) !important;
        background-size: cover !important
    }

    .l-contents.aboutPhilosophy .c-pageTtl__quality {
        background: url("/html/user_data/assets/img/na/mv-sp-philosophy.jpg") !important;
        background-size: cover !important
    }

    .c-pageTtl__quality .c-pageTtl__ttl {
        background: none !important
    }
}

@media only screen and (min-width: 769px) {
    .safetyConts {
        padding: 88px 0 188px
    }
}

@media only screen and (max-width: 768px) {
    .safetyConts {
        padding: 14.94vw 0 33.07vw
    }
}

@media only screen and (min-width: 769px) {
    .lead {
        background: url(/cdn/shop/files/bg_field-pc_7c8c78b7-0f5e-41b8-80dc-fcfa8adb4020.png?v=1749489035) no-repeat center bottom;
        background-size: 100%;
        min-height: 573px;
        padding-bottom: 235px
    }

    .aboutPhilosophy .lead {
        background: url("/html/user_data/assets/img/na/bg_field-pc-philosophy.png") no-repeat center bottom;
        background-size: cover;
        min-height: 1450px;
        padding-bottom: 340px
    }
}

@media only screen and (max-width: 768px) {
    .lead {
        background: url(/cdn/shop/files/bg_field-sp_62575e1a-abc8-4d19-893d-4f23981e23f5.jpg?v=1749489034) no-repeat center bottom;
        background-size: 100vw auto !important;
        padding-bottom: 53.34vw
    }

    .aboutPhilosophy .lead {
        background: none;
        min-height: auto;
        padding-bottom: 0
    }
}

@media only screen and (min-width: 769px) {
    .l-basicSection.-first {
        padding-bottom: 0
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection .l-basicSection__head {
        width: 84vw;
        margin: 0 auto 10.67vw;
        text-align: left
    }
}

.l-basicSection .l-basicSection__txt {
    margin-bottom: 2em
}

@media only screen and (max-width: 768px) {
    .l-basicSection .p-simpleTwoClm__left .p-simpleTwoClm__figure {
        margin-bottom: 2em
    }
}

@media only screen and (max-width: 768px) {
    .p-simpleTwoClm .p-simpleTwoClm__ttl {
        text-align: left
    }
}

@media only screen and (min-width: 769px) {
    .material {
        position: relative;
        margin-bottom: 104px
    }
}

@media only screen and (max-width: 768px) {
    .material {
        margin-bottom: 17.07vw
    }
}

@media only screen and (min-width: 769px) {
    .material .p-simpleTwoClm__txt {
        margin-bottom: 1em
    }
}

@media only screen and (min-width: 769px) {
    .material .p-simpleTwoClm__left {
        padding-top: 24px
    }
}

@media only screen and (max-width: 768px) {
    .material .p-simpleTwoClm__figure {
        margin-top: 2em
    }
}

@media only screen and (min-width: 769px) {
    .safety-02 {
        margin-bottom: 104px
    }
}

@media only screen and (max-width: 768px) {
    .safety-02 {
        margin-bottom: 17.07vw
    }
}

@media only screen and (max-width: 768px) {
    .safety-02 .p-centerTxtsBlock__ttl {
        text-align: left
    }
}

@media only screen and (min-width: 769px) {
    .safety-02 .p-simpleTwoClm__txt {
        margin-bottom: 1em
    }
}

@media only screen and (max-width: 768px) {
    .safety-02 .p-simpleTwoClm__figure {
        margin-bottom: 2em
    }
}

@media only screen and (min-width: 769px) {
    .safety-03 {
        margin-bottom: 104px
    }
}

@media only screen and (max-width: 768px) {
    .safety-03 {
        margin-bottom: 17.07vw
    }
}

@media only screen and (max-width: 768px) {
    .safety-03 .p-simpleTwoClm__figure {
        margin-bottom: 2em
    }
}

@media only screen and (min-width: 769px) {
    .safety-04 {
        margin-bottom: 104px
    }
}

@media only screen and (max-width: 768px) {
    .safety-04 {
        margin-bottom: 17.07vw
    }
}

@media only screen and (max-width: 768px) {
    .safety-04 .p-centerTxtsBlock__ttl {
        text-align: left
    }
}

.safety-04 .p-centerTxtsBlock__txt {
    margin-bottom: 2em
}

@media only screen and (min-width: 769px) {
    .safety-04 .p-centerTxtsBlock__txt {
        width: 1000px
    }
}

@media only screen and (min-width: 769px) {
    .safety-05 {
        margin-bottom: 104px
    }
}

@media only screen and (max-width: 768px) {
    .safety-05 {
        margin-bottom: 17.07vw
    }
}

@media only screen and (max-width: 768px) {
    .safety-05 .p-centerTxtsBlock__ttl {
        text-align: left
    }
}

@media only screen and (max-width: 768px) {
    .safety-05 .p-simpleTwoClm__figure {
        margin-bottom: 2em
    }
}

.safety-05 .l-shop__btn {
    display: block
}

@media only screen and (min-width: 769px) {
    .safety-05 .l-shop__btn {
        width: 1000px;
        margin: 40px auto 0
    }
}

@media only screen and (max-width: 768px) {
    .safety-05 .l-shop__btn {
        width: 84vw;
        margin: 2em auto 0
    }
}

@media only screen and (max-width: 768px) {
    .l-bgDark {
        margin-top: 0
    }
}

@media only screen and (min-width: 769px) {
    .l-shop {
        padding: 80px 0 160px
    }
}

@media only screen and (min-width: 769px) {
    .aboutPhilosophy .l-basicSection .l-basicSection__txt-02 {
        font-size: 16px;
        width: 753px;
        margin: 0 auto 2em;
        line-height: 2
    }

    .aboutPhilosophy .-logoImg img {
        width: 150px;
        margin-left: 260px
    }
}

@media only screen and (max-width: 768px) {
    .aboutPhilosophy .l-basicSection .l-basicSection__txt-02 {
        font-size: 15px;
        line-height: 1.9;
        padding: 0 8vw;
        margin-bottom: 2em
    }

    .aboutPhilosophy .-logoImg img {
        width: 53.34vw;
        margin: 0 auto
    }
}

/*# sourceMappingURL=/cdn/shop/t/4/assets/from-oldsite-202505.na_naSafety.css.map?v=95287257841373316161754980831 */




/* css_sample_lp_style */
/*!
 * guide
 */
p {
    margin-top: 0;
    margin-bottom: 1rem
}

.mt-5,
.my-5 {
    margin-top: 3rem !important
}

li {
    list-style: none
}

body.layout-class-A header {
    border-bottom: 1px solid #f5f0e6
}

body.layout-class-A header .upper .navbar-toggle {
    right: 0
}

body.layout-class-A main#main h1 {
    padding-bottom: 0;
    padding-top: 0
}

main {
    max-width: initial;
    min-height: initial;
    margin: auto;
    max-width: none;
    width: 100%
}

main hr.thick {
    border-bottom: 5px solid #f5f0e6
}

.footer .footer-inner {
    max-width: none
}

a {
    color: #3c3c3c;
    text-decoration: underline;
    transition: .2s ease-in-out
}

body.layout-class-A header .brand-links-wrap {
    display: none
}

.pconly {
    display: none
}

.img-radius {
    border-radius: 5px;
    overflow: hidden
}

.notes {
    background-color: #ffebeb;
    font-size: .875rem;
    padding: 20px
}

.notes b {
    display: block;
    margin-bottom: 5px
}

.comments {
    font-size: 1.375rem;
    font-style: normal;
    margin-left: 2px;
    margin-right: 2px
}

.hdg[data-heading="01"] {
    background-color: #f5f0e6;
    border-radius: 10px;
    margin-bottom: 15px;
    margin-top: 30px;
    padding: 5px 15px
}

.hdg[data-heading="02"] {
    background-image: url(../images/article/icn_footmark.png);
    background-position: 0 4px;
    background-repeat: no-repeat;
    background-size: 19px auto;
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 10px;
    margin-top: 25px;
    padding-left: 25px
}

.hdg[data-heading="03"] {
    font-size: 1.0625rem;
    margin-bottom: 10px;
    margin-top: 20px
}

.disc,
.asterisk,
.decimal {
    margin-bottom: 0;
    margin-top: 15px;
    padding-left: 0
}

.disc>li {
    font-size: 1rem;
    margin-top: .95rem;
    padding-left: 25px;
    position: relative
}

.disc>li:first-child,
.asterisk>li:first-child,
.decimal>li:first-child {
    margin-top: 0
}

.disc>li:before {
    content: "";
    background-color: #bfb299;
    border-radius: 100%;
    display: block;
    height: 10px;
    left: 5px;
    position: absolute;
    top: 8px;
    width: 10px
}

.asterisk>li {
    font-size: 1rem;
    margin-top: .5rem;
    padding-left: 20px;
    position: relative
}

.asterisk>li:before {
    content: "\906f\ff76?\ff7b";
    left: 5px;
    position: absolute;
    top: -2px
}

.decimal>li {
    counter-increment: serial;
    font-size: 1rem;
    margin-top: .75rem;
    padding-left: 23px;
    position: relative
}

.decimal>li:before {
    content: counter(serial) ".";
    left: 0;
    position: absolute;
    top: 0
}

.col-side {
    display: block;
    margin-top: 30px
}

.col-side[data-side=side-2]>div:nth-child(n+2) {
    margin-top: 15px;
    font-weight: 700
}

@media (min-width: 750px) {
    a:hover {
        opacity: .7;
        filter: alpha(opacity=70);
        text-decoration: none
    }

    .pconly {
        display: block
    }

    .sponly {
        display: none
    }

    .img-radius {
        border-radius: 10px
    }

    .notes {
        padding: 30px
    }

    .hdg {
        margin-left: auto;
        margin-right: auto;
        max-width: 860px;
        width: 100%
    }

    .hdg[data-heading="01"] {
        font-size: 1.125rem;
        margin-top: 50px
    }

    .hdg[data-heading="02"] {
        background-size: 22px auto;
        margin-bottom: 15px;
        margin-top: 30px;
        padding-left: 34px
    }

    .disc,
    .asterisk,
    .decimal {
        margin-top: 25px
    }

    .disc>li {
        margin-top: 1.25rem;
        padding-left: 20px
    }

    .disc>li:before {
        height: 10px;
        left: 0;
        top: 7px;
        width: 10px
    }

    .asterisk>li {
        padding-left: 15px
    }

    .asterisk>li:before {
        left: 0
    }

    .decimal>li {
        margin-top: 1.25rem
    }

    .col-side {
        display: flex;
        justify-content: space-between;
        margin-left: auto;
        margin-right: auto;
        margin-top: 50px;
        max-width: 860px;
        width: 100%
    }

    .col-side[data-side=side-2]>div {
        width: 48%
    }

    .col-side[data-side=side-2]>div:nth-child(n+2) {
        margin-top: 0
    }

    .col-side[data-side=side-2]>div:nth-child(n+3) {
        margin-top: 30px
    }

    .m_lr_20 {
        margin-left: 20px;
        margin-right: 20px
    }
}

.breadcrumbs {
    overflow-x: auto
}

.breadcrumbs ul {
    display: flex;
    align-items: center;
    font-size: .6875rem;
    min-height: 30px;
    margin-bottom: initial;
    padding-left: 10px;
    white-space: nowrap
}

.breadcrumbs ul li {
    padding-right: 10px
}

.breadcrumbs ul li:before {
    color: #000;
    content: "/";
    padding-right: 10px
}

.breadcrumbs ul li:first-child:before {
    content: "";
    padding-left: initial;
    padding-right: initial
}

.breadcrumbs ul li a {
    color: #3c3c3c;
    text-decoration: none
}

.breadcrumbs ul li span {
    color: #c9c9c9
}

@media (min-width: 750px) {
    .breadcrumbs {
        padding-left: 10px;
        padding-right: 10px
    }

    .breadcrumbs ul {
        padding-left: initial;
        white-space: initial;
        margin-left: auto;
        margin-right: auto;
        max-width: 940px;
        width: 100%
    }
}

/*!
   * guide kitten index
   ------------------------------*/
.kv {
    margin-bottom: 40px
}

.kv img {
    height: auto;
    max-width: 100%
}

@media (min-width: 750px) {
    .kv {
        margin-bottom: 0;
        padding-bottom: 40px;
        padding-top: 40px;
        text-align: center
    }
}

.catguide-list-wrp hr.thick {
    margin-top: 70px
}

@media (min-width: 750px) {
    .catguide-list-wrp {
        background-color: #fdfcfa
    }

    .catguide-list-wrp hr.thick {
        margin-top: 35px
    }
}

.category-list-wrap {
    margin-bottom: 50px
}

.category-list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-left: 12.5px;
    padding-right: 12.5px
}

.category-list>li {
    max-width: 340px;
    width: 48.5%
}

.category-list>li:nth-child(n+3) {
    margin-top: 10px
}

.category-list>li>a {
    background-color: #f5f0e6;
    border-radius: 5px;
    color: #ff1414;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .875rem;
    height: 50px;
    padding-right: 26px;
    position: relative;
    text-align: center;
    text-decoration: none
}

.category-list>li>a:after {
    background-image: url(../images/article/menu_arr.png);
    background-size: cover;
    content: "";
    height: 7px;
    position: absolute;
    right: 12px;
    top: 50%;
    width: 14px;
    transform: translateY(-50%)
}

.category-list[data-category-dog=tab-dog]>li>a {
    color: #0000a0
}

.category-list[data-category-dog=tab-dog]>li>a:after {
    background-image: url(../images/article/menu_arr.png)
}

.category-list>li.active>a {
    font-weight: 700
}

.category-list>li>a:hover {
    text-decoration: none
}

.category-list>li>a br {
    display: none
}

@media (min-width: 750px) {
    .category-list-wrap {
        background-color: #f9f6f0;
        margin-bottom: 0;
        padding-bottom: 10px;
        padding-top: 10px
    }

    .category-list {
        display: table;
        flex-wrap: initial;
        margin-bottom: 0;
        margin-left: auto;
        margin-right: auto;
        padding-left: 10px;
        padding-right: 10px;
        max-width: 980px;
        width: 100%
    }

    .category-list>li {
        background-image: url(../images/article/menu_divider.png);
        background-position: right top;
        background-repeat: no-repeat;
        display: table-cell;
        padding-right: 12px;
        vertical-align: middle
    }

    .category-list[data-menu=tab-cat]>li {
        width: 14.3%
    }

    .category-list[data-category-dog=tab-dog]>li {
        width: 13.5%
    }

    .category-list>li:nth-child(n+3) {
        margin-top: 0
    }

    .category-list>li:last-child {
        background-image: none;
        padding-right: 0;
        max-width: 150px
    }

    .category-list>li>a {
        background-color: transparent;
        font-size: 1rem;
        height: 80px;
        padding-right: 0
    }

    .category-list>li>a:after {
        bottom: 0;
        left: 50%;
        right: auto;
        top: auto;
        transform: translate(-50%)
    }

    .category-list>li>a:hover {
        text-decoration: none
    }

    .category-list>li>a br {
        display: block
    }
}

.box-article-list {
    padding-left: 15px;
    padding-right: 15px
}

.box-article-list img {
    height: auto;
    max-width: 100%
}

.box-article-list .box-article {
    border-bottom: 1px solid #f5f0e6
}

.box-article-list .box-article:first-child {
    border-top: 1px solid #f5f0e6
}

.box-article-list .box-article>a {
    display: flex;
    justify-content: space-between;
    padding-bottom: 7.5px;
    padding-top: 7.5px;
    text-decoration: none
}

.box-article-list .box-article .article-img {
    width: 47.8%
}

.box-article-list .box-article .article-info {
    width: 50%
}

.box-article-list .box-article .article-info .article-ttl {
    color: #3c3c3c;
    font-size: .9375rem;
    margin-bottom: auto;
    text-align: left;
    padding-top: 0;
    padding-bottom: 13px
}

.box-article-list .box-article .article-info .article-txt {
    display: none
}

.box-article-list .box-article .article-info .article-category {
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

.box-article-list .box-article .article-info .article-category>p {
    border: 1px solid #ff1414;
    border-radius: 22px;
    color: #ff1414;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .75rem;
    height: 22px;
    margin-bottom: 6px;
    margin-right: 4px;
    padding: 0 10px
}

.box-article-list[data-category-dog=dog] .box-article .article-info .article-category>p {
    border: 1px solid #0000a0;
    color: #0000a0
}

.box-article-list .box-article>a:hover {
    text-decoration: none
}

@media (min-width: 750px) {
    .box-article-list {
        display: flex;
        align-content: center;
        flex-wrap: wrap;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        padding-top: 26px;
        max-width: 920px;
        width: 100%
    }

    .box-article-list .box-article {
        background-color: #fff;
        border-bottom: none;
        box-shadow: 0 0 8px 3px #f5f0e6;
        margin-top: 30px;
        margin-left: 2.39%;
        max-width: 292px;
        width: 30.2%
    }

    .box-article-list .box-article:first-child {
        border-top: none
    }

    .box-article-list .box-article>a {
        display: block;
        padding: 20px
    }

    .box-article-list .box-article .article-img,
    .box-article-list .box-article .article-info {
        width: auto
    }

    .box-article-list .box-article .article-info .article-ttl {
        padding-bottom: 15px;
        padding-top: 15px
    }

    .box-article-list .box-article .article-info .article-txt {
        color: #3c3c3c;
        display: block;
        font-size: .8125rem;
        padding: 0 0 15px
    }
}

.transition-btn {
    margin-bottom: 50px;
    margin-top: 80px;
    padding-left: 15px;
    padding-right: 15px
}

.transition-btn p:nth-child(n+2) {
    margin-top: 30px
}

.transition-btn .btn-puppy,
.transition-btn .btn-kitten {
    margin-bottom: 0
}

.transition-btn .btn-puppy a,
.transition-btn .btn-kitten a {
    border-radius: 30px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    line-height: 1.3;
    text-decoration: none
}

.transition-btn .btn-puppy a {
    background-color: #0000a0
}

.transition-btn .btn-kitten a {
    background-color: #ff1414
}

@media (min-width: 750px) {
    .transition-btn {
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        margin-bottom: 70px;
        margin-top: 70px
    }

    .transition-btn p:nth-child(n+2) {
        margin-top: 0
    }

    .transition-btn .btn-puppy,
    .transition-btn .btn-kitten {
        margin-left: 5px;
        margin-right: 5px
    }

    .transition-btn .btn-puppy a,
    .transition-btn .btn-kitten a {
        height: 50px;
        width: 230px
    }
}

/*!
   * guide kitten detail
   ------------------------------*/
.article-top {
    background-color: #f5f0e6;
    padding: 28.5px 18.5px 39.5px
}

.article-top .article-top-upper {
    padding-left: 20px;
    padding-right: 20px
}

.article-top .article-img img {
    border-radius: 5px;
    height: auto;
    max-width: 100%;
    overflow: hidden
}

.article-top .article-ttl {
    padding-bottom: 24px;
    padding-top: 45px
}

body.layout-class-A main#main .article-top .article-ttl .mod-ttl-cts {
    color: #ff1414;
    font-size: 1.5rem;
    text-align: left;
    margin-bottom: 12px
}

body.layout-class-A main#main .article-top[data-article-top=dog] .article-ttl .mod-ttl-cts {
    color: #0000a0
}

.article-top .article-ttl .article-category {
    display: flex;
    flex-wrap: wrap
}

.article-top .article-ttl .article-category>p {
    display: flex;
    justify-content: center;
    margin-bottom: 5px;
    margin-right: 5px
}

.article-top .article-ttl .article-category>p span {
    border: 1px solid #ff1414;
    border-radius: 22px;
    color: #ff1414;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .75rem;
    height: 22px;
    padding: 0 10px
}

.article-top[data-article-top=dog] .article-ttl .article-category>p span {
    border: 1px solid #0000a0;
    color: #0000a0
}

.article-top .article-ttl .txt {
    font-size: .875rem;
    margin-bottom: 0;
    margin-top: 20px
}

.article-top .txtbox {
    background-color: #fff;
    border-radius: 5px;
    font-size: .875rem;
    padding: 20px 15px
}

.article-top .txtbox .txt {
    margin-bottom: 0
}

@media (min-width: 750px) {
    .article-top {
        padding: 40px 0
    }

    .article-top .cts-inner {
        margin-left: auto;
        margin-right: auto;
        max-width: 786px;
        width: 100%
    }

    .article-top .article-top-upper {
        display: flex;
        justify-content: space-between;
        padding-left: 0;
        padding-right: 0
    }

    .article-top .article-img,
    .article-top .article-ttl {
        width: 373px
    }

    .article-top .article-img img {
        border-radius: 10px
    }

    .article-top .article-ttl {
        padding-bottom: 0;
        padding-top: 0
    }

    body.layout-class-A main#main .article-top .article-ttl .mod-ttl-cts {
        font-size: 2.25rem;
        font-weight: 700
    }

    .article-top .article-ttl .article-category>p {
        justify-content: initial
    }

    .article-top .article-ttl .article-category>p span {
        font-size: .875rem;
        height: 30px;
        padding: 0 20px
    }

    .article-top .txtbox {
        border-radius: 10px;
        font-size: 1rem;
        font-weight: 700;
        margin-top: 40px;
        padding: 25px 50px
    }
}

.article-wrp {
    line-height: 1.7;
    padding-top: 55px;
    padding-bottom: 70px
}

.article-wrp .cts-inner {
    padding-left: 10px;
    padding-right: 10px
}

.article-wrp .txtbox[data-txtbox=txtonly] {
    margin-top: 30px
}

.article-wrp .imgbox[data-txtbox=imgonly] {
    text-align: center
}

.article-wrp .imgbox[data-txtbox=imgonly] .img {
    border-radius: 3px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    width: 66%
}

.article-wrp .imgbox[data-txtbox=imgonly] .img img {
    max-width: 100%;
    height: auto
}

.article-wrp .imgbox[data-txtbox=imgonly] .img[data-img=sp_wf] {
    width: 100%
}

.article-wrp .each-txtbox+.each-txtbox {
    margin-top: 50px
}

.article-wrp .txtbox[data-txtbox=txtonly]+.each-txtbox {
    margin-top: 30px
}

.article-wrp .each-txtbox[data-imgsize=s] .each-txtbox-inside .inner-imgbox {
    width: 51%
}

.article-wrp .each-txtbox[data-imgsize=m] .each-txtbox-inside .inner-imgbox {
    width: 69%
}

.article-wrp .txtbox+.imgbox,
.article-wrp .imgbox+.imgbox {
    margin-top: 30px
}

.article-wrp .mod-ttl-sub {
    background-color: #f5f0e6;
    border-radius: 5px;
    color: #3c3c3c;
    font-size: 1.375rem;
    font-weight: 400;
    margin-bottom: 30px;
    margin-top: 65px;
    padding: 15px
}

.article-wrp .mod-ttl-sub:first-child {
    margin-top: 0
}

.article-wrp .inner-imgbox {
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    width: 66%
}

.article-wrp .inner-imgbox img {
    border-radius: 5px;
    height: auto;
    max-width: 100%;
    overflow: hidden
}

.article-wrp .each-txtbox>.txt-lead {
    display: none
}

.article-wrp .txt-lead {
    background-size: 4px auto;
    display: block
}

.article-wrp .inner-txtbox+.inner-txtbox {
    margin-top: 30px
}

.article-wrp .txtbox+.txtbox {
    margin-top: 30px
}

.article-wrp .txt-lead {
    background-image: url(../images/article/dot.png);
    background-position: left bottom;
    background-repeat: repeat-x;
    color: #ff1414;
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 15px;
    padding-bottom: 10px
}

.article-wrp[data-dog=dogwrap] .txt-lead {
    background-image: url(../images/article/dot.png);
    color: #0000a0
}

.article-wrp[data-dog=dogwrap] .txt-lead[data-lead=lead-outside] {
    margin-left: auto;
    margin-right: auto;
    max-width: 862px;
    width: 100%
}

.article-wrp .txt {
    margin-bottom: 0
}

.article-wrp .txt+.txt-lead,
.article-wrp .hdg[data-heading="01"]+.txt-lead,
.article-wrp .hdg[data-heading="02"]+.txt-lead,
.article-wrp .hdg[data-heading="03"]+.txt-lead {
    margin-top: 30px
}

.article-wrp .txt-lead+.hdg,
.article-wrp .txt-lead+.col-side {
    margin-top: 0
}

.article-wrp .lnk {
    margin-bottom: 0;
    margin-top: 15px
}

.article-wrp .lnk a,
.mod-txtlink {
    color: #3c3c3c;
    display: block;
    position: relative;
    padding-left: 17px;
    text-decoration: underline
}

.article-wrp .lnk a:before,
.mod-txtlink:before {
    border-style: solid;
    border-width: 6.25px 0 6.25px 6px;
    border-color: transparent transparent transparent #ff1414;
    content: "";
    left: 0;
    position: absolute;
    top: 5px
}

.article-wrp .footprint {
    margin-bottom: 0;
    padding-left: 0
}

main .article-wrp .footprint>li {
    background-image: url(../images/article/icn_footmark.png);
    background-position: 0 4px;
    background-repeat: no-repeat;
    background-size: 19px auto;
    margin-top: 1rem;
    padding-left: 25px
}

main .article-wrp .footprint>li:first-child {
    margin-top: 0
}

@media (min-width: 750px) {
    .article-wrp {
        padding-top: 60px;
        padding-bottom: 100px
    }

    .article-wrp .cts-inner {
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        max-width: 920px;
        width: 100%
    }

    .article-wrp .each-txtbox,
    .article-wrp .txtbox[data-txtbox=txtonly] {
        margin-left: auto;
        margin-right: auto;
        max-width: 860px;
        width: 100%
    }

    .article-wrp .txtbox[data-txtbox=txtonly] {
        margin-top: 50px
    }

    .article-wrp .each-txtbox+.txtbox[data-txtbox=txtonly] {
        margin-top: 50px
    }

    .article-wrp .hdg+.txtbox[data-txtbox=txtonly] {
        margin-top: 0
    }

    .article-wrp .each-txtbox .each-txtbox-inside {
        display: flex;
        justify-content: space-between
    }

    .article-wrp .each-txtbox.txtbox-r .each-txtbox-inside {
        flex-direction: row-reverse
    }

    .article-wrp .each-txtbox+.each-txtbox {
        margin-top: 50px
    }

    .article-wrp .txtbox[data-txtbox=txtonly]+.each-txtbox {
        margin-top: 50px
    }

    .article-wrp .mod-ttl-sub {
        background-color: #f5f0e6;
        border-radius: 10px;
        color: #3c3c3c;
        font-size: 1.375rem;
        font-weight: 400;
        margin-bottom: 30px;
        margin-top: 65px;
        padding: 15px;
        text-align: center
    }

    .article-wrp .mod-ttl-sub:first-child {
        margin-top: 0
    }

    .article-wrp .inner-imgbox,
    .article-wrp .each-txtbox[data-imgsize=m] .each-txtbox-inside .inner-imgbox {
        margin-bottom: 0;
        width: 47.7%
    }

    .article-wrp .inner-imgbox img {
        border-radius: 10px
    }

    .article-wrp .each-txtbox.txtbox-r .each-txtbox-inside .inner-imgbox {
        margin-right: initial
    }

    .article-wrp .each-txtbox.txtbox-l .each-txtbox-inside .inner-imgbox {
        margin-left: initial;
        margin-right: auto
    }

    .article-wrp .inner-txtbox {
        line-height: 1.7;
        width: 47.7%
    }

    .article-wrp .each-txtbox[data-column=col-type01].txtbox-r .each-txtbox-inside .inner-imgbox,
    .article-wrp .each-txtbox[data-column=col-type01].txtbox-l .each-txtbox-inside .inner-imgbox {
        width: 23.85%
    }

    .article-wrp .each-txtbox[data-column=col-type01].txtbox-r .each-txtbox-inside .inner-txtbox,
    .article-wrp .each-txtbox[data-column=col-type01].txtbox-l .each-txtbox-inside .inner-txtbox {
        width: 71.55%
    }

    .article-wrp .imgbox[data-txtbox=imgonly] .img[data-img=sp_wf] {
        width: auto
    }

    .article-wrp .mod-ttl-sub+.txtbox[data-txtbox=txtonly] {
        margin-top: 0
    }

    .article-wrp .txtbox+.txtbox {
        margin-top: 50px
    }

    .article-wrp .each-txtbox>.txt-lead {
        display: block
    }

    .article-wrp .inner-txtbox .txt-lead {
        display: none
    }

    .article-wrp .inner-txtbox+.inner-txtbox {
        margin-top: 50px
    }

    .article-wrp .txtbox+.imgbox,
    .article-wrp .imgbox+.imgbox {
        margin-top: 50px
    }

    .article-wrp .txt-lead {
        background-size: auto;
        font-size: 1.25rem;
        margin-bottom: 20px
    }

    .article-wrp .txt {
        margin-bottom: 0
    }

    .article-wrp .txt+.txt-lead,
    .article-wrp .hdg[data-heading="01"]+.txt-lead,
    .article-wrp .hdg[data-heading="02"]+.txt-lead,
    .article-wrp .hdg[data-heading="03"]+.txt-lead {
        margin-top: 50px
    }

    .article-wrp .lnk a,
    .mod-txtlink {
        text-decoration: none
    }

    .article-wrp .lnk a:hover,
    .mod-txtlink:hover {
        text-decoration: underline
    }

    main .article-wrp .footprint>li {
        background-size: 22px auto;
        font-size: 1rem;
        margin-top: 1rem;
        padding-left: 34px
    }
}

.cat-summary {
    background-color: #f5f0e6;
    margin-top: 65px;
    padding: 100px 10px 50px
}

.cat-summary .txt-lead {
    border-bottom: none;
    color: #ff1414;
    font-size: .9375rem;
    font-weight: 400;
    padding-bottom: 0;
    position: relative;
    text-align: center
}

.cat-summary[data-summay=dog] .txt-lead {
    color: #0000a0
}

.cat-summary .txt-lead:before {
    background-image: url(../images/article/catmark.png);
    background-size: cover;
    content: "";
    height: 54px;
    left: 50%;
    position: absolute;
    top: 0;
    width: 57px;
    transform: translate(-50%, -125%)
}

.cat-summary[data-summay=dog] .txt-lead:before {
    background-image: url(../images/article/dogmark.png);
    height: 56px;
    width: 67px
}

.cat-summary .txt {
    font-size: .9375rem;
    margin-bottom: 0
}

@media (min-width: 750px) {
    .cat-summary .cat-summary-inside {
        margin-left: auto;
        margin-right: auto;
        max-width: 660px;
        width: 100%
    }

    .cat-summary .txt-lead {
        font-size: 1rem;
        font-weight: 700
    }

    .cat-summary .txt {
        font-size: 1rem
    }
}

.catguide-backnumber {
    padding-top: 75px
}

.catguide-backnumber .mod-ttl-cts {
    color: #3c3c3c;
    font-size: 1.5625rem;
    margin-bottom: 35px;
    padding-bottom: 0;
    padding-top: 0;
    text-align: center
}

.catguide-backnumber .list-backnumber {
    padding-left: 12.5px;
    padding-right: 12.5px
}

.catguide-backnumber .list-backnumber ul {
    margin-bottom: 0;
    padding-bottom: 0;
    padding-left: 0
}

.catguide-backnumber .list-backnumber ul>li {
    border-bottom: 1px solid #f5f0e6
}

.catguide-backnumber .list-backnumber ul>li a {
    display: flex;
    align-items: center;
    min-height: 53px;
    height: 100%;
    padding-bottom: 5px;
    padding-top: 5px;
    text-decoration: none
}

.catguide-backnumber .list-backnumber ul>li a:hover {
    text-decoration: underline
}

.catguide-backnumber .list-backnumber ul>li a span {
    padding-left: 17px;
    padding-right: 17px;
    position: relative
}

.catguide-backnumber .list-backnumber ul>li a span:before {
    border-style: solid;
    border-width: 6.25px 0 6.25px 6px;
    border-color: transparent transparent transparent #ff1414;
    content: "";
    left: 0;
    position: absolute;
    top: 4px
}

.catguide-backnumber[data-backnumber=dog] .list-backnumber ul>li a span:before {
    border-color: transparent transparent transparent #0000a0
}

.catguide-backnumber .list-backnumber .btn-expand {
    display: block;
    margin-top: 65px;
    font-size: 1.0625rem;
    position: relative;
    text-align: center
}

.catguide-backnumber .list-backnumber .btn-expand:after {
    border-bottom: 1px solid #ff1414;
    border-right: 1px solid #ff1414;
    content: "";
    height: 12.5px;
    left: 50%;
    position: absolute;
    top: 100%;
    width: 12.5px;
    transform: translate(-50%) rotate(45deg)
}

.catguide-backnumber[data-backnumber=dog] .list-backnumber .btn-expand:after {
    border-bottom: 1px solid #0000a0;
    border-right: 1px solid #0000a0
}

.catguide-backnumber .list-backnumber .btn-expand a {
    color: #3c3c3c;
    text-decoration: none
}

.catguide-backnumber .list-backnumber.open .btn-expand {
    display: none
}

.catguide-backnumber+.transition-btn {
    margin-bottom: 130px
}

@media (min-width: 750px) {
    .catguide-backnumber {
        padding-top: 55px
    }

    .catguide-backnumber .cts-inner {
        margin-left: auto;
        margin-right: auto;
        max-width: 860px;
        width: 100%
    }

    .catguide-backnumber .mod-ttl-cts {
        font-size: 1.75rem;
        text-align: center
    }

    .catguide-backnumber .list-backnumber {
        padding-left: 0;
        padding-right: 0
    }

    .catguide-backnumber .list-backnumber ul {
        display: flex;
        flex-wrap: wrap
    }

    .catguide-backnumber .list-backnumber ul>li {
        margin-right: 10px;
        -webkit-width: calc((100% - 30px) / 3);
        width: calc((100% - 30px) / 3)
    }

    .catguide-backnumber .list-backnumber ul>li:nth-child(3n) {
        margin-right: 0
    }

    .catguide-backnumber .list-backnumber ul>li a {
        min-height: 53px;
        height: 100%;
        padding-bottom: 5px;
        padding-top: 5px
    }

    .catguide-backnumber .list-backnumber ul>li a span {
        padding-left: 39px;
        padding-right: 0
    }

    .catguide-backnumber .list-backnumber ul>li a span:before {
        border-width: 7px 0 7px 7px;
        left: 16px;
        top: 50%;
        transform: translateY(-50%)
    }

    .catguide-backnumber .list-backnumber .btn-expand {
        display: none
    }

    .catguide-backnumber+.transition-btn {
        margin-bottom: 70px
    }
}

.catguide-list-wrp,
.catguide-backnumber {
    padding-bottom: 100px
}

.article-wrp {
    background: #fff
}

.oct-card--series .oct-card__media {
    margin: 0 0 10px
}

.oct-card-carousel__container {
    height: 330px !important
}

.oct-ranking-carousel .oct-paddlenav {
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 25%;
    width: 100%
}

@media screen and (min-width: 769px) {
    .oct-browsing-history__content {
        width: 900px
    }

    .oct-ranking-carousel {
        width: 850px;
        margin: 0 auto;
        padding: 0;
        overflow: visible
    }

    .oct-ranking-carousel .oct-paddlenav {
        position: absolute;
        top: 0;
        left: 0;
        margin-top: 20%;
        width: 100%
    }

    .c-pageTtl.-dogSupremo .c-pageTtl__catch {
        color: #fff;
        text-align: left;
        line-height: 1.9;
        top: 60%
    }

    .c-pageTtl.-dogSupremo .c-pageTtl__ttl {
        top: 60%;
        transform: translate(-500px, -130%)
    }
}

.oct-typography--caption {
    text-align: right
}

.oct-browsing-history__background {
    background: none
}

#float {
    position: fixed;
    right: 0;
    bottom: 30px;
    z-index: 99999
}

#float a {
    display: block;
    margin: 10px 0
}

@media only screen and (max-width: 768px) {
    #float a {
        max-width: 90px
    }
}

#fv_area,
#kv_01 {
    background: url("/html/user_data/assets/img/na/bg__medium_3fdfff77-1e7a-4794-9767-82ed01227030.jpg?v=1750209272") repeat
}

#fv_area h2 {
    padding: 20px
}

.center {
    margin: 0 auto;
    text-align: center;
    display: block
}

.notis {
    padding: 20px;
    text-align: center;
    font-size: 80%;
    color: #635346
}

.catch .p-simpleTwoClm__right .p-simpleTwoClm__figure img {
    width: 71.47vw;
    height: auto !important;
    margin-bottom: 4vw
}

.under_red {
    font-size: 110%;
    border-bottom: double #940000
}

@media only screen and (max-width: 768px) {
    .c-pageTtl.-dogSupremo .c-pageTtl__ttl {
        height: 140vw;
        background: url(../images/sample/kv_dog-sp.jpg) no-repeat center top;
        background-size: cover;
        margin-bottom: 6.14vw;
        padding-top: 90.74vw
    }

    .c-pageTtl .c-pageTtl__catch {
        text-align: center;
        font-size: 3.74vw;
        line-height: 1.6;
        color: #fff;
        margin-top: -40vw
    }

    #fv_text {
        padding: 20px
    }

    .catch {
        margin-bottom: 0
    }
}

#fv_anchor ul {
    text-align: center
}

#fv_anchor ul li {
    padding-bottom: 20px
}

@media only screen and (min-width: 769px) {
    #fv_anchor ul {
        padding: 0 0 50px;
        display: flex;
        justify-content: center
    }

    .c-pageTtl.-dogSupremo .c-pageTtl__logo,
    .c-pageTtl__ttl .c-pageTtl__logo__300 {
        width: 300px !important;
        margin-bottom: 8px
    }

    .c-pageTtl.-dogSupremo {
        background: url(/cdn/shop/files/mv-pc_6954fedb-4dbe-4197-b8fa-f0d3292bf50c.jpg?v=1749489759) no-repeat center top;
        background-size: cover
    }

    .c-pageTtl {
        height: 42vw;
        min-height: 420px
    }

    .catch .p-simpleTwoClm__right .p-simpleTwoClm__figure img {
        width: 100%;
        height: auto
    }

    .catch .p-simpleTwoClm__right {
        width: 760px;
        margin: 0 auto
    }

    .u-textSuper-S {
        top: 0
    }
}

@media only screen and (max-width: 768px) {
    .u-textSuper-S {
        top: 0
    }
}

.c-pageTtl_kv1 .c-pageTtl__ttl {
    top: 50%
}

@media only screen and (min-width: 769px) {
    .c-pageTtl_kv1 {
        background: url(../images/na/na/mv-pc.jpg) no-repeat center top;
        background-size: cover;
        height: 29.28vw;
        min-height: 400px;
        padding: 200px 0 145px;
        position: relative;
        text-align: center;
        color: #e5e0ca
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl_kv1 {
        background: url(../images/na/na/mv-sp.jpg);
        background-size: cover;
        height: 78.54vw;
        padding: 39.74vw 0 83px;
        position: relative;
        text-align: center;
        color: #e5e0ca
    }
}

.pointList {
    padding-bottom: 0
}

@media only screen and (max-width: 768px) {
    .pointList {
        padding-top: 12.27vw
    }
}

.pointList .pointList__list {
    position: relative;
    display: flex;
    justify-content: space-between
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__list {
        width: 1000px;
        margin: 90px auto 0
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__list {
        flex-wrap: wrap;
        width: 88vw;
        margin: 52px auto 0
    }
}

.pointList .pointList__item {
    position: relative;
    background: #fff9;
    color: #703117;
    text-align: center;
    transition: all .6s cubic-bezier(.19, 1, .22, 1)
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item {
        width: 230px;
        height: 230px;
        font-size: 20px;
        padding-top: 96px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item {
        width: 42.67vw;
        height: 45.34vw;
        font-size: 3.74vw;
        padding-top: 18.67vw
    }
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:hover {
        background: #fffc;
        transform: translateY(4px)
    }

    .pointList .pointList__item:hover:after {
        bottom: 12px
    }
}

.pointList .pointList__item:before {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    transform: translate(-50%)
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:first-child {
        margin-bottom: 18.14vw
    }
}

.pointList .pointList__item:first-child:before {
    background: url(../images/na/na/img-01.png)
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:first-child:before {
        width: 232px;
        height: 141px;
        background-size: 232px 141px !important;
        top: -50px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:first-child:before {
        width: 45.87vw;
        height: 28vw;
        background-size: 45.87vw 28vw !important;
        top: -10.66vw
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:nth-child(2) {
        margin-bottom: 18.14vw
    }
}

.pointList .pointList__item:nth-child(2):before {
    background: url(../images/na/na/img-02.png)
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:nth-child(2):before {
        width: 157px;
        height: 154px;
        background-size: 157px 154px !important;
        top: -60px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:nth-child(2):before {
        width: 31.74vw;
        height: 31.2vw;
        background-size: 31.74vw 31.2vw !important;
        top: -13.33vw
    }
}

.pointList .pointList__item:nth-child(3):before {
    background: url(../images/na/na/img-03.png)
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:nth-child(3):before {
        width: 163px;
        height: 136px;
        background-size: 163px 136px !important;
        top: -55px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:nth-child(3):before {
        width: 33.6vw;
        height: 28.27vw;
        background-size: 33.6vw 28.27vw !important;
        top: -10.66vw
    }
}

.pointList .pointList__item:last-child:before {
    background: url(../images/na/na/img-04.png)
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:last-child:before {
        width: 183px;
        height: 142px;
        background-size: 183px 142px !important;
        top: -61px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:last-child:before {
        width: 37.87vw;
        height: 29.34vw;
        background-size: 37.87vw 29.34vw !important;
        top: -12.53vw
    }
}

.pointList .pointList__item:after {
    content: "";
    display: block;
    position: absolute;
    background: url(https://nutro.jp/wp-content/themes/nutro/assets/img/cmn/icon_arrow-dark.svg);
    left: 50%;
    transform: translate(-50%) rotate(90deg)
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__item:after {
        width: 8px;
        height: 15px;
        background-size: 8px 15px !important;
        bottom: 16px;
        transition: bottom .6s cubic-bezier(.19, 1, .22, 1)
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__item:after {
        width: 2.14vw;
        height: 4vw;
        background-size: 2.14vw 4vw !important;
        bottom: 4vw
    }
}

.pointList .pointList__num {
    font-family: Crimson Text, serif
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__num {
        font-size: 28px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__num {
        font-size: 5.34vw
    }
}

.pointList .pointList__ancker {
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    background: none !important
}

.pointList .pointList__ancker span {
    display: block;
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    width: 100%;
    line-height: 1.4;
    letter-spacing: .04em
}

@media only screen and (min-width: 769px) {
    .pointList .pointList__ancker span {
        bottom: 39px
    }
}

@media only screen and (max-width: 768px) {
    .pointList .pointList__ancker span {
        bottom: 9.34vw
    }
}

@media only screen and (max-width: 768px) {
    .p-bgTwoClm .p-bgTwoClm__ttl {
        text-align: center;
        line-height: 1.4
    }
}

@media only screen and (min-width: 769px) {
    .p-bgTwoClm .p-bgTwoClm__btn {
        width: 378px
    }
}

@media only screen and (max-width: 768px) {
    .p-bgTwoClm .p-bgTwoClm__btn {
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 4vw;
        width: 84vw;
        height: 18.67vw;
        line-height: 1.4
    }
}

.c-ttl-01 {
    font-weight: 700
}

@media only screen and (max-width: 768px) {
    .deliciousness-03 {
        padding: 0;
        margin: auto
    }

    .c-ttl-01 {
        font-size: 5.34vw;
        text-align: left;
        letter-spacing: .08em
    }

    .c-catch {
        font-size: 4vw !important;
        line-height: 1.9 !important;
        margin-top: 8.54vw !important
    }

    .c-smallTxt {
        font-size: 3.47vw;
        margin-top: 3.74vw
    }

    .c-greenBdrTtl,
    #kv_02 h1 {
        font-size: 4.8vw !important;
        padding-bottom: 3.74vw;
        margin-bottom: 5.34vw;
        letter-spacing: .08em
    }

    .aboutFirst__head {
        margin-top: 30px
    }

    .c-greenBdrTtl {
        margin-top: 5.34vw
    }

    #point01_cnt,
    #point02_cnt,
    #point03_cnt,
    #point04_cnt,
    .p01-movie,
    #point02_cnt02,
    #point03_cnt02,
    #point03_cnt03,
    .sup_features_txt,
    .nat_features_txt,
    .wil_features_txt {
        font-size: 3.47vw
    }

    #point01_cnt span,
    #point02_cnt span,
    #point03_cnt span,
    #point04_cnt span,
    #point02_cnt02 ul li span,
    .sup_features_txt li span,
    .nat_features_txt li span,
    .wil_features_txt li span {
        font-size: 4vw !important;
        line-height: 1.9
    }
}

.c-greenBdrTtl {
    border-bottom: 2px solid #2f3c0d;
    font-weight: 600;
    color: #2f3c0d
}

.aboutFirst__figure {
    margin: 0 0 50px
}

@media only screen and (min-width: 769px) {
    #point04_cnt {
        width: 50%;
        margin-top: 50px;
        position: relative;
        right: 0;
        margin-right: 0
    }

    #point04_cnt img {
        position: absolute;
        top: -40px;
        left: -20px;
        width: 33%
    }

    #point04_cnt span {
        padding-left: 150px
    }

    .c-ttl-01 {
        margin: 30px 0;
        font-size: 26px;
        text-align: center
    }

    .aboutFirst .aboutFirst__head {
        text-align: center;
        margin: 50px auto 30px
    }

    .c-greenBdrTtl {
        font-size: 18px !important;
        padding-bottom: 14px;
        margin-bottom: 28px !important;
        padding-top: 40px
    }
}

#kv_02 {
    background: url(../images/na/common/bg_right.jpg)
}

#kv_02 h1 {
    text-align: center
}

#kv_02 img {
    padding: 30px 0
}

#kv_02_ttl {
    text-align: center
}

#kv_02_ttl ul {
    padding: 0 20px;
    display: flex;
    justify-content: space-around
}

#kv_02_ttl img {
    padding: 0
}

.kv_02_head {
    width: 100%;
    height: 30px;
    margin: 0 0 50px;
    background: url(../images/bg__dark.jpg)
}

.b_flex {
    display: flex;
    flex-wrap: wrap
}

.pink {
    margin: 0 5px 10px 0;
    padding: 10px 20px;
    background: #cf6685;
    color: #fff
}

.s_ttl {
    margin: 50px 0
}

.osusume {
    padding: 20px
}

.line_up_btn {
    width: 80%;
    margin: 30px auto;
    padding: 10px;
    text-align: center;
    background: #5d3518 url(../images/sample/line_up_bnt_bg.jpg) no-repeat;
    background-size: contain;
    color: #f9f6f0
}

#brand01 {
    padding-top: 10px;
    padding-bottom: 30px;
    max-width: 1100px;
    margin: 0 auto;
    box-sizing: border-box !important
}

#brand01 a,
#brand02 a,
#brand03 a {
    text-decoration: none
}

#brand01_container {
    margin: 0 auto;
    padding: 0 0 30px
}

.s_ttl .under_red {
    color: #c50000;
    border-bottom: 2px solid #c50000
}

.sup_features_txt {
    box-sizing: border-box;
    padding: 20px
}

.sup_features_txt p {
    height: 100%;
    padding: 20px !important;
    border: #cf6685 3px solid;
    border-radius: 9px
}

.sup_features_txt span {
    color: #cf6685;
    font-weight: 600;
    font-size: 16px
}

.sup_features_txt img {
    margin: 0 auto;
    display: block
}

.item a {
    text-decoration: none
}

.info_btn {
    width: 100px;
    background: #cbcbcb url(../images/sample/search_icon.png) no-repeat center left 20px;
    border-radius: 3px;
    display: inline-block
}

.info_btn>a {
    display: block;
    width: 100%;
    height: 100%;
    padding: 20px 0 20px 50px
}

.buy_btn {
    width: 150px;
    background: #8c1e22 url(../images/sample/r_arrow.png) no-repeat center right 12px;
    border-radius: 3px;
    color: #fff;
    display: inline-block
}

.buy_btn>a {
    display: block;
    padding: 20px 0 20px 20px;
    width: 100%;
    height: 100%;
    color: #fff !important
}

.sold_btn {
    width: 150px;
    border-radius: 3px;
    color: #222;
    border: 1px solid rgb(119, 119, 119);
    display: flex;
    align-items: center;
    text-align: center
}

.sold_btn>p {
    display: block;
    padding: 20px 0 20px 20px;
    width: 100%;
    color: #222 !important
}

#sup_item,
#wil_item {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
    margin-top: 20px
}

.item ul {
    margin: 20px;
    display: flex;
    justify-content: center
}

.item ul li {
    margin: 5px
}

@media only screen and (min-width: 769px) {
    .osusume {
        padding: 0 0 0 45px;
        flex-wrap: wrap
    }

    #brand01_container {
        max-width: 1100px;
        margin: 0 auto
    }

    .sup_features_txt {
        padding: 0
    }

    .item {
        width: 310px;
        margin: 30px 10px
    }

    .c-foodsearchBtn {
        width: 590px;
        margin: 0 auto 55px;
        padding: 0 0 0 40px
    }
}

@media only screen and (max-width: 768px) {

    #brand01,
    #brand02,
    #brand03 {
        padding: 10px 0
    }

    .item {
        width: 45%;
        margin: 0 auto 40px
    }

    .item ul {
        margin: 20px auto 0 !important;
        flex-wrap: wrap
    }

    .item img {
        width: 80%;
        margin: 0 auto;
        display: block !important
    }

    .info_btn {
        width: 150px
    }

    .info_btn>a {
        padding: 10px 0 10px 50px !important
    }

    .buy_btn>a {
        padding: 10px 0 10px 20px !important
    }
}

.nat_orange {
    margin: 0 5px 10px 0;
    padding: 10px 20px;
    background: #d59a21;
    color: #fff
}

#brand02 {
    padding-top: 10px;
    padding-bottom: 30px;
    max-width: 1100px;
    margin: 0 auto;
    box-sizing: border-box !important
}

#brand02_container {
    margin: 0 auto;
    padding: 0 0 30px
}

.nat_features_txt {
    box-sizing: border-box;
    padding: 20px
}

.nat_features_txt p {
    height: 100%;
    padding: 20px !important;
    border: #d59a21 3px solid;
    border-radius: 9px
}

.nat_features_txt span {
    color: #d59a21;
    font-weight: 600;
    font-size: 16px
}

.nat_features_txt img {
    margin: 0 auto;
    display: block
}

@media only screen and (max-width: 768px) {
    .nat_1 {
        background: url(/cdn/shop/files/bg_dog-01_3d685449-c014-42df-92d2-76656cb34426.png) no-repeat right 20px top 10px !important;
        background-size: 23%
    }
}

@media only screen and (min-width: 769px) {
    #brand02_container {
        max-width: 1100px;
        margin: 0 auto
    }

    .nat_1 {
        background: url(/cdn/shop/files/bg_dog-01_3d685449-c014-42df-92d2-76656cb34426.png) no-repeat right top 10px !important;
        background-size: 30%
    }

    .nat_features_txt {
        padding: 0
    }

    #nat_item {
        display: flex;
        flex-wrap: wrap;
        justify-content: center
    }
}

.wil_red {
    margin: 0 5px 10px 0;
    padding: 10px 20px;
    background: #c50000;
    color: #fff
}

.s_ttl {
    margin: 50px 0 0
}

#brand03 {
    padding-top: 10px;
    padding-bottom: 30px;
    max-width: 1100px;
    margin: 0 auto;
    box-sizing: border-box !important
}

#brand03_container {
    margin: 0 auto;
    padding: 0 0 30px
}

.wil_features_txt {
    box-sizing: border-box;
    padding: 20px
}

.wil_features_txt p {
    height: 100%;
    padding: 20px !important;
    border: #c50000 3px solid;
    border-radius: 9px
}

.wil_features_txt span {
    color: #c50000;
    font-weight: 600;
    font-size: 16px
}

.wil_features_txt img {
    margin: 0 auto;
    display: block
}

.buy_btn a {
    color: #fff
}

.wil_review .swiper-button-prev,
.wil_review .swiper-button-next {
    top: 20% !important
}

@media only screen and (min-width: 769px) {
    .osusume_wil {
        width: 720px
    }

    #brand03_container {
        max-width: 1100px;
        margin: 0 auto
    }

    .wil_features_txt {
        padding: 0
    }

    #wil_item {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin-top: 20px
    }

    .item {
        margin: 0 10px 30px
    }
}

@media only screen and (max-width: 768px) {

    #sub_main p,
    #sub_con p {
        font-family: source-han-sans-cjk-ja, \6e38\30b4\30b7\30c3\30af, Yu Gothic, YuGothic, \30d2\30e9\30ae\30ce\89d2\30b4 Pro W3, Hiragino Kaku Gothic Pro, Roboto, Helvetica, Arial, sans-serif;
        color: #312215;
        width: 83.2vw;
        font-size: 3.5vw;
        line-height: 1.9;
        margin: 0 auto 7.47vw
    }

    #sub_con h1 {
        font-family: source-han-serif-japanese, Yu Mincho, YuMincho, \30d2\30e9\30ae\30ce\660e\671d Pro, Hiragino Mincho Pro, serif;
        color: #312215;
        width: 100%;
        padding: 10px 10px 10px 30px;
        font-size: 4vw;
        margin: 0 0 8vw;
        background-image: url(../images/bg__dark.jpg)
    }

    #sub_con p .p_bold {
        font-weight: 700
    }

    #sub_con p .p_red {
        font-weight: 700;
        color: #a20000
    }

    .oct-ranking-carousel__item {
        width: 100%
    }
}

.oct-product-card {
    margin: 5px;
    padding: 20px;
    background: #fff;
    box-shadow: 0 0 0 2px #0000001a
}

.oct-typography--caption {
    text-align: left;
    font-family: source-han-sans-cjk-ja, \6e38\30b4\30b7\30c3\30af, Yu Gothic, YuGothic, \30d2\30e9\30ae\30ce\89d2\30b4 Pro W3, Hiragino Kaku Gothic Pro, Roboto, Helvetica, Arial, sans-serif;
    color: #312215;
    font-size: 14px;
    line-height: 1.7em
}

.rev_btn {
    margin: 20px 0 0;
    padding: 20px;
    display: block;
    text-decoration: none;
    border: 1px solid #989898;
    background: url(../images/na/common/icon_arrow-dark.svg) no-repeat right 20px center, -webkit-linear-gradient(top, #dcdcdc 0%, #ffffff 100%);
    border: 1px solid #c0c0c0;
    width: 100%
}

.oct-typography--subtitle1 {
    font-size: 1rem;
    color: #cf6685
}

.oct-typography--subtitle2 {
    font-size: 1rem;
    color: #c50000
}

@media only screen and (min-width: 769px) {
    #sub_con {
        width: 1000px;
        margin: 0 auto;
        padding: 50px 0
    }

    #sub_con h1 {
        font-family: source-han-serif-japanese, Yu Mincho, YuMincho, \30d2\30e9\30ae\30ce\660e\671d Pro, Hiragino Mincho Pro, serif;
        color: #312215;
        margin: 30px 0;
        padding: 10px 0 10px 29px;
        font-size: 20px;
        background-image: url(../images/bg__dark.jpg)
    }

    #sub_con p {
        padding: 0 30px;
        font-family: source-han-sans-cjk-ja, \6e38\30b4\30b7\30c3\30af, Yu Gothic, YuGothic, \30d2\30e9\30ae\30ce\89d2\30b4 Pro W3, Hiragino Kaku Gothic Pro, Roboto, Helvetica, Arial, sans-serif;
        color: #312215;
        font-size: 14px;
        line-height: 1.7em
    }

    #sub_con p .p_red {
        font-weight: 700;
        color: #a20000
    }

    #sub_con p .p_bold {
        font-weight: 700
    }

    .oct-ranking-carousel__item {
        width: 400px
    }
}

/*!
 * btn
 */
.sample_btn_area {
    max-width: 750px;
    margin: 20px auto
}

.sample_btn_area img {
    text-align: center;
    margin: 0 auto 30px;
    display: block
}

@media only screen and (max-width: 768px) {
    .sample_btn_area img {
        width: 80%;
        margin: 0 auto 20px;
        display: block
    }
}

@media screen and (max-width: 320px) {
    .sample_btn_area img {
        width: 90%;
        margin: 0 auto 20px;
        display: block
    }
}

#top_category_area {
    padding: 10px 0 0
}

@-webkit-keyframes tabAnim {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes tabAnim {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.brand_select_ttl {
    max-width: 1100px;
    margin: 20px auto 10px;
    padding: 10px;
    text-align: center;
    font-size: 24px;
    border-top: #63331f double;
    border-bottom: #63331f double
}

.brand_select_ttl p {
    margin: 0;
    font-family: Helvetica Neue, Helvetica, Hiragino Sans, Hiragino Kaku Gothic ProN, Arial, Yu Gothic, Meiryo, sans-serif
}

.brand_caption {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto 10px;
    padding: 20px 0;
    background: #fff;
    font-family: Helvetica Neue, Helvetica, Hiragino Sans, Hiragino Kaku Gothic ProN, Arial, Yu Gothic, Meiryo, sans-serif
}

.brand_caption p {
    text-align: center;
    font-size: 24px;
    color: #63331f
}

@media screen and (max-width: 769px) {
    .brand_select_ttl {
        width: 95%;
        font-size: 18px
    }

    .brand_caption p {
        font-size: 18px;
        font-weight: 600
    }
}

.tab_wrap {
    margin: 0 auto;
    padding: 0
}

.tab_wrap img {
    margin-right: 10px
}

input[type=radio] {
    display: none
}

.tab_area {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    font-size: 0
}

@media screen and (max-width: 769px) {
    .tab_area {
        width: 96%;
        flex-wrap: wrap
    }

    .tab_wrap {
        padding: 0
    }

    .tab_area svg {
        width: 100%
    }
}

.tab_area label {
    height: 70px;
    margin: 0 20px 20px 0;
    padding: 12px 20px;
    color: #703117;
    fill: #703117;
    text-align: center;
    font-size: 13px;
    cursor: pointer;
    transition: ease .2s opacity;
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    border-radius: 10vh
}

@media screen and (max-width: 769px) {
    .tab_area label {
        width: 80%;
        height: 70px;
        margin: 0 auto 20px
    }
}

.tab_area label:hover {
    opacity: .8
}

.tab_panel {
    width: 100%;
    opacity: 0;
    display: none;
    visibility: hidden;
    overflow: hidden;
    height: 0
}

.panel_area p {
    margin: 0;
    padding: 0
}

#tab_sup:checked~.tab_area .tab_sup_label,
#tab_nat:checked~.tab_area .tab_nat_label,
#tab_wil:checked~.tab_area .tab_wil_label {
    opacity: 1;
    border: solid #703117
}

#tab_sup:checked~.panel_area #panel_sup,
#tab_nat:checked~.panel_area #panel_nat,
#tab_wil:checked~.panel_area #panel_wil {
    display: inline-block;
    visibility: visible;
    height: auto;
    -webkit-animation: tabAnim ease .6s forwards;
    animation: tabAnim ease .6s forwards;
    -ms-animation: tabAnim ease .6s forwards
}

.top_category_bg {
    background: #f5f2eb
}

.tab_panel_category {
    margin: 0 auto 80px;
    width: 100%;
    max-width: 1380px;
    padding: 0 48px
}

.category_img,
.brand_img {
    margin-bottom: 30px;
    display: flex;
    justify-content: center
}

.category_img li {
    padding: 0 10px 10px;
    text-align: center
}

.category_img p {
    font-weight: 600
}

.category_img a:after {
    content: ">"
}

.bnr_six {
    flex-wrap: wrap;
    max-width: 1100px;
    margin: 0 auto 80px
}

.bnr_six li {
    width: 33%
}

@media screen and (max-width: 769px) {
    .tab_panel_category {
        width: 100%;
        margin: 0 auto 30px;
        padding: 0
    }

    .category_img {
        flex-wrap: wrap
    }

    .category_img li {
        width: 50%
    }

    .category_img li img {
        width: 100%
    }
}

.brand_img {
    width: 100%;
    max-width: 1380px;
    margin: 0 auto 50px;
    flex-wrap: wrap
}

.brand_img li {
    margin: 10px;
    -webkit-filter: drop-shadow(0 0 3px rgba(0, 0, 0, .3));
    filter: drop-shadow(0 0 3px rgba(0, 0, 0, .3))
}

.brand_img img {
    width: 100%
}

.top_category_btn {
    display: flex;
    justify-content: center
}

.top_category_btn li {
    width: 25%;
    margin: 0 5px;
    background: #fff;
    position: relative;
    display: inline-block;
    padding: 10px 10px 10px 20px;
    -webkit-filter: drop-shadow(0 0 3px rgba(0, 0, 0, .1));
    filter: drop-shadow(0 0 3px rgba(0, 0, 0, .1))
}

.top_category_btn li a {
    display: block
}

.top_category_btn li a:after {
    content: "";
    width: 6px;
    height: 6px;
    border: 0;
    border-top: solid 2px #703117;
    border-right: solid 2px #703117;
    margin-top: -4px;
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 5%
}

@media screen and (max-width: 769px) {
    .top_category_btn {
        padding: 10px;
        display: block
    }

    .top_category_btn li {
        width: 100%;
        border: 1px solid #daceca;
        -webkit-filter: none;
        filter: none
    }

    .top_category_btn li:first-child {
        border-radius: 10px 10px 0 0;
        border-bottom: none
    }

    .top_category_btn li:last-child {
        border-radius: 0 0 10px 10px
    }
}

.tab_panel_brand {
    background: url(../images/top/bg__medium-light.jpg)
}

.oct-ranking-carousel__container {
    min-height: 315px
}

.home__ranking--dog {
    width: 80%;
    max-width: 1000px;
    margin: 0 auto
}

@media screen and (max-width: 769px) {
    .home__ranking--dog {
        width: 100%
    }
}

.top_review_area {
    padding: 0 0 60px;
    position: relative;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto
}

.top_review,
.top_review_cat {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto
}

.top_review__content {
    display: flex
}

.top_review__content img {
    width: 100%
}

.top_review_star {
    color: #e1a401;
    font-size: 25px;
    font-weight: 600
}

.top_review_star svg {
    fill: #e1a401
}

.top_review__content p {
    padding: 0 50px
}

@media screen and (max-width: 769px) {
    .top_review_area {
        padding: 0;
        position: relative;
        width: 100%;
        margin: 0 auto
    }

    .top_review {
        width: 100%
    }

    .top_review__content {
        display: block;
        padding: 0 20px
    }

    .top_review_area .swiper-button-prev,
    .top_review_area .swiper-container-rtl .swiper-button-next {
        left: 0% !important;
        top: 20%
    }

    .top_review_area .swiper-button-next,
    .top_review_area .swiper-container-rtl .swiper-button-prev {
        right: 0% !important;
        top: 20%
    }

    .top_review__content img {
        width: 100%
    }
}

.sub_ttl {
    display: block;
    width: 1100px;
    padding: 0 0 20px;
    margin: 50px auto 30px;
    text-align: left;
    font-size: 30px;
    font-weight: 600;
    color: #703117
}

@media screen and (max-width: 769px) {
    .sub_ttl {
        width: 97%;
        text-align: center;
        font-size: 1.8rem;
        font-weight: 600
    }
}

.sub_ttl span {
    font-size: 40%
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
    right: 0 !important;
    left: auto
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
    left: 0 !important;
    right: auto;
    transform: rotate(180deg)
}

.swiper-slide {
    height: auto !important
}

.features_box {
    height: 100%;
    padding-bottom: 40px
}

.home-series__content {
    position: relative;
    margin: 0 auto;
    padding-bottom: 90px;
    max-width: 1100px;
    z-index: 1
}

.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
    opacity: 0 !important;
    cursor: auto;
    pointer-events: none
}

@media only screen and (min-width: 769px) {
    .l-basicSection {
        padding: 30px 0 80px
    }
}

@media only screen and (max-width: 768px) {
    .pointList {
        padding-top: 0 !important
    }

    .sp_ml10 {
        margin-left: 10px;
        font-size: 100% !important
    }
}

@media screen and (min-width: 769px) {
    .oct-globalnav__placeholder {
        height: 149px !important
    }
}

#wrapper {
    background: #f5f2eb
}

.main.sample .tab_wrap .brand_mv img {
    margin: 0 auto
}

.main.sample #sup_item,
.main.sample #wil_item {
    max-width: 994px;
    justify-content: flex-start;
    gap: 30px 32px;
    margin: 20px auto 0
}

.main.sample #sup_item .item,
.main.sample #wil_item .item {
    width: 310px;
    margin: 0
}

.main.sample #sup_item .item img,
.main.sample #wil_item .item img {
    margin: 0
}

@media only screen and (max-width: 768px) {

    .main.sample #sup_item,
    .main.sample #wil_item {
        gap: 24px 8px;
        padding: 0 16px
    }

    .main.sample #sup_item .item,
    .main.sample #wil_item .item {
        width: calc(50% - 4px)
    }

    .main.sample #sup_item .item img,
    .main.sample #wil_item .item img {
        width: 100%
    }

    .main.sample #sup_item .item ul,
    .main.sample #wil_item .item ul {
        margin-top: 5px !important
    }
}

/*# sourceMappingURL=/cdn/shop/t/4/assets/from-oldsite-202505.css_sample_lp_style.css.map?v=74882692740169809531753832213 */


/* from-oldsite-202505.css_top.css */


ul {
    margin: 0;
    padding: 0
}

li {
    list-style: none
}

img {
    vertical-align: bottom !important
}

iframe {
    display: block
}

iframe[src="common/header.xhtml"] {
    height: 88px
}

iframe[src="common/sidebar-mypage.xhtml"],
iframe[src="common/sidebar.xhtml"] {
    display: none
}

@media screen and (min-width: 769px) {
    iframe[src="common/header.xhtml"] {
        height: 164px
    }

    iframe[src="common/sidebar-mypage.xhtml"],
    iframe[src="common/sidebar.xhtml"] {
        display: block
    }
}

#error {
    padding: 0
}

.top_info {
    width: 100%;
    padding: 10px 0;
    text-align: center
}

.top_info summary {
    color: #b02a2a;
    font-weight: 600
}

.top_info summary:after {
    right: 10% !important
}

.top_info details[open] summary:after {
    right: 10%
}

.top_info p {
    position: relative;
    margin: 0
}

.top_info p a {
    color: #b02a2a;
    font-weight: 600;
    display: block
}

@media screen and (min-width: 769px) {
    .KV {
        position: relative
    }

    .KV_on {
        position: absolute;
        bottom: 0;
        z-index: 100
    }

    .KV .swiper-pagination-bullets {
        bottom: -5px !important;
        z-index: 99999
    }
}

.swiper-pagination {
    width: 100%
}

.swiper-pagination-bullet {
    margin: 0 5px
}

.swiper-pagination-bullet-active {
    border: 1px solid #fc790f
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #fc790f
}

.pickup {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto
}

.pickup li {
    padding: 20px
}

.top_pickup__content img {
    width: 100%
}

.pickup .swiper-button-prev {
    left: 0
}

.pickup .swiper-button-next {
    right: 0
}

@media screen and (max-width: 769px) {
    .pickup {
        width: 100%
    }

    .pickup li {
        padding: 5px
    }

    .top_pickup__content__content {
        display: block
    }

    .swiper-button-prev,
    .swiper-container-rtl .swiper-button-next {
        left: -3.5% !important
    }

    .swiper-button-next,
    .swiper-container-rtl .swiper-button-prev {
        right: -3.5% !important
    }

    #tc_area_wrap .sub_ttl {
        padding: 30px 0 10px
    }

    .pickup .swiper-button-prev,
    .pickup .swiper-button-next {
        padding: 0 0 5px 5px;
        position: absolute;
        top: 61%;
        width: 28px;
        height: 28px;
        margin-top: calc(-1 * var(--swiper-navigation-size) / 2);
        z-index: 10;
        background: #fff !important;
        border: 1px solid #ccc;
        border-radius: 50%
    }
}

#top_campaign_area .bg_opacity {
    padding: 35px 0
}

.bg_opacity {
    background: #ffffff4d
}

.sub_ttl {
    padding: 20px 0;
    text-align: center;
    font-size: 46px;
    font-weight: 600
}

.sub_ttl span {
    font-size: 50%
}

@media screen and (max-width: 769px) {
    .sub_ttl {
        text-align: center;
        font-size: 2.3rem;
        font-weight: 600
    }

    .sub_ttl span {
        font-size: 70%
    }
}

@media screen and (max-width: 769px) {
    #top_campaign_area .bg_opacity {
        padding: 0 0 1px
    }
}

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

#top_official_area a:hover {
    text-decoration: underline
}

#top_official_area {
    padding: 40px 0 0;
    background: #fff
}

#top_official_area ul {
    margin-bottom: 10px;
    display: flex;
    justify-content: center
}

#top_official_area ul li {
    text-align: center;
    padding: 20px
}

#top_official_area ul li:first-child {
    margin-right: 50px
}

#top_official_area ul li:nth-child(2) {
    margin-right: 30px
}

.notes {
    width: 770px;
    margin: 0 auto 50px;
    color: #b02a2a;
    text-align: right;
    font-size: small
}

@media screen and (max-width: 769px) {
    #top_official_area {
        padding: 40px 0 0;
        margin-bottom: 60px;
        background: #fff
    }

    #top_official_area ul {
        flex-wrap: wrap;
        padding: 0 10px
    }

    #top_official_area ul li {
        width: 50%;
        margin: 0 !important;
        padding: 15px 0;
        font-size: .8em
    }

    .notes {
        width: 80%;
        text-align: left;
        font-size: x-small
    }
}

#top_category_area {
    padding: 10px 0 0;
    background: #f5f2eb
}

#top_category_area a {
    color: #703117
}

@-webkit-keyframes tabAnim {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes tabAnim {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.tab_wrap {
    margin: 0 auto;
    padding: 50px 0 0
}

input[type=radio] {
    display: none
}

.HTMLFORM_ELEMENT input[type=radio] {
    display: inline-block
}

.HTMLFORM_ELEMENT label {
    cursor: pointer
}

.tab_area {
    width: 50%;
    max-width: 1020px;
    margin: 0 auto;
    padding: 5px 0;
    display: flex;
    font-size: 0;
    border: 1px solid #daceca
}

@media screen and (max-width: 769px) {
    .tab_area {
        width: 95%
    }

    .tab_wrap {
        padding: 20px 0 0
    }

    .tab_area svg {
        width: 100%
    }
}

.tab_area label {
    width: 50%;
    margin: 0 5px;
    display: inline-block;
    padding: 12px 0;
    color: #703117;
    fill: #703117;
    text-align: center;
    font-size: 13px;
    cursor: pointer;
    transition: ease .2s opacity;
    opacity: .4
}

.tab_area label:hover {
    opacity: .5
}

.tab_panel {
    width: 100%;
    opacity: 0;
    padding: 0 0 20px;
    visibility: hidden;
    overflow: hidden;
    height: 0
}

.panel_area p {
    margin: 0;
    padding: 0
}

#tab_dog:checked~.tab_area .tab_dog_label,
#tab_cat:checked~.tab_area .tab_cat_label {
    background: #703117;
    color: #fff;
    fill: #fff;
    opacity: 1
}

#tab_dog:checked~.panel_area #panel_dog,
#tab_cat:checked~.panel_area #panel_cat {
    visibility: visible;
    height: auto;
    -webkit-animation: tabAnim ease .6s forwards;
    animation: tabAnim ease .6s forwards;
    -ms-animation: tabAnim ease .6s forwards
}

.top_category_bg {
    background: #f5f2eb
}

.tab_panel_category {
    margin: 0 auto 80px;
    width: 100%;
    max-width: 1380px;
    padding: 0 48px
}

.category_img,
.brand_img {
    margin-bottom: 30px;
    display: flex;
    justify-content: center
}

.category_img li {
    padding: 0 10px 10px;
    text-align: center
}

.category_img p {
    font-weight: 600
}

.category_img a:after {
    content: ">"
}

.bnr_six {
    flex-wrap: wrap;
    max-width: 1100px;
    margin: 0 auto 80px;
    justify-content: space-between
}

.bnr_six li {
    width: 33%
}

@media screen and (max-width: 769px) {
    .tab_panel_category {
        width: 100%;
        margin: 0 auto 30px;
        padding: 0
    }

    .category_img {
        flex-wrap: wrap
    }

    .category_img li {
        width: 50%
    }

    .category_img li img {
        width: 100%
    }
}

.brand_img {
    width: 100%;
    max-width: 1380px;
    margin: 0 auto 50px;
    flex-wrap: wrap
}

.brand_img li {
    margin: 10px;
    -webkit-filter: drop-shadow(0 0 3px rgba(0, 0, 0, .3));
    filter: drop-shadow(0 0 3px rgba(0, 0, 0, .3))
}

.brand_img img {
    width: 100%
}

.top_category_btn {
    display: flex;
    justify-content: center
}

.top_category_btn li {
    width: 25%;
    margin: 0 5px;
    background: #fff;
    position: relative;
    display: inline-block;
    padding: 10px 10px 10px 20px;
    -webkit-filter: drop-shadow(0 0 3px rgba(0, 0, 0, .1));
    filter: drop-shadow(0 0 3px rgba(0, 0, 0, .1))
}

.top_category_btn li a {
    display: block
}

.top_category_btn li a:after {
    content: "";
    width: 6px;
    height: 6px;
    border: 0;
    border-top: solid 2px #703117;
    border-right: solid 2px #703117;
    margin-top: -4px;
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 5%
}

@media screen and (max-width: 769px) {
    .top_category_btn {
        padding: 10px;
        display: block
    }

    .top_category_btn li {
        width: 100%;
        border: 1px solid #daceca;
        -webkit-filter: none;
        filter: none
    }

    .top_category_btn li:first-child {
        border-radius: 10px 10px 0 0;
        border-bottom: none
    }

    .top_category_btn li:last-child {
        border-radius: 0 0 10px 10px
    }
}

.tab_panel_brand {
    background: url(../images/top/bg__medium-light.jpg)
}

.oct-ranking-carousel__container {
    min-height: 315px
}

.home__ranking--dog {
    width: 80%;
    max-width: 1000px;
    margin: 0 auto 30px
}

@media screen and (max-width: 769px) {
    .home__ranking--dog {
        width: 100%
    }
}

.top_review_area {
    padding: 0 0 60px;
    position: relative;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto
}

.top_review_area_bg {
    background: url(/cdn/shop/files/bg__medium_3fdfff77-1e7a-4794-9767-82ed01227030.jpg?v=1750209272)
}

.top_review,
.top_review_cat {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto
}

.top_review__content {
    display: flex
}

.top_review__content img {
    width: 100%
}

.top_review_star {
    color: #e1a401;
    font-size: 25px;
    font-weight: 600
}

.top_review_star svg {
    fill: #e1a401
}

.top_review__content p {
    padding: 0 50px
}

@media screen and (max-width: 769px) {
    .top_review_area {
        padding: 0;
        position: relative;
        width: 100%;
        margin: 0 auto
    }

    .top_review {
        width: 100%
    }

    .top_review__content {
        display: block;
        padding: 20px
    }

    .top_review_area .swiper-button-prev,
    .top_review_area .swiper-container-rtl .swiper-button-next {
        left: 0% !important;
        top: 28%
    }

    .top_review_area .swiper-button-next,
    .top_review_area .swiper-container-rtl .swiper-button-prev {
        right: 0% !important;
        top: 28%
    }

    .top_review__content img {
        width: 100%
    }
}

#top_into_area {
    padding: 20px 0 80px;
    background: url(../images/bg__medium-light.jpg)
}

#top_into_container {
    width: 80%;
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.top_into_contents {
    width: 50%;
    display: flex
}

.top_into_contents img {
    width: 40%
}

.top_into_contents section {
    padding: 0 20px
}

.top_into_contents a {
    padding: 10px;
    display: block;
    text-align: center;
    color: #fff;
    background: #5c3518
}

.top_into_contents svg {
    fill: #fff
}

@media screen and (max-width: 769px) {
    #top_into_container {
        width: 100%;
        padding: 10px;
        display: block
    }

    .top_into_contents {
        width: 100%;
        margin-bottom: 30px
    }

    .top_into_contents img {
        width: 40%;
        height: 40%
    }

    .top_into_contents section {
        padding: 0 0 0 10px
    }
}

.home__row {
    margin: 0 auto 80px;
    padding: 24px 0 0
}

@media screen and (min-width: 769px) {
    .home__row {
        margin: 0 auto 80px;
        min-width: 1180px;
        max-width: 1380px;
        padding: 30px 48px 0;
        display: flex
    }
}

@media screen and (min-width: 769px) {
    .home__content {
        flex: 1 1 auto;
        padding-left: 44px
    }
}

.home__divider {
    margin: 52px 0;
    display: block;
    height: 1px;
    background-color: #2f2016;
    border: none;
    opacity: .2
}

@media screen and (min-width: 769px) {
    .home__divider {
        margin: 60px 0
    }
}

@media screen and (min-width: 769px) {
    .home-browsing-history {
        padding-bottom: 80px
    }
}

.home-diagnosis {
    padding: 60px 24px
}

@media screen and (min-width: 769px) {
    .home-diagnosis {
        min-width: 1180px;
        padding: 80px 48px
    }
}

.home-diagnosis__content {
    margin: 0 auto;
    max-width: 1100px
}

.home-diagnosis__content .oct-section-header__primary-text br,
.home-diagnosis__content .oct-section-header__secondary-text br {
    display: none
}

.home-diagnosis__hero {
    padding-top: 41.2844%
}

@media screen and (min-width: 769px) {
    .home-diagnosis__hero {
        margin-bottom: 40px;
        padding-top: 20.45455%
    }
}

.home-diagnosis-filter {
    margin-bottom: 20px
}

.home-diagnosis-filter .oct-form-card-list__item {
    flex: 0 0 100%
}

.home-diagnosis-filter .oct-checkbox {
    width: 240px;
    margin: -8px 0
}

.home-diagnosis-filter .oct-checkbox__label {
    text-align: left;
    line-height: 1.2;
    margin-right: 0
}

@media screen and (min-width: 769px) {
    .home-diagnosis-filter .oct-form-card-list__item {
        flex: 0 0 25%
    }

    .home-diagnosis-filter .oct-checkbox {
        width: 100%
    }
}

.home-diagnosis-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center
}

.home-diagnosis-actions__item {
    margin: 6px auto
}

@media screen and (min-width: 769px) {
    .home-diagnosis-actions__item {
        margin: 0 6px
    }
}

.home-diagnosis-actions__item--cancel,
.home-diagnosis-actions__item--submit {
    min-width: 260px
}

@media screen and (min-width: 769px) {
    .home-diagnosis-actions__item--cancel {
        min-width: 200px
    }
}

.home-features {
    position: relative;
    padding: 60px 24px;
    border-bottom: 1px solid rgba(0, 0, 0, .2)
}

@media screen and (min-width: 769px) {
    .home-features {
        padding: 80px 48px
    }
}

.home-features__content {
    position: relative;
    margin: 0 auto;
    max-width: 1100px;
    z-index: 1
}

.home-features-card-list {
    margin: -12px;
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    list-style: none
}

@media screen and (min-width: 769px) {
    .home-features-card-list {
        margin: 0 -12px
    }
}

.home-features-card-list__item {
    flex: 0 0 100%;
    padding: 12px;
    box-sizing: border-box
}

@media screen and (min-width: 769px) {
    .home-features-card-list__item {
        flex: 0 0 50%;
        padding: 0 12px
    }
}

.home-features-card {
    padding: 36px 20px;
    background-color: #f0ede1;
    -webkit-filter: drop-shadow(0 0 3px rgba(0, 0, 0, .3));
    filter: drop-shadow(0 0 3px rgba(0, 0, 0, .3))
}

.home-features-card__content {
    text-align: center;
    color: #703117;
    margin: 0 auto
}

.home-features-card__image {
    margin-bottom: 24px;
    height: 75px
}

.home-features-card__primary-text {
    font-family: source-han-serif-japanese, Yu Mincho, YuMincho, \30d2\30e9\30ae\30ce\660e\671d Pro, Hiragino Mincho Pro, serif;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.55556;
    letter-spacing: .025em;
    margin: -.27778em 0 1.05556em;
    -webkit-font-smoothing: antialiased
}

.home-features-card__primary-text strong {
    color: red
}

.home-features-card__secondary-text {
    font-family: source-han-serif-japanese, Yu Mincho, YuMincho, \30d2\30e9\30ae\30ce\660e\671d Pro, Hiragino Mincho Pro, serif;
    font-size: .875rem;
    line-height: 1.71429;
    letter-spacing: .025em;
    margin: -.35714em 0;
    -webkit-font-smoothing: antialiased
}

.home-features-card__secondary-text strong {
    color: red
}

.home-features__background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.home-series {
    position: relative;
    padding: 60px 0
}

@media screen and (min-width: 769px) {
    .home-series {
        padding: 80px 48px 120px
    }
}

.home-series__content {
    position: relative;
    margin: 0 auto;
    max-width: 1100px;
    z-index: 1
}

.home-series__background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.home-floating-banner {
    position: fixed;
    right: 0;
    bottom: 12px;
    width: 136px;
    z-index: 2
}

@media screen and (min-width: 769px) {
    .home-floating-banner {
        bottom: 40px;
        width: 160px
    }

    .oct-banner--initialized .home-floating-banner {
        bottom: 90px
    }
}

.home-floating-banner__section {
    text-align: center;
    color: #703117;
    margin-bottom: 6px;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
    -webkit-filter: drop-shadow(0 0 3px rgba(0, 0, 0, .3));
    filter: drop-shadow(0 0 3px rgba(0, 0, 0, .3))
}

.home-fb-one-coin__text {
    padding: 16px 0 12px
}

.home-fb-one-coin__primary-text {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1;
    margin: 0 0 .375em;
    display: block
}

.home-fb-one-coin__secondary-text {
    font-family: source-han-serif-japanese, Yu Mincho, YuMincho, \30d2\30e9\30ae\30ce\660e\671d Pro, Hiragino Mincho Pro, serif;
    font-size: .75rem;
    font-weight: 400;
    line-height: 1;
    margin: 0 0 .41667em;
    display: block
}

.home-fb-one-coin__price-text {
    font-size: 2.125rem;
    font-weight: 600;
    line-height: 1;
    margin: 0;
    display: block
}

.home-fb-one-coin__price-text small {
    font-size: .3em
}

.home-fb-one-coin-action {
    border-top: 1px solid rgba(0, 0, 0, .2)
}

.home-fb-one-coin-action__link {
    color: inherit;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 36px;
    padding: 0 12px
}

.home-fb-one-coin-action__link:hover,
.home-fb-one-coin-action__link:link,
.home-fb-one-coin-action__link:visited {
    color: inherit
}

@media screen and (min-width: 769px) {
    .home-fb-one-coin-action__link {
        height: 52px;
        padding: 0 20px
    }
}

.home-fb-one-coin-action__image {
    display: none
}

@media screen and (min-width: 769px) {
    .home-fb-one-coin-action__image {
        display: block;
        height: 32px
    }
}

.home-fb-one-coin-action__txt {
    font-size: .75rem;
    font-weight: 500;
    line-height: 1.33333;
    text-align: left;
    margin: 0;
    display: block
}

.home-fb-one-coin-action__txt small {
    font-size: 1em;
    display: none
}

@media screen and (min-width: 769px) {
    .home-fb-one-coin-action__txt {
        width: 86px
    }

    .home-fb-one-coin-action__txt small {
        display: inline
    }
}

.home-fb-diagnosis__image {
    display: none
}

@media screen and (min-width: 769px) {
    .home-fb-diagnosis__image {
        display: block;
        margin-bottom: 16px;
        width: 100%
    }
}

.home-fb-diagnosis__link {
    color: inherit
}

.home-fb-diagnosis__link:hover,
.home-fb-diagnosis__link:link,
.home-fb-diagnosis__link:visited {
    color: inherit;
    text-decoration: none
}

.home-fb-diagnosis__link:hover .home-fb-diagnosis__secondary-text {
    text-decoration: underline
}

.home-fb-diagnosis__text {
    padding-top: 16px;
    padding-bottom: 12px
}

@media screen and (min-width: 769px) {
    .home-fb-diagnosis__text {
        padding-top: 0
    }
}

.home-fb-diagnosis__primary-text {
    font-family: source-han-serif-japanese, Yu Mincho, YuMincho, \30d2\30e9\30ae\30ce\660e\671d Pro, Hiragino Mincho Pro, serif;
    font-size: .875rem;
    font-weight: 600;
    letter-spacing: .05em;
    line-height: 1;
    margin: 0 0 .64286em;
    display: block
}

.home-fb-diagnosis__secondary-text {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: .05em;
    line-height: 1.2;
    margin: -.1em 0;
    display: block
}

.news_topics {
    width: 95%;
    margin: 3% auto 0;
    max-width: 1000px;
    font-size: 80%
}

.ttl_news {
    text-align: center;
    padding: 0;
    margin: 0
}

.txt_news {
    text-align: center
}

.br_color {
    color: #703117
}

.panel_area video {
    max-width: 1100px;
    margin: 20px auto 0
}

.item_panel_category {
    max-width: 1034px;
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    margin: 0 auto
}

.item_panel_care {
    width: 65%;
    margin: 0 1% 0 0
}

.item_panel_life {
    width: 33%;
    margin: 0 0 0 1%
}

.item_panel_care,
.item_panel_life {
    background: url(../images/bg__medium-light.jpg)
}

.item_title {
    text-align: center;
    padding: 10px;
    background: url(../images/bg__dark.jpg);
    font-size: 18px;
    font-weight: 600
}

.item_area_care {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    padding: 10px 0 25px 25px
}

.item_area_care ul {
    width: 100%
}

.item_area_life {
    width: 100%;
    padding: 10px 25px 25px
}

.item_icon {
    display: table-cell;
    width: 60px;
    height: 50px;
    vertical-align: middle
}

.item_icon_care {
    display: table-cell;
    width: 50px;
    height: 50px;
    background: #f7f3e2;
    border-radius: 50%
}

.item_btn_care {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    padding-right: 25px
}

.item_btn_care li {
    position: relative;
    width: 100%;
    padding: 12px 20px 12px 0;
    border-bottom: dashed 1px #703117
}

.item_btn_care li a:after {
    content: "";
    width: 10px;
    height: 10px;
    border: 0;
    border-top: solid 2px #703117;
    border-right: solid 2px #703117;
    margin-top: -4px;
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 2%
}

.item_text_care {
    display: table-cell;
    height: 50px;
    vertical-align: middle;
    font-size: 14px;
    font-weight: 600
}

.item_btn_life {
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

.item_btn_life li {
    position: relative;
    width: 100%;
    padding: 12px 0;
    border-bottom: dashed 1px #703117
}

.item_btn_life li a:after {
    content: "";
    width: 10px;
    height: 10px;
    border: 0;
    border-top: solid 2px #703117;
    border-right: solid 2px #703117;
    margin-top: -4px;
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 2%
}

@media screen and (max-width: 769px) {
    .item_panel_category {
        width: 100%;
        display: block
    }

    .item_panel_care {
        width: 90%;
        margin: 0 auto 30px
    }

    .item_panel_life {
        width: 90%;
        margin: 0 auto
    }

    .item_title {
        font-size: 20px
    }

    .item_text_care {
        font-size: 16.5px
    }

    .item_area_care {
        width: 100%;
        display: block;
        padding: 10px 0 35px 25px
    }

    .item_area_life {
        width: 100%;
        padding: 10px 25px 35px
    }
}

.main {
    font-family: Roboto, Noto Sans JP, sans-serif !important;
    margin-bottom: -5%
}

.top_tab_wrap {
    background-color: #f5f2eb;
    margin-top: 40px
}

.ttl_link_wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 40px;
    padding-bottom: 30px
}

.ttl_link_wrap .sub_ttl {
    padding: 0
}

.ttl_link_wrap .sub_ttl p {
    font-size: 30px;
    font-weight: 700;
    line-height: 34px;
    margin-bottom: 0
}

.ttl_link_wrap>a {
    font-size: 14px;
    font-weight: 700;
    line-height: 24px;
    display: block;
    position: relative;
    padding-right: 24px;
    text-decoration: none;
    color: #703117
}

.ttl_link_wrap>a:before {
    content: "";
    vertical-align: middle;
    display: inline-block;
    color: #703117;
    line-height: 1;
    width: 10px;
    height: 10px;
    border: 2px solid #703117;
    border-left: 0;
    border-bottom: 0;
    transform: rotate(45deg);
    position: absolute;
    top: 7px;
    right: 0
}

.top_tab_wrap .panel_dog,
.top_tab_wrap .panel_cat {
    position: relative;
    opacity: 0;
    visibility: hidden;
    height: 0
}

#tab_dog:checked~.top_tab_wrap .panel_dog,
#tab_cat:checked~.top_tab_wrap .panel_cat {
    visibility: visible;
    height: auto;
    -webkit-animation: tabAnim ease .6s forwards;
    animation: tabAnim ease .6s forwards;
    -ms-animation: tabAnim ease .6s forwards
}

.ttl_link_wrap>.link_dog,
.ttl_link_wrap>.link_cat {
    display: none
}

#tab_dog:checked~.top_tab_wrap .link_dog,
#tab_cat:checked~.top_tab_wrap .link_cat {
    display: block
}

@media screen and (max-width: 769px) {
    .top_tab_wrap {
        margin-top: 40px
    }

    .ttl_link_wrap {
        padding-top: 24px;
        padding-bottom: 20px
    }

    .top_tab_wrap .sub_ttl p {
        font-size: 18px;
        line-height: 30px
    }

    .ttl_link_wrap>a {
        font-size: 15px
    }
}

.kv_container {
    position: relative
}

.kv_container .swiper-button-prev,
.kv_container .swiper-button-next {
    background-color: #fff !important;
    border: none;
    opacity: .7;
    border-radius: 15px !important;
    width: 40px;
    height: 40px
}

.kv_container .swiper-button-prev p,
.kv_container .swiper-button-next p {
    display: inline-block;
    vertical-align: middle;
    color: #703117;
    line-height: 1;
    width: 20px;
    height: 2px;
    background: #703117;
    position: absolute;
    top: 50%;
    left: 10px
}

.kv_container .swiper-button-prev p:before,
.kv_container .swiper-button-next p:before {
    content: "";
    width: 14px;
    height: 14px;
    border: 2px solid #703117;
    border-left: 0;
    border-bottom: 0;
    transform: rotate(45deg);
    transform-origin: top right;
    position: absolute;
    top: 50%;
    left: 8px
}

.kv_container .swiper-button-prev {
    left: 10px;
    right: auto
}

.kv_container .swiper-button-next {
    right: 10px;
    left: auto
}

.kv_container .swiper-pagination {
    margin-top: 9px
}

.kv_container .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    margin: 0 6px;
    border: 1px solid #703117
}

.kv_container .swiper-pagination-bullet.swiper-pagination-bullet-active {
    opacity: 1;
    background: #703117
}

@media screen and (max-width: 769px) {

    .kv_container .swiper-button-prev,
    .kv_container .swiper-button-next {
        background-color: transparent !important;
        top: auto;
        bottom: -45px
    }

    .kv_container .swiper-button-prev {
        left: 10px !important
    }

    .kv_container .swiper-button-next {
        right: 10px !important
    }

    .kv_container .swiper-pagination {
        margin-top: 13px
    }
}

.tab_area_rn {
    padding: 30px 0 0
}

.tab_area_rn ul {
    width: calc(50% - 8px);
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 16px
}

.tab_area_rn ul li {
    width: calc(50% - 8px);
    white-space: nowrap
}

.tab_area_rn label {
    width: 100%;
    margin-bottom: 0;
    padding: 6px 22px;
    background-color: #f5f2eb;
    border: 2px solid #f5f2eb;
    border-radius: 25px;
    cursor: pointer;
    opacity: 1
}

#tab_dog:checked~.top_tab_wrap .tab_area_rn .tab_dog_label,
#tab_cat:checked~.top_tab_wrap .tab_area_rn .tab_cat_label {
    border-color: #703117
}

#tab_dog:checked~.top_tab_wrap .tab_area_rn .tab_dog_label:before,
#tab_cat:checked~.top_tab_wrap .tab_area_rn .tab_cat_label:before {
    content: " ";
    display: inline-block;
    border: 2px solid currentColor;
    line-height: 1;
    width: 1em;
    height: .45em;
    border-top: 0;
    border-right: 0;
    transform: translateY(-50%) rotate(-45deg);
    margin-right: 8px
}

.tab_area_rn label span {
    font-size: 16px;
    line-height: 19.2px
}

@media screen and (max-width: 769px) {
    .tab_area_rn {
        padding: 20px 0 0
    }

    .tab_area_rn ul {
        width: 100%
    }

    .tab_area_rn label {
        padding: 6px 22px;
        border: 2px solid #f5f2eb;
        border-radius: 25px
    }

    .tab_area_rn label span {
        font-size: 12px;
        line-height: 16px;
        font-weight: 700
    }
}

.top_ranking_wrap {
    background: url(../images/top/bg__medium-light.jpg)
}

.top_ranking_wrap_inner {
    width: 1136px;
    margin: 0 auto
}

.swiper-container.ranking li {
    padding: 0 6px;
    height: auto
}

.swiper-container.ranking a {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding-bottom: 24px;
    text-decoration: none;
    color: #703117
}

.top_ranking_wrap_inner {
    padding-bottom: 40px
}

.top_ranking_img {
    margin-bottom: 8px
}

.top_ranking_img img {
    width: 100%
}

.top_ranking_item_name,
.top_ranking_price,
.top_ranking_brand_name {
    padding: 8px 16px 0;
    margin-bottom: 0
}

.top_ranking_item_name,
.top_ranking_price {
    font-weight: 700;
    line-height: 24px
}

.top_ranking_item_name {
    font-size: 15px
}

.top_ranking_brand_name {
    font-size: 10px;
    line-height: 11px
}

.top_ranking_price {
    font-size: 20px;
    text-align: right
}

.top_ranking_wrap .swiper-slide .top_ranking_item_name {
    flex-grow: 1
}

.top_ranking_wrap .swiper-button-prev-ranking,
.top_ranking_wrap .swiper-button-next-ranking {
    position: absolute;
    border: none;
    opacity: .7;
    width: 40px;
    height: 40px;
    top: 40%;
    z-index: 1
}

.top_ranking_wrap .swiper-button-prev-ranking {
    left: -41px;
    right: auto;
    transform: rotate(180deg)
}

.top_ranking_wrap .swiper-button-next-ranking {
    right: -41px;
    left: auto
}

.top_ranking_wrap .swiper-button-prev-ranking p,
.top_ranking_wrap .swiper-button-next-ranking p {
    display: inline-block;
    vertical-align: middle;
    color: transparent;
    line-height: 1;
    width: 20px;
    height: 0px;
    background: transparent;
    position: absolute;
    top: 50%;
    left: 10px
}

.top_ranking_wrap .swiper-button-prev-ranking p:before,
.top_ranking_wrap .swiper-button-next-ranking p:before {
    content: "";
    width: 14px;
    height: 14px;
    border: 2px solid #703117;
    border-left: 0;
    border-bottom: 0;
    transform: rotate(45deg);
    transform-origin: top right;
    position: absolute;
    top: 50%;
    left: 8px
}

@media screen and (max-width: 769px) {
    .top_ranking_wrap_inner {
        width: 100%;
        padding: 0 16px 40px
    }

    .swiper-container.ranking li {
        padding: 0 4px
    }

    .swiper-container.ranking a {
        padding-bottom: 0
    }

    .top_ranking_wrap_inner {
        padding-bottom: 28px
    }

    .top_ranking_img {
        margin-bottom: 0
    }

    .top_ranking_item_name,
    .top_ranking_price,
    .top_ranking_brand_name {
        padding: 8px 8px 0
    }

    .top_ranking_wrap .swiper-button-prev-ranking,
    .top_ranking_wrap .swiper-button-next-ranking {
        display: none
    }
}

.top_brand_area_bg {
    width: 100%;
    background: url(../images/top/bg__medium-light.jpg) repeat
}

.top_brand_area {
    width: 1136px;
    padding: 15px 0 80px;
    margin: 0 auto
}

.top_brand_list {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: flex-start
}

.top_brand_list li {
    width: 272px;
    text-align: center
}

.top_brand_list a {
    display: block;
    padding: 24px;
    background-color: #fff;
    border-radius: 10px;
    text-decoration: none;
    color: #703117
}

.top_brand_list img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.brand_logo {
    height: 48px
}

.brand_product {
    height: 109px
}

.top_brand_list a p {
    margin-bottom: 16px;
    font-size: 14px;
    font-weight: 700
}

.top_brand_list a p:last-of-type {
    margin-bottom: 0
}

.brand_detail_txt {
    line-height: 18px;
    height: 54px
}

.brand_product_view {
    line-height: 24px;
    position: relative;
    text-indent: -1em
}

.brand_product_view:before {
    content: "";
    vertical-align: middle;
    display: inline-block;
    color: #703117;
    line-height: 1;
    width: 10px;
    height: 10px;
    border: 2px solid #703117;
    border-left: 0;
    border-bottom: 0;
    transform: rotate(45deg);
    position: absolute;
    top: 5px;
    right: 70px
}

@media screen and (max-width: 769px) {
    .top_brand_area {
        width: auto;
        padding: 5px 16px 56px;
        margin: 0 auto
    }

    .top_brand_list li {
        width: calc(50% - 8px)
    }

    .top_brand_list li:nth-child(n+3) {
        margin-bottom: 0
    }

    .top_brand_list a {
        padding: 24px 16px
    }

    .brand_logo {
        height: 31px
    }

    .brand_product {
        height: 71px
    }

    .top_brand_list a p {
        font-size: 12px
    }

    .brand_detail_txt {
        line-height: 18px;
        height: 90px;
        text-align: left
    }

    .top_brand_list a .brand_product_view {
        font-size: 15px;
        line-height: 20px;
        text-indent: -2em
    }

    .brand_product_view:before {
        content: "";
        vertical-align: middle;
        display: inline-block;
        color: #703117;
        line-height: 1;
        width: 10px;
        height: 10px;
        border: 2px solid #703117;
        border-left: 0;
        border-bottom: 0;
        transform: rotate(45deg);
        position: absolute;
        top: 5px;
        right: 20%
    }
}

.top_right_diet_area {
    padding: 80px 0
}

.top_right_diet_inner {
    width: 1136px;
    margin: 0 auto;
    position: relative
}

.top_right_diet_bg {
    width: 1136px;
    height: 445px;
    margin-bottom: 0;
    overflow: hidden;
    border-radius: 15px;
    position: relative
}

.top_right_diet_bg img {
    width: 1380px;
    position: absolute;
    top: -70px;
    left: -80px
}

.top_right_diet_logo {
    width: 76px;
    position: absolute;
    top: 115px;
    left: 40px
}

.top_right_diet_logo img {
    width: 100%
}

.top_right_diet_ttl {
    position: absolute;
    top: 187px;
    left: 40px;
    font-size: 48px;
    line-height: 48px;
    font-weight: 700;
    color: #f5f2eb
}

.top_right_diet_card {
    width: 272px;
    background-color: #eee9de;
    position: absolute;
    top: -16px;
    right: 90px;
    border-radius: 15px;
    box-shadow: 0 4px 9px #0000000f, 0 17px 17px #0000000d, 0 38px 23px #00000008, 0 67px 27px #00000003, 0 105px 29px #0000
}

.top_right_diet_card .top_right_diet_img {
    display: block;
    padding: 30px 60px 23px
}

.top_right_diet_card.top_right_diet_card_cat .top_right_diet_img {
    display: block;
    padding: 0
}

.top_right_diet_card img {
    width: 100%
}

.top_right_diet_txt {
    display: block;
    padding: 16px;
    color: #703117 !important;
    text-decoration: none !important
}

.top_right_diet_txt p {
    margin: 0 auto 8px;
    font-weight: 700
}

.top_right_diet_txt p:last-of-type {
    margin-bottom: 0
}

.top_right_diet_name {
    font-size: 14px;
    font-weight: 700;
    line-height: 16.8px
}

.top_right_diet_brand {
    font-size: 14px;
    line-height: 18px
}

.top_right_diet_price {
    font-size: 20px;
    line-height: 24px;
    text-align: right
}

.top_right_diet_price span {
    font-size: 12px
}

@media screen and (max-width: 769px) {
    .top_right_diet_area {
        padding: 8% 0 calc(485px - 13%)
    }

    .top_right_diet_inner {
        width: 100%;
        padding: 0 16px
    }

    .top_right_diet_bg {
        width: 100%;
        height: auto;
        border-radius: 15px;
        padding-bottom: 80%
    }

    .top_right_diet_bg img {
        width: 190%;
        top: 0;
        left: -15%
    }

    .top_right_diet_logo {
        width: 37%;
        top: 10%;
        left: 10%
    }

    .top_right_diet_ttl {
        top: 48%;
        left: 10%;
        font-size: 5.8vw;
        line-height: 1
    }

    .top_right_diet_card {
        top: 87%;
        right: calc(50% - 136px);
        box-shadow: 0 2px 5px #00000014, 0 8px 8px #00000012, 0 19px 11px #0000000a, 0 33px 13px #00000003, 0 52px 15px #0000
    }

    .top_right_diet_name {
        font-size: 20px;
        line-height: 24px
    }
}

.top_search_bg {
    background: url(../images/bg__light.jpg)
}

.top_search_inner {
    width: 1136px;
    margin: 0 auto;
    padding: 40px 0
}

.top_search_type {
    font-size: 32px;
    line-height: 34px;
    font-weight: 700;
    margin-bottom: 0
}

.top_search_life_stage_list,
.top_search_problem_list {
    display: flex;
    justify-content: space-between;
    margin: 40px auto
}

.top_search_life_stage_list li {
    width: 368px;
    background-color: #fff;
    border-radius: 12px;
    list-style: none
}

.top_search_life_stage_list a,
.top_search_problem_list a {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 29px;
    text-decoration: none;
    color: #703117;
    height: 100%;
    position: relative
}

.top_search_life_stage_list a:before,
.top_search_problem_list a:before {
    content: "";
    vertical-align: middle;
    display: inline-block;
    color: #703117;
    line-height: 1;
    width: 9px;
    height: 9px;
    border: 2px solid #703117;
    border-left: 0;
    border-bottom: 0;
    transform: rotate(45deg);
    position: absolute;
    top: 45%;
    right: 20px
}

.top_search_life_stage_list p,
.top_search_problem_list p {
    margin-bottom: 0
}

.top_search_life_stage_list .top_search_life_img {
    text-align: left;
    width: 80px
}

.top_search_life_stage_list .top_search_life_txt,
.top_search_problem_list .top_search_problem_txt {
    font-size: 14px;
    line-height: 16.8px;
    font-weight: 700
}

.top_search_life_stage_list span {
    display: block;
    margin-top: 8px;
    font-size: 12px;
    line-height: 1;
    font-weight: 400;
    color: #9a847b
}

.top_search_problem_list {
    flex-wrap: wrap;
    gap: 16px
}

.top_search_problem_list li {
    width: 272px;
    background: #fff;
    border-radius: 12px;
    list-style: none
}

.top_search_problem_list .top_search_problem_img {
    width: 80px
}

.top_search_problem_list img {
    width: 100%
}

.top_search_problem_list a {
    padding: 16px 44px 16px 8px;
    gap: 8px
}

.top_search_problem_list .top_search_problem_txt {
    width: 132px
}

.top_tab_wrap .panel_dog .top_search_problem_list a,
.top_tab_wrap .panel_cat .top_search_problem_list a {
    height: 0
}

#tab_dog:checked~.top_tab_wrap .panel_dog .top_search_problem_list a,
#tab_cat:checked~.top_tab_wrap .panel_cat .top_search_problem_list a {
    height: 112px
}

@media screen and (max-width: 769px) {
    .top_search_inner {
        width: 100%;
        margin: 0 auto;
        padding: 24px 16px
    }

    .top_search_type {
        font-size: 18px;
        line-height: 28px
    }

    .top_search_life_stage_list {
        flex-wrap: wrap;
        flex-direction: column;
        margin: 24px auto;
        gap: 16px
    }

    .top_search_life_stage_list li {
        width: 100%
    }

    .top_search_life_stage_list a,
    .top_search_problem_list a {
        padding: 16px 8px 16px 24px;
        height: auto
    }

    .top_search_life_stage_list .top_search_life_stage_list_adult {
        padding: 9px 8px 9px 24px
    }

    .top_search_life_stage_list .top_search_life_txt,
    .top_search_problem_list .top_search_problem_txt {
        font-size: 15px;
        line-height: 24px
    }

    .top_search_life_stage_list span {
        margin-top: 4px;
        font-size: 12px;
        line-height: 1
    }

    .top_search_problem_list {
        margin: 24px auto
    }

    .top_search_problem_list li {
        width: calc(50% - 8px);
        text-align: center
    }

    .top_search_problem_list li:last-of-type a {
        padding: 0
    }

    .top_search_problem_list .top_search_problem_img {
        width: 64px
    }

    .top_search_problem_list a {
        height: 100%;
        padding: 8px 0 16px;
        flex-direction: column;
        justify-content: center;
        gap: 26px
    }

    .top_search_problem_list a:before {
        content: none
    }

    .top_search_problem_list .top_search_problem_txt {
        width: 100%;
        line-height: 18px
    }

    .top_tab_wrap .panel_dog .top_search_problem_list a,
    .top_tab_wrap .panel_cat .top_search_problem_list a {
        height: 0
    }

    #tab_dog:checked~.top_tab_wrap .panel_dog .top_search_problem_list a,
    #tab_cat:checked~.top_tab_wrap .panel_cat .top_search_problem_list a {
        height: 150px
    }
}

.top_blog_area_inner {
    width: 1136px;
    margin: 0 auto;
    padding-bottom: 40px
}

.top_blog_area .sub_ttl p {
    font-size: 32px
}

.top_blog_area a {
    display: block;
    border-radius: 15px;
    overflow: hidden;
    color: #703117;
    text-decoration: none
}

.top_blog_area p {
    margin-bottom: 0
}

.top_blog_area .ttl_link_wrap {
    padding-bottom: 40px
}

.top_blog_area .ttl_link_wrap>a:before {
    right: 2px
}

.top_blog_sl {
    display: flex;
    gap: 16px
}

.top_blog_sl>div {
    width: 560px
}

.top_blog_img img {
    -o-object-fit: cover;
    object-fit: cover
}

.top_blog_img {
    position: relative
}

.top_blog_img span {
    display: block;
    position: absolute;
    left: 16px;
    bottom: 16px;
    color: #f5f2eb;
    background-color: #703117;
    padding: 4px 8px;
    border-radius: 40px;
    font-size: 12px;
    line-height: 1;
    text-align: center
}

.top_blog_txt_area {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 18px;
    background-color: #fff;
    line-height: 24px;
    font-weight: 700
}

.top_blog_txt_area .top_blog_txt {
    font-size: 18px
}

.top_blog_txt_area .top_blog_read {
    display: inline-block;
    position: relative;
    font-size: 14px
}

.top_blog_txt_area .top_blog_read:before {
    content: "";
    vertical-align: middle;
    display: inline-block;
    color: #703117;
    line-height: 1;
    width: 9px;
    height: 9px;
    border: 2px solid #703117;
    border-left: 0;
    border-bottom: 0;
    transform: rotate(45deg);
    position: absolute;
    top: 6px;
    left: 5.5em
}

.top_blog_sl_double a {
    display: flex
}

.top_blog_sl_single .top_blog_img img {
    width: 560px;
    height: 280px
}

.top_blog_sl_double .top_blog_img img {
    width: 272px;
    height: 200px
}

.top_blog_sl_single .top_blog_txt_area {
    height: 136px;
    padding: 0 22px
}

.top_blog_sl_double .top_blog_txt_area {
    width: 288px;
    padding: 0 22px
}

.top_blog_sl_double a:first-of-type {
    margin-bottom: 16px
}

.top_blog_swiper_pc {
    position: relative
}

.swiper-button-prev-blog_pc,
.swiper-button-next-blog_pc {
    position: absolute;
    border: none;
    opacity: .7;
    width: 40px;
    height: 40px;
    top: 40%;
    z-index: 1
}

.swiper-button-prev-blog_pc {
    left: -41px;
    right: auto;
    transform: rotate(180deg)
}

.swiper-button-next-blog_pc {
    right: -41px;
    left: auto
}

.swiper-button-prev-blog_pc p,
.swiper-button-next-blog_pc p {
    display: inline-block;
    vertical-align: middle;
    color: #703117;
    line-height: 1;
    width: 20px;
    height: 2px;
    background: #703117;
    position: absolute;
    top: 50%;
    left: 10px
}

.swiper-button-prev-blog_pc p:before,
.swiper-button-next-blog_pc p:before {
    content: "";
    width: 14px;
    height: 14px;
    border: 2px solid #703117;
    border-left: 0;
    border-bottom: 0;
    transform: rotate(45deg);
    transform-origin: top right;
    position: absolute;
    top: 50%;
    left: 8px
}

.top_blog_swiper_pc img {
    width: 100%
}

.top_blog_swiper_sp {
    display: none
}

@media screen and (max-width: 769px) {
    .top_blog_area {
        padding-bottom: 110px
    }

    .top_blog_area_inner {
        width: 100%;
        padding: 0 16px
    }

    .top_blog_area_inner .ttl_link_wrap {
        padding: 30px 0
    }

    .top_blog_area .sub_ttl {
        margin-bottom: 0
    }

    .top_blog_area .sub_ttl p {
        font-size: 18px;
        line-height: 28px
    }

    .top_blog_area .sub_ttl a {
        line-height: 20px
    }

    .top_blog_area a {
        border-radius: 12px
    }

    .top_blog_sl_single .top_blog_img img {
        width: 100%;
        height: 250px
    }

    .top_blog_img span {
        font-size: 12px;
        line-height: 12px
    }

    .top_blog_sl_single .top_blog_txt_area {
        height: 150px;
        padding: 0 24px
    }

    .top_blog_txt_area .top_blog_txt {
        font-size: 15px;
        line-height: 24px
    }

    .top_blog_txt_area .top_blog_read {
        font-size: 12px;
        line-height: 22px
    }

    .swiper-button-prev-blog_sp,
    .swiper-button-next-blog_sp {
        padding: 9px 0 10px 20px;
        position: absolute;
        z-index: 10;
        cursor: pointer;
        border: none;
        opacity: .7;
        border-radius: 15px;
        width: 40px;
        height: 40px;
        top: auto;
        bottom: -45px
    }

    .swiper-button-prev-blog_sp {
        left: 10px;
        right: auto;
        transform: rotate(180deg)
    }

    .swiper-button-next-blog_sp {
        left: auto;
        right: 10px
    }

    .swiper-button-prev-blog_sp p,
    .swiper-button-next-blog_sp p {
        display: inline-block;
        vertical-align: middle;
        color: #703117;
        line-height: 1;
        width: 20px;
        height: 2px;
        background: #703117;
        position: absolute;
        top: 50%;
        left: 10px
    }

    .swiper-button-prev-blog_sp p:before,
    .swiper-button-next-blog_sp p:before {
        content: "";
        width: 14px;
        height: 14px;
        border: 2px solid #703117;
        border-left: 0;
        border-bottom: 0;
        transform: rotate(45deg);
        transform-origin: top right;
        position: absolute;
        top: 50%;
        left: 8px
    }

    .swiper-pagination_blog_sp {
        width: 100%;
        margin-top: 13px;
        position: absolute;
        text-align: center;
        transition: .3s opacity;
        transform: translateZ(0);
        z-index: 10
    }

    .swiper-pagination_blog_sp .swiper-pagination-bullet {
        width: 12px;
        height: 12px;
        margin: 0 6px;
        border: 1px solid #703117;
        cursor: pointer;
        display: inline-block;
        border-radius: 100%;
        background: #faf5f0;
        opacity: .8
    }

    .swiper-pagination_blog_sp .swiper-pagination-bullet.swiper-pagination-bullet-active {
        opacity: 1;
        background-color: #703117
    }

    .top_blog_swiper_pc {
        display: none
    }

    .top_blog_swiper_sp {
        display: block
    }
}

.top_tab_wrap .top_blog_area .panel_dog .swiper-container,
.top_tab_wrap .top_blog_area .panel_cat .swiper-container {
    position: relative;
    opacity: 0;
    visibility: hidden;
    height: 0
}

#tab_dog:checked~.top_tab_wrap .top_blog_area .panel_dog .swiper-container,
#tab_cat:checked~.top_tab_wrap .top_blog_area .panel_cat .swiper-container {
    visibility: visible;
    height: auto;
    -webkit-animation: tabAnim ease .6s forwards;
    animation: tabAnim ease .6s forwards;
    -ms-animation: tabAnim ease .6s forwards
}

.dogSupremoFeatureConts .c-foodsearchBtn__custom {
    padding-left: 100px !important
}

.l-contents .dogNaturalFeatureConts .brandLineupBtn__custom {
    margin: 5vw auto !important
}

.p-simpleTwoClm__figure__custom img {
    width: 100% !important
}

@media only screen and (max-width: 768px) {
    .dogSupremoFeatureConts .c-foodsearchBtn .c-foodsearchBtn__icon:before {
        right: -5vw
    }
}

@media only screen and (max-width: 768px) {
    .dogNatural .c-pageTtl__height .c-pageTtl__ttl__custom__dogSupremo {
        padding-top: 0 !important;
        height: 0 !important;
        position: relative !important;
        top: 0 !important;
        left: 0 !important;
        transform: none !important
    }
}

@media only screen and (max-width: 768px) {
    .dogNatural__custom .-feature03 {
        margin-top: 60px
    }
}

@media only screen and (max-width: 768px) {
    .dogNatural__custom .-feature02 {
        margin-top: 60px
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl.-dogSupremo .c-pageTtl__ttl__dogSupremo {
        position: relative;
        top: 0 !important;
        left: 0 !important;
        transform: none !important;
        padding-top: 0 !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl .c-pageTtl__logo__customdogSupremo {
        width: 48.8vw !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl.-dogSupremo .c-pageTtl__ttl__customHeight {
        padding-top: 10.74vw
    }
}

/* .main .dogNatural__custom,
.main .aboutMaterial__custom {
    margin-top: -150px !important
} */

@media only screen and (max-width: 768px) {
    .dogNatural .c-pageTtl__customDog {
        background: url(/cdn/shop/files/mv-sp_6e2e1488-b573-448b-98a6-49b4ca6d4d6c.jpg?v=1749489758) !important;
        background-size: cover !important;
        height: 59.87vw !important;
        padding-top: 40.94vw !important
    }
}

.p-simpleTwoClm__right__custom {
    padding-top: 0
}

@media only screen and (max-width: 768px) {
    .p-simpleTwoClm__right__custom {
        padding-top: 8vw
    }
}

caption {
    padding-top: .75rem;
    padding-bottom: .75rem;
    color: #6c757d;
    text-align: left;
    caption-side: bottom
}

th {
    text-align: inherit;
    text-align: -webkit-match-parent;
    font-weight: 700
}

#shopify-section-template--19148579635454__main .container--xs {
    --container-max-width: 100%;
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px
}

.section-spacing {
    padding: 0
}

.main {
    margin-top: 0 !important;
    padding-bottom: 0 !important
}

#wrapper {
    padding: 0 !important
}

@media only screen and (min-width: 769px) {
    .c-pageTtl .c-pageTtl__ttl__top50 {
        position: absolute;
        top: 50% !important;
        left: 50%;
        transform: translate(-500px, -50%)
    }
}

.troubleList__icon__flex {
    display: flex !important;
    align-items: flex-end
}

@media only screen and (min-width: 769px) {
    .p-simpleTwoClm .p-simpleTwoClm__txt {
        font-size: 16px !important;
        line-height: 2 !important;
        margin-bottom: 2em !important
    }
}

@media only screen and (min-width: 769px) {
    .troubleList .p-simpleTwoClm__left__width {
        width: 632px !important
    }
}

@media only screen and (min-width: 769px) {
    .c-greenBdrTtl__size {
        font-size: 18px !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__custom {
        height: auto !important;
        padding: 0 !important
    }
}

@media only screen and (max-width: 768px) {
    .featureConts__head {
        margin: 21.87vw auto 0 !important
    }
}

@media only screen and (max-width: 768px) {
    .catDailyFeatureConts.-feature02 .featureConts__head__custom {
        margin-bottom: 17.07vw !important
    }
}

@media only screen and (min-width: 769px) {
    .firstArea .firstArea__item__custom {
        margin-top: 0 !important;
        -webkit-margin-before: 0 !important;
        margin-block-start: 0 !important
    }
}

.p-simpleTwoClm {
    display: flex !important
}

@media only screen and (min-width: 769px) {
    .c-pageTtl .c-pageTtl__ttl__top {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-500px, -50%) !important
    }
}

@media only screen and (min-width: 769px) {
    .c-pageTtl__top {
        background: url(/cdn/shop/files/mv-pc_88ea9168-98e1-48b6-9f41-3cef435d2f74.jpg?v=1749490065) no-repeat center top !important;
        background-size: cover !important
    }

    .dog_natural .c-pageTtl__top {
        background: url(/cdn/shop/files/mv-pc_f5b16118-0499-44b3-99ea-36f594b9a0a3.jpg?v=1752212457) no-repeat center top !important;
        background-size: cover !important
    }
}

.troubleList__icon__custom {
    display: flex !important;
    align-items: flex-end !important
}

@media only screen and (min-width: 769px) {
    .troubleList__icon__custom {
        justify-content: flex-end !important
    }
}

@media only screen and (min-width: 769px) {
    .c-foodsearchBtn {
        width: 590px !important;
        margin: 0 auto 55px !important;
        padding: 0 0 0 40px !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl .c-pageTtl__ttl__custom {
        background: url(/cdn/shop/files/mv-sp_27200804-bf36-4b6e-a891-82a33d9af5dc.jpg?v=1749490065) no-repeat center top !important;
        padding-top: 37.34vw !important;
        height: 59.87vw !important;
        margin-bottom: 1.6vw !important
    }

    .dog_natural .c-pageTtl .c-pageTtl__ttl__custom {
        background: url(/cdn/shop/files/mv-sp_52a02e2e-c480-487f-9e2d-8970afb7263c.jpg?v=1754316032) no-repeat center top !important;
        padding-top: 37.34vw !important;
        height: 59.87vw !important;
        margin-bottom: 1.6vw !important
    }
}

.c-pageTtl__custom .c-pageTtl__ttl {
    background: none !important
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__custom .c-pageTtl__ttl {
        padding-top: 37.34vw !important;
        height: 59.87vw !important;
        margin-bottom: 1.6vw !important;
        background: url(/cdn/shop/files/mv-sp_27200804-bf36-4b6e-a891-82a33d9af5dc.jpg?v=1749490065) !important;
        background-size: cover !important
    }

    .dog_natural .c-pageTtl__custom .c-pageTtl__ttl {
        padding-top: 37.34vw !important;
        height: 59.87vw !important;
        margin-bottom: 1.6vw !important;
        background: url(/cdn/shop/files/mv-sp_52a02e2e-c480-487f-9e2d-8970afb7263c.jpg?v=1754316032) !important;
        background-size: cover !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__custom .c-pageTtl__logo {
        width: 36.8vw !important;
        height: 22.67vw;
        margin: 0 auto 1.07vw
    }
}

@media only screen and (max-width: 768px) {
    .catNatural__custom .c-pageTtl {
        background: none !important;
        padding: 0 !important
    }
}

@media only screen and (min-width: 769px) {
    .l-contents .c-pageTtl__catBackground {
        height: 21.96vw !important;
        min-height: 300px !important;
        background: url(/cdn/shop/files/mv2024-pc_10239a65-eba8-4719-9767-f80be3fef098.jpg?v=1752237331) no-repeat center top !important;
        background-size: cover !important
    }
}

#wrapper {
    margin-bottom: -2vw
}

@media only screen and (max-width: 768px) {
    #wrapper {
        margin-bottom: -5vw
    }
}

.catDaily__custom-0em {
    padding-top: 0 !important
}

.catDaily__custom-7em {
    padding-top: 7em !important
}

@media only screen and (max-width: 768px) {
    .catDaily__custom-7em {
        padding-top: 0 !important
    }
}

#wrapper .brandLineupBtn__custom {
    margin: 6.07vw auto !important;
    border-radius: 10px;
    text-align: center
}

@media only screen and (max-width: 768px) {
    #wrapper .brandLineupBtn__custom {
        width: 84vw !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl.-dogSupremo .c-pageTtl__logo__size {
        width: 48.8vw !important;
        height: 12.8vw !important;
        margin: 0 auto !important
    }
}

@media only screen and (max-width: 768px) {
    .dogSupremoFeatureConts.-feature01 .featureConts__head .featureConts__ttl {
        margin-bottom: 8vw;
        line-height: 1.4;
        letter-spacing: .04em
    }
}

.feature_01_01 .p-simpleTwoClm .p-simpleTwoClm__ttl__font,
.feature_01_03 .p-simpleTwoClm .p-simpleTwoClm__ttl__font {
    font-family: Roboto, Noto Sans JP, sans-serif !important
}

.main .c-pageTtl__customDogWild {
    margin-top: -150px !important
}

@media only screen and (max-width: 768px) {
    .c-pageTtl_dogWild_custom {
        background: none !important;
        padding: 0 !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__dog {
        background: none !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__dog .c-pageTtl__ttl {
        background: url(/cdn/shop/files/mv-sp_5ce22a86-0af6-4ed2-98ed-caf3adebe17d.jpg?v=1749489799) no-repeat center top !important;
        background-size: cover !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__catBackground .c-pageTtl__ttl {
        padding-top: 42.94vw;
        height: 59.87vw;
        background: url(/cdn/shop/files/mv-sp_e13b765c-4f01-4e70-ab44-bac74c369a2a.jpg?v=1749490156) no-repeat center top !important;
        background-size: cover !important;
        margin-bottom: 6.14vw !important
    }
}

@media only screen and (max-width: 768px) {
    .catNatural .c-pageTtl {
        background: none !important
    }
}

.main .c-pageTtl__catBackground {
    margin-top: -150px !important;
    padding: 0 !important
}

.main .l-contents .catNaturalFeatureConts .featureConts__head__custom {
    margin-bottom: 104px !important
}

.main .c-pageTtl__custom-DogNatural,
.main .c-pageTtl__customCat {
    margin-top: -150px !important
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__custom .c-pageTtl__ttl__logoHeight {
        background: url(/cdn/shop/files/mv-sp_79f294f7-2cbf-461f-8422-653e34799eef.jpg?v=1749489713) !important;
        background-size: cover !important
    }
}

@media only screen and (min-width: 769px) {
    .c-pageTtl .c-pageTtl__ttl__logoHeight {
        top: 50% !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl .c-pageTtl__ttl .c-pageTtl__logoTitle {
        display: block
    }
}

.subBrandFeatures__custom {
    margin-top: 60px !important
}

@media only screen and (max-width: 768px) {
    .c-pageTtl.-dogNatural .c-pageTtl__ttl__dog {
        background: url(/cdn/shop/files/mv-sp_79f294f7-2cbf-461f-8422-653e34799eef.jpg?v=1749489713) !important;
        background-size: cover !important
    }
}

@media only screen and (min-width: 769px) {
    .c-greenBdrTtl__custom {
        font-size: 18px !important;
        padding-bottom: 14px !important;
        margin-bottom: 28px !important;
        padding-top: 40px !important
    }
}

@media only screen and (max-width: 768px) {
    .c-greenBdrTtl__custom {
        font-size: 4.8vw !important;
        padding-bottom: 3.74vw !important;
        margin-bottom: 5.34vw !important;
        letter-spacing: .08em !important
    }
}

body .section-stack .prose .wrpper__custom {
    color: #2f2016 !important
}

.catDaily__custom {
    padding-top: 11em !important
}

.c-foodsearchBtn {
    max-width: 1000px !important;
    width: 100% !important
}

@media only screen and (min-width: 769px) {
    .c-foodsearchBtn {
        width: 84vw !important;
        margin: 0 auto 17.07vw !important
    }

    .feature_01-01 .p-simpleTwoClm__right__width {
        width: 317px !important
    }
}

@media only screen and (min-width: 769px) {
    .feature_01-01 .p-simpleTwoClm__left__width {
        width: 650px !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__daily .c-pageTtl__ttl {
        padding-top: 37.34vw;
        height: 59.87vw;
        background: url(/cdn/shop/files/mv-sp_1.jpg?v=1750642147) no-repeat center top;
        background-size: cover;
        margin-bottom: 6.14vw
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__daily {
        background: none !important
    }
}

.l-contents .c-pageTtl__oyatu {
    margin-top: -150px !important
}

@media only screen and (min-width: 769px) {
    .l-contents .c-pageTtl__daily {
        height: 21.96vw !important;
        min-height: 300px !important;
        background: url(/cdn/shop/files/mv-pc_1.jpg?v=1750639401) no-repeat center top !important;
        background-size: cover !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl .c-pageTtl__logo__custom {
        width: 29.34vw;
        height: 22.67vw;
        margin: 0 0 0 8vw
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__daily {
        height: auto !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__padding {
        padding: 0 !important
    }
}

@media only screen and (min-width: 769px) {
    .c-pageTtl__daily .c-pageTtl__logo {
        width: 211px;
        margin-bottom: 8px
    }
}

@media only screen and (max-width: 768px) {
    .feature_02-02__daily .p-simpleTwoClm .p-simpleTwoClm__ttl {
        text-align: left !important
    }
}

.catOyatsuFeatureConts__custom {
    padding-bottom: 100px
}

@media only screen and (min-width: 769px) {
    .l-contents .c-pageTtl__oyatu {
        height: 21.96vw !important;
        min-height: 300px !important;
        background: url(/cdn/shop/files/mv-pc_2.jpg?v=1750642134) no-repeat center top !important;
        background-size: cover !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__oyatu .c-pageTtl__ttl {
        padding-top: 42.94vw !important;
        height: 59.87vw !important;
        background: url(/cdn/shop/files/mv-sp_2.jpg?v=1750642129) no-repeat center top !important;
        background-size: cover !important;
        margin-bottom: 6.14vw !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__oyatu .c-pageTtl__logo {
        width: 36.8vw !important;
        height: 22.67vw !important;
        margin: 0 auto 1.07vw !important
    }
}

@media only screen and (max-width: 768px) {
    .l-contents {
        margin-top: 0 !important
    }
}

@media only screen and (min-width: 769px) {
    .c-pageTtl .c-pageTtl__logo__oyatu {
        width: 211px !important;
        margin-bottom: 8px !important
    }
}

@media only screen and (min-width: 769px) {
    .c-pageTtl .c-pageTtl__ttl__oyatu .-jp {
        font-size: 22px !important;
        text-align: left !important
    }
}

@media only screen and (min-width: 769px) {
    .featureConts__head__oyatu .p-simpleTwoClm__right {
        width: 325px !important
    }
}

@media only screen and (min-width: 769px) {
    .featureConts__head__oyatu .p-simpleTwoClm__left {
        width: 638px !important
    }
}

.main__teiki {
    margin-top: -150px !important
}

@media only screen and (max-width: 768px) {
    .main__teiki {
        margin-top: -150px !important
    }
}

.nutritional-02 .lead {
    background: none;
    padding-bottom: 0;
    min-height: 100% !important;
    height: 100% !important
}

.safety-05 .c-searchBtn__font {
    font-family: "Noto Serif JP", serif !important
}

.pointList__item__custom:after {
    display: none !important
}

@media only screen and (min-width: 769px) {

    .commitment01.p-bgTwoClm .p-bgTwoClm__btn,
    .commitment03.p-bgTwoClm .p-bgTwoClm__btn,
    .commitment04.p-bgTwoClm .p-bgTwoClm__btn {
        width: 415px
    }
}

@media only screen and (max-width: 768px) {

    .commitment01.p-bgTwoClm .c-lightBrownBtn__custom,
    .commitment02.p-bgTwoClm .c-lightBrownBtn__custom,
    .commitment03.p-bgTwoClm .c-lightBrownBtn__custom,
    .commitment04.p-bgTwoClm .c-lightBrownBtn__custom {
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 4vw;
        width: 84vw;
        height: 18.67vw;
        line-height: 1.4
    }
}

.main__shoppinngGuide {
    margin-top: -150px !important
}

@media only screen and (max-width: 768px) {
    .main__shoppinngGuide {
        margin-top: -150px !important
    }
}

.guidebtn_wrapper .guide_btn a {
    background: none;
    color: #703117
}

.oct-form__section .contents_innner {
    display: block
}

.mars-legal__row .table-scroller th {
    font-weight: 700 !important
}

@media screen and (min-width: 769px) {
    .mars-legal__row .table-scroller th {
        vertical-align: top !important
    }
}

.oct-input-data-definition__data-text img {
    max-width: 32px;
    width: 100%
}

.table-scroller .tbl-r02 th {
    text-align: left !important;
    font-weight: 700 !important;
    border: none !important;
    font-family: Roboto, Noto Sans JP, sans-serif
}

.oct-form__section .table-scroller .tbl-r02 {
    border: none !important;
    border-top: 1px solid #ccc !important;
    margin: 0 auto !important
}

.mars-legal__row td,
.mars-legal__row th {
    border-top: 1px solid #ccc !important;
    border-left: none !important;
    border-right: none !important
}

@media screen and (max-width: 769px) {

    .mars-legal__row td,
    .mars-legal__row th {
        border-top: none !important
    }
}

.mars-legal__row tr {
    border-top: 1px solid #ccc !important
}

.tbl-r02 a {
    color: #703117
}

#main .tbl-r02 {
    width: 100% !important
}

.main .mars-form__row {
    max-width: 1024px;
    width: 100%
}

.main .oct-typography--headline1 {
    font-size: 1.5rem !important
}

.main .mars-legal__row li,
.main .mars-legal__row p,
.main .mars-legal__row td,
.main .mars-legal__row th,
.main .oct-typography--body2 {
    font-size: .875rem
}

#merit .menber_point_system .menber_point_syste_list_03 li {
    width: 100%
}

.main__custom02 {
    margin-top: -150px !important
}

.main__custom .main_wrapper {
    max-width: 750px !important;
    margin: 0 auto 120px
}

body footer {
    font: var(--text-font-style) var(--text-font-weight) var(--text-base) / 1.65 var(--text-font-family);
    letter-spacing: var(--text-letter-spacing)
}

body .wrapper__custom {
    color: #2f2016 !important
}

.wrapper__custom main {
    color: #2f2016 !important;
    font-family: "Noto Serif JP", serif !important
}

.header__secondary-nav li a .h6,
.header__secondary-nav li a {
    display: flex;
    font-weight: 700;
    font-size: 14px;
    color: #703117 !important
}

header-sidebar__linklist.divide-y .header-sidebar__linklist-button {
    color: #703117 !important
}

@media only screen and (min-width: 769px) {
    .c-greenBdrTtl__custom {
        padding-top: 0 !important
    }
}

@media only screen and (min-width: 769px) {
    .feature_02_01_01__custom02 {
        padding-top: 80px !important
    }
}

@media only screen and (min-width: 769px) {
    .l-basicSection__custom {
        padding: 30px 0 80px !important
    }
}

main .p__custom {
    font-family: "Noto Serif JP", serif !important
}

main .dogNatural,
main .catNatural {
    font-family: Noto Sans Japanese, sans-serif !important
}

@media only screen and (max-width: 768px) {
    .lead__paddingCustom {
        padding-bottom: 0 !important
    }
}

@media only screen and (min-width: 769px) {
    .lead .p-simpleTwoClm__right__customWidth {
        width: 435px !important
    }
}

@media only screen and (min-width: 769px) {
    .lead__chicken__customImg {
        background-size: 100% auto !important
    }
}

@media only screen and (min-width: 769px) {
    .p-centerTxtsBlock .p-centerTxtsBlock__txt__custom {
        width: 1000px !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl.-dogSupremo .c-pageTtl__logo__size {
        margin-top: 14px !important
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl.-dogSupremo .c-pageTtl__ttl__customHeight__custom {
        padding-top: 4.74vw !important
    }
}

.main .dogNatural__custom-02 {
    margin-top: -165px !important
}

@media screen and (min-width: 769px) {
    .c-pageTtl.-dogSupremo .c-pageTtl__ttl__custom02 {
        position: absolute;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-500px, -50%) !important
    }
}

@media only screen and (min-width: 769px) {
    .p-simpleTwoClm .p-simpleTwoClm__left__custom {
        width: 500px !important
    }
}

/*# sourceMappingURL=/cdn/shop/t/4/assets/from-oldsite-202505.css_top.css.map?v=116323302974582201961755614576 */


/* css_na_safety_common */

/**
*
* Main Stylesheet For Visual Style Guide
*
**/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Crimson+Text&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Crimson+Text:wght@600;700&display=swap");

html {
    width: 100%;
    height: 100%;
    touch-action: manipulation;
}

html,
body,
button {
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: unset;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {

    html,
    body,
    button {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

body {
    -webkit-text-size-adjust: 100%;
    font-feature-settings: "palt";
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {

    ::i-block-chrome,
    body {
        font-feature-settings: "pkna";
    }
}

/*
* Make body take up the entire screen
* Remove body margin so layout containers don't cause extra overflow.
*/
body {
    width: 100%;
    min-height: 100%;
    margin: 0;
}

/*
 * Main display reset for IE support.
 * Source: http://weblog.west-wind.com/posts/2015/Jan/12/main-HTML5-Tag-not-working-in-Internet-Explorer-91011
 */
main {
    display: block;
}

button,
input[type="submit"],
input[type="button"] {
    border-radius: 0;
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
    border: none;
    box-sizing: border-box;
    cursor: pointer;
}

button::-webkit-search-decoration,
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
    display: none;
}

button::focus,
input[type="submit"]::focus,
input[type="button"]::focus {
    outline-offset: -2px;
}

button {
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

ol,
ul {
    list-style: none;
}

li {
    text-align: -webkit-match-parent;
}

/**
* Eric Meyer's Reset CSS v2.0
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video,
input,
textarea {
    margin: 0;
    padding: 0;
    border: 0;
}

/*
* Apply no display to elements with the hidden attribute.
* IE 9 and 10 support.
*/
*[hidden] {
    display: none !important;
}

.l-amountModal {
    opacity: 0;
    visibility: hidden;
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 100;
    color: #fff;
    transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}

.l-amountModal.is-open {
    opacity: 1;
    visibility: visible;
}

.l-amountModal .l-amountModal__wrap {
    width: 100vw;
    overflow: auto;
    text-align: center;
}

.l-amountModal .l-amountModal__wrap::-webkit-scrollbar {
    display: none;
}

.l-amountModal .l-amountModal__wrap:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 1px;
    height: 100%;
}

.l-amountModal .l-amountModal__layer {
    position: absolute;
    width: 100vw;
    height: 100vh;
    background: rgba(47, 32, 22, 0.9);
    top: 0;
    left: 0;
}

.l-amountModal .l-amountModal__closeBtn {
    position: absolute;
    color: #fff;
    z-index: 10;
    cursor: pointer;
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__closeBtn {
        padding-top: 40px;
        font-size: 16px;
        width: 44px;
        height: 59px;
        top: 40px;
        right: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__closeBtn {
        padding-top: 7.2vw;
        font-size: 3.47vw;
        width: 8vw;
        height: 11.74vw;
        top: 6.14vw;
        right: 6.14vw;
    }
}

.l-amountModal .l-amountModal__closeBtn::before {
    display: block;
    content: "";
    position: absolute;
    background: #e5e0ca;
    transform: rotate(-45deg);
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__closeBtn::before {
        top: 14px;
        left: 0px;
        width: 41px;
        height: 1px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__closeBtn::before {
        top: 3.2vw;
        left: 0px;
        width: 9.07vw;
        height: 1px;
    }
}

.l-amountModal .l-amountModal__closeBtn::after {
    display: block;
    content: "";
    position: absolute;
    background: #e5e0ca;
    transform: rotate(45deg);
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__closeBtn::after {
        top: 14px;
        left: 0px;
        width: 41px;
        height: 1px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__closeBtn::after {
        top: 3.2vw;
        left: 0px;
        width: 9.07vw;
        height: 1px;
    }
}

.l-amountModal .l-amountModal__conts {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__conts {
        margin-bottom: 15px;
    }
}

.l-amountModal .l-amountModal__head {
    position: relative;
    text-align: center;
    font-weight: 600;
    color: #e5e0ca;
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__head {
        font-size: 16px;
        padding: 98px 0 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__head {
        font-size: 3.47vw;
        padding: 20vw 0 0;
    }
}

.l-amountModal .l-amountModal__head::before {
    content: "";
    display: block;
    position: absolute;
    background: url(../images/icon_amont.svg);
    left: 50%;
    transform: translateX(-50%);
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__head::before {
        width: 75px;
        height: 68px;
        background-size: 100%;
        top: 25px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__head::before {
        width: 15.2vw;
        height: 13.87vw;
        background-size: 15.2vw 13.87vw;
        top: 3.74vw;
    }
}

.l-amountModal .l-amountModal__serect {
    display: none;
    opacity: 0;
    background: url("/html/user_data/assets/img/na/bg__medium_3fdfff77-1e7a-4794-9767-82ed01227030.jpg?v=1750209272");
    color: #703117;
    transition: opacity 0.6s cubic-bezier(0.47, 0, 0.745, 0.715);
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__serect {
        width: 960px;
        margin: 27px auto 32px;
        padding: 42px 0 55px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__serect {
        background-size: 100vw auto;
        width: 89.34vw;
        margin: 6.4vw auto 6.4vw;
        padding: 10.67vw 0 10.67vw;
    }
}

.l-amountModal .l-amountModal__serect.-active {
    display: block;
    opacity: 1;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-name: fade-in;
    animation-name: fade-in;
}

@-webkit-keyframes fade-in {
    0% {
        display: none;
        opacity: 0;
    }

    1% {
        display: block;
        opacity: 0;
    }

    100% {
        display: block;
        opacity: 1;
    }
}

@keyframes fade-in {
    0% {
        display: none;
        opacity: 0;
    }

    1% {
        display: block;
        opacity: 0;
    }

    100% {
        display: block;
        opacity: 1;
    }
}

.l-amountModal .l-amountModal__serect__head {
    font-weight: 600;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__serect__head {
        font-size: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__serect__head {
        font-size: 4.8vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__serect__check {
        margin: 0 auto;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__serect__check {
        width: 78.67vw;
        margin: 0 auto;
    }
}

.l-amountModal .l-amountModal__serect__check__input {
    position: relative;
    height: 100%;
}

.l-amountModal .l-amountModal__serect__check__input::before {
    content: "";
    display: block;
    position: absolute;
    background: #9d9889;
    height: 1px;
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__serect__check__input::before {
        left: 16px;
        width: 227px;
        bottom: 12px;
        transition: left 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__serect__check__input::before {
        left: 50%;
        transform: translateX(-50%);
        width: 28.27vw;
        bottom: 3.2vw;
    }
}

.l-amountModal .l-amountModal__serect__check__input::after {
    content: "";
    display: block;
    position: absolute;
    background: #9d9889;
    transform: rotate(35deg);
    transform-origin: right bottom;
    width: 10px;
    height: 1px;
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__serect__check__input::after {
        bottom: 12px;
        right: 17px;
        transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__serect__check__input::after {
        bottom: 3.2vw;
        right: 4.43vw;
    }
}

.l-amountModal .l-amountModal__serect__check__input input {
    display: none;
}

.l-amountModal .l-amountModal__serect__check__list {
    display: flex;
    justify-content: space-between;
}

.l-amountModal .l-amountModal__serect__check__item {
    position: relative;
    font-weight: 600;
}

.l-amountModal .l-amountModal__serect__check__item::after {
    content: "";
    display: block;
    position: absolute;
    transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__serect__check__item:hover .l-amountModal__serect__check__input::before {
        left: 20px;
    }

    .l-amountModal .l-amountModal__serect__check__item:hover .l-amountModal__serect__check__input::after {
        right: 12px;
    }
}

.l-amountModal .l-amountModal__serect__check__item label {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    z-index: 1;
    cursor: pointer;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__serect__check__item label {
        padding: 218px 0 0;
        font-size: 18px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__serect__check__item label {
        padding: 46.94vw 0 0;
        font-size: 3.47vw;
    }
}

.l-amountModal .l-amountModal__serect__check__item label .-en {
    display: block;
    font-family: "Crimson Text", serif;
    font-weight: 600;
    line-height: 1;
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__serect__check__item label .-en {
        font-size: 14px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__serect__check__item label .-en {
        font-size: 3.2vw;
    }
}

/*
�y�b�g�̎�ނ́H
*/
@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-kind .l-amountModal__serect__check {
        width: 552px;
        margin-top: 7px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-kind .l-amountModal__serect__check {
        margin-top: 1.87vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-kind .l-amountModal__serect__check__item {
        width: 260px;
        height: 273px;
    }

    .l-amountModal__serect.-kind .l-amountModal__serect__check__item:hover::after {
        transform: scale(1.05, 1.05);
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-kind .l-amountModal__serect__check__item {
        width: 37.34vw;
        height: 60.8vw;
    }
}

.l-amountModal__serect.-kind .l-amountModal__serect__check__item::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    background: #f7f3e2 left bottom;
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-kind .l-amountModal__serect__check__item::before {
        width: 260px;
        height: 160px;
        background-size: 260px 160px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-kind .l-amountModal__serect__check__item::before {
        width: 37.34vw;
        height: 37.34vw;
        background-size: 140px 140px;
    }
}

.l-amountModal__serect__check__item.-dog::after {
    background: url(../images/img_search01-dog.png);
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect__check__item.-dog::after {
        width: 166px;
        height: 213px;
        background-size: 166px 213px;
        top: 0;
        left: 47px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect__check__item.-dog::after {
        width: 34.67vw;
        height: 44.54vw;
        background-size: 34.67vw 44.54vw;
        top: 0;
        left: 1.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect__check__item.-cat::after {
        background: url(../images/img_search01-cat-pc.png);
        width: 259px;
        height: 189px;
        background-size: 259px 189px;
        top: 24px;
        left: 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect__check__item.-cat::after {
        background: url(../images/img_search01-cat-sp.png);
        width: 37.34vw;
        height: 44.8vw;
        background-size: 37.34vw 44.8vw;
        top: 0;
        left: 0;
    }
}

/*
�u�����h��I������������
*/
@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-brand .l-amountModal__serect__check {
        width: 808px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-brand .l-amountModal__serect__check {
        margin-top: 2.67vw;
    }
}

.l-amountModal__serect.-brand .l-amountModal__serect__check__list {
    flex-wrap: wrap;
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-brand .l-amountModal__serect__check__list {
        margin-top: 18px;
    }
}

.l-amountModal__serect.-brand .l-amountModal__serect__check__item {
    background: #f7f3e2;
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-brand .l-amountModal__serect__check__item {
        width: 396px;
        height: 100px;
        margin-top: 34px;
    }

    .l-amountModal__serect.-brand .l-amountModal__serect__check__item:hover::after {
        transform: scale(1.05, 1.05);
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-brand .l-amountModal__serect__check__item {
        width: 37.34vw;
        height: 25.07vw;
        margin-top: 5.87vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-brand .l-amountModal__serect__check__input::before {
        width: 363px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-brand .l-amountModal__serect__check__input::before {
        width: 28.27vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-brand .l-amountModal__serect__check__input::after {
        right: 4.54vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-brand .l-amountModal__serect__check__input label {
        padding-left: 192px;
        padding-top: 0px;
        display: flex;
        align-items: center;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-brand .l-amountModal__serect__check__input label {
        padding-top: 10.67vw;
        font-size: 3.2vw;
    }
}

/*
���i��I������������
*/
@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-product .l-amountModal__serect__check {
        width: 808px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-product .l-amountModal__serect__check {
        margin-top: 1.34vw;
    }
}

.l-amountModal__serect.-product .l-amountModal__serect__check__list {
    flex-wrap: wrap;
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-product .l-amountModal__serect__check__list {
        margin-top: 12px;
    }
}

.l-amountModal__serect.-product .l-amountModal__serect__check__item {
    background: #f7f3e2;
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-product .l-amountModal__serect__check__item {
        width: 190px;
        height: 240px;
        margin-top: 52px;
    }

    .l-amountModal__serect.-product .l-amountModal__serect__check__item:hover::after {
        transform: scale(1.05, 1.05);
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-product .l-amountModal__serect__check__item {
        width: 37.34vw;
        height: 46.4vw;
        margin-top: 8.81vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-product .l-amountModal__serect__check__input::before {
        width: 157px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-product .l-amountModal__serect__check__input::before {
        width: 28.27vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-product .l-amountModal__serect__check__input::after {
        right: 4.54vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-product .l-amountModal__serect__check__input label {
        padding-top: 125px;
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-product .l-amountModal__serect__check__input label {
        padding-top: 22.67vw;
        font-size: 3.2vw;
    }
}

/*
�t�[�h�̑g�ݍ��킹��I�����Ă�������
*/
@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-combination .l-amountModal__serect__check {
        width: 552px;
    }
}

.l-amountModal__serect.-combination .l-amountModal__serect__check__list {
    flex-wrap: wrap;
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-combination .l-amountModal__serect__check__list {
        margin-top: 12px;
    }
}

.l-amountModal__serect.-combination .l-amountModal__serect__check__item {
    background: #f7f3e2;
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-combination .l-amountModal__serect__check__item {
        width: 260px;
        height: 255px;
        margin-top: 52px;
    }

    .l-amountModal__serect.-combination .l-amountModal__serect__check__item:hover::after {
        transform: scale(1.05, 1.05);
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-combination .l-amountModal__serect__check__item {
        width: 79.47vw;
        height: 24vw;
        margin-top: 4.27vw;
    }
}

.l-amountModal__serect.-combination .l-amountModal__serect__check__input {
    width: 100%;
}

.l-amountModal__serect.-combination .l-amountModal__serect__check__input::before {
    display: none;
}

.l-amountModal__serect.-combination .l-amountModal__serect__check__input::after {
    display: none;
}

.l-amountModal__serect.-combination .l-amountModal__serect__check__input label {
    display: flex;
    align-items: center;
    justify-content: center;
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-combination .l-amountModal__serect__check__input label {
        padding-top: 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-combination .l-amountModal__serect__check__input label {
        padding-top: 0vw;
    }
}

/*
�y�b�g�̏�Ԃ������Ă�������
*/
@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-status .l-amountModal__serect__check {
        width: 808px;
        margin-top: 64px;
    }
}

.l-amountModal__serect.-status .l-amountModal__serect__check__list {
    flex-wrap: wrap;
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-status .l-amountModal__serect__check__list {
        margin-top: 12px;
    }
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-status .l-amountModal__serect__check__item {
        width: 396px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-status .l-amountModal__serect__check__item {
        width: 79.47vw;
        margin-top: 8.54vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-status .l-amountModal__serect__check__item:hover .l-amountModal__serect__check__input::after {
        right: 35px;
    }
}

.l-amountModal__serect.-status .l-amountModal__serect__check__input {
    position: relative;
    width: 100%;
}

.l-amountModal__serect.-status .l-amountModal__serect__check__input::before {
    display: none;
}

.l-amountModal__serect.-status .l-amountModal__serect__check__input::after {
    content: "";
    display: block;
    position: absolute;
    /* background: url(../images/icon_arrow-dark.svg); */
    transform: rotate(90deg);
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-status .l-amountModal__serect__check__input::after {
        width: 8px;
        height: 15px;
        background-size: 8px 15px;
        right: 35px;
        bottom: 32px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-status .l-amountModal__serect__check__input::after {
        width: 2.14vw;
        height: 4vw;
        background-size: 2.14vw 4vw;
        right: 7.47vw;
        bottom: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-status .l-amountModal__serect__check__input .serectHead {
        text-align: left;
        margin-bottom: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-status .l-amountModal__serect__check__input .serectHead {
        margin-bottom: 8px;
    }
}

.l-amountModal__serect.-status .l-amountModal__serect__check__input select {
    font-family: inherit;
    font-size: 100%;
}

.l-amountModal__serect.-status .l-amountModal__serect__check__input .l-amountModal__pulldown {
    background: #f7f3e2;
    text-align: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

@media only screen and (min-width: 769px) {
    .l-amountModal__serect.-status .l-amountModal__serect__check__input .l-amountModal__pulldown {
        width: 396px;
        height: 70px;
        padding: 20px 20px 23px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__serect.-status .l-amountModal__serect__check__input .l-amountModal__pulldown {
        width: 79.47vw;
        height: 10.67vw;
        padding: 2.67vw 3.2vw 3.2vw;
    }
}

.l-amountModal__serect.-status .l-amountModal__serect__check__input .l-amountModal__pulldown::-ms-expand {
    display: none;
}

/*
����
*/
@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__serect.-answer {
        margin-bottom: 100px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__serect.-answer {
        margin-bottom: 24vw;
    }
}

.l-amountModal .l-amountModal__serect.-answer+.l-amountModal__closeBtn {
    display: none;
    left: 50%;
    transform: translateX(-50%);
}

@media only screen and (min-width: 769px) {
    .l-amountModal .l-amountModal__serect.-answer+.l-amountModal__closeBtn {
        bottom: 10px;
        top: initial;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal .l-amountModal__serect.-answer+.l-amountModal__closeBtn {
        bottom: 5.34vw;
        top: initial;
    }
}

.volume {
    border: 3px solid #ccc6ad;
    margin: 0 auto;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .volume {
        width: 340px;
        font-size: 16px;
        padding: 15px;
    }
}

@media only screen and (max-width: 768px) {
    .volume {
        width: 100%;
        font-size: 4.27vw;
        padding: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .calory {
        margin-bottom: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .calory {
        margin-bottom: 5.34vw;
    }
}

.calory .calory__head {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .calory .calory__head {
        font-size: 24px;
        margin-bottom: 17px;
    }
}

@media only screen and (max-width: 768px) {
    .calory .calory__head {
        font-size: 4.27vw;
        margin-bottom: 1.6vw;
    }
}

.foodType {
    background: rgba(255, 255, 255, 0.4);
    text-align: left;
}

@media only screen and (min-width: 769px) {
    .foodType {
        display: flex;
        justify-content: center;
        width: 808px;
        margin: 0 auto;
        padding: 30px 32px;
    }
}

@media only screen and (max-width: 768px) {
    .foodType {
        width: 78.67vw;
        padding: 4.8vw 5.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .foodType .foodType__dry {
        width: 340px;
    }
}

@media only screen and (max-width: 768px) {
    .foodType .foodType__dry {
        width: 100%;
    }
}

.foodType .foodType__wet {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .foodType .foodType__wet {
        margin-left: 62px;
        width: 340px;
    }
}

@media only screen and (max-width: 768px) {
    .foodType .foodType__wet {
        margin-top: 16.8vw;
    }
}

.foodType .foodType__wet::before {
    content: "+";
    display: block;
    position: absolute;
}

@media only screen and (min-width: 769px) {
    .foodType .foodType__wet::before {
        top: 50%;
        transform: translateY(-50%);
        left: -38px;
        font-size: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .foodType .foodType__wet::before {
        left: 50%;
        transform: translateX(-50%);
        top: -13.86vw;
        font-size: 8vw;
    }
}

@media only screen and (min-width: 769px) {
    .foodType .foodType__ttl {
        margin-bottom: 18px;
        font-size: 18px;
    }
}

@media only screen and (max-width: 768px) {
    .foodType .foodType__ttl {
        margin-bottom: 4.27vw;
        font-size: 4.27vw;
    }
}

@media only screen and (min-width: 769px) {
    .foodType .foodType__name {
        margin-bottom: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .foodType .foodType__name {
        margin-bottom: 4.27vw;
    }
}

@media only screen and (min-width: 769px) {
    .foodType .foodType__definition dt {
        font-size: 13px;
        margin-bottom: 5px;
    }
}

@media only screen and (max-width: 768px) {
    .foodType .foodType__definition dt {
        font-size: 3.47vw;
        margin-bottom: 1.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .foodType .foodType__definition dd {
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 768px) {
    .foodType .foodType__definition dd {
        margin-bottom: 1.34vw;
    }
}

.foodType .foodType__definition dd:last-child {
    margin-bottom: 0;
}

.foodType .foodType__note {
    text-align: right;
}

@media only screen and (min-width: 769px) {
    .foodType .foodType__note {
        font-size: 12px;
        margin-top: 5px;
    }
}

@media only screen and (max-width: 768px) {
    .foodType .foodType__note {
        font-size: 2.94vw;
        margin-top: 1.34vw;
    }
}

.give {
    text-align: left;
}

@media only screen and (min-width: 769px) {
    .give {
        width: 808px;
        margin: 32px auto 0;
        font-size: 15px;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .give {
        width: 79.47vw;
        margin: 8vw auto 0;
        font-size: 4vw;
        line-height: 1.9;
    }
}

.l-amountModal__btn {
    display: flex;
    justify-content: center;
}

.l-amountModal__btn .l-amountModal__item {
    background: #e5e0ca;
    opacity: 0.4;
    border-radius: 50%;
}

@media only screen and (min-width: 769px) {
    .l-amountModal__btn .l-amountModal__item {
        width: 10px;
        height: 10px;
        margin: 0 5px;
    }
}

@media only screen and (max-width: 768px) {
    .l-amountModal__btn .l-amountModal__item {
        width: 2.67vw;
        height: 2.67vw;
        margin: 0 1.34vw;
    }
}

.l-amountModal__btn .l-amountModal__item.-active {
    opacity: 1;
}

.is-amountModalOpen {
    cursor: pointer;
}

@media only screen and (min-width: 769px) {
    .l-basicSection {
        padding: 65px 0 80px;
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection {
        padding: 8vw 0 10.67vw;
    }
}

.l-basicSection .l-basicSection__head {
    font-family: "Noto Serif JP", serif !important;
    font-weight: 700;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-basicSection .l-basicSection__head {
        font-size: 24px;
        margin-bottom: 40px;
        line-height: 1.7;
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection .l-basicSection__head {
        font-size: 5.87vw;
        margin-bottom: 8vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-basicSection .l-basicSection__txt {
        font-size: 16px;
        width: 1000px;
        margin: 0 auto;
        text-align: center;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection .l-basicSection__txt {
        font-size: 15px;
        line-height: 1.9;
        padding: 0 8vw;
        margin-bottom: 1em;
    }
}

.l-basicSection .l-basicSection__txt-02 {
    text-align: left;
}

@media only screen and (min-width: 769px) {
    .l-basicSection .l-basicSection__txt-02 {
        font-size: 16px;
        width: 753px;
        margin: 0 auto 2em;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection .l-basicSection__txt-02 {
        font-size: 15px;
        line-height: 1.9;
        padding: 0 8vw;
        margin-bottom: 2em;
    }
}

.l-basicSection .l-basicSection__txt-02:last-child {
    margin-bottom: 0;
}

@media only screen and (min-width: 769px) {
    .l-basicSection .l-basicSection__txt-02.-small {
        font-size: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection .l-basicSection__txt-02.-small {
        font-size: 3.47vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-basicSection .l-basicSection__ancker {
        text-align: center;
        font-size: 15px;
        margin-top: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection .l-basicSection__ancker {
        text-align: left;
        margin-top: 8.54vw;
    }
}

.l-basicSection .l-basicSection__ancker a {
    position: relative;
    color: #2f3c0d;
}

@media only screen and (min-width: 769px) {
    .l-basicSection .l-basicSection__ancker a {
        padding-left: 14px;
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection .l-basicSection__ancker a {
        padding-left: 2.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-basicSection .l-basicSection__ancker a:hover::before {
        left: 3px;
    }
}

.l-basicSection .l-basicSection__ancker a::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: url(../images/icon_arrow-green.svg);
}

@media only screen and (min-width: 769px) {
    .l-basicSection .l-basicSection__ancker a::before {
        width: 8px;
        height: 15px;
        background-size: 8px 15px;
        transition: left 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection .l-basicSection__ancker a::before {
        width: 1.6vw;
        height: 2.94vw;
        background-size: 1.6vw 2.94vw;
    }
}

.l-bgDark {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .l-bgDark {
        background: url(../images/bg_dark.jpg) 24.3vw -8.78vw;
        background-size: 55vw;
        margin-top: -60px;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1100px) {
    .l-bgDark {
        background: url(../images/bg_dark.jpg) 0;
        background-size: 603.75px;
    }
}

@media only screen and (max-width: 768px) {
    .l-bgDark {
        background: url(../images/bg_dark.jpg) center 70.67vw;
        background-size: 100vw auto;
        margin-top: -18.13vw;
    }
}

.l-bgDark::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
}

@media only screen and (min-width: 769px) {
    .l-bgDark::before {
        top: -4.9vw;
        height: 4.97vw;
        background: url(../images/bg_dark-top-pc.png) left bottom;
        background-size: 100%;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1100px) {
    .l-bgDark::before {
        top: -54.7px;
        height: 54.7px;
    }
}

@media only screen and (max-width: 768px) {
    .l-bgDark::before {
        top: -17.6vw;
        height: 17.61vw;
        background: url(../images/bg_dark-top-sp.png) center top;
        background-size: 100vw auto;
    }
}

@media only screen and (min-width: 769px) {
    .l-bgDark.-lightTop::before {
        background: url(../images/bg_dark-light-top-pc.png) left bottom;
        background-size: 100%;
    }
}

@media only screen and (max-width: 768px) {
    .l-bgDark.-lightTop::before {
        background: url(../images/bg_dark-light-top-sp.png) center top;
        background-size: 100vw auto;
    }
}

.l-bgDark .l-bgDark__ttl {
    text-align: center;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .l-bgDark .l-bgDark__ttl {
        font-size: 36px;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-bgDark .l-bgDark__ttl {
        font-size: 5.87vw;
        padding-top: 5.34vw;
        margin: 17.87vw auto 5.6vw;
    }
}

.l-contents {
    background: url("/html/user_data/assets/img/na/bg__medium.jpg");
}

@media only screen and (min-width: 1367px) {
    .l-contents {
        background-position: center top;
        background-size: 55vw;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1366px) {
    .l-contents {
        background-position: center top;
        background-size: 750px;
    }
}

@media only screen and (max-width: 768px) {
    .l-contents {
        background-size: 100vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-contents.-subBrandNavUnder {
        margin-top: 134px;
    }
}

@media only screen and (max-width: 768px) {
    .l-contents.-subBrandNavUnder {
        margin-top: 32.27vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-closing {
        position: relative;
        background: url(/html/user_data/assets/img/na/index/img_index-08-pc.png) no-repeat top;
        background-size: cover;
        height: 41vw;
        min-height: 560px;
        z-index: 1;
        margin-top: -68px;
    }
}

@media only screen and (max-width: 768px) {
    .l-closing {
        position: relative;
        background: url(/html/user_data/assets/img/na/index/img_index-08-sp.png) no-repeat top;
        background-size: 100vw auto;
        padding: 71.74vw 0 26.67vw;
        margin-top: -18.13vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-closing.-bottom {
        background: url(/html/user_data/assets/img/na/index/img_index-08-cut-pc.png) no-repeat top;
        background-size: cover;
        height: 39.8vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-closing .l-closing__inner {
        position: relative;
        width: 460px;
        height: 100%;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: center;
        left: 50%;
        transform: translateX(-500px);
    }
}

.l-closing .l-closing__ttl {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .l-closing .l-closing__ttl {
        font-size: 24px;
        margin: 0 auto 32px;
        line-height: 1.6;
        color: #e5e0ca;
        width: 1000px;
    }
}

@media only screen and (max-width: 768px) {
    .l-closing .l-closing__ttl {
        font-size: 4.8vw;
        margin: 8vw 0 5.34vw;
        line-height: 1.55;
        color: #2f3c0d;
        text-align: center;
    }
}

.l-closing .l-closing__txt {
    line-height: 1.6;
}

@media only screen and (min-width: 769px) {
    .l-closing .l-closing__txt {
        position: relative;
        color: #e5e0ca;
        font-size: 16px;
        width: 460px;
        margin: 0 0 24px;
    }
}

@media only screen and (max-width: 768px) {
    .l-closing .l-closing__txt {
        font-size: 3.74vw;
        width: 84vw;
        margin: 0 auto 6.94vw;
    }
}

.l-closing .l-closing__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

@media only screen and (min-width: 769px) {
    .l-closing .l-closing__list {
        position: relative;
        width: 349px;
    }
}

@media only screen and (max-width: 768px) {
    .l-closing .l-closing__list {
        width: 84vw;
        margin: 0 auto;
    }
}

.l-closing .l-closing__item {
    width: 50%;
}

@media only screen and (min-width: 769px) {
    .l-closing .l-closing__item {
        font-size: 15px;
        margin-bottom: 18px;
    }
}

@media only screen and (max-width: 768px) {
    .l-closing .l-closing__item {
        font-size: 3.74vw;
        margin-bottom: 5.34vw;
    }
}

.l-closing .l-closing__item:nth-last-child(-n + 2) {
    margin-bottom: 0;
}

.l-closing .l-closing__ancker {
    position: relative;
    text-decoration: underline;
}

@media only screen and (min-width: 769px) {
    .l-closing .l-closing__ancker {
        display: block;
        color: #e5e0ca;
        margin-left: 12px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .l-closing .l-closing__ancker:hover {
        transform: translateX(2px);
    }
}

@media only screen and (max-width: 768px) {
    .l-closing .l-closing__ancker {
        margin-left: 2.94vw;
    }
}

.l-closing .l-closing__ancker::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

@media only screen and (min-width: 769px) {
    .l-closing .l-closing__ancker::before {
        width: 8px;
        height: 15px;
        background: url("/cdn/shop/files/icon_arrow.svg?v=1749488478");
        background-size: 8px auto;
        left: -12px;
    }
}

@media only screen and (max-width: 768px) {
    .l-closing .l-closing__ancker::before {
        width: 1.6vw;
        height: 3.2vw;
        /* background: url(../images/icon_arrow-dark.svg); */
        background-size: 1.6vw auto;
        left: -2.93vw;
    }
}

.l-dictionary .l-dictionary__ancker {
    display: block;
    position: relative;
    background: url("/html/user_data/assets/img/na/bg__medium_3fdfff77-1e7a-4794-9767-82ed01227030.jpg?v=1750209272");
}

@media only screen and (min-width: 769px) {
    .l-dictionary .l-dictionary__ancker {
        display: flex;
        justify-content: center;
        flex-direction: column;
        width: 1000px;
        height: 170px;
        margin: 0 auto;
        box-shadow: 0px 10px 36px 0px rgba(47, 32, 22, 0.3);
    }
}

@media only screen and (max-width: 768px) {
    .l-dictionary .l-dictionary__ancker {
        width: 84vw;
        height: 45.34vw;
        background-size: 100vw;
        box-shadow: 0px 2.67vw 9.6vw 0px rgba(47, 32, 22, 0.3);
    }
}

.l-dictionary .l-dictionary__ancker::before {
    content: "";
    display: block;
    position: absolute;
}

@media only screen and (min-width: 769px) {
    .l-dictionary .l-dictionary__ancker::before {
        width: 686px;
        height: 225px;
        background: url(/html/user_data/assets/img/na/index/illust_foods-pc.png);
        top: -31px;
        right: 8px;
    }
}

@media only screen and (max-width: 768px) {
    .l-dictionary .l-dictionary__ancker::before {
        width: 82.67vw;
        height: 50.14vw;
        background: url(/html/user_data/assets/img/na/index/illust_foods-sp.png);
        background-size: 82.67vw 50.14vw;
        top: -10.13vw;
        left: 3.74vw;
    }
}

.l-dictionary .l-dictionary__ttl {
    position: relative;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .l-dictionary .l-dictionary__ttl {
        font-size: 28px;
        margin: 0 0 6px;
        padding: 0 0 0 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-dictionary .l-dictionary__ttl {
        width: 77.07vw;
        margin: 0 auto 1.07vw;
        font-size: 5.87vw;
        padding: 29.87vw 0 0 1.87vw;
    }
}

.l-dictionary .l-dictionary__catch {
    position: relative;
    line-height: 1;
}

@media only screen and (min-width: 769px) {
    .l-dictionary .l-dictionary__catch {
        font-size: 15px;
        margin: 0 0 0 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-dictionary .l-dictionary__catch {
        width: 77.07vw;
        margin: 0 auto;
        font-size: 3.2vw;
        letter-spacing: 0;
        padding: 0 0 0 1.87vw;
        border-bottom: 1px solid #5d5446;
    }
}

.l-dictionary .l-dictionary__catch::before {
    content: "";
    display: block;
    position: absolute;
    bottom: -1px;
    right: -1px;
    background: #5d5446;
    transform: rotate(35deg);
    transform-origin: right bottom;
}

@media only screen and (max-width: 768px) {
    .l-dictionary .l-dictionary__catch::before {
        width: 2.67vw;
        height: 1px;
    }
}

.l-learning .l-learning__ancker {
    display: block;
    position: relative;
}

@media only screen and (min-width: 769px) {
    .l-learning .l-learning__ancker {
        display: flex;
        justify-content: center;
        flex-direction: column;
        width: 1000px;
        height: 170px;
        margin: 0 auto;
        overflow: hidden;
        box-shadow: 0px 10px 36px 0px rgba(47, 32, 22, 0.3);
    }

    .l-learning .l-learning__ancker:hover:before {
        transform: scale(1.06);
    }

    .l-learning .l-learning__ancker:before {
        content: "";
        width: 1000px;
        height: 170px;
        background-image: url("../images/bnr_learning_pc.jpg");
        transition-duration: 0.6s;
        transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }

    .l-learning .l-learning__ancker .is-sp {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    .l-learning .l-learning__ancker {
        width: 84vw;
        height: 45.34vw;
        background-size: 100vw;
        background-image: url("../images/bnr_learning_sp.jpg");
        box-shadow: 0px 2.67vw 9.6vw 0px rgba(47, 32, 22, 0.3);
    }

    .l-learning .l-learning__ancker .is-sp {
        display: block;
    }
}

.l-learning .l-learning__ancker .l-learning__text {
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    line-height: 1.2;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .l-learning .l-learning__ancker .l-learning__text {
        width: 949px;
        padding-bottom: 40px;
        font-size: 30px;
        bottom: 20px;
        text-align: right;
    }
}

@media only screen and (max-width: 768px) {
    .l-learning .l-learning__ancker .l-learning__text {
        width: 77.34vw;
    }
}

.l-learning .l-learning__ancker .l-learning__text:before {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 1px;
    padding: 0 13px;
    background: #e5e0ca;
    bottom: -1px;
    left: 0;
}

.l-learning .l-learning__ancker .l-learning__text:after {
    content: "";
    display: block;
    position: absolute;
    background: #e5e0ca;
    bottom: -1px;
    right: -1px;
    transform: rotate(35deg);
    transform-origin: right bottom;
    width: 10px;
    height: 1px;
}

.l-learning .l-learning__ancker .l-learning__text .l-learning__textInner {
    display: inline-block;
    text-align: left;
}

@media only screen and (min-width: 769px) {
    .l-learning .l-learning__ancker .l-learning__text .l-learning__textInner {
        padding: 0 40px 0 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-learning .l-learning__ancker .l-learning__text .l-learning__textInner {
        width: 100%;
    }
}

.l-learning .l-learning__ttl {
    position: relative;
    font-weight: 600;
    color: #e5e0ca;
}

@media only screen and (min-width: 769px) {
    .l-learning .l-learning__ttl {
        font-size: 28px;
        margin: 0 0 6px;
        text-align: left;
    }
}

@media only screen and (max-width: 768px) {
    .l-learning .l-learning__ttl {
        width: 77.07vw;
        margin: 0 auto 1.07vw;
        font-size: 5.87vw;
        padding: 20.27vw 0 2.14vw 1.87vw;
    }
}

.l-learning .l-learning__catch {
    position: relative;
    line-height: 1;
    color: #e5e0ca;
}

@media only screen and (min-width: 769px) {
    .l-learning .l-learning__catch {
        font-size: 15px;
        text-align: left;
    }
}

@media only screen and (max-width: 768px) {
    .l-learning .l-learning__catch {
        width: 77.07vw;
        margin: 0 auto;
        font-size: 3.2vw;
        letter-spacing: 0;
        padding: 0 0 0 1.87vw;
    }
}

.l-faq {
    background: rgba(255, 255, 255, 0.2);
}

@media only screen and (min-width: 769px) {
    .l-faq {
        padding: 60px 0 80px;
    }
}

@media only screen and (max-width: 768px) {
    .l-faq {
        margin: 0 auto;
        padding: 12.8vw 8vw;
    }
}

.l-faq .l-faq__ttl {
    line-height: 1;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__ttl {
        font-size: 36px;
        margin-bottom: 32px;
    }
}

@media only screen and (max-width: 768px) {
    .l-faq .l-faq__ttl {
        font-size: 5.87vw;
        margin-bottom: 6.4vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__list {
        width: 1000px;
        margin: 0 auto 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-faq .l-faq__list {
        margin: 0 auto 6.4vw;
    }
}

.l-faq .l-faq__q {
    position: relative;
    background: #e5e0ca;
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__q {
        padding: 27px 74px 25px 57px;
        margin-bottom: 7px;
        font-size: 16px;
        line-height: 1.6;
    }

    .l-faq .l-faq__q:hover::before {
        transform: translateX(4px);
    }

    .l-faq .l-faq__q:hover .l-faq__ancker {
        transform: translateX(4px);
    }
}

@media only screen and (max-width: 768px) {
    .l-faq .l-faq__q {
        padding: 3.74vw 8.81vw 4vw 9.6vw;
        margin-bottom: 1px;
        font-size: 3.47vw;
    }
}

.l-faq .l-faq__q::before {
    content: "Q";
    display: block;
    position: absolute;
    font-family: "Crimson Text", serif;
    font-weight: 600;
    line-height: 1;
    color: #2f3c0d;
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__q::before {
        font-size: 28px;
        top: 21px;
        left: 24px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-faq .l-faq__q::before {
        font-size: 4.8vw;
        top: 2.94vw;
        left: 3.74vw;
    }
}

.l-faq .l-faq__ancker {
    position: relative;
    display: block;
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__ancker {
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

.l-faq .l-faq__ancker::before {
    content: "";
    display: block;
    position: absolute;
    /* background: url(../images/icon_arrow-dark.svg); */
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__ancker::before {
        width: 10px;
        height: 19px;
        background-size: 10px auto;
        top: 50%;
        right: -36px;
        transform: translateY(-50%);
    }
}

@media only screen and (max-width: 768px) {
    .l-faq .l-faq__ancker::before {
        width: 1.6vw;
        height: 2.94vw;
        background-size: 1.6vw auto;
        top: 3.2vw;
        right: -3.2vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__cat {
        width: 1000px;
        margin: 0 auto;
    }
}

.l-faq .l-faq__cat .l-faq__cat__ttl {
    background: #2f3c0d;
    color: #e5e0ca;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__cat .l-faq__cat__ttl {
        font-size: 20px;
        height: 60px;
        line-height: 60px;
        margin-bottom: 7px;
    }
}

@media only screen and (max-width: 768px) {
    .l-faq .l-faq__cat .l-faq__cat__ttl {
        font-size: 4vw;
        height: 10.67vw;
        line-height: 10.67vw;
        margin-bottom: 1px;
    }
}

.l-faq .l-faq__cat .l-faq__cat__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.l-faq .l-faq__cat .l-faq__cat__item {
    background: #e5e0ca;
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__cat .l-faq__cat__item {
        width: 330px;
        height: 60px;
        line-height: 60px;
        font-size: 16px;
        margin-bottom: 7px;
    }
}

@media only screen and (max-width: 768px) {
    .l-faq .l-faq__cat .l-faq__cat__item {
        width: 41.87vw;
        height: 10.67vw;
        line-height: 10.67vw;
        font-size: 3.47vw;
        margin-bottom: 1px;
    }
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__cat .l-faq__cat__item .l-faq__ancker {
        padding: 0 0 0 24px;
    }
}

@media only screen and (max-width: 768px) {
    .l-faq .l-faq__cat .l-faq__cat__item .l-faq__ancker {
        padding: 0 0 0 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__cat .l-faq__cat__item .l-faq__ancker::before {
        right: 24px;
        top: 50%;
        transform: translateY(-50%);
    }
}

@media only screen and (max-width: 768px) {
    .l-faq .l-faq__cat .l-faq__cat__item .l-faq__ancker::before {
        right: 4vw;
        top: 3.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-faq .l-faq__cat .l-faq__cat__item .l-faq__ancker:hover {
        transform: translateX(4px);
    }
}

.l-foodSearch {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 100;
    color: #fff;
    transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}

.l-foodSearch.is-open {
    opacity: 1;
    visibility: visible;
}

.l-foodSearch .l-foodSearch__wrap {
    width: 100vw;
    overflow: auto;
    text-align: center;
}

.l-foodSearch .l-foodSearch__wrap::-webkit-scrollbar {
    display: none;
}

.l-foodSearch .l-foodSearch__wrap:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 1px;
    height: 100%;
}

.l-foodSearch .l-foodSearch__layer {
    position: absolute;
    width: 100vw;
    height: 100vh;
    background: rgba(47, 32, 22, 0.9);
    top: 0;
    left: 0;
}

.l-foodSearch .l-foodSearch__closeBtn {
    position: absolute;
    color: #fff;
    z-index: 10;
    cursor: pointer;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__closeBtn {
        padding-top: 40px;
        font-size: 16px;
        width: 44px;
        height: 59px;
        top: 40px;
        right: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__closeBtn {
        padding-top: 7.2vw;
        font-size: 3.47vw;
        width: 8vw;
        height: 11.74vw;
        top: 6.14vw;
        right: 6.14vw;
    }
}

.l-foodSearch .l-foodSearch__closeBtn::before {
    display: block;
    content: "";
    position: absolute;
    background: #e5e0ca;
    transform: rotate(-45deg);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__closeBtn::before {
        top: 14px;
        left: 0px;
        width: 41px;
        height: 1px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__closeBtn::before {
        top: 3.2vw;
        left: 0px;
        width: 9.07vw;
        height: 1px;
    }
}

.l-foodSearch .l-foodSearch__closeBtn::after {
    display: block;
    content: "";
    position: absolute;
    background: #e5e0ca;
    transform: rotate(45deg);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__closeBtn::after {
        top: 14px;
        left: 0px;
        width: 41px;
        height: 1px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__closeBtn::after {
        top: 3.2vw;
        left: 0px;
        width: 9.07vw;
        height: 1px;
    }
}

.l-foodSearch .l-foodSearch__conts {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__conts {
        margin-bottom: 25px;
    }
}

.l-foodSearch .l-foodSearch__head {
    position: relative;
    text-align: center;
    font-weight: 600;
    color: #e5e0ca;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__head {
        font-size: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__head {
        font-size: 4vw;
    }
}

.l-foodSearch .l-foodSearch__serect {
    display: none;
    opacity: 0;
    background: url("/html/user_data/assets/img/na/bg__medium_3fdfff77-1e7a-4794-9767-82ed01227030.jpg?v=1750209272");
    color: #703117;
    transition: opacity 0.6s cubic-bezier(0.47, 0, 0.745, 0.715);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__serect {
        width: 960px;
        margin: 32px auto 10px;
        padding: 40px 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__serect {
        background-size: 100vw auto;
        width: 89.34vw;
        margin: 6vw auto;
        padding: 8vw 0 6vw;
    }
}

.l-foodSearch .l-foodSearch__serect.-active {
    display: block;
    opacity: 1;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-name: fade-in;
    animation-name: fade-in;
}

@keyframes fade-in {
    0% {
        display: none;
        opacity: 0;
    }

    1% {
        display: block;
        opacity: 0;
    }

    100% {
        display: block;
        opacity: 1;
    }
}

.l-foodSearch .l-foodSearch__serect__head {
    font-weight: 600;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__serect__head {
        font-size: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__serect__head {
        font-size: 4.8vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__serect__check {
        margin: 0 auto;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__serect__check {
        width: 78.67vw;
        margin: 0 auto;
    }
}

.l-foodSearch .l-foodSearch__serect__check__input {
    position: relative;
    height: 100%;
}

.l-foodSearch .l-foodSearch__serect__check__input::before {
    content: "";
    display: block;
    position: absolute;
    background: #9d9889;
    height: 1px;
    z-index: 10;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__serect__check__input::before {
        left: 16px;
        width: 227px;
        bottom: 12px;
        transition: left 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__serect__check__input::before {
        left: 50%;
        transform: translateX(-50%);
        width: 28.27vw;
        bottom: 3.2vw;
    }
}

.l-foodSearch .l-foodSearch__serect__check__input::after {
    content: "";
    display: block;
    position: absolute;
    background: #9d9889;
    transform: rotate(35deg);
    transform-origin: right bottom;
    width: 10px;
    height: 1px;
    z-index: 1;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__serect__check__input::after {
        bottom: 12px;
        right: 17px;
        transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__serect__check__input::after {
        width: 1.87vw;
        bottom: 3.2vw;
        right: 4.43vw;
    }
}

.l-foodSearch .l-foodSearch__serect__check__input input {
    display: none;
}

.l-foodSearch .l-foodSearch__serect__check__input label {
    background: rgba(247, 243, 226, 0.5);
    transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.l-foodSearch .l-foodSearch__serect__check__input input:checked~label {
    background: #f7f3e2;
    color: #2f3c0d;
}

.l-foodSearch .l-foodSearch__serect__check__list {
    display: flex;
    justify-content: space-between;
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__serect__check__list {
        flex-wrap: wrap;
    }
}

.l-foodSearch .l-foodSearch__serect__check__item {
    position: relative;
    font-weight: 600;
}

.l-foodSearch .l-foodSearch__serect__check__item::after {
    content: "";
    display: block;
    position: absolute;
    transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    z-index: 10;
    pointer-events: none;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__serect__check__item:hover .l-foodSearch__serect__check__input::before {
        left: 20px;
    }

    .l-foodSearch .l-foodSearch__serect__check__item:hover .l-foodSearch__serect__check__input::after {
        right: 12px;
    }
}

.l-foodSearch .l-foodSearch__serect__check__item label {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    z-index: 1;
    cursor: pointer;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__serect__check__item label {
        padding: 105px 0 0;
        font-size: 18px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__serect__check__item label {
        padding: 23.47vw 0 0;
        font-size: 3.47vw;
    }
}

.l-foodSearch .l-foodSearch__serect__check__item label .-en {
    display: block;
    font-family: "Crimson Text", serif;
    font-weight: 600;
    line-height: 1;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__serect__check__item label .-en {
        font-size: 14px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__serect__check__item label .-en {
        font-size: 3.2vw;
    }
}

.l-foodSearch .l-foodSearch__serect__check__item label .-small {
    display: block;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .l-foodSearch__serect__check__item label .-small {
        font-size: 14px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .l-foodSearch__serect__check__item label .-small {
        font-size: 2.67vw;
        transform: scale(0.9);
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .subSelect {
        margin-top: 4.27vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .subSelect>ol {
        width: 80vw;
        display: flex;
        justify-content: space-between;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side {
        width: 210px;
        height: 86px;
        margin-bottom: 18px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side {
        width: 38.14vw;
        height: 12.27vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side::before {
        width: 210px;
        height: 86px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side::before {
        width: 38.14vw;
        height: 12.27vw;
    }
}

.l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side::after {
    display: none;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side label {
        height: 86px;
        padding: 24px 30px 24px 106px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side label {
        padding: 1.87vw 6.4vw 1.87vw 17.34vw;
    }
}

.l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-dogPregnant::before {
    display: block;
    background: url(../images/img_search-pregnant-dog.png);
    pointer-events: none;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-dogPregnant::before {
        width: 60px;
        height: 57px;
        background-size: 60px 57px;
        top: 16px;
        left: 16px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-dogPregnant::before {
        width: 10.14vw;
        height: 9.6vw;
        background-size: 10.14vw 9.6vw;
        top: 1.34vw;
        left: 3.2vw;
        transform: translateX(0);
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-dogPregnant:hover::before {
        transform: scale(1.05);
    }
}

.l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-catPregnant::before {
    display: block;
    background: url(../images/img_search-pregnant-cat.png);
    pointer-events: none;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-catPregnant::before {
        width: 60px;
        height: 42px;
        background-size: 60px 42px;
        top: 24px;
        left: 16px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-catPregnant::before {
        width: 10.67vw;
        height: 7.47vw;
        background-size: 10.67vw 7.47vw;
        top: 2.94vw;
        left: 3.2vw;
        transform: translateX(0);
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-catPregnant:hover::before {
        transform: scale(1.05);
    }
}

.l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-dogLactation::before {
    display: block;
    background: url(../images/img_search-lactation-dog.png);
    pointer-events: none;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-dogLactation::before {
        width: 60px;
        height: 57px;
        background-size: 60px 57px;
        top: 16px;
        left: 16px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-dogLactation::before {
        width: 10.14vw;
        height: 9.6vw;
        background-size: 10.14vw 9.6vw;
        top: 1.34vw;
        left: 3.2vw;
        transform: translateX(0);
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-dogLactation:hover::before {
        transform: scale(1.05);
    }
}

.l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-catLactation::before {
    display: block;
    background: url(../images/img_search-lactation-cat.png);
    pointer-events: none;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-catLactation::before {
        width: 60px;
        height: 42px;
        background-size: 60px 42px;
        top: 22px;
        left: 16px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-catLactation::before {
        width: 10.67vw;
        height: 7.47vw;
        background-size: 10.67vw 7.47vw;
        top: 2.4vw;
        left: 3.2vw;
        transform: translateX(0);
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input.-catLactation:hover::before {
        transform: scale(1.05);
    }
}

.l-foodSearch .subSelect .l-foodSearch__serect__check__item.-side .l-foodSearch__serect__check__input::after {
    display: none;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch .subSelect .l-foodSearch__serect__check__item:last-child {
        margin-bottom: 0;
    }
}

/*
�y�b�g�̎�ނ́H
*/
@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-kind .l-foodSearch__serect__check {
        width: 552px;
        margin-top: 7px;
        padding-top: 123px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-kind .l-foodSearch__serect__check {
        padding-top: 29.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-kind .l-foodSearch__serect__check__item {
        width: 260px;
        height: 170px;
    }

    .l-foodSearch__serect.-kind .l-foodSearch__serect__check__item:hover::after {
        transform: scale(1.05, 1.05);
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-kind .l-foodSearch__serect__check__item {
        width: 37.34vw;
        height: 37.34vw;
    }
}

.l-foodSearch__serect__check__item.-dog::after {
    background: url(../images/img_search01-dog.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect__check__item.-dog::after {
        width: 162px;
        height: 203px;
        background-size: 162px 203px;
        top: -109px;
        left: 49px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect__check__item.-dog::after {
        width: 28.54vw;
        height: 36vw;
        background-size: 28.54vw 36vw;
        top: -15.73vw;
        left: 4.54vw;
    }
}

.l-foodSearch__serect__check__item.-cat::after {
    background: url(../images/img_search01-cat.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect__check__item.-cat::after {
        width: 124px;
        height: 216px;
        background-size: 124px 216px;
        top: -122px;
        left: 68px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect__check__item.-cat::after {
        width: 22.94vw;
        height: 40vw;
        background-size: 22.94vw 40vw;
        top: -19.73vw;
        left: 7.2vw;
    }
}

/*
���C�t�X�e�[�W�́H
*/
@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check {
        width: 880px;
        padding-top: 134px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check {
        margin-top: 0;
        padding-top: 24vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogToy .l-foodSearch__serect__check__item.-dogPuppy::after {
    background: url(../images/img_search02-dog-01.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogToy .l-foodSearch__serect__check__item.-dogPuppy::after {
        width: 100px;
        height: 151px;
        background-size: 100px 151px;
        top: -43px;
        left: 50px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogToy .l-foodSearch__serect__check__item.-dogPuppy::after {
        width: 16.54vw;
        height: 25.07vw;
        background-size: 16.54vw 25.07vw;
        top: -5.86vw;
        left: 3.74vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogToy .l-foodSearch__serect__check__item.-dogAdult::after {
    background: url(../images/img_search01-dog.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogToy .l-foodSearch__serect__check__item.-dogAdult::after {
        width: 178px;
        height: 225px;
        background-size: 178px 225px;
        top: -117px;
        left: 11px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogToy .l-foodSearch__serect__check__item.-dogAdult::after {
        width: 29.87vw;
        height: 37.6vw;
        background-size: 29.87vw 37.6vw;
        top: -17.33vw;
        left: -2.4vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogToy .l-foodSearch__serect__check__item.-dogSenior::after {
    background: url(../images/img_search02-dog-03.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogToy .l-foodSearch__serect__check__item.-dogSenior::after {
        width: 123px;
        height: 148px;
        background-size: 123px 148px;
        top: -40px;
        left: 39px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogToy .l-foodSearch__serect__check__item.-dogSenior::after {
        width: 20.54vw;
        height: 24.8vw;
        background-size: 20.54vw 24.8vw;
        top: -5.6vw;
        left: 2.14vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogSmall .l-foodSearch__serect__check__item.-dogPuppy::after {
    background: url(../images/img_search03-dog-01.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogSmall .l-foodSearch__serect__check__item.-dogPuppy::after {
        width: 86px;
        height: 131px;
        background-size: 86px 131px;
        top: -23px;
        left: 57px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogSmall .l-foodSearch__serect__check__item.-dogPuppy::after {
        width: 14.94vw;
        height: 22.67vw;
        background-size: 14.94vw 22.67vw;
        top: -4.8vw;
        left: 3.47vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogSmall .l-foodSearch__serect__check__item.-dogAdult::after {
    background: url(../images/img_search03-dog-02.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogSmall .l-foodSearch__serect__check__item.-dogAdult::after {
        width: 120px;
        height: 225px;
        background-size: 120px 225px;
        top: -117px;
        left: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogSmall .l-foodSearch__serect__check__item.-dogAdult::after {
        width: 20.8vw;
        height: 39.74vw;
        background-size: 20.8vw 39.74vw;
        top: -19.73vw;
        left: 1.87vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogSmall .l-foodSearch__serect__check__item.-dogSenior::after {
    background: url(../images/img_search03-dog-03.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogSmall .l-foodSearch__serect__check__item.-dogSenior::after {
        width: 134px;
        height: 162px;
        background-size: 134px 162px;
        top: -54px;
        left: 33px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogSmall .l-foodSearch__serect__check__item.-dogSenior::after {
        width: 23.2vw;
        height: 28vw;
        background-size: 23.2vw 28vw;
        top: -8.8vw;
        left: 0.54vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogMedium .l-foodSearch__serect__check__item.-dogPuppy::after {
    background: url(../images/img_search04-dog-01.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogMedium .l-foodSearch__serect__check__item.-dogPuppy::after {
        width: 100px;
        height: 122px;
        background-size: 100px 122px;
        top: -14px;
        left: 50px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogMedium .l-foodSearch__serect__check__item.-dogPuppy::after {
        width: 17.34vw;
        height: 21.34vw;
        background-size: 17.34vw 21.34vw;
        top: -2.13vw;
        left: 3.47vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogMedium .l-foodSearch__serect__check__item.-dogAdult::after {
    background: url(../images/img_search04-dog-02.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogMedium .l-foodSearch__serect__check__item.-dogAdult::after {
        width: 122px;
        height: 225px;
        background-size: 122px 225px;
        top: -117px;
        left: 39px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogMedium .l-foodSearch__serect__check__item.-dogAdult::after {
        width: 21.34vw;
        height: 39.74vw;
        background-size: 21.34vw 39.74vw;
        top: -20.26vw;
        left: 1.6vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogMedium .l-foodSearch__serect__check__item.-dogSenior::after {
    background: url(../images/img_search04-dog-03.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogMedium .l-foodSearch__serect__check__item.-dogSenior::after {
        width: 152px;
        height: 135px;
        background-size: 152px 135px;
        top: -27px;
        left: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogMedium .l-foodSearch__serect__check__item.-dogSenior::after {
        width: 26.67vw;
        height: 23.74vw;
        background-size: 26.67vw 23.74vw;
        top: -4.53vw;
        left: -1.33vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogLarge .l-foodSearch__serect__check__item.-dogPuppy::after {
    background: url(../images/img_search05-dog-01.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogLarge .l-foodSearch__serect__check__item.-dogPuppy::after {
        width: 95px;
        height: 157px;
        background-size: 95px 157px;
        top: -49px;
        left: 53px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogLarge .l-foodSearch__serect__check__item.-dogPuppy::after {
        width: 16.54vw;
        height: 27.2vw;
        background-size: 16.54vw 27.2vw;
        top: -8vw;
        left: 4vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogLarge .l-foodSearch__serect__check__item.-dogAdult::after {
    background: url(../images/img_search05-dog-02.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogLarge .l-foodSearch__serect__check__item.-dogAdult::after {
        width: 139px;
        height: 228px;
        background-size: 139px 228px;
        top: -120px;
        left: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogLarge .l-foodSearch__serect__check__item.-dogAdult::after {
        width: 24vw;
        height: 39.47vw;
        background-size: 24vw 39.47vw;
        top: -20vw;
        left: 0.27vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogLarge .l-foodSearch__serect__check__item.-dogSenior::after {
    background: url(../images/img_search05-dog-03.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogLarge .l-foodSearch__serect__check__item.-dogSenior::after {
        width: 109px;
        height: 155px;
        background-size: 109px 155px;
        top: -47px;
        left: 46px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogLarge .l-foodSearch__serect__check__item.-dogSenior::after {
        width: 18.67vw;
        height: 26.67vw;
        background-size: 18.67vw 26.67vw;
        top: -7.46vw;
        left: 2.94vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogGiant .l-foodSearch__serect__check__item.-dogPuppy::after {
    background: url(../images/img_search06-dog-01.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogGiant .l-foodSearch__serect__check__item.-dogPuppy::after {
        width: 98px;
        height: 142px;
        background-size: 98px 142px;
        top: -34px;
        left: 51px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogGiant .l-foodSearch__serect__check__item.-dogPuppy::after {
        width: 17.61vw;
        height: 25.6vw;
        background-size: 17.61vw 25.6vw;
        top: -6.4vw;
        left: 3.47vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogGiant .l-foodSearch__serect__check__item.-dogAdult::after {
    background: url(../images/img_search06-dog-02.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogGiant .l-foodSearch__serect__check__item.-dogAdult::after {
        width: 120px;
        height: 225px;
        background-size: 120px 225px;
        top: -117px;
        left: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogGiant .l-foodSearch__serect__check__item.-dogAdult::after {
        width: 21.6vw;
        height: 40.54vw;
        background-size: 21.6vw 40.54vw;
        top: -21.33vw;
        left: 1.6vw;
    }
}

.l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogGiant .l-foodSearch__serect__check__item.-dogSenior::after {
    background: url(../images/img_search06-dog-03.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogGiant .l-foodSearch__serect__check__item.-dogSenior::after {
        width: 142px;
        height: 135px;
        background-size: 142px 135px;
        top: -27px;
        left: 29px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check.-dogGiant .l-foodSearch__serect__check__item.-dogSenior::after {
        width: 25.6vw;
        height: 24.27vw;
        background-size: 25.6vw 24.27vw;
        top: -5.06vw;
        left: 1.07vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check__item {
        width: 200px;
        height: 190px;
    }

    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check__item:hover::after {
        transform: scale(1.05, 1.05);
    }

    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check__item:hover .l-foodSearch__serect__check__input::after {
        right: 5px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check__item {
        width: 24.54vw;
        height: 34.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check__input::before {
        width: 176px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check__input::before {
        width: 18.94vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check__input::after {
        right: 8px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check__input::after {
        right: 2.83vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check__input label {
        padding-top: 122px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-lifestage .l-foodSearch__serect__check__input label {
        padding-top: 21.34vw;
    }
}

.l-foodSearch__serect__check__item.-catKitten::after {
    background: url(../images/img_search02-cat-01.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect__check__item.-catKitten::after {
        width: 97px;
        height: 159px;
        background-size: 97px 159px;
        top: -49px;
        left: 52px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect__check__item.-catKitten::after {
        width: 17.07vw;
        height: 28vw;
        background-size: 17.07vw 28vw;
        top: -8.8vw;
        left: 3.74vw;
    }
}

.l-foodSearch__serect__check__item.-catAdult::after {
    background: url(../images/img_search01-cat.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect__check__item.-catAdult::after {
        width: 130px;
        height: 225px;
        background-size: 130px 225px;
        top: -117px;
        left: 35px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect__check__item.-catAdult::after {
        width: 22.94vw;
        height: 40vw;
        background-size: 22.94vw 40vw;
        top: -20.8vw;
        left: 0.8vw;
    }
}

.l-foodSearch__serect__check__item.-catSenior::after {
    background: url(../images/img_search02-cat-03.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect__check__item.-catSenior::after {
        width: 102px;
        height: 117px;
        background-size: 102px 117px;
        top: -9px;
        left: 49px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect__check__item.-catSenior::after {
        width: 18.14vw;
        height: 21.07vw;
        background-size: 18.14vw 21.07vw;
        top: -1.86vw;
        left: 3.2vw;
    }
}

/*
�y�b�g�̑傫���́H
*/
@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check {
        width: 880px;
        padding-top: 124px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check {
        margin-top: 0;
        padding-top: 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__list {
        justify-content: center;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item {
        width: 160px;
        height: 190px;
    }

    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item:hover::after {
        transform: scale(1.05, 1.05);
    }

    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item:hover .l-foodSearch__serect__check__input::after {
        right: 5px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item {
        width: 24.54vw;
        height: 29.34vw;
        margin-top: 9.34vw;
        margin-right: 2.4vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item:nth-of-type(3n) {
        margin-right: 0;
    }
}

.l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogToy::after {
    background: url(../images/img_search01-dog.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogToy::after {
        width: 83px;
        height: 102px;
        background-size: 83px 102px;
        top: 6px;
        left: 39px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogToy::after {
        width: 10.94vw;
        height: 13.34vw;
        background-size: 10.94vw 13.34vw;
        top: 1.34vw;
        left: 6.94vw;
    }
}

.l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogSmall::after {
    background: url(../images/img_search03-dog-02.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogSmall::after {
        width: 70px;
        height: 130px;
        background-size: 70px 130px;
        top: -22px;
        left: 45px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogSmall::after {
        width: 8.81vw;
        height: 16.54vw;
        background-size: 8.81vw 16.54vw;
        top: -1.6vw;
        left: 7.47vw;
    }
}

.l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogMedium::after {
    background: url(../images/img_search04-dog-02.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogMedium::after {
        width: 94px;
        height: 172px;
        background-size: 94px 172px;
        top: -64px;
        left: 33px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogMedium::after {
        width: 10.4vw;
        height: 18.67vw;
        background-size: 10.4vw 18.67vw;
        top: -4.26vw;
        left: 7.2vw;
    }
}

.l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogLarge::after {
    background: url(../images/img_search05-dog-02.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogLarge::after {
        width: 129px;
        height: 212px;
        background-size: 129px 212px;
        top: -104px;
        left: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogLarge::after {
        width: 12.8vw;
        height: 21.07vw;
        background-size: 12.8vw 21.07vw;
        top: -5.86vw;
        left: 6.14vw;
    }
}

.l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogGiant::after {
    background: url(../images/img_search06-dog-02.png);
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogGiant::after {
        width: 136px;
        height: 256px;
        background-size: 136px 256px;
        top: -148px;
        left: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__item.-dogGiant::after {
        width: 12vw;
        height: 22.94vw;
        background-size: 12vw 22.94vw;
        top: -8vw;
        left: 6.14vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__input::before {
        width: 136px;
        left: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__input::before {
        width: 18.94vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__input::after {
        right: 13px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__input::after {
        right: 2.83vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__input label {
        padding-top: 122px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__serect.-size .l-foodSearch__serect__check__input label {
        padding-top: 16.54vw;
    }
}

.sendBtn {
    position: absolute;
    display: block;
    background: #36460b;
    font-family: "Noto Serif JP", serif;
    font-weight: 600;
    color: #e5e0ca;
    right: 0;
    text-align: center;
    letter-spacing: 0.04em;
    box-shadow: 5px 3px 10px rgba(0, 0, 0, 0.3);
}

@media only screen and (min-width: 769px) {
    .sendBtn {
        bottom: -57px;
        height: 47px;
        width: 300px;
        font-size: 16px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .sendBtn {
        bottom: -10.13vw;
        width: 45.34vw;
        height: 12.8vw;
        font-size: 4vw;
        padding-left: 4vw;
        line-height: 1;
    }
}

.sendBtn[disabled] {
    background: none;
    color: rgba(229, 224, 202, 0.3);
    border: 1px solid rgba(229, 224, 202, 0.3);
    box-shadow: none;
}

.sendBtn[disabled]::before {
    opacity: 0.4;
}

.sendBtn[disabled]:hover {
    background: none;
    color: rgba(229, 224, 202, 0.3);
    transform: translate(0px, 0px);
    box-shadow: none;
}

.sendBtn[disabled]:hover::before {
    transform: translateY(-50%);
}

.sendBtn::before {
    content: "";
    display: block;
    position: absolute;
    background: url(../images/icon_search.svg) no-repeat;
    top: 50%;
    transform: translateY(-50%);
    background-size: cover;
}

@media only screen and (min-width: 769px) {
    .sendBtn::before {
        width: 20px;
        height: 20px;
        left: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .sendBtn::before {
        width: 4.8vw;
        height: 4.8vw;
        left: 8vw;
    }
}

@media only screen and (min-width: 769px) {
    .sendBtn:hover {
        background: #3e510a;
        transform: translate(2px, 2px);
        box-shadow: none;
    }

    .sendBtn:hover::before {
        transform: translateY(-50%) scale(1.02);
    }
}

.selectBack,
.selectBack--cat {
    position: absolute;
    color: #e5e0ca;
}

@media only screen and (min-width: 769px) {

    .selectBack,
    .selectBack--cat {
        left: 0;
        bottom: -72px;
        padding: 25px 15px 25px 19px;
        cursor: pointer;
    }
}

@media only screen and (max-width: 768px) {

    .selectBack,
    .selectBack--cat {
        left: 0;
        bottom: -11.73vw;
        padding: 5.34vw;
    }
}

@media only screen and (min-width: 769px) {

    .selectBack:hover::before,
    .selectBack--cat:hover::before {
        left: -4px;
    }
}

.selectBack::before,
.selectBack--cat::before {
    content: "";
    display: block;
    background: url("/cdn/shop/files/icon_arrow.svg?v=1749488478");
    transform: rotate(180deg);
    position: absolute;
}

@media only screen and (min-width: 769px) {

    .selectBack::before,
    .selectBack--cat::before {
        background-size: 8px 15px;
        width: 8px;
        height: 15px;
        left: 0;
        top: 28px;
        transition: left 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {

    .selectBack::before,
    .selectBack--cat::before {
        background-size: 2.14vw 4vw;
        width: 2.14vw;
        height: 4vw;
        left: 0;
        top: 6.14vw;
        vertical-align: middle;
    }
}

@media only screen and (min-width: 769px) {

    .selectBack .-pc,
    .selectBack--cat .-pc {
        display: inline-block;
    }
}

.l-foodSearch__btn {
    display: flex;
    justify-content: center;
}

.l-foodSearch__btn .l-foodSearch__item {
    background: #e5e0ca;
    opacity: 0.4;
    border-radius: 50%;
}

@media only screen and (min-width: 769px) {
    .l-foodSearch__btn .l-foodSearch__item {
        width: 10px;
        height: 10px;
        margin: 0 5px;
    }
}

@media only screen and (max-width: 768px) {
    .l-foodSearch__btn .l-foodSearch__item {
        width: 2.67vw;
        height: 2.67vw;
        margin: 0 1.34vw;
    }
}

.l-foodSearch__btn .l-foodSearch__item.-active {
    opacity: 1;
}

.is-foodSearchOpen {
    cursor: pointer;
}

.l-footer {
    font-family: "Noto Serif JP", serif;
    background: url(../images/bg_footer.jpg);
    letter-spacing: 0.04em;
    color: #e5e0ca;
}

@media only screen and (min-width: 769px) {
    .l-footer {
        font-size: 14px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer {
        font-size: 3.47vw;
        background-size: 100vw;
    }
}

.l-footer a,
.l-footer span {
    color: #e5e0ca;
}

.l-footer .l-footer__inner {
    display: flex;
    margin: 0 auto;
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__inner {
        width: 1000px;
        padding: 48px 0 50px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__inner {
        flex-wrap: wrap;
        width: 84vw;
        padding: 5.34vw 0 9.6vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__logo {
        width: 210px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__logo {
        width: 100%;
        text-align: center;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__logo img {
        width: 26.14vw;
        margin: 0 auto 5.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__nav {
        width: 210px;
        margin-top: 10px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__nav {
        width: 100%;
        margin-bottom: 2.67vw;
    }
}

.l-footer .l-footer__list {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__list {
        margin: 0 0 27px;
        padding: 0 0 0 14px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__list {
        background: rgba(229, 224, 202, 0.02);
        height: 10.67vw;
        line-height: 10.67vw;
        margin-bottom: 2.67vw;
        padding: 0 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__list:hover {
        transform: translateX(2px);
    }
}

.l-footer .l-footer__list::before {
    content: "";
    display: block;
    position: absolute;
    background: url("/cdn/shop/files/icon_arrow.svg?v=1749488478") no-repeat;
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__list::before {
        top: 0;
        left: 0;
        width: 8px;
        height: 15px;
        background-size: 8px 15px;
        background-position: center 1px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__list::before {
        top: 50%;
        right: 4vw;
        transform: translateY(-50%);
        width: 1.6vw;
        height: 3.2vw;
        background-size: 1.6vw auto;
        background-position: center center;
    }
}

.l-footer .l-footer__list:last-child {
    margin-bottom: 0;
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__list.-child {
        height: auto;
        background: none;
        padding: 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__list.-child::before {
        display: none;
    }
}

.l-footer .l-footer__list .l-footer__list__head {
    display: inline-block;
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__list .l-footer__list__head {
        margin-bottom: 8px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__list .l-footer__list__head {
        background: rgba(47, 60, 13, 0.2);
        width: 100%;
        height: 10.67vw;
        line-height: 10.67vw;
        margin-bottom: 2.67vw;
        padding: 0 4vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__list .l-footer__list__child {
        display: flex;
        justify-content: space-between;
    }
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__list .l-footer__list__child .l-footer__list {
        font-size: 13px;
        margin-bottom: 3px;
        padding: 0 0 0 12px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__list .l-footer__list__child .l-footer__list {
        width: 41.87vw;
        margin-bottom: 0;
    }
}

.l-footer .l-footer__list .l-footer__list__child .l-footer__list::before {
    width: 6px;
    height: 12px;
    background-size: 6px auto;
    background-position: center 2px;
}

.l-footer .l-footer__list .l-footer__list__child .l-footer__list:last-child {
    margin-bottom: 0;
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__subNav {
        width: 160px;
        margin-top: 10px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__subNav {
        display: flex;
        justify-content: center;
        width: 100%;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__subNav .l-footer__list {
        background: none;
        height: auto;
        line-height: 1;
        margin: 4.8vw 0 0;
        padding: 0 2.94vw;
        border-right: 1px solid #5d5446;
    }
}

.l-footer .l-footer__subNav .l-footer__list:last-child {
    border-right: none;
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__subNav .l-footer__list::before {
        display: none;
    }
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__subNav .js-guide:hover {
        transform: translateX(0);
    }
}

.l-footer .l-footer__subNav .js-guide .js-guide__balloon {
    left: initial;
    right: 0;
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__subNav .js-guide .js-guide__balloon {
        width: 320px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__subNav .js-guide .js-guide__balloon {
        width: 66vw;
    }
}

.l-footer .l-footer__subNav .js-guide .js-guide__balloon::before {
    left: initial;
    transform: translateX(0);
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__subNav .js-guide .js-guide__balloon::before {
        right: 110px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__subNav .js-guide .js-guide__balloon::before {
        right: 8.54vw;
    }
}

.l-footer .l-footer__btm {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    border-top: 1px solid #707070;
    margin: 0 auto;
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__btm {
        width: 1000px;
        padding: 33px 0 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__btm {
        width: 84vw;
        padding: 8vw 0 9.6vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__prohibition {
        font-size: 12px;
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__prohibition {
        font-size: 2.67vw;
        margin-bottom: 5.34vw;
        width: 55.2vw;
    }
}

.l-footer .l-footer__copyright {
    font-family: "Crimson Text", serif;
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__copyright {
        font-size: 13px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__copyright {
        font-size: 2.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-footer .l-footer__marsLogo {
        width: 105px;
        height: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .l-footer .l-footer__marsLogo {
        width: 18.67vw;
        height: 5.34vw;
    }
}

.pagetopScroll {
    background: rgba(47, 60, 13, 0.3);
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .pagetopScroll {
        height: 56px;
        line-height: 56px;
        font-size: 15px;
        cursor: pointer;
        transition: background 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .pagetopScroll {
        height: 14.94vw;
        line-height: 14.94vw;
        font-size: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .pagetopScroll:hover {
        background: rgba(47, 60, 13, 0.6);
    }

    .pagetopScroll:hover span::before {
        top: 19px;
    }
}

.pagetopScroll span {
    position: relative;
    display: inline-block;
    padding-left: 1em;
}

.pagetopScroll span::before {
    content: "";
    display: block;
    position: absolute;
    background: url(../images/icon_pagetop.svg);
}

@media only screen and (min-width: 769px) {
    .pagetopScroll span::before {
        width: 11px;
        height: 12px;
        background-size: 11px 12px;
        top: 23px;
        left: -2px;
        transition: top 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .pagetopScroll span::before {
        width: 2.94vw;
        height: 3.2vw;
        background-size: 2.94vw 3.2vw;
        top: 6.14vw;
        left: -0.53vw;
    }
}

.l-goodLifeNav {
    position: relative;
    background: url("/html/user_data/assets/img/na/bg__medium_3fdfff77-1e7a-4794-9767-82ed01227030.jpg?v=1750209272");
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav {
        padding: 44px 0 148px;
        background-size: 55vw;
        background-position: 24.3vw -11.7vw;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1100px) {
    .l-goodLifeNav {
        background-size: 603.75px;
        background-position: 270px -130px;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav {
        padding: 6.14vw 8vw 26.67vw;
        background-size: 100%;
        background-position: center 70.41vw;
    }
}

.l-goodLifeNav::before {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav::before {
        background: url(../images/bg_right-top2-pc.png) no-repeat left bottom;
        background-size: 100%;
        height: 5vw;
        top: -5vw;
        left: 0;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1100px) {
    .l-goodLifeNav::before {
        height: 54.7px;
        top: -54.7px;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav::before {
        background: url(../images/bg_right-top-sp.png) no-repeat left top;
        background-size: 100vw auto;
        height: 18.67vw;
        top: -70px;
        left: 0;
    }
}

.l-goodLifeNav.-inner {
    background: none;
    padding: 0;
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav.-inner {
        width: 84vw;
        margin: 0 auto;
    }
}

.l-goodLifeNav.-inner::before {
    display: none;
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-dictionary {
        margin-bottom: 90px;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-dictionary {
        margin-bottom: 15.47vw;
    }
}

.l-goodLifeNav .l-goodLifeNav__ttl {
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__ttl {
        font-size: 36px;
        margin-bottom: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-goodLifeNav__ttl {
        font-size: 5.87vw;
        margin-bottom: 5.34vw;
    }
}

.l-goodLifeNav .l-goodLifeNav__ttl span {
    font-family: "Crimson Text", serif;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__ttl span {
        font-size: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-goodLifeNav__ttl span {
        font-size: 6.94vw;
    }
}

.l-goodLifeNav .l-goodLifeNav__catch {
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__catch {
        font-size: 16px;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-goodLifeNav__catch {
        font-size: 3.47vw;
        margin-bottom: 6.4vw;
        line-height: 1.7;
    }
}

.l-goodLifeNav .l-goodLifeNav__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__list {
        width: 1000px;
        margin: 0 auto;
        margin-bottom: 32px;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-goodLifeNav__list {
        margin-bottom: 2.4vw;
    }
}

.l-goodLifeNav .l-goodLifeNav__item {
    background: rgba(255, 255, 255, 0.4);
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__item {
        width: 485px;
        margin-bottom: 30px;
        padding: 16px;
        transition: background 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-goodLifeNav__item {
        width: 40vw;
        margin-bottom: 4vw;
        padding: 2.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__item:hover {
        background: rgba(255, 255, 255, 0.6);
    }

    .l-goodLifeNav .l-goodLifeNav__item:hover .l-goodLifeNav__img img {
        transform: scale(1.05);
    }
}

.l-goodLifeNav .l-goodLifeNav__ancker {
    display: flex;
    justify-content: space-between;
    height: 100%;
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__ancker {
        align-items: center;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-goodLifeNav__ancker {
        flex-direction: column;
    }
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__inner {
        width: 216px;
    }
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__img {
        overflow: hidden;
        width: 220px;
        margin-right: 8px;
    }

    .l-goodLifeNav .l-goodLifeNav__img img {
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-goodLifeNav__img {
        margin-bottom: 2.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__navTtl {
        margin-bottom: 20px;
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-goodLifeNav__navTtl {
        margin-bottom: 2.67vw;
    }
}

.l-goodLifeNav .l-goodLifeNav__tag {
    font-family: "�q���M�m�p�S Pro", "Hiragino Kaku Gothic Pro", "MS P�S�V�b�N",
        "MS PGothic", sans-serif;
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__tag {
        font-size: 11px;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-goodLifeNav__tag {
        font-size: 2.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__tag span {
        padding-right: 9px;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-goodLifeNav__tag span {
        padding-right: 2.94vw;
    }
}

.l-goodLifeNav .l-goodLifeNav__tag span:last-child {
    padding-right: 0;
}

.l-goodLifeNav .l-goodLifeNav__btn {
    display: block;
}

@media only screen and (min-width: 769px) {
    .l-goodLifeNav .l-goodLifeNav__btn {
        width: 290px;
        height: 47px;
        line-height: 47px;
        font-size: 15px;
        margin: 0 auto;
    }
}

@media only screen and (max-width: 768px) {
    .l-goodLifeNav .l-goodLifeNav__btn {
        width: 100%;
        height: 12.54vw;
        line-height: 12.54vw;
        font-size: 4.27vw;
    }
}

.l-header {
    position: absolute;
    letter-spacing: 0;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99;
}

@media only screen and (min-width: 769px) {
    .l-header {
        width: 100%;
        min-width: 1100px;
        height: 125px;
        opacity: 1;
        transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-header {
        padding: 5.34vw 0 0;
    }
}

.l-header::before {
    content: "";
    display: block;
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

@media only screen and (min-width: 769px) {
    .l-header::before {
        background-image: url("/html/user_data/assets/img/na/bg__medium_3fdfff77-1e7a-4794-9767-82ed01227030.jpg?v=1750209272");
        background-position: right top;
        transition: opacity 0.2s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-header::before {
        background-image: url("/html/user_data/assets/img/na/bg__medium_3fdfff77-1e7a-4794-9767-82ed01227030.jpg?v=1750209272");
        background-size: 100vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-header a {
        color: #e5e0ca;
        transition: color 0.2s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (min-width: 769px) {
    .l-header.is-hover {
        height: 340px;
    }

    .l-header.is-hover::before {
        opacity: 1;
    }

    .l-header.is-hover a {
        color: #703117;
    }
}

@media only screen and (min-width: 769px) {

    .l-header.is-hover.is-fixed,
    .l-header.is-hover.is-fit {
        height: 340px;
    }
}

.l-header.is-hover .l-header__list {
    background: none;
}

@media only screen and (min-width: 769px) {
    .l-header.is-hover .smallNav__border {
        background: #2f2016;
    }
}

.l-header.is-hover .l-header__item.-shop svg {
    fill: #2f2016;
}

@media only screen and (min-width: 769px) {
    .l-header.is-smallNavOpen::before {
        opacity: 1;
    }

    .l-header.is-smallNavOpen a {
        color: #703117;
    }
}

.l-header.is-fixed {
    position: fixed;
}

.l-header.is-fit {
    position: absolute;
}

.l-header.is-fixed,
.l-header.is-fit {
    top: 0;
    opacity: 1;
    z-index: 99;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

@media only screen and (min-width: 769px) {

    .l-header.is-fixed,
    .l-header.is-fit {
        height: 80px;
        box-shadow: 0px 0px 6px 0px rgba(47, 32, 22, 0.3);
    }
}

@media only screen and (max-width: 768px) {

    .l-header.is-fixed,
    .l-header.is-fit {
        width: 100vw;
        padding-top: 3.2vw;
        padding-bottom: 3.2vw;
    }
}

.l-header.is-fixed::before,
.l-header.is-fit::before {
    display: block;
    -webkit-animation: show 0.5s linear 0s forwards;
    animation: show 0.5s linear 0s forwards;
}

@media only screen and (min-width: 769px) {

    .l-header.is-fixed .l-header__logo,
    .l-header.is-fit .l-header__logo {
        width: 81px;
        height: 50px;
        top: 15px;
        left: 40px;
    }
}

@media only screen and (max-width: 768px) {

    .l-header.is-fixed .l-header__logo,
    .l-header.is-fit .l-header__logo {
        width: 18.67vw;
        height: 11.74vw;
    }
}

@media only screen and (max-width: 768px) {

    .l-header.is-fixed .openNav,
    .l-header.is-fit .openNav {
        margin-top: 0.8vw;
    }
}

.l-header.is-fixed .openNav .openNav__border,
.l-header.is-fit .openNav .openNav__border {
    background: #2f2016;
}

.l-header.is-fixed .openNav .openNav__txt,
.l-header.is-fit .openNav .openNav__txt {
    color: #703117;
}

@media only screen and (min-width: 769px) {

    .l-header.is-fixed .l-header__list,
    .l-header.is-fit .l-header__list {
        margin-top: 0;
        padding: 20px 114px 20px 40px;
        background: none;
    }
}

@media only screen and (min-width: 769px) {

    .l-header.is-fixed .l-header__item a,
    .l-header.is-fit .l-header__item a {
        color: #703117;
    }
}

.l-header.is-fixed .l-header__item a::before,
.l-header.is-fit .l-header__item a::before {
    background: #2f3c0d;
}

.l-header.is-fixed .l-header__item.-shop svg,
.l-header.is-fit .l-header__item.-shop svg {
    fill: #2f2016;
}

@media only screen and (min-width: 769px) {

    .l-header.is-fixed .smallNav__menu,
    .l-header.is-fit .smallNav__menu {
        top: 25px;
    }
}

@media only screen and (min-width: 769px) {

    .l-header.is-fixed .smallNav__border,
    .l-header.is-fit .smallNav__border {
        background: #2f2016;
    }
}

@media only screen and (min-width: 769px) {

    .l-header.is-fixed .l-header__list-02,
    .l-header.is-fit .l-header__list-02 {
        top: 80px;
        background-position: right -80px;
    }
}

@media only screen and (min-width: 769px) {
    .l-header.is-fit {
        box-shadow: none;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__head {
        position: relative;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__head {
        display: flex;
        justify-content: space-between;
        width: 89.34vw;
        margin: 0 auto;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__logo {
        position: absolute;
        top: 30px;
        left: 40px;
        width: 110px;
        transition: width 0.1s cubic-bezier(0.19, 1, 0.22, 1);
        z-index: 10;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__logo {
        position: relative;
        width: 23.47vw;
        height: 14.4vw;
        transition: width 0.1s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (min-width: 769px) {
    .l-header .openNav {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .openNav {
        position: relative;
        width: 9.07vw;
        margin-top: 2.67vw;
    }
}

.l-header .openNav .openNav__border {
    position: absolute;
    display: block;
    width: 100%;
    height: 1px;
    background: #fff;
    left: 0;
}

@media only screen and (min-width: 769px) {
    .l-header .openNav .openNav__border:first-child {
        width: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .openNav .openNav__border:first-child {
        width: 3.2vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .openNav .openNav__border:nth-child(2) {
        top: 8px;
        width: 18px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .openNav .openNav__border:nth-child(2) {
        top: 2.14vw;
        width: 4.8vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .openNav .openNav__border:nth-child(3) {
        top: 16px;
        width: 26px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .openNav .openNav__border:nth-child(3) {
        top: 4.27vw;
        width: 6.94vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .openNav .openNav__border:nth-child(4) {
        top: 24px;
        width: 34px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .openNav .openNav__border:nth-child(4) {
        top: 6.4vw;
        width: 9.07vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .openNav .openNav__txt {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .openNav .openNav__txt {
        font-family: "Crimson Text", serif;
        letter-spacing: 0.04em;
        line-height: 1;
        color: #fff;
        padding-top: 8vw;
        transition: color 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__nav {
        position: relative;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__nav {
        visibility: hidden;
        opacity: 0;
        position: absolute;
        top: 0;
        background: url("/html/user_data/assets/img/na/bg__medium_3fdfff77-1e7a-4794-9767-82ed01227030.jpg?v=1750209272");
        background-size: 375px 375px;
        width: 100%;
        height: 100vh;
        padding: 0 0 18.67vw;
        overflow: scroll;
        z-index: 10;
        transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__nav .openNav {
        position: absolute;
        top: 8vw;
        right: 5.34vw;
        margin-top: 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__nav.is-open {
        display: block;
        visibility: visible;
        opacity: 1;
    }
}

.l-header .l-header__nav.is-open .l-header__nav__inner {
    opacity: 1;
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__nav.is-open .l-header__nav__inner {
        padding-bottom: 17.07vw;
    }
}

.l-header .l-header__nav.is-open .openNav {
    position: absolute;
    top: 8vw;
    right: 5.34vw;
    margin-top: 0;
}

.l-header .l-header__nav.is-open .openNav__border {
    position: absolute;
    top: 3.2vw;
    background: #2f2016;
}

.l-header .l-header__nav.is-open .openNav__border:first-child {
    width: 10.67vw;
    transform: rotate(45deg);
    transform-origin: center;
    margin-left: -1.33vw;
}

.l-header .l-header__nav.is-open .openNav__border:nth-child(2) {
    opacity: 0;
}

.l-header .l-header__nav.is-open .openNav__border:nth-child(3) {
    opacity: 0;
}

.l-header .l-header__nav.is-open .openNav__border:nth-child(4) {
    width: 10.67vw;
    transform: rotate(-45deg);
    transform-origin: center;
    margin-left: -1.33vw;
}

.l-header .l-header__nav.is-open .openNav__txt {
    color: #703117;
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__nav__inner {
        opacity: 0;
        transition: all 0.2s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__nav__logo {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__nav__logo {
        display: block;
        margin: 11.2vw auto 0;
        text-align: center;
    }
}

.l-header .l-header__list {
    display: flex;
    position: relative;
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__list {
        justify-content: flex-end;
        padding: 40px 114px 46px 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__list {
        flex-wrap: wrap;
        width: 84vw;
        margin: 6.94vw auto 0;
        border-top: 1px solid #9d9889;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__list-02 {
        position: absolute;
        right: 0;
        top: 100px;
        background-image: url("/html/user_data/assets/img/na/bg__medium_3fdfff77-1e7a-4794-9767-82ed01227030.jpg?v=1750209272");
        background-position: right -100px;
        width: 316px;
        padding-left: 41px;
        padding-bottom: 30px;
        opacity: 0;
        visibility: hidden;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__list-02 {
        flex-wrap: wrap;
        width: 84vw;
        margin: 0 auto;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__list-02.is-open {
        opacity: 1;
        visibility: visible;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__list-02 .l-header__item a {
        position: relative;
        color: #703117;
        margin: 0;
        padding-left: 14px;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__list-02 .l-header__item a::before {
        content: "";
        display: block;
        position: absolute;
        /* background: url(../images/icon_arrow-dark.svg); */
        background-size: 8px 15px;
        width: 8px;
        height: 15px;
        left: 0;
        top: 3px;
        opacity: 1;
        visibility: visible;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__list-02 .l-header__item a:hover {
        text-decoration: underline;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__list__child {
        visibility: hidden;
        opacity: 0;
        display: flex;
        justify-content: center;
        position: absolute;
        width: 100%;
        left: 0;
        z-index: 10;
        transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__list__child {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        padding: 3.2vw 0 0;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__category {
        width: 1000px;
        margin: 50px auto 0;
        display: flex;
        justify-content: space-between;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__category {
        width: 100%;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList {
        margin-left: 5.34vw;
        border-top: 1px solid #c2bcaa;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList.-type {
        width: 160px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList.-type .l-header__categoryList__item {
        width: 31.5%;
        font-size: 3.47vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList.-type .l-header__categoryList__name {
        width: 100%;
        height: 18.67vw;
        background: rgba(255, 255, 255, 0.4);
        margin-top: 9.6vw;
        padding-top: 12.54vw;
        text-align: center;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList.-type .l-header__categoryList__img {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList.-type .l-header__categoryList__img {
        position: absolute;
        bottom: 8vw;
        left: 50%;
        transform: translateX(-50%);
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList.-material {
        width: 234px;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList.-material .l-header__categoryList__item:nth-child(odd) {
        width: 130px;
    }

    .l-header .l-header__categoryList.-material .l-header__categoryList__item:nth-child(even) {
        width: 104px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList.-material .l-header__categoryList__item {
        width: 38.14vw;
        height: 9.34vw;
        line-height: 8.81vw;
        padding: 0 3.74vw;
        background: rgba(255, 255, 255, 0.4);
        margin-bottom: 2.14vw;
    }

    .l-header .l-header__categoryList.-material .l-header__categoryList__item:nth-last-child(-n + 2) {
        margin-bottom: 0;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList.-brand {
        width: 494px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList.-brand .l-header__categoryList__item {
        width: 37.87vw;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column-reverse;
        justify-content: flex-end;
        text-align: center;
        line-height: 1.2;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList.-brand .l-header__categoryList__item:nth-child(-n + 2) {
        margin-bottom: 4vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList.-brand .l-header__categoryList__img {
        margin-bottom: 2.14vw;
    }
}

.l-header .l-header__categoryList .l-header__categoryList__head {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList .l-header__categoryList__head {
        font-size: 14px;
        border-bottom: 1px solid #9d9889;
        padding-bottom: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList .l-header__categoryList__head {
        position: relative;
        font-size: 3.74vw;
        padding: 13px 0 12px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList .l-header__categoryList__head::before {
        content: "";
        display: block;
        position: absolute;
        /* background: url(../images/icon_arrow-dark.svg); */
        background-size: 2.14vw 4vw;
        width: 2.14vw;
        height: 4vw;
        transform: rotate(90deg);
        right: 0.8vw;
        top: 3.47vw;
        transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

.l-header .l-header__categoryList .l-header__categoryList__head.is-open::before {
    transform: rotate(-90deg);
}

.l-header .l-header__categoryList .l-header__categoryList__list {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList .l-header__categoryList__list {
        padding: 18px 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList .l-header__categoryList__list {
        padding-bottom: 4.27vw;
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList .l-header__categoryList__list.is-open {
        display: flex;
    }
}

.l-header .l-header__categoryList .l-header__categoryList__item {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList .l-header__categoryList__item {
        width: 100%;
        padding: 6px 0;
        font-size: 14px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__categoryList .l-header__categoryList__item {
        font-size: 3.47vw;
    }
}

.l-header .l-header__categoryList .l-header__categoryList__item a {
    margin: 0;
    display: block;
    position: relative;
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList .l-header__categoryList__item a {
        padding: 0 0 0 13px;
    }

    .l-header .l-header__categoryList .l-header__categoryList__item a:hover {
        text-decoration: underline;
    }

    .l-header .l-header__categoryList .l-header__categoryList__item a:hover+.l-header__categoryList__img {
        opacity: 1;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList .l-header__categoryList__item a::before {
        content: "";
        display: block;
        position: absolute;
        /* background: url(../images/icon_arrow-dark.svg); */
        background-size: 8px 15px;
        width: 8px;
        height: 15px;
        left: 0;
        top: 2px;
        opacity: 1;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList .l-header__categoryList__name {
        width: 252px;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__categoryList .l-header__categoryList__img {
        position: absolute;
        width: 211px;
        height: 120px;
        right: 0;
        top: 25px;
        opacity: 0;
        transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .l-header .l-header__categoryList .l-header__categoryList__img a::before {
        display: none;
    }
}

.l-header .l-header__categoryList .l-header__categoryList__img img {
    -webkit-backface-visibility: hidden;
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__item {
        margin-right: 0;
        padding: 10px 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__item {
        position: relative;
        width: 100%;
        border-bottom: 1px solid #9d9889;
        line-height: 1;
        font-size: 4.27vw;
        padding: 4.27vw 0;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__item::before {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__item::before {
        display: block;
        content: "";
        position: absolute;
        /* background: url(../images/icon_arrow-dark.svg); */
        background-size: 2.14vw 4vw;
        width: 2.14vw;
        height: 4vw;
        right: 0.54vw;
        top: 50%;
        transform: translateY(-50%);
    }
}

.l-header .l-header__item a {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__item a {
        position: relative;
        margin-right: 1.24vw;
        margin-left: 1.24vw;
    }

    .l-header .l-header__item a::before {
        display: block;
        content: "";
        position: absolute;
        width: 100%;
        height: 2px;
        background: #e5e0ca;
        bottom: -8px;
        left: 0;
        opacity: 0;
        transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (min-width: 769px) and (max-width: 1100px) {
    .l-header .l-header__item a {
        margin-right: 14px;
        margin-left: 14px;
    }
}

.l-header .l-header__item a:hover::before {
    bottom: -6px;
    opacity: 1;
}

.l-header .l-header__item:last-child {
    margin-right: 0;
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__item:last-child a {
        margin-right: 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__item .-sp {
        display: inline;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__item.-parent {
        padding: 4.27vw 0 1.87vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__item.-parent::before {
        display: none;
    }
}

.l-header .l-header__item.-parent>a::before {
    background: #2f3c0d;
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__item.-parent:hover .l-header__list__child {
        opacity: 1;
        visibility: visible;
    }
}

.l-header .l-header__item.-shop {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__item.-shop svg {
        position: absolute;
        top: 12px;
        left: 1.1vw;
        fill: #e5e0ca;
        transition: fill 0.2s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

.l-header .l-header__item.-shop a {
    margin-left: 2.48vw;
}

@media only screen and (min-width: 769px) and (max-width: 1100px) {
    .l-header .l-header__item.-shop a {
        margin-left: 28px;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__btn {
        width: 84vw;
        margin: 8.54vw auto 0;
    }
}

.l-header .l-header__btn button {
    width: 100%;
    margin-bottom: 3.74vw;
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__btn .c-searchBtn .c-searchBtn__icon {
        width: 14.14vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-header .l-header__serch {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__serch {
        position: relative;
        background: #2f3c0d;
        color: #fff;
        width: 100%;
        height: 12.54vw;
        line-height: 12.27vw;
        font-size: 4vw;
        letter-spacing: 0.04em;
        padding-right: 2.67vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-header .l-header__serch::before {
        display: block;
        content: "";
        position: absolute;
        background: url("/cdn/shop/files/icon_arrow.svg?v=1749488478");
        background-size: 2.14vw 4vw;
        width: 2.14vw;
        height: 4vw;
        right: 4vw;
        top: 50%;
        transform: translateY(-50%);
    }
}

@media only screen and (min-width: 769px) {
    .smallNav .smallNav__menu {
        position: absolute;
        width: 34px;
        height: 24px;
        right: 40px;
        top: 45px;
        z-index: 10;
        cursor: pointer;
    }
}

@media only screen and (max-width: 768px) {
    .smallNav .smallNav__menu {
        display: none;
    }
}

@media only screen and (min-width: 769px) {
    .smallNav .smallNav__menu.is-open .smallNav__border {
        position: absolute;
        top: 10px;
        background: #2f2016;
    }

    .smallNav .smallNav__menu.is-open .smallNav__border:first-child {
        width: 31.5px;
        transform: rotate(45deg);
        transform-origin: center;
        margin-left: -3px;
    }

    .smallNav .smallNav__menu.is-open .smallNav__border:nth-child(2) {
        opacity: 0;
    }

    .smallNav .smallNav__menu.is-open .smallNav__border:nth-child(3) {
        opacity: 0;
    }

    .smallNav .smallNav__menu.is-open .smallNav__border:nth-child(4) {
        width: 31.5px;
        transform: rotate(-45deg);
        transform-origin: center;
        margin-left: -3px;
    }
}

@media only screen and (min-width: 769px) {
    .smallNav .smallNav__border {
        position: absolute;
        display: block;
        width: 100%;
        height: 1px;
        background: #fff;
        left: 0;
        transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (min-width: 769px) {
    .smallNav .smallNav__border:first-child {
        width: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .smallNav .smallNav__border:first-child {
        width: 3.2vw;
    }
}

@media only screen and (min-width: 769px) {
    .smallNav .smallNav__border:nth-child(2) {
        top: 8px;
        width: 18px;
    }
}

@media only screen and (max-width: 768px) {
    .smallNav .smallNav__border:nth-child(2) {
        top: 2.14vw;
        width: 4.8vw;
    }
}

@media only screen and (min-width: 769px) {
    .smallNav .smallNav__border:nth-child(3) {
        top: 16px;
        width: 26px;
    }
}

@media only screen and (max-width: 768px) {
    .smallNav .smallNav__border:nth-child(3) {
        top: 4.27vw;
        width: 6.94vw;
    }
}

@media only screen and (min-width: 769px) {
    .smallNav .smallNav__border:nth-child(4) {
        top: 24px;
        width: 34px;
    }
}

@media only screen and (max-width: 768px) {
    .smallNav .smallNav__border:nth-child(4) {
        top: 6.4vw;
        width: 9.07vw;
    }
}

.l-subBrandHeaderNav {
    position: absolute;
    z-index: 98;
    width: 100%;
    background-color: #fff;
    box-shadow: 0px -3px 26px 0px rgba(0, 0, 0, 0.16);
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav {
        top: 80px;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1100px) {
    .l-subBrandHeaderNav {
        width: 1100px;
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav {
        top: 18.94vw;
    }
}

.l-subBrandHeaderNav.is-fixed {
    position: fixed;
    top: 0;
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__select {
    width: 100%;
    border: none;
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__select {
        font-size: 17px;
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__select {
        font-size: 4.27vw;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__select.is-open .l-subBrandHeaderNav__hidden__inner::before {
    transform: rotate(-90deg);
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__select.is-open .l-subBrandHeaderNav__hidden:hover .l-subBrandHeaderNav__hidden__inner::before {
    top: 15px;
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__hidden {
    position: relative;
    background: url(../images/bg_dark.jpg);
    cursor: pointer;
    z-index: 10;
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__hidden {
        height: 54px;
        transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__hidden {
        height: 13.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__hidden:hover {
        opacity: 0.92;
    }

    .l-subBrandHeaderNav .l-subBrandHeaderNav__hidden:hover .l-subBrandHeaderNav__hidden__inner::before {
        top: 23px;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .l-subBrandHeaderNav__hidden__inner {
    display: flex;
    position: relative;
    align-items: center;
    height: 100%;
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .l-subBrandHeaderNav__hidden__inner {
        width: 1000px;
        margin: 0 auto;
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .l-subBrandHeaderNav__hidden__inner {
        padding: 0 5.34vw;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .l-subBrandHeaderNav__hidden__inner::before {
    content: "";
    display: block;
    position: absolute;
    /* background: url(../images/icon_arrow-dark.svg); */
    transform: rotate(90deg);
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .l-subBrandHeaderNav__hidden__inner::before {
        right: 0;
        top: 19px;
        width: 10px;
        height: 19px;
        background-size: 10px 19px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .l-subBrandHeaderNav__hidden__inner::before {
        right: 5.34vw;
        top: 4.27vw;
        width: 2.67vw;
        height: 5.07vw;
        background-size: 2.67vw 5.07vw;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .menuIcon {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .menuIcon {
        width: 18px;
        height: 18px;
        margin-right: 10px;
    }
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .menuIcon .-border {
        position: absolute;
        display: block;
        width: 18px;
        height: 1px;
        background: #2f2016;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .menuIcon .-border:first-child {
    top: 0;
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .menuIcon .-border:nth-child(2) {
    top: 9px;
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .menuIcon .-border:last-child {
    top: 18px;
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__hidden .l-subBrandHeaderNav__hidden__txt {
        display: inline-block;
        line-height: 1;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__open {
    position: absolute;
    z-index: 0;
    opacity: 0;
    visibility: hidden;
    background-image: url("/html/user_data/assets/img/na/bg__medium_3fdfff77-1e7a-4794-9767-82ed01227030.jpg?v=1750209272");
    box-shadow: 0px -3px 26px 0px rgba(0, 0, 0, 0.16);
    transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__open {
        width: 100%;
        background-position: auto -54px;
        padding: 40px 0;
        margin-top: 54px;
        top: -10px;
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__open {
        overflow: scroll;
        width: 100vw;
        margin-top: 13.34vw;
        padding-bottom: 18.67vw;
        top: 0;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__open.is-open {
    top: 0;
    opacity: 1;
    visibility: visible;
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__open__inner {
    display: flex;
    margin: 0 auto;
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__open__inner {
        justify-content: space-between;
        align-items: flex-start;
        width: 1000px;
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__open__inner {
        width: 84vw;
        flex-wrap: wrap;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__links {
    display: flex;
    flex-wrap: wrap;
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__links {
        width: 280px;
        border-top: 1px solid #9d9889;
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__links {
        flex-wrap: wrap;
        font-size: 4.27vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__links:first-child {
        margin-top: 10.67vw;
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__links:last-child {
        margin-bottom: 21.34vw;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__links-child {
    border-top: 1px solid #9d9889;
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__links-child {
        width: 280px;
        font-size: 14px;
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__links-child {
        font-size: 3.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__links-child .l-subBrandHeaderNav__item {
        width: 260px;
        margin-left: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__links-child .l-subBrandHeaderNav__item {
        width: 78.67vw;
        margin-left: 5.34vw;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__links.-subParent>.l-subBrandHeaderNav__item {
    border-bottom: none;
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__item {
    border-bottom: 1px solid #9d9889;
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__item {
        width: 280px;
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__item {
        width: 84vw;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__item span,
.l-subBrandHeaderNav .l-subBrandHeaderNav__item a {
    position: relative;
    display: block;
}

@media only screen and (min-width: 769px) {

    .l-subBrandHeaderNav .l-subBrandHeaderNav__item span,
    .l-subBrandHeaderNav .l-subBrandHeaderNav__item a {
        padding: 12px 0;
    }
}

@media only screen and (max-width: 768px) {

    .l-subBrandHeaderNav .l-subBrandHeaderNav__item span,
    .l-subBrandHeaderNav .l-subBrandHeaderNav__item a {
        padding: 3.2vw 0;
    }
}

.l-subBrandHeaderNav .l-subBrandHeaderNav__item a::before {
    display: block;
    content: "";
    position: absolute;
    right: 0;
    /* background: url(../images/icon_arrow-dark.svg); */
    top: 50%;
    transform: translateY(-50%);
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__item a::before {
        background-size: 8px 15px;
        width: 8px;
        height: 15px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__item a::before {
        background-size: 2.14vw 4vw;
        width: 2.14vw;
        height: 4vw;
        right: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-subBrandHeaderNav .l-subBrandHeaderNav__item a:hover::before {
        transform: translateY(-50%) translateX(3px);
    }
}

@-webkit-keyframes show {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes show {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-webkit-keyframes show-out {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes show-out {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

.l-search {
    margin-left: auto;
    margin-right: auto;
}

@media only screen and (min-width: 769px) {
    .l-search {
        width: 1000px;
        padding-top: 110px;
    }
}

@media only screen and (max-width: 768px) {
    .l-search {
        padding-top: 5.34vw;
    }
}

.indexFoodSearch {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch {
        padding-bottom: 80px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch {
        padding-bottom: 0vw;
    }
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .indexFoodSearch__list {
        display: flex;
        justify-content: space-between;
        width: 1000px;
        margin: 0 auto;
    }
}

.indexFoodSearch .indexFoodSearch__item {
    position: relative;
}

.indexFoodSearch .indexFoodSearch__item.-dogfood::before {
    background: url(/html/user_data/assets/img/na/index/bg_dogfood-02.png);
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .indexFoodSearch__item.-dogfood::before {
        width: 101px;
        height: 111px;
        background-size: 101px 111px;
        top: -50px;
        right: 65px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .indexFoodSearch__item.-dogfood::before {
        width: 26.94vw;
        height: 29.6vw;
        background-size: 26.94vw 29.6vw;
        top: -2.66vw;
        right: 6.67vw;
    }
}

.indexFoodSearch .indexFoodSearch__item.-catfood::before {
    background: url(/html/user_data/assets/img/na/index/bg_catfood-02.png);
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .indexFoodSearch__item.-catfood::before {
        width: 161px;
        height: 110px;
        background-size: 161px 110px;
        top: -50px;
        right: -32px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .indexFoodSearch__item.-catfood::before {
        width: 33.6vw;
        height: 22.14vw;
        background-size: 33.6vw 22.14vw;
        top: 9.34vw;
        right: 2.67vw;
    }
}

.indexFoodSearch .indexFoodSearch__item::before {
    content: "";
    display: block;
    position: absolute;
}

.indexFoodSearch .indexFoodSearch__head {
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .indexFoodSearch__head {
        font-size: 26px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .indexFoodSearch__head {
        font-size: 5.87vw;
        padding-top: 12vw;
        margin-bottom: 2.14vw;
    }
}

.indexFoodSearch .foodTypeSelect {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect {
        width: 460px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect {
        display: flex;
        width: 84vw;
        margin: 0 auto;
    }
}

.indexFoodSearch .foodTypeSelect__item {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__item {
        width: 140px;
        font-size: 15px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect__item {
        width: 31.5%;
        font-size: 3.2vw;
    }
}

.indexFoodSearch .foodTypeSelect__item a {
    margin: 0;
    display: block;
    position: relative;
}

.indexFoodSearch .foodTypeSelect__item a::before {
    content: "";
    display: block;
    position: absolute;
    height: 1px;
    background: #9d9889;
    left: 50%;
    transform: translateX(-50%);
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__item a::before {
        width: 120px;
        bottom: 7px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect__item a::before {
        width: 22.4vw;
        bottom: 3.2vw;
    }
}

.indexFoodSearch .foodTypeSelect__item a::after {
    content: "";
    display: block;
    position: absolute;
    background: #9d9889;
    transform: rotate(35deg);
    transform-origin: right bottom;
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__item a::after {
        width: 10px;
        height: 1px;
        right: 11px;
        bottom: 7px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect__item a::after {
        width: 2.14vw;
        height: 1px;
        right: 1.87vw;
        bottom: 3.2vw;
    }
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__item a:hover::before {
        margin-left: 4px;
    }

    .indexFoodSearch .foodTypeSelect__item a:hover::after {
        right: 7px;
    }

    .indexFoodSearch .foodTypeSelect__item a:hover .foodTypeSelect__name {
        background: rgba(255, 255, 255, 0.6);
    }

    .indexFoodSearch .foodTypeSelect__item a:hover .foodTypeSelect__img {
        transform: scale(1.05) translateX(-50%);
        transform-origin: center left 0;
    }
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__item.-dogDry .foodTypeSelect__img {
        width: 72px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect__item.-dogDry .foodTypeSelect__img {
        width: 16.54vw;
    }
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__item.-dogWet .foodTypeSelect__img {
        width: 94px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect__item.-dogWet .foodTypeSelect__img {
        width: 19.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__item.-dogOyatsu .foodTypeSelect__img {
        width: 60px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect__item.-dogOyatsu .foodTypeSelect__img {
        width: 13.6vw;
    }
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__item.-catDry .foodTypeSelect__img {
        width: 72px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect__item.-catDry .foodTypeSelect__img {
        width: 16.54vw;
    }
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__item.-catWet .foodTypeSelect__img {
        width: 94px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect__item.-catWet .foodTypeSelect__img {
        width: 19.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__item.-catOyatsu .foodTypeSelect__img {
        width: 49px;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect__item.-catOyatsu .foodTypeSelect__img {
        width: 10.94vw;
    }
}

.indexFoodSearch .foodTypeSelect__name {
    background: rgba(255, 255, 255, 0.4);
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__name {
        width: 100%;
        height: 100px;
        margin-top: 60px;
        padding-top: 60px;
        transition: background 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect__name {
        width: 100%;
        height: 21.34vw;
        margin-top: 9.6vw;
        padding-top: 11.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__img {
        position: absolute;
        bottom: 48px;
        left: 50%;
        transform: translateX(-50%);
        transform-origin: center left 0;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .foodTypeSelect__img {
        position: absolute;
        bottom: 10.67vw;
        left: 50%;
        transform: translateX(-50%);
    }
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .foodTypeSelect__img img {
        width: 100%;
    }
}

.indexFoodSearch .c-foodsearchBtn {
    display: block;
}

@media only screen and (min-width: 769px) {
    .indexFoodSearch .c-foodsearchBtn {
        width: 460px;
        margin: 48px auto 0;
    }
}

@media only screen and (max-width: 768px) {
    .indexFoodSearch .c-foodsearchBtn {
        width: 84vw;
        margin: 12.8vw auto 0;
    }
}

@media only screen and (min-width: 769px) {
    .l-shop {
        padding-bottom: 160px;
    }
}

@media only screen and (max-width: 768px) {
    .l-shop {
        padding: 13.34vw 8vw 26.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-shop .l-shop__inner {
        width: 1000px;
        height: 380px;
        margin: 0 auto;
        background: url(/html/user_data/assets/img/na/index/bg_searchshop-pc.jpg);
        background-size: cover;
        padding: 60px 0 60px 62px;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .l-shop .l-shop__inner {
        width: 84vw;
        height: 142.14vw;
        background: url(/html/user_data/assets/img/na/index/bg_searchshop-sp.jpg);
        background-size: cover;
        padding: 4.8vw 6.67vw 6.67vw;
        line-height: 1.4;
    }
}

.l-shop .l-shop__head {
    color: #2f3c0d;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .l-shop .l-shop__head {
        font-size: 23px;
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 768px) {
    .l-shop .l-shop__head {
        text-align: center;
        font-size: 4.8vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-shop .l-shop__txt {
        width: 418px;
        font-size: 16px;
        margin-bottom: 32px;
    }
}

@media only screen and (max-width: 768px) {
    .l-shop .l-shop__txt {
        font-size: 3.74vw;
        margin-bottom: 4.8vw;
        margin-top: 61.34vw;
        line-height: 1.6;
    }
}

@media only screen and (min-width: 769px) {
    .l-shop .l-shop__btn {
        width: 410px;
        padding-left: 60px;
    }
}

@media only screen and (max-width: 768px) {
    .l-shop .l-shop__btn {
        width: 70.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-topics {
        width: 1000px;
        margin: 0 auto;
    }
}

@media only screen and (max-width: 768px) {
    .l-topics {
        width: 84vw;
        margin: 0 auto;
    }
}

.l-topics .l-topics__ttl {
    font-family: "Crimson Text", serif;
    font-weight: 600;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-topics .l-topics__ttl {
        font-size: 46px;
        margin-bottom: 22px;
    }
}

@media only screen and (max-width: 768px) {
    .l-topics .l-topics__ttl {
        font-size: 8.54vw;
        margin-bottom: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-topics .l-topics__list {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-topics .l-topics__list {
        border-top: 1px solid #707070;
        margin-bottom: 6.4vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-topics .l-topics__item {
        width: 485px;
    }
}

.l-topics .l-topics__item:nth-last-child(-n + 2) .l-topics__item__ancker {
    border-bottom: 1px solid #707070;
}

.l-topics .l-topics__item__ancker {
    display: flex;
}

@media only screen and (min-width: 769px) {
    .l-topics .l-topics__item__ancker {
        padding: 16px 15px 16px 8px;
        border-top: 1px solid #707070;
        height: 100%;
    }

    .l-topics .l-topics__item__ancker:hover .l-topics__thumb {
        transform: scale(1.05);
    }

    .l-topics .l-topics__item__ancker:hover .l-topics__listTtl {
        color: #2f3c0d;
    }
}

@media only screen and (max-width: 768px) {
    .l-topics .l-topics__item__ancker {
        padding: 3.2vw 1.34vw;
        border-bottom: 1px solid #707070;
    }
}

@media only screen and (min-width: 769px) {
    .l-topics .l-topics__thumb {
        width: 90px;
        margin-right: 18px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-topics .l-topics__thumb {
        width: 16vw;
        margin-right: 3.2vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-topics .l-topics__thumb img {
        width: 100%;
    }
}

@media only screen and (min-width: 769px) {
    .l-topics .l-topics__detail {
        width: 353px;
    }
}

@media only screen and (max-width: 768px) {
    .l-topics .l-topics__detail {
        width: 62.14vw;
    }
}

.l-topics .l-topics__date {
    font-family: "Crimson Text", serif;
}

@media only screen and (min-width: 769px) {
    .l-topics .l-topics__date {
        font-size: 18px;
        margin-bottom: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .l-topics .l-topics__date {
        font-size: 3.2vw;
        margin-bottom: 1.34vw;
    }
}

.l-topics .l-topics__date .-new {
    font-family: "Crimson Text", serif;
    font-weight: 600;
    display: inline-block;
    background: #2f3c0d;
    color: #e5e0ca;
    line-height: 1;
}

@media only screen and (min-width: 769px) {
    .l-topics .l-topics__date .-new {
        font-size: 17px;
        padding: 0px 8px 3px 9px;
        margin-right: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .l-topics .l-topics__date .-new {
        font-size: 3.2vw;
        padding: 0 1.34vw 0.8vw;
        margin-right: 1.87vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-topics .l-topics__listTtl {
        font-size: 15px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-topics .l-topics__listTtl {
        font-size: 3.47vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-topics .l-topics__btn {
        display: block;
        width: 315px;
        margin: 0 auto;
        height: 40px;
        line-height: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-topics .l-topics__btn {
        height: 40px;
        line-height: 40px;
    }
}

.l-tasting>a {
    position: relative;
    display: -ms-grid;
    display: grid;
    background: rgba(255, 255, 255, 0.4);
}

@media only screen and (min-width: 769px) {
    .l-tasting>a {
        -ms-grid-columns: 321px 449px 174px;
        grid-template-columns: 321px 449px 174px;
        -ms-grid-rows: auto auto auto;
        grid-template-rows: auto auto auto;
        width: 1000px;
        margin: 0 auto 40px;
        padding: 24px 32px 24px 25px;
        transition: background 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .l-tasting>a>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }

    .l-tasting>a>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 2;
    }

    .l-tasting>a>*:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }

    .l-tasting>a>*:nth-child(4) {
        -ms-grid-row: 2;
        -ms-grid-column: 1;
    }

    .l-tasting>a>*:nth-child(5) {
        -ms-grid-row: 2;
        -ms-grid-column: 2;
    }

    .l-tasting>a>*:nth-child(6) {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }

    .l-tasting>a>*:nth-child(7) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }

    .l-tasting>a>*:nth-child(8) {
        -ms-grid-row: 3;
        -ms-grid-column: 2;
    }

    .l-tasting>a>*:nth-child(9) {
        -ms-grid-row: 3;
        -ms-grid-column: 3;
    }
}

@media only screen and (max-width: 768px) {
    .l-tasting>a {
        width: 84vw;
        margin: 0 auto 10.67vw;
        padding: 6.67vw 4vw 4.8vw;
    }
}

.l-tasting>a::before {
    content: "";
    display: block;
    position: absolute;
    background: url(/html/user_data/assets/img/na/cat/natural/bg_cat-02.png);
}

@media only screen and (min-width: 769px) {
    .l-tasting>a::before {
        width: 179px;
        height: 199px;
        background-size: 179px 199px;
        top: -16px;
        right: 116px;
    }
}

@media only screen and (max-width: 768px) {
    .l-tasting>a::before {
        width: 28vw;
        height: 31.2vw;
        background-size: 28vw 31.2vw;
        top: -11.2vw;
        left: -4vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-tasting>a:hover {
        background: rgba(255, 255, 255, 0.6);
    }

    .l-tasting>a:hover .l-tasting__thumb img {
        transform: scale(1.03);
    }

    .l-tasting>a:hover .l-tasting__link {
        transform: translateX(8px);
    }
}

@media only screen and (max-width: 768px) {
    .l-tasting.-dog {
        padding-top: 13.34vw;
        margin-top: -13.33vw;
        overflow: hidden;
    }
}

.l-tasting.-dog>a::before {
    background: url(../images/bg_dog.png);
}

@media only screen and (min-width: 769px) {
    .l-tasting.-dog>a::before {
        width: 208px;
        height: 199px;
        background-size: 208px 199px;
    }
}

@media only screen and (max-width: 768px) {
    .l-tasting.-dog>a::before {
        width: 34.67vw;
        height: 33.34vw;
        background-size: 34.67vw 33.34vw;
        top: -13.86vw;
        left: 64.54vw;
    }
}

.l-tasting .l-tasting__head {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .l-tasting .l-tasting__head {
        -ms-grid-column: 2;
        -ms-grid-column-span: 1;
        grid-column: 2 / 3;
        -ms-grid-row: 1;
        -ms-grid-row-span: 1;
        grid-row: 1 / 2;
        -ms-grid-row-align: end;
        align-self: end;
        font-size: 24px;
        margin-bottom: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .l-tasting .l-tasting__head {
        text-align: center;
        font-size: 5.87vw;
        margin-bottom: 4.27vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-tasting .l-tasting__thumb {
        -ms-grid-column: 1;
        -ms-grid-column-span: 1;
        grid-column: 1 / 2;
        -ms-grid-row: 1;
        -ms-grid-row-span: 3;
        grid-row: 1 / 4;
        margin-right: 36px;
        overflow: hidden;
    }
}

@media only screen and (max-width: 768px) {
    .l-tasting .l-tasting__thumb {
        width: 76vw;
        margin-bottom: 3.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-tasting .l-tasting__thumb img {
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }
}

.l-tasting .l-tasting__txt {
    line-height: 1.6;
}

@media only screen and (min-width: 769px) {
    .l-tasting .l-tasting__txt {
        -ms-grid-column: 2;
        -ms-grid-column-span: 1;
        grid-column: 2 / 3;
        -ms-grid-row: 2;
        -ms-grid-row-span: 1;
        grid-row: 2 / 3;
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .l-tasting .l-tasting__txt {
        font-size: 3.47vw;
        text-align: left;
        margin-bottom: 4vw;
    }
}

.l-tasting .l-tasting__link {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .l-tasting .l-tasting__link {
        -ms-grid-row-align: end;
        align-self: end;
        -ms-grid-column: 3;
        -ms-grid-column-span: 1;
        grid-column: 3 / 4;
        -ms-grid-row: 3;
        -ms-grid-row-span: 1;
        grid-row: 3 / 4;
        font-size: 15px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-tasting .l-tasting__link {
        -ms-grid-column-align: end;
        justify-self: end;
    }
}

.l-tasting .l-tasting__link span {
    color: #2f3c0d;
}

@media only screen and (max-width: 768px) {
    .l-tasting .l-tasting__link span {
        padding-right: 55px;
    }
}

.l-tasting .l-tasting__link::before {
    content: "";
    display: block;
    position: absolute;
    background: #2f3c0d;
    height: 1px;
}

@media only screen and (min-width: 769px) {
    .l-tasting .l-tasting__link::before {
        width: 80px;
        top: 11px;
        right: 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-tasting .l-tasting__link::before {
        width: 10.67vw;
        top: 2.67vw;
        right: 1.6vw;
    }
}

.l-tasting .l-tasting__link::after {
    content: "";
    display: block;
    position: absolute;
    background: #2f3c0d;
    transform: rotate(35deg);
    transform-origin: right bottom;
    width: 10px;
    height: 1px;
}

@media only screen and (min-width: 769px) {
    .l-tasting .l-tasting__link::after {
        top: 11px;
        right: -1px;
    }
}

@media only screen and (max-width: 768px) {
    .l-tasting .l-tasting__link::after {
        top: 2.67vw;
        right: 1.34vw;
    }
}

.l-lineup {
    margin: 0 auto;
}

@media only screen and (min-width: 769px) {
    .l-lineup {
        width: 1000px;
        margin-bottom: 64px;
    }
}

.l-lineup__head {
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-lineup__head {
        margin-bottom: 53px;
    }
}

@media only screen and (max-width: 768px) {
    .l-lineup__head {
        width: 84vw;
        margin: 0 auto 8.54vw;
    }
}

.l-lineup__ttl {
    font-weight: 600;
    line-height: 1.2;
}

@media only screen and (min-width: 769px) {
    .l-lineup__ttl {
        font-size: 36px;
        margin-bottom: 35px;
    }
}

@media only screen and (max-width: 768px) {
    .l-lineup__ttl {
        font-size: 5.87vw;
        margin-bottom: 6.4vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-lineup__head__txt {
        font-size: 16px;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .l-lineup__head__txt {
        text-align: left;
        font-size: 3.74vw;
        line-height: 1.9;
    }
}

.l-lineup__head__att {
    display: block;
}

@media only screen and (min-width: 769px) {
    .l-lineup__head__att {
        font-size: 12px;
        margin-top: 10px;
    }
}

@media only screen and (max-width: 768px) {
    .l-lineup__head__att {
        text-align: left;
        font-size: 10px;
        margin-top: 2.67vw;
    }
}

.l-lineup__btn {
    display: block;
}

@media only screen and (min-width: 769px) {
    .l-lineup__btn {
        width: 315px;
        margin: 0 auto;
        height: 40px;
        line-height: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-lineup__btn {
        width: 84vw;
        margin: 0 auto;
        height: 40px;
        line-height: 40px;
    }
}

.l-sampleBnr {
    position: fixed;
    bottom: 0;
    z-index: 10;
}

@media only screen and (min-width: 769px) {
    .l-sampleBnr {
        width: 400px;
        right: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .l-sampleBnr {
        width: 94.67vw;
        left: 2.67vw;
    }
}

.l-sampleBnr .l-sampleBnr__head {
    position: absolute;
    background: url(../images/bg_dark.jpg);
    font-weight: 600;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .l-sampleBnr .l-sampleBnr__head {
        width: 375px;
        top: -19px;
        font-size: 15px;
        padding: 5px 0 5px;
    }
}

@media only screen and (max-width: 768px) {
    .l-sampleBnr .l-sampleBnr__head {
        width: 76vw;
        top: -2.66vw;
        font-size: 3.47vw;
        padding: 1.34vw 0;
        background-size: 100vw auto;
    }
}

.l-sampleBnr .l-sampleBnr__body {
    background: #e5e0ca;
    display: flex;
    justify-content: space-between;
}

@media only screen and (min-width: 769px) {
    .l-sampleBnr .l-sampleBnr__body {
        width: 400px;
        border-radius: 10px 10px 0 0;
        padding: 21px 22px 10px 17px;
    }
}

@media only screen and (max-width: 768px) {
    .l-sampleBnr .l-sampleBnr__body {
        width: 94.67vw;
        border-radius: 2.67vw 2.67vw 0 0;
        padding: 6.94vw 5.07vw 2.4vw 5.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-sampleBnr .l-sampleBnr__img {
        width: 90px;
    }
}

@media only screen and (max-width: 768px) {
    .l-sampleBnr .l-sampleBnr__img {
        width: 18.4vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-sampleBnr .l-sampleBnr__txt {
        width: 257px;
        font-size: 13px;
    }
}

@media only screen and (max-width: 768px) {
    .l-sampleBnr .l-sampleBnr__txt {
        width: 63.47vw;
        font-size: 3.2vw;
    }
}

.l-sampleBnr .l-sampleBnr__link {
    text-align: right;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .l-sampleBnr .l-sampleBnr__link {
        font-size: 12px;
        margin-top: 9px;
    }
}

@media only screen and (max-width: 768px) {
    .l-sampleBnr .l-sampleBnr__link {
        font-size: 2.67vw;
        margin-top: 1.34vw;
    }
}

.l-sampleBnr .l-sampleBnr__link a {
    position: relative;
    color: #2f3c0d;
    text-decoration: underline;
}

@media only screen and (min-width: 769px) {
    .l-sampleBnr .l-sampleBnr__link a {
        padding-right: 15px;
    }
}

@media only screen and (max-width: 768px) {
    .l-sampleBnr .l-sampleBnr__link a {
        padding-right: 4vw;
    }
}

.l-sampleBnr .l-sampleBnr__link a::before {
    content: "";
    display: block;
    position: absolute;
    /* background: url(../images/icon_arrow-dark.svg); */
}

@media only screen and (min-width: 769px) {
    .l-sampleBnr .l-sampleBnr__link a::before {
        width: 6px;
        height: 11px;
        background-size: 6px 11px;
        right: 0;
        top: 5px;
        transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .l-sampleBnr .l-sampleBnr__link a::before {
        width: 1.6vw;
        height: 2.94vw;
        background-size: 1.6vw 2.94vw;
        right: 0;
        top: 1.07vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-sampleBnr .l-sampleBnr__link a:hover::before {
        right: -4px;
    }
}

.l-pageBtnBnr {
    position: relative;
    background: url(../images/bg_dark.jpg);
}

@media only screen and (max-width: 768px) {
    .l-pageBtnBnr {
        padding: 10.14vw 8vw 13.34vw;
        width: 100vw;
        background-size: 100vw;
        background-position: left 74.41vw;
    }
}

.l-pageBtnBnr::before {
    content: "";
    display: block;
    position: absolute;
}

@media only screen and (max-width: 768px) {
    .l-pageBtnBnr::before {
        background: url(../images/bg_dark-top-sp.png) left top;
        background-size: 100vw auto;
        height: 18.67vw;
        width: 100%;
        top: -18.66vw;
        left: 0;
    }
}

@media only screen and (min-width: 769px) {
    .l-pageBtnBnr .l-pageBtnBnr__inner {
        padding: 95px 0 48px;
        margin-top: -45px;
    }
}

@media only screen and (min-width: 769px) {
    .c-campaingBnr {
        width: 1000px;
        margin: 0 auto 80px;
    }
}

@media only screen and (max-width: 768px) {
    .c-campaingBnr {
        width: 84vw;
        margin: 0 auto 14.94vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-forcatBnr {
        width: 1000px;
        height: 170px;
        background: url(../images/bnr_forcat-pc.png);
        background-size: cover;
        margin: 48px auto 0;
        box-shadow: 0px 10px 36px 0px rgba(47, 32, 22, 0.3);
    }
}

@media only screen and (max-width: 768px) {
    .c-forcatBnr {
        width: 84vw;
        height: 45.34vw;
        background: url(../images/bnr_forcat-sp.png);
        background-size: cover;
        margin: 6.4vw auto 0;
        box-shadow: 0px 2.67vw 9.6vw 0px rgba(47, 32, 22, 0.3);
    }
}

.c-forcatBnr .c-forcatBnr__ancker {
    display: block;
    color: #e5e0ca;
}

.c-forcatBnr .c-forcatBnr__ttl {
    position: relative;
    border-bottom: 1px solid #e5e0ca;
}

@media only screen and (min-width: 769px) {
    .c-forcatBnr .c-forcatBnr__ttl {
        width: 354px;
        padding: 53px 20px 37px;
        margin-left: 21px;
    }
}

@media only screen and (max-width: 768px) {
    .c-forcatBnr .c-forcatBnr__ttl {
        width: 77.07vw;
        padding: 27.74vw 8.27vw 0;
    }
}

.c-forcatBnr .c-forcatBnr__ttl::before {
    content: "";
    display: block;
    position: absolute;
    bottom: -1px;
    right: -1px;
    background: #e5e0ca;
    transform: rotate(35deg);
    transform-origin: right bottom;
}

@media only screen and (min-width: 769px) {
    .c-forcatBnr .c-forcatBnr__ttl::before {
        width: 10px;
        height: 1px;
    }
}

@media only screen and (max-width: 768px) {
    .c-forcatBnr .c-forcatBnr__ttl::before {
        width: 2.67vw;
        height: 1px;
    }
}

.c-forcatBnr .c-forcatBnr__ttl .-en {
    font-family: "Crimson Text", serif;
    line-height: 1;
}

@media only screen and (min-width: 769px) {
    .c-forcatBnr .c-forcatBnr__ttl .-en {
        font-size: 35px;
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 768px) {
    .c-forcatBnr .c-forcatBnr__ttl .-en {
        font-size: 8.81vw;
    }
}

.c-forcatBnr .c-forcatBnr__ttl .-jp {
    line-height: 1;
}

@media only screen and (min-width: 769px) {
    .c-forcatBnr .c-forcatBnr__ttl .-jp {
        font-size: 15px;
    }
}

@media only screen and (max-width: 768px) {
    .c-forcatBnr .c-forcatBnr__ttl .-jp {
        font-size: 3.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-careBnr {
        width: 1000px;
        height: 170px;
        background: url(../images/bnr_catcare-pc.png);
        background-size: cover;
        margin: 48px auto 0;
    }
}

@media only screen and (max-width: 768px) {
    .c-careBnr {
        width: 84vw;
        height: 45.34vw;
        background: url(../images/bnr_catcare-sp.png);
        background-size: cover;
        margin: 6.4vw auto 0;
    }
}

.c-careBnr .c-careBnr__ancker {
    display: block;
    position: relative;
    color: #e5e0ca;
}

@media only screen and (min-width: 769px) {
    .c-careBnr .c-careBnr__ancker {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        width: 1000px;
        height: 170px;
        margin: 0 auto;
        box-shadow: 0px 10px 36px 0px rgba(47, 32, 22, 0.3);
        padding-bottom: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .c-careBnr .c-careBnr__ancker {
        width: 84vw;
        height: 45.34vw;
        background-size: 100vw;
        box-shadow: 0px 2.67vw 9.6vw 0px rgba(47, 32, 22, 0.3);
    }
}

.c-careBnr .c-careBnr__head {
    position: relative;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .c-careBnr .c-careBnr__head {
        font-size: 28px;
        margin: 0 0 6px;
        padding: 0 0 0 40px;
    }
}

@media only screen and (max-width: 768px) {
    .c-careBnr .c-careBnr__head {
        width: 77.07vw;
        margin: 0 auto 1.07vw;
        font-size: 5.87vw;
        padding: 29.87vw 0 0 1.87vw;
    }
}

.c-careBnr .c-careBnr__catch {
    position: relative;
    line-height: 1;
    border-bottom: 1px solid #e5e0ca;
}

@media only screen and (min-width: 769px) {
    .c-careBnr .c-careBnr__catch {
        width: 919px;
        font-size: 15px;
        margin: 0 0 0 40px;
        padding-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .c-careBnr .c-careBnr__catch {
        width: 77.07vw;
        margin: 0 auto;
        font-size: 3.2vw;
        letter-spacing: 0;
        padding: 0 0 0 1.87vw;
    }
}

.c-careBnr .c-careBnr__catch::before {
    content: "";
    display: block;
    position: absolute;
    bottom: -1px;
    right: -1px;
    background: #e5e0ca;
    transform: rotate(35deg);
    transform-origin: right bottom;
}

@media only screen and (min-width: 769px) {
    .c-careBnr .c-careBnr__catch::before {
        width: 10px;
        height: 1px;
    }
}

@media only screen and (max-width: 768px) {
    .c-careBnr .c-careBnr__catch::before {
        width: 2.67vw;
        height: 1px;
    }
}

.c-subBrandLinkBnr {
    background: rgba(255, 255, 255, 0.4);
}

@media only screen and (min-width: 769px) {
    .c-subBrandLinkBnr {
        position: relative;
        width: 1000px;
        height: 126px;
        margin: 0 auto;
        padding: 17px 21px 17px 24px;
        transition: background 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-subBrandLinkBnr {
        width: 84vw;
        margin: 0 auto;
        padding: 4.27vw 6.14vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-subBrandLinkBnr:hover {
        background: rgba(255, 255, 255, 0.6);
    }

    .c-subBrandLinkBnr:hover .c-subBrandLinkBnr__txt::before {
        left: 5px;
    }

    .c-subBrandLinkBnr:hover .c-subBrandLinkBnr__txt::after {
        right: -5px;
    }
}

.c-subBrandLinkBnr .c-subBrandLinkBnr__ancker {
    display: flex;
}

@media only screen and (min-width: 769px) {
    .c-subBrandLinkBnr .c-subBrandLinkBnr__ancker {
        justify-content: space-between;
        height: 100%;
    }
}

@media only screen and (max-width: 768px) {
    .c-subBrandLinkBnr .c-subBrandLinkBnr__ancker {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media only screen and (min-width: 769px) {
    .c-subBrandLinkBnr .c-subBrandLinkBnr__img {
        position: relative;
        width: 248px;
    }
}

@media only screen and (max-width: 768px) {
    .c-subBrandLinkBnr .c-subBrandLinkBnr__img {
        width: 61.87vw;
        margin-bottom: 1.87vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-subBrandLinkBnr .c-subBrandLinkBnr__img img {
        position: absolute;
        bottom: 0;
    }
}

.c-subBrandLinkBnr .c-subBrandLinkBnr__txt {
    position: relative;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .c-subBrandLinkBnr .c-subBrandLinkBnr__txt {
        display: flex;
        align-items: center;
        width: 699px;
        font-size: 18px;
    }
}

@media only screen and (max-width: 768px) {
    .c-subBrandLinkBnr .c-subBrandLinkBnr__txt {
        width: 73.87vw;
        font-size: 4vw;
        text-align: center;
        padding-bottom: 4.27vw;
    }
}

.c-subBrandLinkBnr .c-subBrandLinkBnr__txt::before {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 1px;
    background: #9d9889;
    bottom: 0;
    left: 0;
    transition: left 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.c-subBrandLinkBnr .c-subBrandLinkBnr__txt::after {
    content: "";
    display: block;
    position: absolute;
    background: #9d9889;
    bottom: 0px;
    right: 0px;
    transform: rotate(35deg);
    transform-origin: right bottom;
    transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

@media only screen and (min-width: 769px) {
    .c-subBrandLinkBnr .c-subBrandLinkBnr__txt::after {
        width: 10px;
        height: 1px;
    }
}

@media only screen and (max-width: 768px) {
    .c-subBrandLinkBnr .c-subBrandLinkBnr__txt::after {
        width: 3.2vw;
        height: 1px;
    }
}

.c-greenBtn {
    position: relative;
    background: #2f3c0d;
    font-family: "Noto Serif JP", serif;
    color: #e5e0ca;
    text-align: center;
    letter-spacing: 0.04em;
}

@media only screen and (min-width: 769px) {
    .c-greenBtn {
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

.c-greenBtn::before {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: url("/cdn/shop/files/icon_arrow.svg?v=1749488478");
}

@media only screen and (min-width: 769px) {
    .c-greenBtn::before {
        background-size: 8px 15px;
        width: 8px;
        height: 15px;
        right: 15px;
    }
}

@media only screen and (max-width: 768px) {
    .c-greenBtn::before {
        background-size: 2.14vw 4vw;
        width: 2.14vw;
        height: 4vw;
        right: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-greenBtn:hover {
        background: #425313;
        transform: translate(2px, 2px);
    }

    .c-greenBtn:hover::before {
        right: 12px;
    }
}

.c-lightBrownBtn {
    position: relative;
    background: #5d3518;
    font-family: "Noto Serif JP", serif;
    font-weight: 600;
    color: #e5e0ca;
    text-align: center;
    letter-spacing: 0.04em;
    box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.3);
}

@media only screen and (min-width: 769px) {
    .c-lightBrownBtn {
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

.c-lightBrownBtn::before {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: url("/html/user_data/assets/img/na/icon_arrow_white.svg");
}

@media only screen and (min-width: 769px) {
    .c-lightBrownBtn::before {
        background-size: 8px 15px;
        width: 8px;
        height: 15px;
        right: 15px;
        transition: right 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-lightBrownBtn::before {
        background-size: 2.14vw 4vw;
        width: 2.14vw;
        height: 4vw;
        right: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-lightBrownBtn:hover {
        background: #71370d;
        transform: translate(2px, 2px);
        box-shadow: none;
    }

    .c-lightBrownBtn:hover::before {
        right: 12px;
    }
}

.c-lightBrownBtn.-back::before {
    transform: rotate(180deg) translateY(-50%);
    transform-origin: center top;
}

@media only screen and (min-width: 769px) {
    .c-lightBrownBtn.-back::before {
        left: 20px;
        right: initial;
        transition: left 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-lightBrownBtn.-back::before {
        left: 4vw;
        right: initial;
    }
}

@media only screen and (min-width: 769px) {
    .c-lightBrownBtn.-back:hover {
        background: #71370d;
        transform: translate(2px, 2px);
        box-shadow: none;
    }

    .c-lightBrownBtn.-back:hover::before {
        left: 16px;
    }
}

.c-brownBtn {
    position: relative;
    background: #2f2016;
    font-family: "Noto Serif JP", serif;
    color: #e5e0ca;
    text-align: center;
    letter-spacing: 0.04em;
    box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.3);
}

@media only screen and (min-width: 769px) {
    .c-brownBtn {
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

.c-brownBtn::before {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: url("/cdn/shop/files/icon_arrow.svg?v=1749488478");
}

@media only screen and (min-width: 769px) {
    .c-brownBtn::before {
        background-size: 8px 15px;
        width: 8px;
        height: 15px;
        right: 15px;
        transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-brownBtn::before {
        background-size: 2.14vw 4vw;
        width: 2.14vw;
        height: 4vw;
        right: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-brownBtn:hover {
        transform: translate(2px, 2px);
    }

    .c-brownBtn:hover::before {
        right: 10px;
    }
}

.c-searchBtn {
    position: relative;
    background: #5d3518;
    font-family: "Noto Serif JP", serif;
    color: #e5e0ca;
    text-align: center;
    letter-spacing: 0.04em;
    font-weight: 600;
    box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.3);
}

@media only screen and (min-width: 769px) {
    .c-searchBtn {
        height: 54px;
        padding-left: 10px;
        font-size: 18px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-searchBtn {
        height: 16vw;
        padding-left: 15.2vw;
        font-size: 4.27vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-searchBtn:hover {
        transform: translate(2px, 2px);
        background: #71370d;
        box-shadow: none;
    }

    .c-searchBtn:hover .c-searchBtn__icon {
        width: 48px;
    }
}

.c-searchBtn .c-searchBtn__icon {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #7e4114;
    height: 100%;
    top: 0;
    left: 0;
}

@media only screen and (min-width: 769px) {
    .c-searchBtn .c-searchBtn__icon {
        width: 44px;
        transition: width 0.2s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-searchBtn .c-searchBtn__icon {
        width: 9.87vw;
    }
}

.c-searchBtn .c-searchBtn__icon::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent transparent transparent #7e4014;
}

@media only screen and (min-width: 769px) {
    .c-searchBtn .c-searchBtn__icon::before {
        border-width: 27px 0 27px 20px;
        right: -20px;
    }
}

@media only screen and (max-width: 768px) {
    .c-searchBtn .c-searchBtn__icon::before {
        border-width: 8vw 0 8vw 5.34vw;
        right: -5.33vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-searchBtn .c-searchBtn__icon img {
        width: 26px;
        background-size: 26px auto;
        height: 26px;
        transform: translateX(5px);
    }
}

@media only screen and (max-width: 768px) {
    .c-searchBtn .c-searchBtn__icon img {
        width: 5.87vw;
        height: 5.87vw;
        background-size: 5.87vw auto;
        transform: translateX(1.34vw);
    }
}

.c-foodAmountBtn {
    width: 100%;
    position: relative;
    background: #5d3518;
    color: #e5e0ca;
    font-weight: 600;
    box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.3);
}

@media only screen and (min-width: 769px) {
    .c-foodAmountBtn {
        height: 64px;
        padding-left: 84px;
        font-size: 19px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-foodAmountBtn {
        height: 16vw;
        padding-left: 19.47vw;
        font-size: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-foodAmountBtn:hover {
        transform: translate(2px, 2px);
        background: #71370d;
        box-shadow: none;
    }

    .c-foodAmountBtn:hover .c-foodAmountBtn__icon {
        width: 81px;
    }
}

.c-foodAmountBtn .c-foodAmountBtn__icon {
    position: absolute;
    display: flex;
    align-items: center;
    background: #7e4114;
    height: 100%;
    top: 0;
    left: 0;
}

@media only screen and (min-width: 769px) {
    .c-foodAmountBtn .c-foodAmountBtn__icon {
        width: 76px;
        padding-left: 17px;
        transition: width 0.2s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-foodAmountBtn .c-foodAmountBtn__icon {
        width: 14.14vw;
        padding-left: 3.47vw;
    }
}

.c-foodAmountBtn .c-foodAmountBtn__icon::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent transparent transparent #7e4014;
}

@media only screen and (min-width: 769px) {
    .c-foodAmountBtn .c-foodAmountBtn__icon::before {
        border-width: 32px 0 32px 20px;
        right: -20px;
    }
}

@media only screen and (max-width: 768px) {
    .c-foodAmountBtn .c-foodAmountBtn__icon::before {
        border-width: 8vw 0 8vw 5.34vw;
        right: -5.33vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-foodAmountBtn .c-foodAmountBtn__icon img {
        width: 52.47px;
        height: 47.18px;
    }
}

@media only screen and (max-width: 768px) {
    .c-foodAmountBtn .c-foodAmountBtn__icon img {
        width: 9.87vw;
        height: 8.81vw;
    }
}

.c-foodsearchBtn {
    width: 100% !important;
    position: relative;
    background: #5d3518;
    color: #e5e0ca;
    font-weight: 600;
    box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.3);
    max-width: 1000px;
}

@media only screen and (min-width: 769px) {
    .c-foodsearchBtn {
        height: 64px;
        padding-left: 10px;
        font-size: 19px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-foodsearchBtn {
        width: 84vw !important;
        height: 16vw;
        padding-left: 19.47vw;
        font-size: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-foodsearchBtn:hover {
        transform: translate(2px, 2px);
        background: #71370d;
        box-shadow: none;
    }

    .c-foodsearchBtn:hover .c-foodsearchBtn__icon {
        width: 68px;
    }
}

@media only screen and (max-width: 768px) {
    .c-foodsearchBtn.-line3 {
        height: 24vw;
    }

    .c-foodsearchBtn.-line3 .c-foodsearchBtn__icon::before {
        border-width: 12vw 0 12vw 5.34vw;
    }
}

@media only screen and (max-width: 768px) {
    .c-foodsearchBtn.-line4 {
        height: 30.4vw;
    }

    .c-foodsearchBtn.-line4 .c-foodsearchBtn__icon::before {
        border-width: 15.2vw 0 15.2vw 5.34vw;
    }
}

.c-foodsearchBtn .c-foodsearchBtn__icon {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #7e4114;
    height: 100%;
    top: 0;
    left: 0;
}

@media only screen and (min-width: 769px) {
    .c-foodsearchBtn .c-foodsearchBtn__icon {
        width: 64px;
        transition: width 0.2s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-foodsearchBtn .c-foodsearchBtn__icon {
        width: 14.14vw;
    }
}

.c-foodsearchBtn .c-foodsearchBtn__icon::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent transparent transparent #7e4014;
}

@media only screen and (min-width: 769px) {
    .c-foodsearchBtn .c-foodsearchBtn__icon::before {
        border-width: 32px 0 32px 20px;
        right: -20px;
    }
}

@media only screen and (max-width: 768px) {
    .c-foodsearchBtn .c-foodsearchBtn__icon::before {
        border-width: 8vw 0 8vw 5.34vw;
        right: -5.33vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-foodsearchBtn .c-foodsearchBtn__icon img {
        width: 28px;
        background-size: 28px auto;
        height: 39px;
    }
}

@media only screen and (max-width: 768px) {
    .c-foodsearchBtn .c-foodsearchBtn__icon img {
        width: 6.4vw;
        height: 9.87vw;
        background-size: 6.4vw auto;
    }
}

.c-moreBtn {
    position: relative;
    font-family: "Noto Serif JP", serif;
    border: 1px solid #2f3c0d;
    transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

@media only screen and (min-width: 769px) {
    .c-moreBtn {
        font-size: 15px;
    }

    .c-moreBtn:hover {
        transform: translate(2px, 2px);
    }

    .c-moreBtn:hover::before {
        transform: translateX(-50%) rotate(90deg);
    }

    .c-moreBtn:hover::after {
        transform: translateX(-50%) rotate(180deg);
    }
}

@media only screen and (max-width: 768px) {
    .c-moreBtn {
        font-size: 4.27vw;
    }
}

.c-moreBtn::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    height: 1px;
    background: #2f3c0d;
    transform: translateX(-50%);
}

@media only screen and (min-width: 769px) {
    .c-moreBtn::before {
        left: 16px;
        width: 15px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-moreBtn::before {
        left: 4.27vw;
        width: 4vw;
    }
}

.c-moreBtn::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    height: 1px;
    background: #2f3c0d;
    transform: translateX(-50%) rotate(90deg);
}

@media only screen and (min-width: 769px) {
    .c-moreBtn::after {
        left: 16px;
        width: 15px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-moreBtn::after {
        left: 4.27vw;
        width: 4vw;
    }
}

.c-moreBtn:active {
    color: #2f3c0d;
}

.c-moreArrowBtn {
    position: relative;
    font-family: "Noto Serif JP", serif;
    border: 1px solid #2f3c0d;
    transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    color: #2f3c0d;
}

@media only screen and (min-width: 769px) {
    .c-moreArrowBtn {
        font-size: 15px;
    }

    .c-moreArrowBtn:hover::before {
        right: 10px;
    }
}

@media only screen and (max-width: 768px) {
    .c-moreArrowBtn {
        font-size: 4.27vw;
    }
}

.c-moreArrowBtn::before {
    content: "";
    display: block;
    position: absolute;
    background: url(../images/icon_arrow-green.svg) no-repeat center;
    top: 50%;
    transform: translateY(-50%);
}

@media only screen and (min-width: 769px) {
    .c-moreArrowBtn::before {
        width: 8px;
        height: 15px;
        background-size: 8px 15px;
        right: 14px;
        transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-moreArrowBtn::before {
        width: 2.14vw;
        height: 4vw;
        background-size: 2.14vw 4vw;
        right: 2.67vw;
    }
}

.c-moreArrowBtn:active {
    color: #2f3c0d;
}

@media only screen and (min-width: 769px) {
    .c-pageBnr {
        display: flex;
        justify-content: space-between;
        width: 1000px;
        margin: 0 auto 80px;
    }
}

.c-pageBnr__item {
    box-shadow: 0px 10px 36px 0px rgba(47, 32, 22, 0.3);
}

@media only screen and (min-width: 769px) {
    .c-pageBnr__item {
        width: 485px;
        height: 190px;
        overflow: hidden;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageBnr__item {
        width: 84vw;
        height: 45.34vw;
        margin: 0 auto 4.27vw;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageBnr__item:last-child {
        margin-bottom: 8.54vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-pageBnr__item:hover .c-pageBnr__ancker::before {
        transform: scale(1.01);
    }

    .c-pageBnr__item:hover .c-pageBnr__ttl::before {
        left: 5px;
    }

    .c-pageBnr__item:hover .c-pageBnr__ttl::after {
        right: -6px;
    }
}

.c-pageBnr__ancker {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.c-pageBnr__ancker::before {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

@media only screen and (min-width: 769px) {
    .c-pageBnr__ancker::before {
        transition: transform 0.5s linear;
    }
}

.c-pageBnr__ttl {
    position: absolute;
    color: #e5e0ca;
    line-height: 1.2;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .c-pageBnr__ttl {
        width: 289px;
        left: 23px;
        bottom: 20px;
        padding-left: 7px;
        font-size: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageBnr__ttl {
        width: 77.07vw;
        bottom: 5.34vw;
        font-size: 5.34vw;
        left: 3.47vw;
        padding-left: 1.87vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-pageBnr__ttl .-jpSmall {
        font-size: 15px;
        margin-top: 4px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageBnr__ttl .-jpSmall {
        font-size: 3.2vw;
        margin-top: 2px;
    }
}

.c-pageBnr__ttl::before {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 1px;
    background: #e5e0ca;
    bottom: -1px;
    left: 0;
}

@media only screen and (min-width: 769px) {
    .c-pageBnr__ttl::before {
        transition: left 0.3s linear;
    }
}

.c-pageBnr__ttl::after {
    content: "";
    display: block;
    position: absolute;
    background: #e5e0ca;
    bottom: -1px;
    right: -1px;
    transform: rotate(35deg);
    transform-origin: right bottom;
    width: 10px;
    height: 1px;
}

@media only screen and (min-width: 769px) {
    .c-pageBnr__ttl::after {
        transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

.c-bottomPager__btn {
    display: block;
    margin: 0 auto;
    font-weight: 600;
    letter-spacing: 0.04em;
    padding-left: 1em;
    font-family: "Noto Serif JP", serif !important;
}

@media only screen and (min-width: 769px) {
    .c-bottomPager__btn {
        width: 500px;
        height: 47px;
        line-height: 47px;
    }
}

@media only screen and (max-width: 768px) {
    .c-bottomPager__btn {
        width: 84vw;
        height: 12.54vw;
        line-height: 12.27vw;
        font-size: 4.27vw;
    }
}

.c-bottomPager__btn::before {
    right: initial;
    transform: translateY(-50%) rotate(180deg);
}

@media only screen and (min-width: 769px) {
    .c-bottomPager__btn::before {
        left: 20px;
        transition: left 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .c-bottomPager__btn::before {
        left: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-bottomPager__btn:hover::before {
        left: 15px;
    }
}

.c-bnrshadow-01 {
    box-shadow: 0px 10px 36px 0px rgba(47, 32, 22, 0.3);
}

.c-bnrshadow-02 {
    box-shadow: 0px -3px 26px 0px rgba(0, 0, 0, 0.16);
}

.c-pageTtl {
    position: relative;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .c-pageTtl {
        height: 29.28vw;
        min-height: 400px;
        padding: 162px 0 145px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl {
        height: 78.54vw;
        padding: 39.74vw 0 83px;
    }
}

.c-pageTtl__ttl {
    color: #e5e0ca;
}

.c-pageTtl__ttl.-underPage {
    position: absolute;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    font-weight: 700;
    font-family: "Noto Serif JP", serif !important;
}

@media only screen and (min-width: 769px) {
    .c-pageTtl__ttl.-underPage {
        font-size: 32px;
        bottom: 160px;
        font-weight: 700;
        font-family: "Noto Serif JP", serif !important;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__ttl.-underPage {
        font-size: 5.87vw;
        bottom: 21.34vw;
    }
}

.c-pageTtl__ttl .-en {
    display: block;
    font-family: "Crimson Text", serif;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .c-pageTtl__ttl .-en {
        font-size: 50px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__ttl .-en {
        font-size: 10.67vw;
    }
}

.c-pageTtl__ttl .-jp {
    display: block;
    letter-spacing: 0;
    font-weight: normal;
}

@media only screen and (min-width: 769px) {
    .c-pageTtl__ttl .-jp {
        font-size: 32px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__ttl .-jp {
        font-size: 4.8vw;
    }
}

.c-pageTtl__sub {
    color: #e5e0ca;
    font-weight: bold;
}

@media only screen and (min-width: 769px) {
    .c-pageTtl__sub {
        font-size: 18px;
        margin-top: 5px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl__sub {
        font-size: 3.74vw;
        margin-top: 1.34vw;
    }
}

.c-pageSimpleTtl {
    font-weight: 600;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .c-pageSimpleTtl {
        padding: 186px 0 60px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageSimpleTtl {
        padding: 34.14vw 0 10.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-pageSimpleTtl__shoulder {
        font-size: 24px;
        margin-bottom: 25px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageSimpleTtl__shoulder {
        font-size: 5.87vw;
        margin-bottom: 7.47vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-pageSimpleTtl__main {
        font-size: 36px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageSimpleTtl__main {
        font-size: 5.87vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-pageSimpleTtl__main-02 {
        font-size: 36px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageSimpleTtl__main-02 {
        font-size: 4.8vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-pageSimpleTtl__sub {
        font-size: 16px;
        margin-top: 28px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageSimpleTtl__sub {
        font-size: 4vw;
        margin-top: 4.27vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-pageSimpleTtl__catch {
        line-height: 2;
        font-size: 16px;
        text-align: center;
        margin-top: 15px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageSimpleTtl__catch {
        width: 84vw;
        line-height: 1.9;
        font-size: 4vw;
        text-align: left;
        margin: 5.34vw auto 0;
    }
}

@media only screen and (min-width: 769px) {
    .c-sort {
        margin-bottom: 48px;
    }
}

@media only screen and (max-width: 768px) {
    .c-sort {
        margin-bottom: 15.47vw;
    }
}

.c-sort .c-sort__conts {
    background: rgba(255, 255, 255, 0.4);
}

@media only screen and (min-width: 769px) {
    .c-sort .c-sort__conts {
        padding: 35px 40px 10px 40px;
    }
}

@media only screen and (max-width: 768px) {
    .c-sort .c-sort__conts {
        width: 84vw;
        margin: 0 auto;
        padding: 5.34vw 5.34vw 0.27vw 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-sort .c-sort__txt {
        font-size: 16px;
        margin-bottom: 32px;
    }
}

@media only screen and (max-width: 768px) {
    .c-sort .c-sort__txt {
        font-size: 2.67vw;
        margin-bottom: 5.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-sort .c-sort__select {
        margin-bottom: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .c-sort .c-sort__select {
        margin-bottom: 2.14vw;
    }
}

.c-sort .c-sort__list__head {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .c-sort .c-sort__list__head {
        font-size: 18px;
        margin-bottom: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .c-sort .c-sort__list__head {
        font-size: 3.74vw;
        margin-bottom: 3.2vw;
    }
}

.c-sort .c-sort__list__check {
    display: flex;
    flex-wrap: wrap;
}

@media only screen and (max-width: 768px) {
    .c-sort .c-sort__list__check {
        justify-content: space-between;
    }
}

@media only screen and (min-width: 769px) {
    .c-sort .c-sort__list__item {
        margin-bottom: 16px;
        margin-right: 36px;
    }
}

@media only screen and (max-width: 768px) {
    .c-sort .c-sort__list__item {
        margin-bottom: 3.2vw;
    }
}

.c-sort .c-sort__list__item input {
    display: none;
}

.c-sort .c-sort__list__item input:checked+label {
    background: #6f301b;
    color: #e5e0ca;
}

.c-sort .c-sort__list__item label,
.c-sort .c-sort__list__item .label {
    font-family: "�q���M�m�p�S Pro", "Hiragino Kaku Gothic Pro", "MS P�S�V�b�N",
        "MS PGothic", sans-serif;
    font-weight: 600;
    display: block;
    border: 1px solid #6f301b;
    color: #6f301b;
    text-align: center;
    cursor: pointer;
}

@media only screen and (min-width: 769px) {

    .c-sort .c-sort__list__item label,
    .c-sort .c-sort__list__item .label {
        width: 200px;
        height: 30px;
        line-height: 28px;
        border-radius: 4px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .c-sort .c-sort__list__item label:hover,
    .c-sort .c-sort__list__item .label:hover {
        color: #e5e0ca;
        background: #6f301b;
    }
}

@media only screen and (max-width: 768px) {

    .c-sort .c-sort__list__item label,
    .c-sort .c-sort__list__item .label {
        width: 35.47vw;
        height: 6.67vw;
        line-height: 6.14vw;
        border-radius: 1.07vw;
        font-size: 2.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-sort .c-sort__list__item:nth-child(4n) {
        margin-right: 0;
    }
}

.c-topArrowLink svg {
    margin: 0 5px;
}

.c-topArrowLink svg path {
    fill: #2f3c0d;
}

@media only screen and (min-width: 769px) {
    .c-topArrowLink svg {
        width: 8px;
    }
}

@media only screen and (max-width: 768px) {
    .c-topArrowLink svg {
        width: 2.14vw;
    }
}

.c-topArrowLink a {
    color: #2f3c0d;
    text-decoration: underline;
}

@media only screen and (min-width: 769px) {
    .c-pointTbl_01 {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
}

@media only screen and (min-width: 769px) {
    .c-pointTbl_01 .c-pointTbl__item {
        background: rgba(255, 255, 255, 0.4);
        width: 490px;
        margin-bottom: 20px;
        padding: 35px 44px;
        text-align: center;
    }
}

@media only screen and (max-width: 768px) {
    .c-pointTbl_01 .c-pointTbl__item {
        margin-bottom: 8vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-pointTbl_01 .c-pointTbl__item:nth-last-child(-n + 2) {
        margin-bottom: 0;
    }
}

.c-pointTbl_01 .c-pointTbl__head {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .c-pointTbl_01 .c-pointTbl__head {
        text-align: center;
        font-size: 22px;
        padding-bottom: 22px;
        border-bottom: 1px solid #9d9889;
        margin-bottom: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .c-pointTbl_01 .c-pointTbl__head {
        text-align: left;
        font-size: 18px;
        padding-bottom: 4.27vw;
        color: #2f3c0d;
        border-bottom: 2px solid #2f3c0d;
        margin-bottom: 6.4vw;
    }
}

@media only screen and (min-width: 769px) {
    .c-pointTbl_01 .c-pointTbl__txt {
        font-size: 14px;
        text-align: left;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .c-pointTbl_01 .c-pointTbl__txt {
        font-size: 4vw;
        line-height: 1.9;
    }
}

.p-twoClmTbl {
    border-left: 1px solid #9d9889;
    border-top: 1px solid #9d9889;
    border-collapse: collapse;
    border-spacing: 0;
}

@media only screen and (min-width: 769px) {
    .p-twoClmTbl {
        width: 1000px;
        margin: 0 auto;
    }
}

@media only screen and (max-width: 768px) {
    .p-twoClmTbl {
        width: 84vw;
        margin: 0 auto;
    }
}

.p-twoClmTbl th {
    width: 50%;
}

.p-twoClmTbl td,
.p-twoClmTbl th {
    border-right: 1px solid #9d9889 !important;
    border-bottom: 1px solid #9d9889 !important;
    padding: 0;
}

.p-twoClmTbl thead {
    text-align: center;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .p-twoClmTbl thead {
        font-size: 18px;
    }
}

@media only screen and (max-width: 768px) {
    .p-twoClmTbl thead {
        font-size: 3.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-twoClmTbl thead th {
        padding: 18px 0;
    }
}

@media only screen and (max-width: 768px) {
    .p-twoClmTbl thead th {
        padding: 2.67vw 0;
    }
}

@media only screen and (min-width: 769px) {
    .p-twoClmTbl tbody {
        font-size: 14px;
    }
}

@media only screen and (max-width: 768px) {
    .p-twoClmTbl tbody {
        font-size: 3.74vw;
    }
}

.p-twoClmTbl tbody tr:nth-child(odd) {
    background: rgba(255, 255, 255, 0.3);
}

@media only screen and (min-width: 769px) {
    .p-twoClmTbl tbody td {
        padding: 12px;
        text-align: center;
    }
}

@media only screen and (max-width: 768px) {
    .p-twoClmTbl tbody td {
        padding: 3.2vw 2.67vw;
    }
}

.js-accordion .p-accordionBtn {
    text-align: center;
    cursor: pointer;
    background: url(../images/bg_dark.jpg);
    text-align: center;
    font-weight: 600;
    transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1);
}

@media only screen and (min-width: 769px) {
    .js-accordion .p-accordionBtn {
        width: 1000px;
        height: 47px;
        line-height: 47px;
        font-size: 17px;
        margin: 0 auto;
    }

    .js-accordion .p-accordionBtn:hover {
        transform: translateY(2px);
    }

    .js-accordion .p-accordionBtn:hover span::before {
        transform: translateY(-4px) rotate(90deg);
    }
}

@media only screen and (max-width: 768px) {
    .js-accordion .p-accordionBtn {
        width: 84vw;
        height: 12.54vw;
        line-height: 12.54vw;
        font-size: 4.27vw;
        margin: 0 auto;
    }
}

.js-accordion .p-accordionBtn span {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .js-accordion .p-accordionBtn span {
        display: inline-block;
    }
}

@media only screen and (max-width: 768px) {
    .js-accordion .p-accordionBtn span {
        display: block;
    }
}

.js-accordion .p-accordionBtn span::before {
    display: block;
    content: "";
    /* background: url(../images/icon_arrow-dark.svg); */
    position: absolute;
    top: 50%;
    transform: translateY(-50%) rotate(90deg);
    transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1);
}

@media only screen and (min-width: 769px) {
    .js-accordion .p-accordionBtn span::before {
        background-size: 8px 15px;
        width: 8px;
        height: 15px;
        right: -20px;
    }
}

@media only screen and (max-width: 768px) {
    .js-accordion .p-accordionBtn span::before {
        background-size: 2.14vw 4vw;
        width: 2.14vw;
        height: 4vw;
        right: 5.34vw;
    }
}

.js-accordion .p-accordionConts {
    display: none;
}

@media only screen and (min-width: 769px) {
    .js-accordion .p-accordionConts {
        width: 1000px;
        margin: 0 auto 0;
        padding-top: 32px;
    }
}

@media only screen and (max-width: 768px) {
    .js-accordion .p-accordionConts {
        padding-top: 6.4vw;
    }
}

.js-accordion.is-open .p-accordionBtn span::before {
    transform: translateY(-50%) rotate(-90deg);
}

.js-accordion.is-open .p-accordionConts {
    display: block;
}

.p-simpleTwoClm {
    display: flex;
    margin: 0 auto;
}

.aboutMaterial .p-simpleTwoClm__custom {
    display: flex;
    margin: 0 auto;
}

@media only screen and (min-width: 769px) {
    .p-simpleTwoClm {
        justify-content: space-between;
        width: 1000px;
    }
}

@media only screen and (max-width: 768px) {
    .p-simpleTwoClm {
        flex-wrap: wrap;
        width: 84vw;
    }
}

.p-simpleTwoClm__figure__img {
    max-width: 100%;
}

@media only screen and (min-width: 769px) {
    .p-simpleTwoClm .p-simpleTwoClm__left {
        width: 480px;
    }

    .p-simpleTwoClm__figure__img {
        max-width: 300px;
    }
}

@media only screen and (max-width: 768px) {
    .p-simpleTwoClm .p-simpleTwoClm__left {
        width: 100%;
    }
}

@media only screen and (min-width: 769px) {
    .p-simpleTwoClm .p-simpleTwoClm__right {
        width: 480px;
    }
}

@media only screen and (max-width: 768px) {
    .p-simpleTwoClm .p-simpleTwoClm__right {
        width: 100%;
        margin-top: 0;
    }
}

@media only screen and (max-width: 768px) {
    .p-simpleTwoClm .p-simpleTwoClm__right.-wide {
        margin: 0 -8vw;
        width: 100vw;
    }

    .p-simpleTwoClm .p-simpleTwoClm__right.-wide img {
        width: 100%;
    }
}

.p-simpleTwoClm .p-simpleTwoClm__ttl {
    font-weight: 600;
    /* font-family: "Noto Serif JP", serif !important; */
}

@media only screen and (min-width: 769px) {
    .p-simpleTwoClm .p-simpleTwoClm__ttl {
        font-size: 24px !important;
        margin-bottom: 40px !important;
    }
}

@media only screen and (max-width: 768px) {
    .p-simpleTwoClm .p-simpleTwoClm__ttl {
        font-size: 5.87vw !important;
        text-align: center;
        margin-bottom: 8vw !important;
    }
}

@media only screen and (min-width: 769px) {
    .p-simpleTwoClm .p-simpleTwoClm__txt {
        font-size: 16px !important;
        line-height: 2 !important;
        margin-bottom: 2em !important;
    }
}

@media only screen and (max-width: 768px) {
    .p-simpleTwoClm .p-simpleTwoClm__txt {
        font-size: 4vw !important;
        line-height: 1.9 !important;
        margin-bottom: 2em !important;
    }
}

.p-simpleTwoClm .p-simpleTwoClm__txt:last-child {
    margin-bottom: 0;
}

@media only screen and (min-width: 769px) {
    .p-simpleTwoClm .p-simpleTwoClm__txt.-small {
        font-size: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .p-simpleTwoClm .p-simpleTwoClm__txt.-small {
        font-size: 3.47vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-simpleTwoClm .p-simpleTwoClm__caption {
        font-size: 11px;
    }
}

@media only screen and (max-width: 768px) {
    .p-simpleTwoClm .p-simpleTwoClm__caption {
        font-size: 2.67vw;
    }
}

.p-gridTwoClm {
    display: -ms-grid;
    display: grid;
    margin: 0 auto;
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm {
        -ms-grid-columns: 480px 1fr 480px;
        grid-template-columns: 480px 1fr 480px;
        -ms-grid-rows: auto auto;
        grid-template-rows: auto auto;
        width: 1000px;
    }

    .p-gridTwoClm>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }

    .p-gridTwoClm>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 2;
    }

    .p-gridTwoClm>*:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }

    .p-gridTwoClm>*:nth-child(4) {
        -ms-grid-row: 2;
        -ms-grid-column: 1;
    }

    .p-gridTwoClm>*:nth-child(5) {
        -ms-grid-row: 2;
        -ms-grid-column: 2;
    }

    .p-gridTwoClm>*:nth-child(6) {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm {
        -ms-grid-columns: 100%;
        grid-template-columns: 100%;
        -ms-grid-rows: auto auto auto;
        grid-template-rows: auto auto auto;
        width: 84vw;
    }

    .p-gridTwoClm>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }

    .p-gridTwoClm>*:nth-child(2) {
        -ms-grid-row: 2;
        -ms-grid-column: 1;
    }

    .p-gridTwoClm>*:nth-child(3) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
}

.p-gridTwoClm .p-gridTwoClm__ttl {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm .p-gridTwoClm__ttl {
        -ms-grid-column: 3;
        -ms-grid-column-span: 1;
        grid-column: 3 / 4;
        -ms-grid-row: 1;
        grid-row: 1;
        -ms-grid-row-align: end;
        align-self: end;
        font-size: 24px;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm .p-gridTwoClm__ttl {
        -ms-grid-row: 1;
        grid-row: 1;
        text-align: center;
        font-size: 5.87vw;
        margin-bottom: 8vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm .p-gridTwoClm__left {
        -ms-grid-column: 1;
        -ms-grid-column-span: 1;
        grid-column: 1 / 2;
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm .p-gridTwoClm__left {
        -ms-grid-row: 2;
        grid-row: 2;
    }
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm .p-gridTwoClm__right {
        -ms-grid-column: 3;
        -ms-grid-column-span: 1;
        grid-column: 3 / 4;
        -ms-grid-row: 2;
        grid-row: 2;
        -ms-grid-row-align: top;
        align-self: top;
        font-size: 16px;
        line-height: 2;
        margin-bottom: 1em;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm .p-gridTwoClm__right {
        -ms-grid-row: 3;
        grid-row: 3;
        font-size: 4vw;
        line-height: 1.9;
    }
}

.p-gridTwoClm .p-gridTwoClm__right:last-child {
    margin-bottom: 0;
}

.p-gridTwoClm .p-gridTwoClm__head {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm .p-gridTwoClm__head {
        font-size: 24px;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm .p-gridTwoClm__head {
        font-size: 5.87vw;
        text-align: center;
        margin-bottom: 8vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm .p-gridTwoClm__txt {
        font-size: 16px;
        line-height: 2;
        margin-bottom: 1em;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm .p-gridTwoClm__txt {
        font-size: 4vw;
        line-height: 1.9;
    }
}

.p-gridTwoClm .p-gridTwoClm__txt:last-child {
    margin-bottom: 0;
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm .p-gridTwoClm__txt.-small {
        font-size: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm .p-gridTwoClm__txt.-small {
        font-size: 3.47vw;
    }
}

.p-gridTwoClm02 {
    display: -ms-grid;
    display: grid;
    margin: 0 auto;
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm02 {
        -ms-grid-columns: 480px 1fr 480px;
        grid-template-columns: 480px 1fr 480px;
        -ms-grid-rows: auto auto;
        grid-template-rows: auto auto;
        width: 1000px;
    }

    .p-gridTwoClm02>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }

    .p-gridTwoClm02>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 2;
    }

    .p-gridTwoClm02>*:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }

    .p-gridTwoClm02>*:nth-child(4) {
        -ms-grid-row: 2;
        -ms-grid-column: 1;
    }

    .p-gridTwoClm02>*:nth-child(5) {
        -ms-grid-row: 2;
        -ms-grid-column: 2;
    }

    .p-gridTwoClm02>*:nth-child(6) {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm02 {
        -ms-grid-columns: 100%;
        grid-template-columns: 100%;
        -ms-grid-rows: auto auto auto;
        grid-template-rows: auto auto auto;
        width: 84vw;
    }

    .p-gridTwoClm02>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }

    .p-gridTwoClm02>*:nth-child(2) {
        -ms-grid-row: 2;
        -ms-grid-column: 1;
    }

    .p-gridTwoClm02>*:nth-child(3) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
}

.p-gridTwoClm02 .p-gridTwoClm__ttl {
    font-weight: 600;
    font-family: "Noto Serif JP", serif !important;
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm02 .p-gridTwoClm__ttl {
        -ms-grid-column: 1;
        -ms-grid-column-span: 1;
        grid-column: 1 / 2;
        align-self: flex-start;
        font-size: 24px;
        margin-bottom: 40px;
        line-height: 1.4;
        letter-spacing: 0.04em;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm02 .p-gridTwoClm__ttl {
        -ms-grid-row: 1;
        grid-row: 1;
        font-size: 5.87vw;
        margin-bottom: 8vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm02 .p-gridTwoClm__left {
        -ms-grid-row: 2;
        -ms-grid-row-span: 1;
        grid-row: 2 / 3;
        align-self: flex-start;
        font-size: 16px;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm02 .p-gridTwoClm__left {
        -ms-grid-row: 3;
        grid-row: 3;
    }
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm02 .p-gridTwoClm__right {
        -ms-grid-column: 3;
        -ms-grid-column-span: 1;
        grid-column: 3 / 4;
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm02 .p-gridTwoClm__right {
        -ms-grid-row: 2;
        grid-row: 2;
    }
}

.p-gridTwoClm02 .p-gridTwoClm__head {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm02 .p-gridTwoClm__head {
        font-size: 24px;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm02 .p-gridTwoClm__head {
        font-size: 5.87vw;
        text-align: center;
        margin-bottom: 8vw;
    }
}

.p-gridTwoClm02 .p-gridTwoClm__txt {
    margin-bottom: 2em;
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm02 .p-gridTwoClm__txt {
        font-size: 16px;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm02 .p-gridTwoClm__txt {
        font-size: 4vw;
        line-height: 1.9;
    }
}

.p-gridTwoClm02 .p-gridTwoClm__txt:last-child {
    margin-bottom: 0;
}

@media only screen and (min-width: 769px) {
    .p-gridTwoClm02 .p-gridTwoClm__txt.-small {
        font-size: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm02 .p-gridTwoClm__txt.-small {
        font-size: 3.47vw;
    }
}

@media only screen and (max-width: 768px) {
    .p-gridTwoClm02 .p-gridTwoClm__figure {
        margin-bottom: 8.54vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-bgTwoClm {
        padding: 5.85vw 0 14.42vw;
        min-height: 499px;
        background-size: cover;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1100px) {
    .p-bgTwoClm {
        padding: 64.4px 0 158.5px;
        background-size: cover;
    }
}

@media only screen and (max-width: 768px) {
    .p-bgTwoClm {
        padding: 9.87vw 0 73.6vw;
        background-size: 100vw auto;
    }
}

@media only screen and (min-width: 769px) {
    .p-bgTwoClm.-right .p-bgTwoClm__contents {
        width: 500px;
        float: right;
    }
}

@media only screen and (min-width: 769px) {
    .p-bgTwoClm .p-bgTwoClm__inner {
        width: 1000px;
        margin: 0 auto;
    }
}

@media only screen and (min-width: 769px) {
    .p-bgTwoClm .p-bgTwoClm__contents {
        width: 500px;
    }
}

.p-bgTwoClm .p-bgTwoClm__ttl {
    line-height: 1;
}

@media only screen and (min-width: 769px) {
    .p-bgTwoClm .p-bgTwoClm__ttl {
        font-size: 24px;
        margin-bottom: 27px;
    }
}

@media only screen and (max-width: 768px) {
    .p-bgTwoClm .p-bgTwoClm__ttl {
        font-size: 5.87vw;
        width: 83.2vw;
        margin: 0 auto 6.67vw;
    }
}

.p-bgTwoClm .p-bgTwoClm__ttl.-en {
    font-family: "Crimson Text", serif;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .p-bgTwoClm .p-bgTwoClm__ttl.-en {
        font-size: 34px;
    }
}

@media only screen and (max-width: 768px) {
    .p-bgTwoClm .p-bgTwoClm__ttl.-en {
        font-size: 8vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-bgTwoClm .p-bgTwoClm__txt {
        font-size: 16px;
        line-height: 2;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-bgTwoClm .p-bgTwoClm__txt {
        width: 83.2vw;
        font-size: 4vw;
        line-height: 1.9;
        margin: 0 auto 7.47vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-bgTwoClm .p-bgTwoClm__btn {
        width: 230px;
        height: 47px;
        line-height: 47px;
        font-size: 15px;
        padding-right: 8px;
    }
}

@media only screen and (max-width: 768px) {
    .p-bgTwoClm .p-bgTwoClm__btn {
        width: 61.34vw;
        height: 12.54vw;
        line-height: 12.54vw;
        font-size: 4.27vw;
        padding-right: 4vw;
        margin-left: 8vw;
    }
}

.p-alignClm {
    display: flex;
}

.laboratory .p-alignClm {
    display: flex;
}

@media only screen and (min-width: 769px) {
    .p-alignClm {
        justify-content: space-between;
    }
}

@media only screen and (max-width: 768px) {
    .p-alignClm {
        flex-wrap: wrap;
    }
}

.p-alignClm .p-alignClm__item {
    display: flex;
    flex-wrap: wrap;
}

@media only screen and (min-width: 769px) {
    .p-alignClm .p-alignClm__item {
        align-content: space-between;
        width: 480px;
    }
}

@media only screen and (max-width: 768px) {
    .p-alignClm .p-alignClm__item {
        margin-bottom: 8.54vw;
    }
}

@media only screen and (max-width: 768px) {
    .p-alignClm .p-alignClm__item:last-child {
        margin-bottom: 0;
    }
}

@media only screen and (min-width: 769px) {
    .p-alignClm .p-alignClm__txt {
        font-size: 16px;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .p-alignClm .p-alignClm__txt {
        font-size: 4vw;
        line-height: 1.9;
    }
}

.p-alignClm .p-alignClm__figure {
    width: 100%;
}

@media only screen and (min-width: 769px) {
    .p-alignClm .p-alignClm__figure {
        margin-top: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-alignClm .p-alignClm__figure {
        margin-top: 8.54vw;
    }
}

.p-centerTxtsBlock {
    text-align: center;
    margin: 0 auto;
}

@media only screen and (min-width: 769px) {
    .p-centerTxtsBlock {
        width: 1000px;
    }
}

.p-centerTxtsBlock .p-centerTxtsBlock__ttl {
    font-weight: 600;
    /* font-family: "Noto Serif JP", serif !important; */
}

@media only screen and (min-width: 769px) {
    .p-centerTxtsBlock .p-centerTxtsBlock__ttl {
        font-size: 24px;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-centerTxtsBlock .p-centerTxtsBlock__ttl {
        width: 84vw;
        font-size: 5.87vw;
        margin: 0 auto 8vw !important;
    }
}

@media only screen and (min-width: 769px) {
    .p-centerTxtsBlock .p-centerTxtsBlock__txt {
        width: 700px;
        font-size: 16px;
        line-height: 2;
        margin: 0 auto;
    }
}

@media only screen and (max-width: 768px) {
    .p-centerTxtsBlock .p-centerTxtsBlock__txt {
        width: 84vw;
        font-size: 4vw;
        line-height: 1.9;
        margin: 0 auto;
        text-align: left;
    }
}

.p-centerTxtsBlock .p-centerTxtsBlock__txt p {
    margin-bottom: 1em;
}

.p-centerTxtsBlock .p-centerTxtsBlock__txt p:last-child {
    margin-bottom: 0;
}

@media only screen and (min-width: 769px) {
    .p-centerTxtsBlock .p-centerTxtsBlock__txt.-small {
        font-size: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .p-centerTxtsBlock .p-centerTxtsBlock__txt.-small {
        font-size: 3.47vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-centerTxtsBlock__att {
        font-size: 12px;
        margin-top: 5px;
    }
}

@media only screen and (max-width: 768px) {
    .p-centerTxtsBlock__att {
        font-size: 3.47vw;
        margin-top: 1.34vw;
    }
}

.p-directoryPath {
    border-top: 1px solid #898163;
}

@media only screen and (min-width: 769px) {
    .p-directoryPath {
        width: 1000px;
        margin: 0 auto 0;
        padding: 20px 0;
    }
}

@media only screen and (max-width: 768px) {
    .p-directoryPath {
        font-size: 3.47vw;
        letter-spacing: 0;
        padding: 4vw 0 4.54vw;
        margin: 13.34vw auto -13.33vw;
    }
}

.p-directoryPath .p-directoryPath__page {
    display: inline-block;
}

.p-directoryPath .p-directoryPath__page a {
    display: block;
    position: relative;
}

.p-directoryPath .p-directoryPath__page a::before {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    /* background: url(../images/icon_arrow-dark.svg) no-repeat; */
}

@media only screen and (min-width: 769px) {
    .p-directoryPath .p-directoryPath__page a::before {
        width: 6px;
        height: 11px;
        background-size: 6px auto;
        top: 4px;
    }
}

@media only screen and (max-width: 768px) {
    .p-directoryPath .p-directoryPath__page a::before {
        width: 1.6vw;
        height: 2.94vw;
        background-size: 1.6vw auto;
        top: 1.07vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-directoryPath .p-directoryPath__page a {
        padding: 0 16px 0 0;
        margin: 0 10px 0 0;
    }
}

@media only screen and (max-width: 768px) {
    .p-directoryPath .p-directoryPath__page a {
        padding: 0 4.27vw 0 0;
        margin: 0 2.67vw 0 0;
    }
}

.p-circleList .p-circleList__item {
    position: relative;
    padding-left: 1.2em;
}

.p-circleList .p-circleList__item::before {
    content: "��";
    display: block;
    color: #5d5446;
    position: absolute;
    left: 0;
}

@media only screen and (min-width: 769px) {
    .p-topics__list {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-topics__list {
        border-top: 1px solid #707070;
        margin-bottom: 6.4vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-topics__item {
        width: 485px;
    }
}

.p-topics__item:nth-last-child(-n + 2) .p-topics__item__ancker {
    border-bottom: 1px solid #707070;
}

.p-topics__item__ancker {
    display: flex;
}

@media only screen and (min-width: 769px) {
    .p-topics__item__ancker {
        padding: 16px 15px 16px 8px;
        border-top: 1px solid #707070;
    }
}

@media only screen and (max-width: 768px) {
    .p-topics__item__ancker {
        padding: 3.2vw 1.34vw;
        border-bottom: 1px solid #707070;
    }
}

@media only screen and (min-width: 769px) {
    .p-topics__thumb {
        width: 90px;
        margin-right: 18px;
    }
}

@media only screen and (max-width: 768px) {
    .p-topics__thumb {
        width: 16vw;
        margin-right: 3.2vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-topics__detail {
        width: 353px;
    }
}

@media only screen and (max-width: 768px) {
    .p-topics__detail {
        width: 62.14vw;
    }
}

.p-topics__date {
    font-family: "Crimson Text", serif;
}

@media only screen and (min-width: 769px) {
    .p-topics__date {
        font-size: 18px;
        margin-bottom: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .p-topics__date {
        font-size: 3.2vw;
        margin-bottom: 1.34vw;
    }
}

.p-topics__date .-new {
    font-family: "Crimson Text", serif;
    font-weight: 600;
    display: inline-block;
    background: #2f3c0d;
    color: #e5e0ca;
    line-height: 1;
}

@media only screen and (min-width: 769px) {
    .p-topics__date .-new {
        font-size: 17px;
        padding: 0px 8px 3px 9px;
        margin-right: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .p-topics__date .-new {
        font-size: 3.2vw;
        padding: 0 1.34vw 0.8vw;
        margin-right: 1.87vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-topics__listTtl {
        font-size: 15px;
    }
}

@media only screen and (max-width: 768px) {
    .p-topics__listTtl {
        font-size: 3.47vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-seriesList {
        margin-bottom: 80px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList {
        margin-bottom: 16vw;
    }
}

.p-seriesList.-meat .p-seriesList__head {
    background: #5c2310;
}

.p-seriesList.-meat .p-seriesList__head::before {
    background: url(../images/img_badge_meat.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-meat .p-seriesList__head::before {
        background-size: 130px 130px;
        width: 130px;
        height: 130px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-meat .p-seriesList__head::before {
        background-size: 29.34vw 29.34vw;
        width: 29.34vw;
        height: 29.34vw;
    }
}

.p-seriesList.-fish .p-seriesList__head {
    background: #1176b9;
}

.p-seriesList.-fish .p-seriesList__head::before {
    background: url(../images/img_badge_fish.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-fish .p-seriesList__head::before {
        background-size: 148px 130px;
        width: 148px;
        height: 130px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-fish .p-seriesList__head::before {
        background-size: 33.34vw 29.34vw;
        width: 33.34vw;
        height: 29.34vw;
        right: 4vw;
    }
}

.p-seriesList.-special .p-seriesList__head {
    background: #d99f38;
}

.p-seriesList.-special .p-seriesList__head::before {
    background: url(../images/img_badge_special.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-special .p-seriesList__head::before {
        background-size: 130px 130px;
        width: 130px;
        height: 130px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-special .p-seriesList__head::before {
        background-size: 29.34vw 29.34vw;
        width: 29.34vw;
        height: 29.34vw;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-pate {
        overflow: hidden;
    }
}

.p-seriesList.-pate .p-seriesList__head {
    background: #90221e;
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-pate .p-seriesList__head {
        padding-left: 5.34vw;
    }
}

.p-seriesList.-pate .p-seriesList__head::before {
    background: url(../images/img_pate.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-pate .p-seriesList__head::before {
        background-size: 237px 130px;
        width: 238px;
        height: 130px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-pate .p-seriesList__head::before {
        background-size: 44.8vw 24.27vw;
        width: 44.8vw;
        height: 24.27vw;
        right: -2.66vw;
        top: 13.34vw;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-pate.-highTtl .p-seriesList__head {
        height: auto;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-pate.-highTtl .p-seriesList__head::before {
        top: initial;
        transform: translateY(0);
        bottom: -4.8vw;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-cut {
        overflow: hidden;
    }
}

.p-seriesList.-cut .p-seriesList__head {
    background: #0d5796;
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-cut .p-seriesList__head {
        padding-left: 5.34vw;
    }
}

.p-seriesList.-cut .p-seriesList__head::before {
    background: url(../images/img_cut.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-cut .p-seriesList__head::before {
        background-size: 280px 120px;
        width: 282px;
        height: 120px;
        top: -23px;
        transform: translateY(0);
        right: 1px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-cut .p-seriesList__head::before {
        background-size: 53.87vw 22.94vw;
        width: 53.87vw;
        height: 22.94vw;
        top: 3.2vw;
        transform: translateY(0);
        right: -13.33vw;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-cut.-highTtl .p-seriesList__head {
        height: auto;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-cut.-highTtl .p-seriesList__head::before {
        top: initial;
        transform: translateY(0);
        bottom: -2.93vw;
    }
}

.p-seriesList.-chickenFlake .p-seriesList__head {
    background: #e26c75;
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-chickenFlake .p-seriesList__head {
        padding-left: 5.34vw;
    }
}

.p-seriesList.-chickenFlake .p-seriesList__head::before {
    background: url(../images/img_oyatsu-chicken.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-chickenFlake .p-seriesList__head::before {
        background-size: 122px 140px;
        width: 122px;
        height: 140px;
        top: -22px;
        transform: translateY(0);
        right: 98px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-chickenFlake .p-seriesList__head::before {
        background-size: 25.34vw 29.07vw;
        width: 25.34vw;
        height: 29.07vw;
        top: -2.4vw;
        transform: translateY(0);
        right: 5.6vw;
    }
}

.p-seriesList.-tsunaFlake .p-seriesList__head {
    background: #36bfaa;
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-tsunaFlake .p-seriesList__head {
        padding-left: 5.34vw;
    }
}

.p-seriesList.-tsunaFlake .p-seriesList__head::before {
    background: url(../images/img_oyatsu-tsuna.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-tsunaFlake .p-seriesList__head::before {
        background-size: 122px 140px;
        width: 122px;
        height: 140px;
        top: -22px;
        transform: translateY(0);
        right: 98px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-tsunaFlake .p-seriesList__head::before {
        background-size: 25.34vw 29.07vw;
        width: 25.34vw;
        height: 29.07vw;
        top: -2.4vw;
        transform: translateY(0);
        right: 5.6vw;
    }
}

.p-seriesList.-paste .p-seriesList__head {
    background: #85b500;
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-paste .p-seriesList__head {
        padding-left: 5.34vw;
    }
}

.p-seriesList.-paste .p-seriesList__head::before {
    background: url(../images/img_oyatsu-paste.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-paste .p-seriesList__head::before {
        background-size: 122px 140px;
        width: 122px;
        height: 140px;
        top: -22px;
        transform: translateY(0);
        right: 98px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-paste .p-seriesList__head::before {
        background-size: 25.34vw 29.07vw;
        width: 25.34vw;
        height: 29.07vw;
        top: -2.4vw;
        transform: translateY(0);
        right: 5.6vw;
    }
}

.p-seriesList.-premium .p-seriesList__head {
    background: #dd668a;
}

.p-seriesList.-premium .p-seriesList__head::before {
    background: url(../images/img_premiumchicken.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-premium .p-seriesList__head::before {
        background-size: 130px 130px;
        width: 130px;
        height: 130px;
        right: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-premium .p-seriesList__head::before {
        background-size: 21.34vw 21.34vw;
        width: 21.34vw;
        height: 21.34vw;
        top: -9.33vw;
        transform: translateY(0);
        right: 8vw;
    }
}

.p-seriesList.-protein .p-seriesList__head {
    background: #79a500;
}

.p-seriesList.-protein .p-seriesList__head::before {
    background: url(../images/img_protain.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-protein .p-seriesList__head::before {
        background-size: 118px 118px;
        width: 118px;
        height: 118px;
        right: 35px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-protein .p-seriesList__head::before {
        background-size: 21.34vw 21.34vw;
        width: 21.34vw;
        height: 21.34vw;
        top: -3.2vw;
        transform: translateY(0);
        right: 8vw;
    }
}

.p-seriesList.-dry .p-seriesList__head {
    background: #5c2310;
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-dry .p-seriesList__head {
        padding-left: 5.34vw;
    }
}

.p-seriesList.-dry .p-seriesList__head::before {
    display: none;
}

.p-seriesList.-brend .p-seriesList__head {
    background: #5c2310;
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-brend .p-seriesList__head {
        padding-left: 5.34vw;
        padding-right: 5.34vw;
        height: auto;
    }
}

.p-seriesList.-brend .p-seriesList__head::before {
    display: none;
}

.p-seriesList.-wet .p-seriesList__head {
    background: #d99f38;
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-wet .p-seriesList__head {
        padding-left: 5.34vw;
        padding-right: 5.34vw;
        height: auto;
    }
}

.p-seriesList.-oatmeal .p-seriesList__head {
    background: #66b8ca;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-oatmeal .p-seriesList__head {
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-oatmeal .p-seriesList__head {
        padding-left: 5.34vw;
    }
}

.p-seriesList.-oatmeal .p-seriesList__head::before {
    background: url(../images/img_oatmeal.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-oatmeal .p-seriesList__head::before {
        background-size: 134px 84px;
        width: 134px;
        height: 84px;
        top: 17px;
        transform: translateY(0);
        right: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-oatmeal .p-seriesList__head::before {
        background-size: 32vw 20vw;
        width: 32vw;
        height: 20vw;
        top: 7.2vw;
        transform: translateY(0);
        right: 5.07vw;
    }
}

.p-seriesList.-oatmeal .p-seriesList__ancker {
    justify-content: center;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-oatmeal .p-seriesList__figure img {
        width: 130px;
    }
}

.p-seriesList.-jerky .p-seriesList__head {
    background: #a66135;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-jerky .p-seriesList__head {
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-jerky .p-seriesList__head {
        padding-left: 5.34vw;
    }
}

.p-seriesList.-jerky .p-seriesList__head::before {
    background: url(../images/img_jerky.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-jerky .p-seriesList__head::before {
        background-size: 130px 107px;
        width: 130px;
        height: 107px;
        top: -10px;
        transform: translateY(0);
        right: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-jerky .p-seriesList__head::before {
        background-size: 28.8vw 23.74vw;
        width: 28.54vw;
        height: 23.74vw;
        top: 2.14vw;
        transform: translateY(0);
        right: 5.07vw;
    }
}

.p-seriesList.-jerky .p-seriesList__ancker {
    justify-content: center;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-jerky .p-seriesList__figure img {
        width: 130px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-jerky .p-seriesList__figure img {
        width: 24.54vw;
    }
}

.p-seriesList.-wetDog .p-seriesList__head {
    background: #6f301b;
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-wetDog .p-seriesList__head {
        padding-left: 5.34vw;
    }
}

.p-seriesList.-wetDog .p-seriesList__head::before {
    background: url(../images/img_wild_wet.png) no-repeat;
}

@media only screen and (min-width: 769px) {
    .p-seriesList.-wetDog .p-seriesList__head::before {
        background-size: 205px 114px;
        width: 205px;
        height: 114px;
        top: -12px;
        transform: translateY(0);
        right: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList.-wetDog .p-seriesList__head::before {
        background-size: 38.4vw 21.34vw;
        width: 38.4vw;
        height: 21.34vw;
        top: 4.27vw;
        transform: translateY(0);
        right: 5.34vw;
    }
}

.p-seriesList .p-seriesList__head {
    position: relative;
    color: #e5e0ca;
    margin: 0 auto;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__head {
        text-align: center;
        height: 86px;
        padding: 16px 0 22px;
        margin-bottom: 37px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__head {
        height: 22.94vw;
        padding: 4.8vw 0 4.27vw 8vw;
        margin-bottom: 7.47vw;
    }
}

.p-seriesList .p-seriesList__head::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-repeat: none;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__head::before {
        right: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__head::before {
        right: 8.54vw;
    }
}

.p-seriesList .p-seriesList__head--en {
    font-family: "Crimson Text", serif;
    font-weight: 600;
    line-height: 1;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__head--en {
        font-size: 18px;
        margin-bottom: 3px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__head--en {
        font-size: 4.8vw;
        margin-bottom: 0.8vw;
    }
}

.p-seriesList .p-seriesList__head--jp {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__head--jp {
        font-size: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__head--jp {
        font-size: 5.87vw;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__head--jp .-spSmall {
        display: block;
        font-weight: 600;
        font-size: 3.74vw;
    }
}

.p-seriesList .p-seriesList__head--jpSmall {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__head--jpSmall {
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__head--jpSmall {
        font-size: 3.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__catch {
        text-align: center;
        font-size: 16px;
        margin-bottom: 48px;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__catch {
        width: 84vw;
        margin: 0 auto 6.4vw;
        font-size: 3.74vw;
        line-height: 1.6;
    }
}

.p-seriesList .p-seriesList__list {
    display: flex;
    flex-wrap: wrap;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__list {
        justify-content: space-between;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__list {
        width: 84vw;
        margin: 0 auto;
    }
}

.p-seriesList .p-seriesList__list.-related .p-seriesList__item {
    display: -ms-grid;
    display: grid;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__list.-related .p-seriesList__item {
        -ms-grid-columns: 298px 13px 169px;
        grid-template-columns: 298px 169px;
        -ms-grid-rows: auto auto� @auto;
        grid-template-rows: auto 34px auto;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__list.-related .p-seriesList__item {
        -ms-grid-columns: 40.54vw 38.14vw;
        grid-template-columns: 40.54vw 38.14vw;
        -ms-grid-rows: auto auto auto;
        grid-template-rows: auto auto auto;
    }

    .p-seriesList .p-seriesList__list.-related .p-seriesList__item>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }

    .p-seriesList .p-seriesList__list.-related .p-seriesList__item>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 2;
    }

    .p-seriesList .p-seriesList__list.-related .p-seriesList__item>*:nth-child(3) {
        -ms-grid-row: 2;
        -ms-grid-column: 1;
    }

    .p-seriesList .p-seriesList__list.-related .p-seriesList__item>*:nth-child(4) {
        -ms-grid-row: 2;
        -ms-grid-column: 2;
    }

    .p-seriesList .p-seriesList__list.-related .p-seriesList__item>*:nth-child(5) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }

    .p-seriesList .p-seriesList__list.-related .p-seriesList__item>*:nth-child(6) {
        -ms-grid-row: 3;
        -ms-grid-column: 2;
    }
}

.p-seriesList .p-seriesList__item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #9d9889;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__item {
        width: 480px;
        padding: 16px 0;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__item {
        width: 100%;
        padding: 0 0 6.4vw;
        margin-bottom: 6.4vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__item:nth-child(-n + 2) {
        border-top: 1px solid #9d9889;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__item:last-child {
        margin-bottom: 0;
    }
}

.p-seriesList .p-seriesList__ancker {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__detail {
        width: 298px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__detail {
        width: 40.54vw;
    }
}

.p-seriesList .p-seriesList__name {
    text-align: center;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__name {
        font-size: 18px;
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__name {
        font-size: 4.27vw;
        margin-bottom: 1.34vw;
    }
}

.p-seriesList .p-seriesList__name a:hover {
    text-decoration: underline;
}

.p-seriesList .p-seriesList__name-02 {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__name-02 {
        -ms-grid-column: 1;
        -ms-grid-column-span: 1;
        grid-column: 1 / 2;
        -ms-grid-row: 1;
        -ms-grid-row-span: 1;
        grid-row: 1 / 2;
        -ms-grid-row-align: end;
        align-self: end;
        font-size: 18px;
        margin-bottom: 20px;
        text-align: left;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__name-02 {
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1 / 3;
        -ms-grid-row: 1;
        -ms-grid-row-span: 1;
        grid-row: 1 / 2;
        font-size: 4.27vw;
        margin-bottom: 1.34vw;
        text-align: center;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__name-02 .p-seriesList__ancker {
        justify-content: center;
    }
}

.p-seriesList .p-seriesList__name-02 a:hover {
    text-decoration: underline;
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__tags .p-productTags__item {
        width: 146px;
    }
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__tags-02 {
        -ms-grid-column: 1;
        -ms-grid-column-span: 1;
        grid-column: 1 / 2;
        -ms-grid-row: 3;
        -ms-grid-row-span: 1;
        grid-row: 3 / 4;
        -ms-grid-row-align: start;
        align-self: start;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__tags-02 {
        -ms-grid-column: 1;
        -ms-grid-column-span: 1;
        grid-column: 1 / 2;
        -ms-grid-row: 3;
        -ms-grid-row-span: 1;
        grid-row: 3 / 4;
        -ms-grid-row-align: start;
        align-self: start;
    }
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__tags-02 .p-productTags__item {
        width: 146px;
    }
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__figure {
        width: 169px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .p-seriesList .p-seriesList__figure .p-seriesList__ancker {
        display: block;
        transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .p-seriesList .p-seriesList__figure .p-seriesList__ancker:hover {
        transform: scale(1.02, 1.02);
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__figure {
        width: 38.14vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-seriesList .p-seriesList__figure-02 {
        -ms-grid-column: 2;
        -ms-grid-column-span: 1;
        grid-column: 2 / 3;
        -ms-grid-row: 1;
        -ms-grid-row-span: 3;
        grid-row: 1 / 4;
    }

    .p-seriesList .p-seriesList__figure-02 .p-seriesList__ancker {
        display: block;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .p-seriesList .p-seriesList__figure-02 .p-seriesList__ancker:hover {
        transform: scale(1.02, 1.02);
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList .p-seriesList__figure-02 {
        -ms-grid-column: 2;
        -ms-grid-column-span: 1;
        grid-column: 2 / 3;
        -ms-grid-row: 2;
        -ms-grid-row-span: 2;
        grid-row: 2 / 4;
    }
}

.p-seriesList__old {
    font-family: "�q���M�m�p�S Pro", "Hiragino Kaku Gothic Pro", "MS P�S�V�b�N",
        "MS PGothic", sans-serif;
    font-weight: bold;
    background: rgba(255, 255, 255, 0.4);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

@media only screen and (min-width: 769px) {
    .p-seriesList__old {
        padding: 10px 0;
        font-size: 13px;
        line-height: 1;
        margin-bottom: 16px;
        -ms-grid-column: 1;
        -ms-grid-column-span: 1;
        grid-column: 1 / 2;
        -ms-grid-row: 2;
        -ms-grid-row-span: 1;
        grid-row: 2 / 3;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList__old {
        flex-wrap: wrap;
        padding: 1.6vw 0;
        font-size: 3.2vw;
        margin-bottom: 3.2vw;
        -ms-grid-column: 1;
        -ms-grid-column-span: 1;
        grid-column: 1 / 2;
        -ms-grid-row: 2;
        -ms-grid-row-span: 1;
        grid-row: 2 / 3;
        -ms-grid-row-align: end;
        align-self: end;
    }
}

@media only screen and (max-width: 768px) {
    .p-seriesList__old .-small {
        display: block;
        text-align: center;
        width: 100%;
        font-size: 2.67vw;
    }
}

.p-productTags {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.p-productTags .p-productTags__item {
    position: relative;
    text-align: center;
    font-family: "�q���M�m�p�S Pro", "Hiragino Kaku Gothic Pro", "MS P�S�V�b�N",
        "MS PGothic", sans-serif;
    font-weight: 600;
    line-height: 1;
    border: 1px solid #2f3c0d;
    color: #2f3c0d;
}

@media only screen and (min-width: 769px) {
    .p-productTags .p-productTags__item {
        border-radius: 4px;
        font-size: 11px;
        padding: 7px 0;
        margin-bottom: 6px;
    }
}

@media only screen and (max-width: 768px) {
    .p-productTags .p-productTags__item {
        width: 100%;
        height: 6.67vw;
        line-height: 5.87vw;
        font-size: 3.2vw;
        border-radius: 1.07vw;
        margin-bottom: 6px;
    }
}

.p-productTags .p-productTags__item.-type,
.p-productTags .p-productTags__item.-room {
    color: #e5e0ca;
    background: #6f301b;
    border: 1px solid #6f301b;
}

.p-productTags .p-productTags__item.-fix {
    color: #e5e0ca;
    background: #009c87;
    border: 1px solid #009c87;
}

.p-productTags .p-productTags__item.-diet {
    color: #e5e0ca;
    background: #d19532;
    border: 1px solid #d19532;
}

.p-productTags .p-productTags__item.-taste {
    color: #e5e0ca;
    background: #981e21;
    border: 1px solid #981e21;
}

.p-productTags .p-productTags__item.-grainfree {
    color: #e5e0ca;
    background: #01003a;
    border: 1px solid #01003a;
}

@media only screen and (min-width: 769px) {
    .p-productTags .p-productTags__item.-grainfree {
        font-size: 11px;
    }
}

@media only screen and (min-width: 769px) {
    .p-productTags .p-productTags__item.-small {
        font-size: 11px;
    }
}

.p-productTags .p-productTags__item.js-guide::before {
    content: "";
    display: block;
    position: absolute;
    background: url(../images/icon_hint.svg) no-repeat;
    top: 50%;
    transform: translateY(-50%);
}

@media only screen and (min-width: 769px) {
    .p-productTags .p-productTags__item.js-guide::before {
        width: 16px;
        height: 16px;
        background-size: 16px 16px;
        right: 6px;
    }
}

@media only screen and (max-width: 768px) {
    .p-productTags .p-productTags__item.js-guide::before {
        width: 4vw;
        height: 4vw;
        background-size: 4vw 4vw;
        right: 1.6vw;
    }
}

.js-guide {
    position: relative;
    cursor: default;
}

@media only screen and (min-width: 769px) {
    .js-guide:hover .js-guide__balloon {
        display: block;
        -webkit-animation: show 0.2s linear 0s;
        animation: show 0.2s linear 0s;
    }
}

.js-guide__balloon {
    display: none;
    position: absolute;
    background: #f7f3e2;
    color: #703117;
    border-radius: 6px;
    text-align: left;
    box-shadow: 0px 3px 26px 0px rgba(0, 0, 0, 0.16);
    z-index: 10;
}

@media only screen and (min-width: 769px) {
    .js-guide__balloon {
        width: 400px;
        left: -70px;
        bottom: 34px;
        padding: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .js-guide__balloon {
        width: 74.67vw;
        left: -0.8vw;
        bottom: 8vw;
        padding: 4.27vw;
    }
}

.js-guide__balloon::before {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-color: #f7f3e2 transparent transparent transparent;
}

@media only screen and (min-width: 769px) {
    .js-guide__balloon::before {
        bottom: -8px;
        border-width: 10px 8px 0 8px;
    }
}

@media only screen and (max-width: 768px) {
    .js-guide__balloon::before {
        bottom: -2.13vw;
        border-width: 2.67vw 1.87vw 0 1.87vw;
    }
}

.js-guide__balloon .js-guide__head {
    color: #2f3c0d;
    margin-bottom: 1em;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .js-guide__balloon .js-guide__head {
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .js-guide__balloon .js-guide__head {
        font-size: 3.47vw;
    }
}

.js-guide__balloon .js-guide__txt {
    margin-bottom: 1em;
    line-height: 1.5;
}

@media only screen and (min-width: 769px) {
    .js-guide__balloon .js-guide__txt {
        font-size: 13px;
    }
}

@media only screen and (max-width: 768px) {
    .js-guide__balloon .js-guide__txt {
        font-size: 2.67vw;
    }
}

.js-guide__balloon .js-guide__txt a {
    color: #2f3c0d;
    text-decoration: underline;
}

.js-guide__balloon .js-guide__txt:last-child {
    margin-bottom: 0;
}

@media only screen and (min-width: 769px) {
    .js-guide__balloon .js-guide__txt.-small {
        font-size: 11px;
    }
}

@media only screen and (max-width: 768px) {
    .js-guide__balloon .js-guide__txt.-small {
        font-size: 2.67vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-shopList {
        width: 1000px;
        margin: 0 auto;
    }
}

.p-shopList .p-shopList__list {
    display: flex;
    flex-wrap: wrap;
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__list {
        justify-content: space-between;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .p-shopList .p-shopList__list {
        margin-bottom: 10.67vw;
    }
}

.p-shopList .p-shopList__item {
    border-bottom: 1px solid #9d9889;
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__item {
        width: 480px;
        padding: 32px 0;
    }

    .p-shopList .p-shopList__item:nth-child(-n + 2) {
        border-top: 1px solid #9d9889;
    }
}

@media only screen and (max-width: 768px) {
    .p-shopList .p-shopList__item {
        width: 84vw;
        padding: 6.67vw 0;
        margin: 0 auto;
    }

    .p-shopList .p-shopList__item:nth-child(1) {
        border-top: 1px solid #9d9889;
    }
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__shopName {
        font-size: 18px;
        margin-bottom: 13px;
    }
}

@media only screen and (max-width: 768px) {
    .p-shopList .p-shopList__shopName {
        font-size: 4.27vw;
        margin-bottom: 2.94vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__shopAdd {
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .p-shopList .p-shopList__shopAdd {
        font-size: 3.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__shopTel {
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .p-shopList .p-shopList__shopTel {
        font-size: 3.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__shopTime {
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .p-shopList .p-shopList__shopTime {
        font-size: 3.74vw;
    }
}

.p-shopList .p-shopList__btns {
    display: flex;
    justify-content: space-between;
    text-align: center;
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__btns {
        margin-top: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .p-shopList .p-shopList__btns {
        margin-top: 4.27vw;
    }
}

.p-shopList .p-shopList__btns .p-shopList__btn {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__btns .p-shopList__btn {
        width: 230px;
        height: 47px;
        line-height: 45px;
    }
}

@media only screen and (max-width: 768px) {
    .p-shopList .p-shopList__btns .p-shopList__btn {
        width: 40.8vw;
        height: 10.67vw;
        line-height: 10.14vw;
        font-size: 3.47vw;
    }
}

.p-shopList .p-shopList__btns .p-shopList__btn span {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__btns .p-shopList__btn span {
        padding-left: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .p-shopList .p-shopList__btns .p-shopList__btn span {
        padding-left: 4.27vw;
    }
}

.p-shopList .p-shopList__btns .p-shopList__btn.-map {
    background: #2f3c0d;
    color: #e5e0ca;
}

.p-shopList .p-shopList__btns .p-shopList__btn.-map a {
    color: #e5e0ca;
}

.p-shopList .p-shopList__btns .p-shopList__btn.-map span::before {
    content: "";
    display: block;
    position: absolute;
    background: url(../images/icon_mappointer.svg);
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__btns .p-shopList__btn.-map span::before {
        width: 10px;
        height: 14px;
        background-size: 10px 14px;
    }
}

@media only screen and (max-width: 768px) {
    .p-shopList .p-shopList__btns .p-shopList__btn.-map span::before {
        width: 2.67vw;
        height: 3.74vw;
        background-size: 2.67vw 3.74vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__btns .p-shopList__btn.-brand::before {
        left: 40px;
        background: #2f2016;
    }
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopList__btns .p-shopList__btn.-brand::after {
        left: 40px;
        background: #2f2016;
    }
}

.p-shopList .p-shopListBtn {
    display: block;
}

@media only screen and (min-width: 769px) {
    .p-shopList .p-shopListBtn {
        width: 315px;
        height: 41px;
        margin: 0 auto;
    }
}

@media only screen and (max-width: 768px) {
    .p-shopList .p-shopListBtn {
        width: 84vw;
        height: 10.94vw;
        margin: 0 auto;
    }
}

@media only screen and (max-width: 768px) {
    .p-foodTypeSelect .p-foodTypeSelect__item {
        width: 31.5%;
        font-size: 3.47vw;
    }
}

@media only screen and (max-width: 768px) {
    .p-foodTypeSelect .p-foodTypeSelect__name {
        width: 100%;
        height: 18.67vw;
        background: rgba(255, 255, 255, 0.4);
        margin-top: 9.6vw;
        padding-top: 12.54vw;
        text-align: center;
    }
}

@media only screen and (max-width: 768px) {
    .p-foodTypeSelect .p-foodTypeSelect__img {
        position: absolute;
        bottom: 8vw;
        left: 50%;
        transform: translateX(-50%);
    }
}

.p-pager {
    position: relative;
    display: flex;
    justify-content: center;
}

@media only screen and (min-width: 769px) {
    .p-pager {
        width: 1000px;
        margin: 40px auto 0;
    }
}

@media only screen and (max-width: 768px) {
    .p-pager {
        width: 84vw;
        margin: 8.54vw auto 0;
    }
}

@media only screen and (min-width: 769px) {
    .p-pager .p-pager__arrow {
        width: 33px;
        height: 41px;
    }
}

@media only screen and (max-width: 768px) {
    .p-pager .p-pager__arrow {
        width: 6.4vw;
        height: 8vw;
    }
}

.p-pager .p-pager__arrow .-arrow {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
}

@media only screen and (min-width: 769px) {
    .p-pager .p-pager__arrow .-arrow {
        justify-content: center;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (min-width: 769px) {
    .p-pager .p-pager__arrow .-arrow img {
        width: 10px;
        height: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .p-pager .p-pager__arrow .-arrow img {
        width: 2.14vw;
        height: 4vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-pager .p-pager__arrow.-prev {
        margin-right: 60px;
    }
}

@media only screen and (max-width: 768px) {
    .p-pager .p-pager__arrow.-prev {
        position: absolute;
        left: 0;
    }
}

@media only screen and (max-width: 768px) {
    .p-pager .p-pager__arrow.-prev .-arrow {
        justify-content: flex-start;
    }
}

.p-pager .p-pager__arrow.-prev .-arrow img {
    transform: rotate(180deg);
}

@media only screen and (min-width: 769px) {
    .p-pager .p-pager__arrow.-prev .-arrow:hover {
        transform: translate(-3px);
    }
}

@media only screen and (min-width: 769px) {
    .p-pager .p-pager__arrow.-next {
        margin-left: 60px;
    }
}

@media only screen and (max-width: 768px) {
    .p-pager .p-pager__arrow.-next {
        position: absolute;
        right: 0;
    }
}

@media only screen and (max-width: 768px) {
    .p-pager .p-pager__arrow.-next .-arrow {
        justify-content: flex-end;
    }
}

@media only screen and (min-width: 769px) {
    .p-pager .p-pager__arrow.-next .-arrow:hover {
        transform: translate(3px);
    }
}

.p-pager .p-pager__list {
    display: flex;
}

.p-pager .p-pager__item {
    font-family: "Crimson Text", serif;
    line-height: 1;
}

@media only screen and (min-width: 769px) {
    .p-pager .p-pager__item {
        width: 33px;
        height: 41px;
        font-size: 20px;
        margin: 0 10px;
    }
}

@media only screen and (max-width: 768px) and (max-width: 768px) {
    .p-pager .p-pager__item {
        width: 6.4vw;
        height: 8vw;
        font-size: 4vw;
        margin: 0 1.87vw;
    }
}

.p-pager .p-pager__item .-active,
.p-pager .p-pager__item .-link,
.p-pager .p-pager__item .-dot {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.p-pager .p-pager__item .-active {
    border: 1px solid #2f2016;
    background: #2f2016;
    color: #e5e0ca;
}

.p-pager .p-pager__item .-link {
    border: 1px solid #5d5446;
}

@media only screen and (min-width: 769px) {
    .p-pager .p-pager__item .-link:hover {
        background: #5d5446;
        color: #e5e0ca;
    }
}

.p-reportsList {
    border-top: 1px solid #9d9889;
}

@media only screen and (min-width: 769px) {
    .p-reportsList {
        width: 1000px;
        margin: 0 auto;
    }
}

@media only screen and (max-width: 768px) {
    .p-reportsList {
        width: 84vw;
        margin: 0 auto 12.8vw;
    }
}

.p-reportsList .p-reportsList__item {
    border-bottom: 1px solid #9d9889;
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__item {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 315px 40px 647px;
        grid-template-columns: 315px 40px 647px;
        -ms-grid-rows: auto auto auto;
        grid-template-rows: auto auto auto;
        padding: 30px 0;
    }

    .p-reportsList .p-reportsList__item>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }

    .p-reportsList .p-reportsList__item>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 2;
    }

    .p-reportsList .p-reportsList__item>*:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }

    .p-reportsList .p-reportsList__item>*:nth-child(4) {
        -ms-grid-row: 2;
        -ms-grid-column: 1;
    }

    .p-reportsList .p-reportsList__item>*:nth-child(5) {
        -ms-grid-row: 2;
        -ms-grid-column: 2;
    }

    .p-reportsList .p-reportsList__item>*:nth-child(6) {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }

    .p-reportsList .p-reportsList__item>*:nth-child(7) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }

    .p-reportsList .p-reportsList__item>*:nth-child(8) {
        -ms-grid-row: 3;
        -ms-grid-column: 2;
    }

    .p-reportsList .p-reportsList__item>*:nth-child(9) {
        -ms-grid-row: 3;
        -ms-grid-column: 3;
    }
}

@media only screen and (max-width: 768px) {
    .p-reportsList .p-reportsList__item {
        padding: 8vw 0;
    }
}

.p-reportsList .p-reportsList__name {
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__name {
        -ms-grid-column: 3;
        -ms-grid-column-span: 1;
        grid-column: 3 / 4;
        -ms-grid-row: 1;
        -ms-grid-row-span: 1;
        grid-row: 1 / 2;
        -ms-grid-row-align: end;
        align-self: end;
        font-size: 18px;
        margin-bottom: 15px;
        padding-right: 15px;
    }
}

@media only screen and (max-width: 768px) {
    .p-reportsList .p-reportsList__name {
        text-align: center;
        font-size: 4.27vw;
        margin-bottom: 4.8vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__img {
        -ms-grid-column: 1;
        -ms-grid-column-span: 1;
        grid-column: 1 / 2;
        -ms-grid-row: 1;
        -ms-grid-row-span: 3;
        grid-row: 1 / 4;
    }
}

@media only screen and (max-width: 768px) {
    .p-reportsList .p-reportsList__img {
        margin-bottom: 4.27vw;
    }
}

.p-reportsList .p-reportsList__img .p-reportsList__img__inner {
    position: relative;
}

.p-reportsList .p-reportsList__img__icon {
    position: absolute;
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__img__icon {
        right: 10px;
        bottom: 10px;
        width: 80px;
        height: 80px;
    }
}

@media only screen and (max-width: 768px) {
    .p-reportsList .p-reportsList__img__icon {
        right: 2.67vw;
        bottom: 2.67vw;
        width: 21.34vw;
        height: 21.34vw;
    }
}

.p-reportsList .p-reportsList__tag {
    display: flex;
    flex-wrap: wrap;
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__tag {
        justify-content: left;
        align-items: center;
        -ms-grid-column: 3;
        -ms-grid-column-span: 1;
        grid-column: 3 / 4;
        -ms-grid-row: 2;
        -ms-grid-row-span: 1;
        grid-row: 2 / 3;
        margin-bottom: 13px;
    }
}

@media only screen and (max-width: 768px) {
    .p-reportsList .p-reportsList__tag {
        justify-content: space-between;
        margin-bottom: 2.67vw;
    }
}

.p-reportsList .p-reportsList__tag__item {
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "�q���M�m�p�S Pro", "Hiragino Kaku Gothic Pro", "MS P�S�V�b�N",
        "MS PGothic", sans-serif;
    border: 1px solid #6f301b;
    color: #6f301b;
    text-align: center;
    font-weight: bold;
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__tag__item {
        width: 200px;
        height: 30px;
        border-radius: 5px;
        margin-right: 8px;
        margin-bottom: 5px;
    }
}

@media only screen and (max-width: 768px) {
    .p-reportsList .p-reportsList__tag__item {
        width: 41.07vw;
        border-radius: 1.34vw;
        font-size: 2.67vw;
        padding: 1.34vw;
        margin-bottom: 1.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__ttl {
        -ms-grid-column: 3;
        -ms-grid-column-span: 1;
        grid-column: 3 / 4;
        -ms-grid-row: 3;
        -ms-grid-row-span: 1;
        grid-row: 3 / 4;
    }
}

.p-reportsList .p-reportsList__ancker {
    display: block;
    background: rgba(255, 255, 255, 0.4);
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__ancker {
        padding: 16px 18px;
        transition: background 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .p-reportsList .p-reportsList__ancker {
        padding: 4.27vw 4.8vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__ancker:hover {
        background: rgba(255, 255, 255, 0.6);
    }

    .p-reportsList .p-reportsList__ancker:hover .p-reportsList__ttl__link svg {
        transform: translateX(4px);
    }
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__ttl__head {
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {
    .p-reportsList .p-reportsList__ttl__head {
        font-size: 3.47vw;
    }
}

.p-reportsList .p-reportsList__ttl__link {
    color: #2f3c0d;
    text-align: right;
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__ttl__link {
        font-size: 14px;
        margin-top: 7px;
    }
}

@media only screen and (max-width: 768px) {
    .p-reportsList .p-reportsList__ttl__link {
        font-size: 2.94vw;
        margin-top: 1.87vw;
    }
}

.p-reportsList .p-reportsList__ttl__link svg {
    vertical-align: baseline;
}

@media only screen and (min-width: 769px) {
    .p-reportsList .p-reportsList__ttl__link svg {
        width: 6px;
        height: 11px;
        margin-left: 5px;
        transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .p-reportsList .p-reportsList__ttl__link svg {
        position: relative;
        width: 1.6vw;
        height: 2.94vw;
        margin-left: 1.34vw;
        top: 0.54vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-naLinks {
        width: 1000px;
        margin: 0 auto;
        font-family: "Noto Serif JP", serif !important;
    }
}

@media only screen and (max-width: 768px) {
    .p-naLinks {
        width: 84vw;
        margin: 0 auto;
    }
}

@media only screen and (min-width: 769px) {
    .p-naLinks .p-naLinks__list {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        margin-bottom: 48px;
    }
}

@media only screen and (max-width: 768px) {
    .p-naLinks .p-naLinks__list {
        margin-bottom: 7.47vw;
    }
}

.p-naLinks .p-naLinks__item {
    box-shadow: 2px 3px 6px 0px rgba(0, 0, 0, 0.16);
    background: rgba(255, 255, 255, 0.4);
}

@media only screen and (min-width: 769px) {
    .p-naLinks .p-naLinks__item {
        width: 485px;
        height: 100px;
        margin-bottom: 30px;
        padding: 10px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .p-naLinks .p-naLinks__item {
        /* width: 100%; */
        height: 21.34vw;
        margin-bottom: 4.8vw;
        padding: 2.67vw;
        width: 84vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-naLinks .p-naLinks__item:nth-last-child(-n + 2) {
        margin-bottom: 0;
    }
}

@media only screen and (max-width: 768px) {
    .p-naLinks .p-naLinks__item:last-child {
        margin-bottom: 0;
    }
}

@media only screen and (min-width: 769px) {
    .p-naLinks .p-naLinks__item:hover {
        box-shadow: none;
        transform: translate(2px, 2px);
    }
}

@media only screen and (min-width: 769px) {
    .p-naLinks .p-naLinks__item:hover a::before {
        right: 5px;
    }
}

.p-naLinks .p-naLinks__item a {
    position: relative;
    display: flex;
    align-items: center;
}

.p-naLinks .p-naLinks__item a::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: url("/html/user_data/assets/img/na/icon-arrow.svg");
}

@media only screen and (min-width: 769px) {
    .p-naLinks .p-naLinks__item a::before {
        width: 8px;
        height: 15px;
        background-size: 8px 15px;
        right: 10px;
        transition: right 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    }
}

@media only screen and (max-width: 768px) {
    .p-naLinks .p-naLinks__item a::before {
        width: 2.14vw;
        height: 4vw;
        background-size: 2.14vw 4vw;
        right: 1.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-naLinks .p-naLinks__item .p-naLinks__img {
        width: 120px;
        overflow: hidden;
    }
}

@media only screen and (max-width: 768px) {
    .p-naLinks .p-naLinks__item .p-naLinks__img {
        width: 24vw;
    }
}

.p-naLinks .p-naLinks__item .p-naLinks__txt {
    font-weight: 600;
    text-align: center;
    -webkit-margin-before: 0;
    margin-block-start: 0;
}

@media only screen and (min-width: 769px) {
    .p-naLinks .p-naLinks__item .p-naLinks__txt {
        width: 345px;
        font-size: 20px !important;
        padding-right: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .p-naLinks .p-naLinks__item .p-naLinks__txt {
        width: 54.67vw;
        font-size: 4.27vw !important;
        padding-right: 4vw;
    }
}

.p-dotList .p-dotList__item {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .p-dotList .p-dotList__item {
        padding-left: 23px;
        font-size: 16px;
        margin-bottom: 0.5em;
    }
}

@media only screen and (max-width: 768px) {
    .p-dotList .p-dotList__item {
        padding-left: 3.2vw;
        font-size: 3.74vw;
        margin-bottom: 1em;
        line-height: 1.6;
    }
}

.p-dotList .p-dotList__item::before {
    content: "";
    display: block;
    position: absolute;
    border-radius: 50%;
    background: #5d5446;
    left: 0;
}

@media only screen and (min-width: 769px) {
    .p-dotList .p-dotList__item::before {
        width: 15px;
        height: 15px;
        top: 3px;
    }
}

@media only screen and (max-width: 768px) {
    .p-dotList .p-dotList__item::before {
        width: 1.6vw;
        height: 1.6vw;
        top: 1.87vw;
    }
}

.p-dotList .p-dotList__item:last-child {
    margin-bottom: 0;
}

@keyframes show {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.p-movie {
    margin: 0 auto;
}

@media only screen and (min-width: 769px) {
    .p-movie {
        padding: 56px 0;
        width: 1000px;
        margin-top: 54px;
        margin-bottom: 32px;
        background: #f7f3e2;
    }
}

@media only screen and (max-width: 768px) {
    .p-movie {
        width: 84vw;
        margin-bottom: 10.67vw;
    }
}

.p-movie .p-movie__head {
    text-align: center;
    font-weight: bold;
}

@media only screen and (min-width: 769px) {
    .p-movie .p-movie__head {
        font-size: 20px;
        margin-bottom: 30px;
    }
}

@media only screen and (max-width: 768px) {
    .p-movie .p-movie__head {
        font-size: 4.8vw;
        margin-bottom: 6.4vw;
    }
}

.p-movie .p-movie__inner {
    position: relative;
}

@media only screen and (min-width: 769px) {
    .p-movie .p-movie__inner {
        /* height: 405px; */
        height: 100%;
        max-width: 90%;
        margin: auto;
    }
}

@media only screen and (max-width: 768px) {
    .p-movie .p-movie__inner {
        height: 47.2vw;
    }
}

.p-movie .p-movie__inner__cover {
    position: relative;
    margin: 0 auto;
    z-index: 2;
}

@media only screen and (min-width: 769px) {
    .p-movie .p-movie__inner__cover {
        width: 720px;
        height: 405px;
    }
}

@media only screen and (max-width: 768px) {
    .p-movie .p-movie__inner__cover {
        width: 84vw;
        height: 47.2vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-movie .p-movie__inner__cover:hover {
        cursor: pointer;
    }

    .p-movie .p-movie__inner__cover:hover::before {
        transform: translate(-50%, -50%) scale(1.05);
    }

    .p-movie .p-movie__inner__cover:hover:after {
        opacity: 1;
    }
}

.p-movie .p-movie__inner__cover::before {
    content: "";
    display: block;
    position: absolute;
    background: url(../images/icon_play.svg);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@media only screen and (min-width: 769px) {
    .p-movie .p-movie__inner__cover::before {
        width: 120px;
        height: 120px;
        background-size: 120px 120px;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
        z-index: 2;
    }
}

@media only screen and (max-width: 768px) {
    .p-movie .p-movie__inner__cover::before {
        width: 13.34vw;
        height: 13.34vw;
        background-size: 13.34vw 13.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .p-movie .p-movie__inner__cover::after {
        opacity: 0;
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.1);
        top: 0;
        left: 0;
        transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
        z-index: 2;
    }
}

.p-movie .p-movie__inner__play {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
}

@media only screen and (min-width: 769px) {
    .p-movie .p-movie__inner__play {
        width: 720px;
        height: 405px;
    }
}

@media only screen and (max-width: 768px) {
    .p-movie .p-movie__inner__play {
        width: 84vw;
        height: 50.67vw;
    }
}

.js-scrollBnr {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.js-scrollBnr.is-active {
    opacity: 0;
    transform: translateY(50%);
}

.js-scrollBnr.is-none {
    opacity: 0;
    visibility: hidden;
}

@media only screen and (min-width: 769px) {
    .p-wysiwyg {
        font-size: 16px;
        line-height: 2;
    }
}

@media only screen and (max-width: 768px) {
    .p-wysiwyg {
        font-size: 4vw;
        line-height: 1.9;
    }
}

@media only screen and (min-width: 769px) {
    .p-wysiwyg p {
        margin-bottom: 25px;
    }
}

@media only screen and (max-width: 768px) {
    .p-wysiwyg p {
        margin-bottom: 4.27vw;
    }
}

.p-wysiwyg h2,
.p-wysiwyg .p-wysiwyg__ttl-02 {
    font-weight: 600;
    color: #2f3c0d;
    border-bottom: 2px solid #2f3c0d;
}

@media only screen and (min-width: 769px) {

    .p-wysiwyg h2,
    .p-wysiwyg .p-wysiwyg__ttl-02 {
        font-size: 18px;
        padding: 30px 0 10px;
        margin-bottom: 26px;
    }
}

@media only screen and (max-width: 768px) {

    .p-wysiwyg h2,
    .p-wysiwyg .p-wysiwyg__ttl-02 {
        font-size: 4.8vw;
        line-height: 1.6;
        padding: 4.8vw 0 2.67vw;
        margin-bottom: 7.47vw;
    }
}

.p-wysiwyg h3,
.p-wysiwyg .p-wysiwyg__ttl-03 {
    font-weight: 600;
    color: #2f3c0d;
    border-left: 2px solid #2f3c0d;
}

@media only screen and (min-width: 769px) {

    .p-wysiwyg h3,
    .p-wysiwyg .p-wysiwyg__ttl-03 {
        font-size: 17px;
        padding: 4px 0px 4px 20px;
        margin: 56px auto 12px;
    }
}

@media only screen and (max-width: 768px) {

    .p-wysiwyg h3,
    .p-wysiwyg .p-wysiwyg__ttl-03 {
        font-size: 4.54vw;
        line-height: 1.6;
        padding: 0 0 0 4.8vw;
        margin: 7.47vw 0;
    }
}

.p-wysiwyg ol,
.p-wysiwyg ul,
.p-wysiwyg .p-wysiwyg__list {
    margin-bottom: 2em;
}

.p-wysiwyg ol li,
.p-wysiwyg ul li,
.p-wysiwyg .p-wysiwyg__list li {
    position: relative;
    padding-left: 1em;
    margin-bottom: 1em;
    line-height: 1.7;
}

.p-wysiwyg ol li::before,
.p-wysiwyg ul li::before,
.p-wysiwyg .p-wysiwyg__list li::before {
    content: "";
    display: block;
    position: absolute;
    background: #5d5446;
    border-radius: 50%;
    left: 0;
}

@media only screen and (min-width: 769px) {

    .p-wysiwyg ol li::before,
    .p-wysiwyg ul li::before,
    .p-wysiwyg .p-wysiwyg__list li::before {
        width: 6px;
        height: 6px;
        top: 10px;
    }
}

@media only screen and (max-width: 768px) {

    .p-wysiwyg ol li::before,
    .p-wysiwyg ul li::before,
    .p-wysiwyg .p-wysiwyg__list li::before {
        width: 1.6vw;
        height: 1.6vw;
        top: 2.67vw;
    }
}

.p-wysiwyg dl,
.p-wysiwyg .p-wysiwyg__definition {
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #9d9889;
    margin-bottom: 2em;
}

@media only screen and (min-width: 769px) {

    .p-wysiwyg dl,
    .p-wysiwyg .p-wysiwyg__definition {
        font-size: 15px;
    }
}

@media only screen and (max-width: 768px) {

    .p-wysiwyg dl,
    .p-wysiwyg .p-wysiwyg__definition {
        font-size: 3.74vw;
    }
}

.p-wysiwyg dl dt,
.p-wysiwyg .p-wysiwyg__definition dt {
    border-right: 1px solid #9d9889 !important;
    line-height: 1.3;
}

@media only screen and (min-width: 769px) {

    .p-wysiwyg dl dt,
    .p-wysiwyg .p-wysiwyg__definition dt {
        width: 160px;
        padding: 24px;
    }
}

@media only screen and (max-width: 768px) {

    .p-wysiwyg dl dt,
    .p-wysiwyg .p-wysiwyg__definition dt {
        width: 25.6vw;
        padding: 4vw 5.34vw;
    }
}

.p-wysiwyg dl dt:nth-of-type(odd),
.p-wysiwyg .p-wysiwyg__definition dt:nth-of-type(odd) {
    background: rgba(255, 255, 255, 0.3);
}

.p-wysiwyg dl dd,
.p-wysiwyg .p-wysiwyg__definition dd {
    line-height: 1.3;
}

@media only screen and (min-width: 769px) {

    .p-wysiwyg dl dd,
    .p-wysiwyg .p-wysiwyg__definition dd {
        width: 478px;
        padding: 24px;
    }
}

@media only screen and (max-width: 768px) {

    .p-wysiwyg dl dd,
    .p-wysiwyg .p-wysiwyg__definition dd {
        width: 57.87vw;
        padding: 4vw 5.34vw;
    }
}

.p-wysiwyg dl dd:nth-of-type(odd),
.p-wysiwyg .p-wysiwyg__definition dd:nth-of-type(odd) {
    background: rgba(255, 255, 255, 0.3);
}

.p-wysiwyg img {
    text-align: center;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

@media only screen and (min-width: 769px) {
    .p-wysiwyg img {
        max-width: 1000px;
        padding: 40px 0 60px;
    }
}

@media only screen and (max-width: 768px) {
    .p-wysiwyg img {
        max-width: 84vw;
        padding: 5.34vw 0 10.67vw;
    }
}

.u-textSuper {
    font-size: 60%;
    vertical-align: super;
    line-height: 1;
    letter-spacing: 0.2em;
}

.u-textSuper-S {
    font-size: 50%;
    vertical-align: super;
    line-height: 1;
    letter-spacing: 0.2em;
    display: inline-block;
    position: relative;
}

@media only screen and (min-width: 769px) {
    .u-textSuper-S {
        top: -10px;
    }
}

@media only screen and (max-width: 768px) {
    .u-textSuper-S {
        top: -2.66vw;
    }
}

.u-textSuper-M {
    font-size: 50%;
    vertical-align: super;
    line-height: 1;
    letter-spacing: 0.2em;
}

.u-textSuper-L {
    font-size: 80%;
    vertical-align: super;
    line-height: 1;
    letter-spacing: 0.2em;
}

body {
    -webkit-font-smoothing: subpixel-antialiased;
}

@media only screen and (max-width: 768px) {
    body {
        overflow-x: hidden;
    }
}

html {
    -webkit-font-smoothing: antialiased;
}

#wrapper {
    font-family: "Noto Serif JP", serif !important;
    font-size: 14px;
    font-weight: 500;
    font-feature-settings: "palt";
    box-sizing: border-box;
    line-height: 1.4;
    letter-spacing: 0.04em !important;
    color: #2f3c0d;
}

@media only screen and (min-width: 769px) {
    #wrapper {
        min-width: 1100px;
    }
}

*,
*:before,
*:after {
    box-sizing: inherit;
}

*:focus {
    outline: none;
}

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

a {
    text-decoration: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

button {
    font-family: "Noto Serif JP", serif;
    font-weight: 600;
}

@media only screen and (min-width: 769px) {
    .-sp {
        display: none !important;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1100px) {
    .-sp {
        display: none !important;
    }
}

@media only screen and (max-width: 768px) {
    .-sp {
        display: block;
    }
}

@media only screen and (min-width: 769px) {
    .-pc {
        display: block;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1100px) {
    .-pc {
        display: block;
    }
}

@media only screen and (max-width: 768px) {
    .-pc {
        display: none !important;
    }

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

    .p-simpleTwoClm__figure__custom .-pc {
        /* display: none !important; */
    }
}



/* css_na_safety_naSafety */

@media only screen and (min-width: 769px) {
    .c-pageTtl {
        background: url("/html/user_data/assets/img/na/mv-pc-nutrition.webp") no-repeat center top;
        background-size: cover;
    }

    .c-pageTtl__nature {
        background: url("/html/user_data/assets/img/na/mv-pc-authority.jpg") no-repeat center top !important;
        background-size: cover !important;
    }
}

@media only screen and (max-width: 768px) {
    .c-pageTtl {
        background: url("/cdn/shop/files/mv-sp_c67f8da6-b739-4cca-bebc-0fe415d33faf.jpg?v=1749490098");
        background-size: cover;
    }

    .c-pageTtl__nature {
        background: url("/html/user_data/assets/img/na/mv-sp-authority.jpg") !important;
        background-size: cover !important;
    }
}

@media only screen and (min-width: 769px) {
    .safetyConts {
        padding: 88px 0 188px;
    }
}

@media only screen and (max-width: 768px) {
    .safetyConts {
        padding: 14.94vw 0 33.07vw;
    }
}

@media only screen and (min-width: 769px) {
    .lead {
        background: url("/html/user_data/assets/img/na/bg_field-pc.png") no-repeat center bottom;
        background-size: 100%;
        min-height: 573px;
        padding-bottom: 235px;
    }
}

@media only screen and (max-width: 768px) {
    .lead {
        background: url("/cdn/shop/files/bg_field-sp_62575e1a-abc8-4d19-893d-4f23981e23f5.jpg?v=1749489034") no-repeat center bottom;
        background-size: 100vw auto !important;
        padding-bottom: 53.34vw;
    }
}

@media only screen and (min-width: 769px) {
    .l-basicSection.-first {
        padding-bottom: 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-basicSection .l-basicSection__head {
        width: 84vw;
        margin: 0 auto 10.67vw;
        text-align: left;
    }
}

.l-basicSection .l-basicSection__txt {
    margin-bottom: 2em;
}

@media only screen and (max-width: 768px) {
    .l-basicSection .p-simpleTwoClm__left .p-simpleTwoClm__figure {
        margin-bottom: 2em;
    }
}

@media only screen and (max-width: 768px) {
    .p-simpleTwoClm .p-simpleTwoClm__ttl {
        text-align: left;
    }
}

@media only screen and (min-width: 769px) {
    .material {
        position: relative;
        margin-bottom: 104px;
    }
}

@media only screen and (max-width: 768px) {
    .material {
        margin-bottom: 17.07vw;
    }
}

@media only screen and (min-width: 769px) {
    .material .p-simpleTwoClm__txt {
        margin-bottom: 1em;
    }
}

@media only screen and (min-width: 769px) {
    .material .p-simpleTwoClm__left {
        padding-top: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .material .p-simpleTwoClm__figure {
        margin-top: 2em;
    }
}

@media only screen and (min-width: 769px) {
    .safety-02 {
        margin-bottom: 104px;
    }
}

@media only screen and (max-width: 768px) {
    .safety-02 {
        margin-bottom: 17.07vw;
    }
}

@media only screen and (max-width: 768px) {
    .safety-02 .p-centerTxtsBlock__ttl {
        text-align: left;
    }
}

@media only screen and (min-width: 769px) {
    .safety-02 .p-simpleTwoClm__txt {
        margin-bottom: 1em;
    }
}

@media only screen and (max-width: 768px) {
    .safety-02 .p-simpleTwoClm__figure {
        margin-bottom: 2em;
    }
}

@media only screen and (min-width: 769px) {
    .safety-03 {
        margin-bottom: 104px;
    }
}

@media only screen and (max-width: 768px) {
    .safety-03 {
        margin-bottom: 17.07vw;
    }
}

@media only screen and (max-width: 768px) {
    .safety-03 .p-simpleTwoClm__figure {
        margin-bottom: 2em;
    }
}

@media only screen and (min-width: 769px) {
    .safety-04 {
        margin-bottom: 104px;
    }
}

@media only screen and (max-width: 768px) {
    .safety-04 {
        margin-bottom: 17.07vw;
    }
}

@media only screen and (max-width: 768px) {
    .safety-04 .p-centerTxtsBlock__ttl {
        text-align: left;
    }
}

.safety-04 .p-centerTxtsBlock__txt {
    margin-bottom: 2em;
}

@media only screen and (min-width: 769px) {
    .safety-04 .p-centerTxtsBlock__txt {
        width: 1000px;
    }
}

@media only screen and (min-width: 769px) {
    .safety-05 {
        margin-bottom: 104px;
    }
}

@media only screen and (max-width: 768px) {
    .safety-05 {
        margin-bottom: 17.07vw;
    }
}

@media only screen and (max-width: 768px) {
    .safety-05 .p-centerTxtsBlock__ttl {
        text-align: left;
    }
}

@media only screen and (max-width: 768px) {
    .safety-05 .p-simpleTwoClm__figure {
        margin-bottom: 2em;
    }
}

.safety-05 .l-shop__btn {
    display: block;
}

@media only screen and (min-width: 769px) {
    .safety-05 .l-shop__btn {
        width: 1000px;
        margin: 40px auto 0;
    }
}

@media only screen and (max-width: 768px) {
    .safety-05 .l-shop__btn {
        width: 84vw;
        margin: 2em auto 0;
    }
}

@media only screen and (max-width: 768px) {
    .l-bgDark {
        margin-top: 0;
    }
}

@media only screen and (min-width: 769px) {
    .l-shop {
        padding: 80px 0 160px;
    }
}


/* na_safety_p-movie */

.p-movie {
    margin: 0 auto;

    @include pc {
        padding: 56px 0;
        width: 1000px;
        margin-top: 54px;
        margin-bottom: 32px;
        background: #F7F3E2;
    }

    @include sp {
        width: vw(315px);
        margin-bottom: vw(40px);
    }
}

.p-movie .p-movie__head {
    text-align: center;
    font-weight: 700;

    @include pc {
        font-size: 20px;
        margin-bottom: 30px;
    }

    @include sp {
        font-size: vw(18px);
        margin-bottom: vw(24px);
    }
}

.p-movie .p-movie__inner {
    position: relative;

    @include pc {
        height: 405px;
    }

    @include sp {
        height: vw(177px);
    }
}

.p-movie .p-movie__inner__cover {
    position: relative;
    margin: 0 auto;
    z-index: 2;

    @include pc {
        width: 720px;
        height: 405px;
    }

    @include sp {
        width: vw(315px);
        height: vw(177px);
    }
}

.p-movie .p-movie__inner__cover:hover {
    @include pc {
        cursor: pointer;

        &::before {
            transform: translate(-50%, -50%) scale(1.05);
        }

        &:after {
            opacity: 1;
        }
    }
}

.p-movie .p-movie__inner__cover:before {
    content: "";
    display: block;
    position: absolute;
    background: url(/html/user_data/assets/img/na/brand-cmn/icon_play.svg);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    @include pc {
        width: 120px;
        height: 120px;
        background-size: 120px 120px;
        transition: all .6s $easeOutExpo;
        z-index: 2;
    }

    @include sp {
        width: vw(50px);
        height: vw(50px);
        background-size: vw(50px) vw(50px);
    }
}

.p-movie .p-movie__inner__cover:after {
    @include pc {
        opacity: 0;
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, .1);
        top: 0;
        left: 0;
        transition: all .6s $easeOutExpo;
        z-index: 2;
    }
}

.p-movie .p-movie__inner__play {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%);

    @include pc {
        width: 720px;
        height: 405px;
    }

    @include sp {
        width: vw(315px);
        height: vw(190px);
    }
}

/*# sourceMappingURL=/cdn/shop/t/4/assets/from-oldsite-202505.css_na_safety_p-movie.css.map?v=143306685095625919151754373069 */