@charset 'UTF-8';
/*@font-face {
    font-family: 'NotoSans';
    src: url(../font/NotoSans_regular.woff) format('woff');
	font-weight: normal;
}

@font-face {
    font-family: 'NotoSans';
    src: url(../font/NotoSans_bold.woff) format('woff');
	font-weight: bold;
}*/
/*初期設定
----------------------------------------------------*/
@page
{
    margin: 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,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video
{
    font: inherit;
    font-size: 100%;

    margin: 0;
    padding: 0;

    text-align: initial;
    vertical-align: baseline;

    border: 0;
}

ul
{
    list-style: none;
}

img
{
    max-width: 100%;

    vertical-align: sub;
}
@media screen and (max-width: 767px)
{
    img
    {
        max-width: 100%;
    }
}

input,
button,
select,
textarea
{
    font: inherit;

    border: none;
    border-radius: 0;
    outline: none;
    background: transparent;

    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}

select
{
            appearance: auto;
    -webkit-appearance: auto;
       -moz-appearance: auto;
}

textarea
{
    resize: vertical;
}

input[type=submit],
input[type=button],
label,
button,
select
{
    cursor: pointer;
}

select::-ms-expand
{
    display: none;
}

@media screen and (max-width: 767px)
{
    select,
    input[type=text],
    input[type=password],
    input[type=email],
    input[type=tel]
    {
        max-width: 100%;
    }
}

/* color設定 */
/*font設定 */
/* 基本設定 */
@media screen and (max-width: 767px)
{
    html
    {
        overflow-x: hidden;
    }
}

body
{
    font-family: 'Zen Kaku Gothic New', 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.7;

    overflow-x: hidden;

    box-sizing: border-box;
    width: 100%;
    min-width: 1280px;
    max-width: 100%;

    text-align: initial;
    letter-spacing: 0;
    word-wrap: break-word;

    color: #333;
    background-color: #fff;
}
@media screen and (min-width: 768px) and (max-width: 1280px)
{
    body
    {
        overflow-x: scroll;
    }
}
@media screen and (max-width: 767px)
{
    body
    {
        font-size: 13px;

        min-width: 100%;
    }
}

*
{
    box-sizing: border-box;

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a
{
    transition: .3s ease;
    text-decoration: none;

    color: inherit;
}
a:hover
{
    transition: .3s ease;

    opacity: .7;
}

.text--red
{
    color: red;
}

.text--link
{
    text-decoration: underline;
}

#tblLayout
{
    width: 100%;
}

.font-en
{
    font-family: 'Inter', 'Zen Kaku Gothic New', 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

strong
{
    font-weight: bold;
}

/* レイアウト */
@media screen and (min-width: 768px)
{
    .pc
    {
        display: block;
    }
}
@media screen and (max-width: 767px)
{
    .pc
    {
        display: none;
    }
}

@media screen and (min-width: 768px)
{
    .sp
    {
        display: none;
    }
}
@media screen and (max-width: 767px)
{
    .sp
    {
        display: block;
    }
}

#primary
{
    margin: 0;
    padding: 0;
}

.inner
{
    width: 100%;
    min-width: 1280px;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
}
@media screen and (max-width: 767px)
{
    .inner
    {
        min-width: 100%;
    }
}

.section-inner
{
    width: 1280px;
    min-width: 1280px;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 40px;
    padding-left: 40px;
}
@media screen and (max-width: 767px)
{
    .section-inner
    {
        width: 100%;
        min-width: 100%;
        padding-right: 4.0712468193vw;
        padding-left: 4.0712468193vw;
    }
}

.text-center
{
    text-align: center;
}

.text-left
{
    text-align: left;
}

.text-right
{
    text-align: right;
}

input,
textarea
{
    border: 1px solid black;
    border-radius: 4px;
    background: #fff;
}

input
{
    padding: 8px;
}

.radio label
{
    position: relative;

    margin-right: 1em;
    padding-left: 16px;
}

.radio label::before
{
    position: absolute;
    top: 0;
    left: 0;

    display: block;

    width: 15px;
    height: 15px;

    content: '';

    border: 1px solid black;
    border-radius: 50%;
    background: #eee;
}

.radio input:checked + label::after
{
    position: absolute;
    top: 3px;
    left: 3px;

    display: block;

    width: 11px;
    height: 11px;

    content: '';

    border-radius: 50%;
    background: #333;
}

label
{
    display: inline-block;

    margin: 0 4px;

    vertical-align: middle;
}

select
{
    position: relative;

    width: auto;
    padding: 10px 24px 10px 10px;

    border: 1px solid #ccc;
    border-radius: 5px;
    background: #fff;
}

.select-wrap
{
    position: relative;

    display: inline-block;

    max-width: 100%;
}
.select-wrap::after
{
    position: absolute;
    top: 50%;
    right: 12px;

    width: 6px;
    height: 6px;

    content: '';
    transform: translateY(-70%) rotate(45deg);

    border-right: 2px solid #666;
    border-bottom: 2px solid #666;
}

textarea
{
    width: 100%;
    height: 16em;
    margin: 10px 0 0;
    padding: 5px;
}
@media screen and (max-width: 767px)
{
    textarea
    {
        height: 12em;
    }
}

.button
{
    text-align: center;
}

.button input
{
    font-size: 16px;

    padding: 15px 30px;

    border: none;
    background: #fff;
}

.button input:hover
{
    cursor: pointer;

    opacity: .7;
}

input[type=checkbox]
{
    position: relative;

    width: 20px;
    height: 20px;

    border: 1px solid #ccc;
    border-radius: 2px;

    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}

input[type=checkbox]:checked:before
{
    position: absolute;
    top: 1px;
    left: 5px;

    width: 6px;
    height: 10px;

    content: '';
    transform: rotate(50deg);

    border-right: 2px solid #333;
    border-bottom: 2px solid #333;
}

input[type=radio]
{
    position: relative;

    width: 24px;
    height: 24px;
    margin: 0 6px;

    border: 1px solid #ccc;
    border-radius: 20px;

    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}

input[type=radio]:checked:before
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    width: 14px;
    height: 14px;
    margin: auto;

    content: '';
    transform: rotate(50deg);

    border-radius: 10px;
    background: #333;
}

.checkbox-wrap
{
    display: flex;

    padding: 5px 0;

    align-items: flex-start;
}
.checkbox-wrap label
{
    padding: 3px 0 0 6px;
}

.btn
{
    font-size: 14px;
    font-weight: 400;

    text-align: center;
}
.btn--primary
{
    position: relative;

    padding: 0 32px 0 0;

    color: #333;
    border: none;
    background-color: #fff;
    box-shadow: none;
}
.btn--primary::after
{
    position: absolute;
    top: 0;
    right: 16px;
    bottom: 0;

    width: 6px;
    height: 6px;
    margin: auto 0;

    content: '';
    transform: rotate(45deg);

    border-top: 2px solid #666;
    border-right: 2px solid #666;
}
.btn--primary:hover
{
    opacity: .6;
    background-color: #fff;
}
.btn--secondary
{
    font-size: 15px;

    position: relative;

    display: inline-block;

    min-width: 280px;
    padding: 18px 40px 18px 16px;

    text-align: left;

    color: #333;
    color: #333;
    border: 1px solid #666;
    border-radius: 4px;
    background: none;
}
.btn--secondary::after
{
    position: absolute;
    top: 0;
    right: 16px;
    bottom: 0;

    width: 6px;
    height: 6px;
    margin: auto 0;

    content: '';
    transform: rotate(45deg);

    border-top: 1px solid #666;
    border-right: 1px solid #666;
}
.btn--secondary:hover
{
    color: #fff;
    border-color: #09689d;
    background-color: #09689d;
}
.btn--secondary:hover::after
{
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
}

.btn-wrap
{
    font-size: 15px;

    margin: 16px auto;
}
@media screen and (max-width: 767px)
{
    .btn-wrap
    {
        margin: 40px auto;
    }
}
.btn-wrap--center
{
    justify-content: center;
}
.btn-wrap--right
{
    justify-content: flex-end;
}

.list
{
    display: flex;

    flex-wrap: wrap;
    gap: 32px 24px;
}
@media screen and (max-width: 767px)
{
    .list
    {
        gap: 24px 2.0356234097vw;
    }
}
.list--col2 > *
{
    width: calc(50% - 12px);
}
@media screen and (max-width: 767px)
{
    .list--col2 > *
    {
        width: calc(50% - 1.0178117048vw);
    }
}
.list--col3 > *
{
    width: calc((100% - 24px * 2) / 3);
}
@media screen and (max-width: 767px)
{
    .list--col3 > *
    {
        width: calc(50% - 1.0178117048vw);
    }
}
.list--col4 > *
{
    width: calc((100% - 24px * 3) / 4);
}
@media screen and (max-width: 767px)
{
    .list--col4 > *
    {
        width: calc(50% - 1.0178117048vw);
    }
}
.list--col5 > *
{
    width: calc((100% - 24px * 4) / 5);
}
@media screen and (max-width: 767px)
{
    .list--col5 > *
    {
        width: calc(50% - 1.0178117048vw);
    }
}
.list--col6 > *
{
    width: calc((100% - 24px * 5) / 6);
}
@media screen and (max-width: 767px)
{
    .list--col6 > *
    {
        width: calc(50% - 1.0178117048vw);
    }
}

.list-product
{
    position: relative;
}
.list-product__img
{
    margin-bottom: 12px;

    text-align: center;
}
@media screen and (max-width: 767px)
{
    .list-product__img
    {
        margin-bottom: 8px;
    }
}
.list-product__img img
{
    max-width: 100%;
}
.list-product .icon
{
    display: flex;

    margin-bottom: 8px;

    flex-wrap: wrap;
    gap: 4px;
}
@media screen and (max-width: 767px)
{
    .list-product .icon
    {
        margin-bottom: 6px;
    }
}
.list-product .icon img
{
    height: 20px;
}
.list-product .color-chip
{
    display: flex;

    margin: -8px 0 6px;

    flex-wrap: wrap;
    gap: 8px;
}
.list-product .color-chip img
{
    width: 10px;
    height: 10px;

    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 50%;
}
.list-product__name
{
    font-size: 14px;
    font-weight: 400;

    margin-bottom: 6px;

    color: #333;
}
@media screen and (max-width: 767px)
{
    .list-product__name
    {
        font-size: 13px;

        margin-bottom: 4px;
    }
}
.list-product__price
{
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;

    color: #666;
}
.list-product__price .tax
{
    font-size: 11px;
    font-weight: 400;
}
.list-product.list-history .list-product__name
{
    font-size: 12px;
}

.heading-wrap
{
    font-weight: 400;

    display: flex;

    margin-bottom: 24px;

    justify-content: space-between;
    align-items: center;
}
.heading
{
    font-size: 28px;
}
@media screen and (max-width: 767px)
{
    .heading
    {
        font-size: 6.106870229vw;
    }
}

.text-arrow-link
{
    font-size: 14px;
    font-weight: 500;

    position: relative;

    padding-right: 28px;
}
.text-arrow-link::after
{
    position: absolute;
    top: 45%;

    width: 15px;
    height: 6px;
    margin-left: 10px;

    content: '';
    transform: translateY(-50%);

    background-image: url(../../../../Contents/ImagesPkg/common/arrow.svg);
    background-repeat: no-repeat;
    background-position: center left;
    background-size: contain;
}

.slick-dots
{
    margin-top: 40px;
}

.slick-dotted.slick-slider
{
    margin: 0;
}

.slider-dots
{
    margin: 24px 0 0 0;

    text-align: center;
}

.slider-dots li
{
    display: inline-block;

    width: auto;
    height: auto;
    margin: 0 8px;
}

.slider-dots li button
{
    width: 10px;
    height: 10px;
    padding: 0;

    color: transparent;
    border-radius: 50%;
    background-color: #eee;
}

.slider-dots li button:before
{
    content: '';
}

.slider-dots .slick-active button
{
    background: #6c7f86;
    /*ドットボタンの現在地表示の色*/
}

.sold-out figure
{
    position: relative;
}

.sold-out .card__wrap,
.sold-out .card__img
{
    position: relative;
}

.sub-archive .sold-out .card__img::after
{
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    content: '';

    border-radius: 8px;
    background-color: rgba(0, 0, 0, .3);
}

.detail .sold-out figure::before,
.sold-out .card__wrap::before
{
    position: absolute;
    z-index: 3;

    content: '';

    background: transparent url(../../../../images/common/ico-soldout.webp) no-repeat center center/cover;
}

.detail .sold-out figure::before
{
    top: 5px;
    left: 7px;

    width: 42px;
    height: 45px;
}

@media screen and (max-width: 767px)
{
    .detail .sold-out figure::before
    {
        width: 2.375rem;
        height: 2.5625rem;
    }
}
.sold-out .card__wrap::before
{
    top: 3px;
    left: 3px;

    width: 25px;
    height: 27px;
}

.detail .sold-out figure::after,
.sold-out .card__wrap::after
{
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;

    content: '';

    border-radius: 8px 0 8px 0;
    background:         linear-gradient(135deg, #888 50%, transparent 50%);
}

.detail .sold-out figure::after
{
    width: 80px;
    height: 80px;
}

@media screen and (max-width: 767px)
{
    .detail .sold-out figure::after
    {
        width: 4.6875rem;
        height: 4.6875rem;
    }
}
.sold-out .card__wrap::after
{
    width: 48px;
    height: 48px;
}

.slick-dots li button:before
{
    font-size: 10px;

    opacity: 1;
    color: rgba(0, 0, 0, .2);
}
@media screen and (max-width: 767px)
{
    .slick-dots li button:before
    {
        font-size: 9px;
    }
}

.slick-dots li.slick-active button:before
{
    opacity: 1;
    color: #666;
}

.slide-arrow
{
    position: absolute;
    top: 50%;

    display: inline-block;

    width: 24px;
    height: 24px;

    cursor: pointer;
    transform: translateY(-50%);
    text-align: center;
}
.slide-arrow--prev
{
    left: -32px;
}
.slide-arrow--next
{
    right: -32px;
}

@media screen and (max-width: 767px)
{
    .slick-slide img.pc
    {
        display: none;
    }
}
@media screen and (min-width: 768px)
{
    .slick-slide img.sp
    {
        display: none;
    }
}

@media screen and (max-width: 767px)
{
    .accordion-trigger
    {
        position: relative;

        display: block;

        width: 100%;
        margin: 0;
        padding: 20px 16px;

        border-top: 1px solid rgba(0, 0, 0, .1);
        background: #fff;
    }
}
@media screen and (max-width: 767px)
{
    .accordion-trigger::after
    {
        position: absolute;
        top: 28px;
        right: 16px;

        width: 8px;
        height: 8px;

        content: '';
        transform: rotate(-135deg);

        border-top: 2px solid #666;
        border-left: 2px solid #666;
    }
}
@media screen and (max-width: 767px)
{
    .accordion-trigger.is-active::after
    {
        top: 32px;

        transform: rotate(45deg);
    }
}

@media screen and (max-width: 767px)
{
    .accordion-content
    {
        background-color: #f7f7f7;
    }
}

#breadcrumb
{
    font-weight: 500;

    margin: 24px 0 0;
    padding: 0;
}
@media screen and (max-width: 767px)
{
    #breadcrumb
    {
        overflow-x: scroll;
        overflow-x: scroll !important;

        width: 100%;
        margin-bottom: 0;
    }
}
#breadcrumb ul
{
    display: flex;

    align-items: center;
    gap: 24px;
}
@media screen and (max-width: 767px)
{
    #breadcrumb ul
    {
        width: -moz-fit-content;
        width: fit-content;
        min-width: 100%;
    }
}
#breadcrumb ul li
{
    position: relative;

    color: #333;
}
@media screen and (max-width: 767px)
{
    #breadcrumb ul li
    {
        white-space: nowrap;
    }
}
#breadcrumb ul li a
{
    color: #666;
}
#breadcrumb ul li::after
{
    position: absolute;
    top: -2px;
    right: -16px;
    bottom: 0;

    display: block;

    content: '>';
}
#breadcrumb ul li:last-child::after
{
    content: '';
}

.paging.top
{
    font-size: 14px;
}
.paging.top span
{
    font-size: 18px;
    font-weight: 600;

    color: #333;
}
.paging.bottom
{
    font-size: 16px;

    display: flex !important;

    margin-top: 80px;

    align-items: center;
    justify-content: center;
    gap: 24px;
}
@media screen and (max-width: 767px)
{
    .paging.bottom
    {
        margin-top: 64px;
    }
}
.paging__item
{
    color: #666;
    background: none;
}
.paging__item--active
{
    font-weight: 700;

    pointer-events: none;

    color: #333;
}

@media screen and (max-width: 767px)
{
    .sp-scroll
    {
        overflow-x: scroll;

        width: calc(100vw);
    }
}
@media screen and (max-width: 767px)
{
    .sp-scroll > *
    {
        width: -moz-fit-content;
        width: fit-content;
    }
}
@media screen and (max-width: 767px)
{
    .sp-scroll .list
    {
        padding-bottom: 8px;

        flex-wrap: nowrap;
    }
}
@media screen and (max-width: 767px)
{
    .sp-scroll .list-product
    {
        flex-wrap: nowrap;
    }
}
@media screen and (max-width: 767px)
{
    .sp-scroll .list-product__item
    {
        width: 90vw;
        min-width: 160px;
    }
}
@media screen and (max-width: 767px) and (max-width: 767px)
{
    .sp-scroll .list-product__item:first-child
    {
        margin-left: 4.0712468193vw;
    }
}
@media screen and (max-width: 767px) and (max-width: 767px)
{
    .sp-scroll .list-product__item:last-child
    {
        margin-right: 4.0712468193vw;
    }
}

@media screen and (max-width: 767px)
{
    .page-product-list__recommend .sp-scroll .list-product__item,
    .page-product-list__connection .sp-scroll .list-product__item,
    .history .sp-scroll .list-product__item
    {
        width: 30vw;
        min-width: 160px;
    }
}

.card__link
{
    display: inline-block;
}
.card__img
{
    position: relative;

    margin-bottom: 12px;

    text-align: center;

    border-radius: 5px;
}
@media screen and (max-width: 767px)
{
    .card__img
    {
        margin-bottom: 8px;
    }
}
.card__img img
{
    max-width: 100%;
}
.card__tit
{
    font-size: 16px;
    font-weight: bold;

    margin-bottom: 8px;
}
.card__txt
{
    margin-bottom: 16px;
}
.card__price
{
    font-family: 'Inter', 'Zen Kaku Gothic New', 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 20px;
    font-weight: 500;

    margin-bottom: 16px;
}
@media screen and (max-width: 767px)
{
    .card__price
    {
        font-size: 18px;
    }
}
.card__price.sale
{
    color: #d52626;
}
.card__price__tax
{
    font-size: 12px;
    font-weight: normal;

    color: #333;
}
.card__iconNew
{
    position: absolute;
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;

    width: 48px;
    height: 48px;

    background: url(../../../../Contents/ProductImages/ProductIcon1.svg);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: cover;
}
.card__bottom
{
    display: flex;

    flex-wrap: wrap;
    gap: 8px;
}
.card__bottom img
{
    width: auto;
    height: 23px;
}
.card__wrap__img .new
{
    position: absolute;
    z-index: 2;

    width: 48px;
    height: 48px;

    pointer-events: none;
}

.card__img .new
{
    position: absolute;
    z-index: 2;

    width: 48px;
    height: 48px;

    pointer-events: none;
}

.card__price--red
{
    color: #c35c51;
}

.card__wrap__img
{
    position: relative;
}

.iconSoldOut
{
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;

    display: inline-block;

    width: 100%;
    height: 100%;

    pointer-events: none;

    background: url(../../../../Contents/ProductImages/iconSoldOut.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: cover;
}

.list-product__img
{
    position: relative;
}

.orderWrap select
{
    border: 1px solid #ccc;
}

.header
{
    font-weight: 400;

    position: static;

    border-bottom: 1px solid rgba(0, 0, 0, .1);
}

.header-wrap
{
    font-size: 12px;

    display: flex;

    max-width: 1280px;
    padding: 12px 40px 16px 40px;

    justify-content: space-between;
}
@media screen and (max-width: 767px)
{
    .header-wrap
    {
        width: 100vw;
        max-width: 750px;
        padding: 14px;
    }
}

.top-news
{
    font-weight: 400;

    min-width: 1280px;
    height: 34px;

    background-color: #dae2e3;
}
@media screen and (max-width: 767px)
{
    .top-news
    {
        min-width: 100%;
    }
}

.top-news__body
{
    margin-right: auto;
    margin-left: auto;
}
@media screen and (max-width: 767px)
{
    .top-news__body
    {
        width: 100vw;
        max-width: 750px;
    }
}

.top-news__list
{
    height: 34px;
}
@media screen and (max-width: 767px)
{
    .top-news__list
    {
        padding: 0;
    }
}

.top-news__list li
{
    height: 34px;
    margin-right: auto;
    margin-left: auto;
}
.top-news__contents
{
    display: flex;

    height: inherit;

    text-align: center;

    align-items: center;
    justify-content: center;
}
@media screen and (max-width: 767px)
{
    .top-news__contents
    {
        padding: 0 10px;
    }
}

.top-news__contents time
{
    display: block;

    min-width: 70px;
}
@media screen and (max-width: 767px)
{
    .top-news__contents time
    {
        font-size: rem(14);
    }
}

.top-news__contents p
{
    display: inline-block;
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}
@media screen and (max-width: 767px)
{
    .top-news__contents p
    {
        font-size: rem(14);
    }
}

.header-top
{
    display: flex;

    max-width: 650px;

    justify-content: space-between;
    align-items: flex-end;
}
.header-top__logo
{
    width: 230px;
    margin-right: 16px;
}
.header-top__user
{
    font-size: 12px;
}
.header-top__point
{
    font-size: 16px;
    font-weight: 700;
}

.header-right
{
    display: flex;

    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    gap: 8px;
}

.header-nav
{
    font-weight: 500;

    display: flex;

    padding-bottom: 4px;
}

.header-menu
{
    position: relative;

    display: flex;
    flex-direction: column;

    padding: 0 12px;

    cursor: pointer;

    align-items: center;
}
.header-menu img
{
    width: 40px;
}

.header-utility
{
    line-height: 1.3;

    display: flex;
    flex-direction: column;

    align-items: center;
    gap: 8px;
}
.header-utility__list
{
    display: flex;

    align-items: center;
    gap: 8px;
}
.header-utility__item
{
    position: relative;
}
.header-utility__item img
{
    width: 32px;
}
.header-utility__item a
{
    display: flex;

    align-items: center;
}
.header-utility__item .header-cart-num
{
    font-size: 11px;
    font-weight: 700;
    line-height: 1.3;

    position: absolute;
    top: -1px;
    left: 20px;

    width: 16px;
    height: 16px;

    text-align: center;
    letter-spacing: 0;

    color: #fff;
    border-radius: 50%;
    background: #d52626;
}
.header-utility__item .header-utility__tel-txt
{
    padding-left: 20px;

    background-image: url(../../../../Contents/ImagesPkg/common/icon_tel.png);
    background-repeat: no-repeat;
    background-position: center left;
    background-size: 16px;
}
.header-utility__tel a
{
    display: inline-block;
}
.header-utility .search-box
{
    position: relative;
}
.header-utility .search-box__input input
{
    width: 500px;
    max-width: 100%;
    margin: 0;
    padding: 9px 40px 8px 16px;

    border: none;
    border: 1px solid #333;
    border-radius: 4rem;
}
.header-utility .search-box__btn
{
    position: absolute;
    top: 50%;
    right: 8px;

    transform: translateY(-50%);
}
.header-utility .search-box__btn img
{
    width: 32px;
}

.hamburger-menu
{
    position: relative;

    width: 32px;
    height: 32px;
}
.hamburger-menu .menu-trigger
{
    position: relative;

    display: flex;
    flex-direction: column;

    cursor: pointer;

    align-items: center;
    gap: 5px;
}
.hamburger-menu .menu-trigger span
{
    display: block;

    width: 25px;
    height: 2px;

    background-color: #333;
}
.hamburger-menu .menu-trigger span:first-child
{
    top: 0;

    margin-bottom: 1px;
}
.hamburger-menu .menu-trigger span:last-child
{
    bottom: 0;
}
.hamburger-menu .menu-trigger span:nth-child(2)
{
    top: 50%;

    transform: translateY(-50%);
}
.hamburger-menu .menu-trigger p
{
    margin-top: 1px;
}
.hamburger-menu .menu-trigger.active span:nth-child(1)
{
    margin-bottom: 0;

    transform: rotate(45deg) translate(5px, 5px);
}
.hamburger-menu .menu-trigger.active span:nth-child(2)
{
    opacity: 0;
    /* 中央線を非表示 */
}
.hamburger-menu .menu-trigger.active span:nth-child(3)
{
    transform: rotate(-45deg) translate(5px, -5px);
}
.hamburger-menu .menu-trigger.active p
{
    margin-top: 2px;
}
.hamburger-menu .menu-content
{
    position: fixed;
    z-index: 10;
    top: 0;
    right: 0;

    width: 250px;
    height: 100%;
    padding-top: 100px;

    transition: all .5s;
    transform: translate(250px);

    background-color: #f7f7f7;
    box-shadow: none !important;
}
.hamburger-menu .menu-content.open
{
    transform: translateZ(0);
}
.hamburger-menu .menu-close
{
    position: relative;
    position: fixed;
    z-index: 10;
    top: 24px;
    right: 24px;

    display: none;

    width: 32px;
    height: 32px;

    cursor: pointer;
    transition: all .5s;
}
.hamburger-menu .menu-close.open
{
    display: block;
}
.hamburger-menu .menu-close::before
{
    position: absolute;
    top: 16px;
    left: 2px;

    display: inline-block;

    width: 24px;
    height: 2px;

    content: '';
    transform: rotate(45deg);

    background-color: #666;
}
.hamburger-menu .menu-close::after
{
    position: absolute;
    top: 16px;
    left: 2px;

    display: inline-block;

    width: 24px;
    height: 2px;

    content: '';
    transform: rotate(-45deg);

    background-color: #666;
}

@media screen and (max-width: 767px)
{
    .header
    {
        position: fixed;
        z-index: 9;

        padding: 0;

        background-color: #fff;
    }
    .header nav
    {
        width: 100%;
    }
    .header .header-nav
    {
        display: flex;

        padding-bottom: 0;

        justify-content: flex-end;
        gap: 0 18px;
        align-items: center;
    }
    .header .header-menu
    {
        font-size: 12px;
        line-height: 1.2;

        padding: 0;

        text-align: center;
    }
    .header .header-menu img
    {
        width: 33px;
    }
    .header .header-menu::before
    {
        content: none;
    }
    .header .header-menu.active::after
    {
        bottom: -9px;
    }
    .header .header__tel
    {
        line-height: 1.4;

        margin: 40px 0;
        padding: 0 4.0712468193vw;
    }
    .header .header__tel a:hover
    {
        opacity: 1;
        color: #333;
    }
}
@media screen and (max-width: 767px) and (max-width: 767px)
{
    .header .header__tel a
    {
        font-size: 20px;
        font-weight: bold;

        display: flex;

        width: 100%;
        margin: 0 auto;
        padding: 12px;

        text-align: center;

        border: 1px solid;
        border-radius: 2rem;
        background-position: center left;
        background-size: 30px;

        align-items: center;
        justify-content: center;
    }
}
@media screen and (max-width: 767px)
{
    .header .header__tel--icon
    {
        padding-left: 20px;

        background-image: url(../../../../Contents/ImagesPkg/common/icon_tel.png);
        background-repeat: no-repeat;
        background-position: 0 7px;
        background-size: 16px;
    }
}
@media screen and (max-width: 767px) and (max-width: 767px)
{
    .header .header__tel--icon
    {
        padding: 0 8px 0 38px;

        background-position: 0 60%;
        background-size: 30px;
    }
}
@media screen and (max-width: 767px)
{
    .header .header__time
    {
        margin-bottom: 16px;
    }
}
@media screen and (max-width: 767px) and (max-width: 767px)
{
    .header .header__time
    {
        font-size: 14px;
        font-weight: normal;

        margin-top: 3px;
        margin-bottom: 0;

        text-align: center;
    }
}
@media screen and (max-width: 767px)
{
    .header .header__sns ul
    {
        display: flex;

        gap: 24px;
        justify-content: center;
    }
    .header .header__sns ul img
    {
        width: 22px;
    }
    .header .header__sns p
    {
        font-family: 'Inter', 'Zen Kaku Gothic New', 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
        font-size: 16px;
        font-weight: bold;

        margin-bottom: 16px;

        text-align: center;
    }
}
@media screen and (max-width: 767px)
{
    .header-top
    {
        margin-bottom: 0;

        align-items: center;
    }
    .header-top__user
    {
        display: none;
    }
    .header-top__logo
    {
        display: flex;

        width: 80%;
        height: 24px;

        align-items: center;
    }
}
@media screen and (max-width: 767px)
{
    .search-box
    {
        position: relative;

        width: 100%;
        padding: 8px 4.0712468193vw;
    }
    .search-box__input input
    {
        width: 100%;
        max-width: none;
        padding: 7px 40px 7px 16px;

        border: none;
        background: #f1f1f1;
    }
    .search-box__btn
    {
        position: absolute;
        top: 22px;
        right: 6.106870229vw;
    }
    .search-box__btn img
    {
        width: 32px;
    }
}
@media screen and (max-width: 767px)
{
    .header-bottom nav
    {
        display: none;
    }
}
@media screen and (max-width: 767px)
{
    .header-utility
    {
        margin-right: 3.0534351145vw;
    }
    .header-utility__list
    {
        gap: 0;
    }
    .header-utility__item:not(:first-child)
    {
        margin-left: 8px;
    }
    .header-utility__item img
    {
        width: 24px;
    }
    .header-utility__item .header-cart-num
    {
        font-size: 10px;
        line-height: 1.3;

        width: 14px;
        height: 14px;
    }
}
@media screen and (max-width: 767px)
{
    .hamburger-menu
    {
        width: 100%;
        max-width: 100px;
        margin-left: 4.0712468193vw;
    }
}
@media screen and (max-width: 767px) and (max-width: 767px)
{
    .hamburger-menu
    {
        margin-left: 0;
    }
}
@media screen and (max-width: 767px)
{
    .hamburger-menu .menu-content
    {
        right: auto;
        left: 0;

        width: 85%;
        margin-top: 110px;
        padding: 0;

        transform: translate(-100vw);
    }
    .hamburger-menu .menu-content__list
    {
        margin-top: 24px;

        background: #fff;
    }
    .hamburger-menu .menu-content__item
    {
        padding: 0;

        border-bottom: 1px solid rgba(0, 0, 0, .1);
    }
    .hamburger-menu .menu-content__item a
    {
        display: inline-block;

        padding: 14px 6.106870229vw !important;
    }
    .hamburger-menu .menu-content .btn-wrap
    {
        margin: 0;
        padding: 6.106870229vw;
    }
    .hamburger-menu .menu-content .btn-wrap .btn
    {
        font-size: 14px;

        width: 100%;
        min-width: auto;
        margin: 0;
        padding: 13px 0;
    }
    .hamburger-menu .menu-content .nav-accordion__main
    {
        font-size: 16px;
        font-weight: bold;

        position: relative;

        margin: 0 6.106870229vw 0;
        padding: 16px 0;

        border-bottom: 1px solid #f5f5f5;
    }
    .hamburger-menu .menu-content .nav-accordion__main::after
    {
        position: absolute;
        top: 35%;
        right: 16px;

        width: 6px;
        height: 6px;
        margin: auto 0;

        content: '';
        transform: rotate(135deg);

        border-top: 2px solid #666;
        border-right: 2px solid #666;
    }
    .hamburger-menu .menu-content .nav-accordion__main.js-open::after
    {
        transform: rotate(-45deg);
    }
    .hamburger-menu .menu-content .nav-accordion__contents
    {
        font-size: 16px;
        font-weight: bold;

        padding: 0 6.106870229vw;
    }
    .hamburger-menu .menu-content .nav-accordion__contents .nav-accordion__list
    {
        line-height: 2;

        margin-top: 0;
        padding: 13px 6.106870229vw;

        background: none;
        background-color: #f5f5f5;
    }
    .hamburger-menu .menu-content a::before
    {
        content: none;
    }
}
@media screen and (max-width: 767px)
{
    .hamburger-menu .menu-close
    {
        right: 16px;
    }
    .hamburger-menu .menu-close::before
    {
        background-color: #000;
    }
    .hamburger-menu .menu-close::after
    {
        background-color: #000;
    }
}
@media screen and (max-width: 767px)
{
    .hamburger-menu .menu-content
    {
        overflow: scroll;

        width: 100%;
        padding: 0;

        background: #fff;
        box-shadow: none !important;
    }
}
@media screen and (max-width: 767px)
{
    .hamburger-menu .menu-content .sp-nav
    {
        position: relative;

        padding: 24px 0 0;
    }
}
@media screen and (max-width: 767px)
{
    .hamburger-menu .menu-content .sp-nav.u-mobile.visible
    {
        right: 0;

        height: -moz-fit-content;

        height: fit-content;
    }
}
@media screen and (max-width: 767px)
{
    .sp-header
    {
        margin-top: 8px;
    }
}
@media screen and (max-width: 767px)
{
    .sp-header__inner
    {
        position: relative;

        padding: 0 1.5rem 16px;
    }
}
@media screen and (max-width: 767px)
{
    .sp-header__inner::after
    {
        position: absolute;
        bottom: 0;
        left: 0;

        width: 100vw;
        height: 1px;

        content: '';

        background-color: #86b99b;
    }
}
@media screen and (max-width: 767px)
{
    .sp-header__top
    {
        display: flex;

        align-items: center;
        justify-content: space-between;
    }

    .menu-content ul li
    {
        padding: 0;
    }

    .header-cart-num
    {
        font-size: 11px;
        font-weight: 700;
        line-height: 1.3;

        position: absolute;
        top: -1px;
        left: 20px;

        width: 16px;
        height: 16px;

        text-align: center;
        letter-spacing: 0;

        color: #fff;
        border-radius: 50%;
        background: #d52626;
    }
}
.sp-header__logout
{
    display: flex;

    margin-top: 16px;

    gap: 20px;
}

#Foot
{
    padding: 0;

    background: #fff;
}

.footer
{
    min-width: 1280px;
    margin-top: 80px;
    padding: 120px 40px 24px 40px;

    background-image: url(../../../../Contents/ImagesPkg/common/f_top.svg);
    background-repeat: no-repeat;
    background-size: contain;
}
@media screen and (max-width: 767px)
{
    .footer
    {
        min-width: 100%;
        padding: 100px 8.1424936387vw 60px;

        background-position: 20% 0;
        background-size: auto;
    }
}
.footer__wrap
{
    display: flex;
    flex-direction: row-reverse;

    max-width: 1200px;
    margin: 0 auto;
    margin-bottom: 24px;

    justify-content: space-between;
    flex-wrap: wrap;
    gap: 40px 24px;
}
@media screen and (max-width: 767px)
{
    .footer__wrap
    {
        display: block;
    }
}
.footer__nav-wrap
{
    display: flex;

    margin-top: 40px;

    gap: 24px;
}
@media screen and (max-width: 767px)
{
    .footer__nav-wrap
    {
        flex-direction: column;

        gap: 16px;
    }
}
.footer__nav
{
    font-size: 13px;

    width: 180px;
    min-width: 140px;

    flex: 1;
}
@media screen and (max-width: 767px)
{
    .footer__nav
    {
        display: flex;

        flex-wrap: wrap;
        gap: 16px 32px;
    }
}
@media screen and (min-width: 768px)
{
    .footer__nav li
    {
        margin-bottom: 12px;
    }
}
@media screen and (max-width: 767px)
{
    .footer__nav li
    {
        width: calc(50% - 16px);
    }
}
.footer__nav-tit
{
    font-size: 16px;
    font-weight: bold;

    margin-bottom: 1rem;
    padding-bottom: 1rem;

    border-bottom: 1px solid #eee;
}
.footer__logo
{
    margin-bottom: 40px;
}
@media screen and (max-width: 767px)
{
    .footer__logo img
    {
        display: block;

        margin: 0 auto;
    }
}
.footer__sns
{
    display: flex;

    margin-bottom: 32px;

    gap: 24px;
}
.footer__tit
{
    font-size: 16px;
    font-weight: bold;

    margin-bottom: 16px;
}
@media screen and (max-width: 767px)
{
    .footer__tit
    {
        text-align: center;
    }
}
.footer__tel
{
    line-height: 1.4;
}
.footer__tel a:hover
{
    opacity: 1;
    color: #333;
}
@media screen and (max-width: 767px)
{
    .footer__tel a
    {
        font-size: 20px;
        font-weight: bold;

        display: flex;

        width: 100%;
        margin: 0 auto;
        padding: 12px;

        text-align: center;

        border: 1px solid;
        border-radius: 2rem;
        background-position: center left;
        background-size: 30px;

        align-items: center;
        justify-content: center;
    }
}
.footer__tel--icon
{
    padding-left: 24px;

    background-image: url(../../../../Contents/ImagesPkg/common/icon_tel.png);
    background-repeat: no-repeat;
    background-position: 0 5px;
    background-size: 21px;
}
@media screen and (max-width: 767px)
{
    .footer__tel--icon
    {
        padding: 0 8px 0 38px;

        background-position: 0 60%;
        background-size: 30px;
    }
}
.footer__address
{
    margin-bottom: 16px;
}
@media screen and (max-width: 767px)
{
    .footer__address
    {
        font-size: 14px;
        font-weight: 400;

        text-align: center;

        color: #333;
    }
}
.footer__time
{
    margin-bottom: 16px;
}
@media screen and (max-width: 767px)
{
    .footer__time
    {
        font-size: 14px;
        font-weight: normal;

        margin-top: 3px;
        margin-bottom: 0;

        text-align: center;
    }
}
@media screen and (max-width: 767px)
{
    .footer__address-wrap
    {
        margin-bottom: 48px;
    }
}
.footer__copy
{
    font-size: 11px;

    margin-top: 32px;
}
@media screen and (max-width: 767px)
{
    .footer__copy
    {
        margin-top: 40px;

        text-align: center;
    }
}
.footer .footer-bottom
{
    display: flex;

    max-width: 1200px;
    margin: 0 auto;

    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
}
@media screen and (max-width: 767px)
{
    .footer .footer-bottom
    {
        justify-content: center;
    }
}
.footer .footer-bottom__sns ul
{
    display: flex;

    gap: 24px;
}
.footer .footer-bottom__sns ul img
{
    width: 22px;
}
.footer .footer-bottom__sns p
{
    font-family: 'Inter', 'Zen Kaku Gothic New', 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 16px;
    font-weight: bold;

    margin-bottom: 8px;
}
@media screen and (max-width: 767px)
{
    .footer .footer-bottom__sns p
    {
        text-align: center;
    }
}

#Wrap
{
    width: 100%;
}
@media screen and (min-width: 768px)
{
    #Wrap
    {
        margin-top: 0 !important;
    }
}

#Contents
{
    margin-bottom: 0;
}
@media screen and (max-width: 767px)
{
    #Contents
    {
        padding-top: 1px;
    }
}

.top-row
{
    width: 100%;
    min-width: 100vw;
    margin-top: 24px;
}
@media screen and (max-width: 767px)
{
    .top-row
    {
        margin-top: 0;
    }
}
.top-row .slider-dots
{
    margin-top: 40px;
}
.top-row__list
{
    gap: 24px;
}
.top-row__item
{
    width: 587px;
    height: auto;
    margin-right: 24px;
}
@media screen and (max-width: 767px)
{
    .top-row__item
    {
        width: 100vw !important;
        margin-right: 0;
    }
}
.top-row__item:last-child
{
    margin-right: 0;
}
.top-row__item figure img
{
    width: 100%;
    height: auto;

    -o-object-fit: cover;

       object-fit: cover;
}

.top-recommended
{
    margin-top: 40px;
}
@media screen and (max-width: 767px)
{
    .top-recommended .section-inner
    {
        width: 100vw;
        margin: 0 calc(50% - 50vw);
        padding: 0;
    }
}
@media screen and (max-width: 767px)
{
    .top-recommended .section-inner .heading-wrap
    {
        padding-right: 4.0712468193vw;
        padding-left: 4.0712468193vw;
    }
}
.top-recommended__title
{
    margin-bottom: 32px;
}
@media screen and (max-width: 767px)
{
    .top-recommended__list
    {
        display: flex;

        flex-wrap: nowrap;
        gap: 24px 4.0712468193vw;
    }
}
.top-recommended__item
{
    width: 282px;
    height: auto;
    margin-right: 24px;
}
@media screen and (max-width: 767px)
{
    .top-recommended__item
    {
        min-width: 160px;
        margin-right: 0;
    }
}
@media screen and (max-width: 767px)
{
    .top-recommended__item:first-child
    {
        margin-left: 4.0712468193vw;
    }
}
@media screen and (max-width: 767px)
{
    .top-recommended__item:last-child
    {
        margin-right: 4.0712468193vw;
    }
}
.top-recommended .slider-dots
{
    margin-top: 32px;
}
@media screen and (max-width: 767px)
{
    .top-recommended__inner
    {
        width: 100vw;
        margin: 0 calc(50% - 50vw);
    }
}

.top-ranking
{
    margin-top: 40px;
}
@media screen and (max-width: 767px)
{
    .top-ranking
    {
        padding-top: 40px;
    }
}
@media screen and (max-width: 767px)
{
    .top-ranking .section-inner
    {
        width: 100vw;
        margin: 0 calc(50% - 50vw);
        padding: 0;
    }
}
@media screen and (max-width: 767px)
{
    .top-ranking .section-inner .heading-wrap
    {
        padding-right: 4.0712468193vw;
        padding-left: 4.0712468193vw;
    }
}
@media screen and (max-width: 767px)
{
    .top-ranking__inner
    {
        width: 100vw;
        margin: 0 calc(50% - 50vw);
    }
}
.top-ranking__list
{
    display: flex;

    gap: 32px 24px;
}
@media screen and (min-width: 768px)
{
    .top-ranking__list
    {
        width: 1210px;
    }
}
@media screen and (max-width: 767px)
{
    .top-ranking__list
    {
        gap: 24px 4.0712468193vw;
        flex-wrap: nowrap;
    }
}
.top-ranking__item
{
    position: relative;

    width: 282px;
    height: auto;
    margin-right: 24px;
    padding-top: 10px;
}
@media screen and (max-width: 767px)
{
    .top-ranking__item
    {
        height: auto;
        margin-right: 0;
    }
}
@media screen and (max-width: 767px)
{
    .top-ranking__item:first-child
    {
        margin-left: 4.0712468193vw;
    }
}
@media screen and (max-width: 767px)
{
    .top-ranking__item:last-child
    {
        margin-right: 4.0712468193vw;
    }
}
.top-ranking__item .card__img::after
{
    font-family: 'Inter', 'Zen Kaku Gothic New', 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 40px;

    position: absolute;
    top: -10px;
    right: -10px;

    width: 40px;
    height: 40px;
    margin: 0 0 0 0;

    text-align: center;

    color: #fff;
    border-radius: 50%;
    background: #a0a0a0;
}
@media screen and (max-width: 767px)
{
    .top-ranking__item .card__img::after
    {
        font-size: 15px;

        top: -10px;
        right: -10px;
        bottom: 0;

        width: 40px;
        height: 40px;
    }
}
.top-ranking__item:nth-child(1) .card__img::after
{
    content: '1';

    background-color: #ebc451;
}
.top-ranking__item:nth-child(2) .card__img::after
{
    content: '2';

    background-color: #bbd0d9;
}
.top-ranking__item:nth-child(3) .card__img::after
{
    content: '3';

    background-color: #b08d79;
}
.top-ranking__item:nth-child(4) .card__img::after
{
    content: '4';
}
.top-ranking__item:nth-child(5) .card__img::after
{
    content: '5';
}
.top-ranking__item:nth-child(6) .card__img::after
{
    content: '6';
}

.slider-prev,
.slider-next
{
    position: absolute;
    z-index: 1;
    top: 25%;

    width: 32px;
    height: 32px;

    content: '';

    background-image: url(../../../../Contents/ProductImages/arrow.svg);
}

.slick-prev,
.slick-next
{
    display: block;

    width: 32px;
    height: 32px;
    /* 不要なボーダーを削除 */

    cursor: pointer;

    border: none;
    /* デフォルトで表示 */
    background-image: url(../../../../Contents/ProductImages/arrow.svg);
    background-position: center;
    background-size: cover;
}

.slider-prev
{
    left: -19px;
    /*戻る矢印の位置と形状*/
}
@media screen and (max-width: 767px)
{
    .slider-prev
    {
        left: 0;
    }
}

.slider-next
{
    right: -19px;
    /*次へ矢印の位置と形状*/

    transform: rotate(-180deg);
}
@media screen and (max-width: 767px)
{
    .slider-next
    {
        right: 0;
    }
}

/* 非ループスライダー用（特定クラスに対して非表示設定を適用） */
.js-slider3 .slider-prev:disabled,
.js-slider3 .slider-next:disabled
{
    display: none;
    /* 非表示に設定 */
}

.js-slider3 .slider-next
{
    right: -9px;
    /*戻る矢印の位置と形状*/
}
@media screen and (max-width: 767px)
{
    .js-slider3 .slider-next
    {
        left: 0;
    }
}

.js-slider3 .slider-prev,
.js-slider3 .slider-next
{
    top: 30%;
}

/* ループスライダー用（常に表示） */
.js-slider2 .slider-prev,
.js-slider2 .slider-next
{
    display: block !important;
    /* 常に表示 */
}

.product-overview
{
    position: relative;
}
@media screen and (max-width: 767px)
{
    .product-overview
    {
        padding-top: 80px;
    }
}
.product-overview__image
{
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;

    width: 40%;
    min-width: 600px;
    margin: auto 0;
}
@media screen and (max-width: 767px)
{
    .product-overview__image
    {
        position: relative;

        width: 100%;
        min-width: 100%;
    }
}
.product-overview__image img
{
    width: auto;
    height: 100%;

    border-radius: 0 10px 10px 0;

    -o-object-fit: cover;

       object-fit: cover;
}
@media screen and (max-width: 767px)
{
    .product-overview__image img
    {
        height: auto;

        border-radius: 0 0 0 0;
    }
}
.product-overview__wrap
{
    width: 50%;
    margin: 0 0 0 auto;
    margin-top: 80px;
    padding: 170px 0;
}
@media screen and (max-width: 767px)
{
    .product-overview__wrap
    {
        width: 100%;
        margin-top: 0;
        padding: 48px 0 48px;
    }
}
.product-overview__tit
{
    font-size: 28px;
    font-weight: 400;

    margin-bottom: 48px;

    text-align: center;
}
@media screen and (max-width: 767px)
{
    .product-overview__tit
    {
        font-size: 24px;

        margin-bottom: 40px;

        text-align: left;
    }
}
.product-overview__txt
{
    font-size: 18px;
    line-height: 2.2;

    margin-bottom: 40px;

    text-align: center;
    letter-spacing: .1rem;
}
@media screen and (max-width: 767px)
{
    .product-overview__txt
    {
        font-size: 16px;

        text-align: left;
        letter-spacing: .05rem;
    }
}

.top-product-list
{
    min-width: 1280px;
    margin: 56px auto;
}
@media screen and (max-width: 767px)
{
    .top-product-list
    {
        min-width: 100%;
        margin: 0 0 80px;
    }
}
@media screen and (max-width: 767px)
{
    .top-product-list .section-inner
    {
        padding: 0;
    }
}
.top-product-list__items
{
    max-width: 1280px;
    padding: 56px 100px;

    border-radius: 2rem;
    background-color: #cdd9e1;
}
@media screen and (max-width: 767px)
{
    .top-product-list__items
    {
        padding: 80px 6.106870229vw;
    }
}
.top-product-list__item
{
    display: flex;

    padding: 0 0 32px 0;

    flex-wrap: wrap;
    gap: 32px 24px;
    align-items: center;
}
@media screen and (max-width: 767px)
{
    .top-product-list__item
    {
        flex-direction: column-reverse;

        padding: 0 0 80px 0;

        gap: 64px 0;
    }
}
.top-product-list__item:nth-child(odd)
{
    flex-direction: row-reverse;
}
@media screen and (max-width: 767px)
{
    .top-product-list__item:nth-child(odd)
    {
        flex-direction: column-reverse;
    }
}
.top-product-list__item:last-child
{
    padding: 0;
}
.top-product-list__image
{
    width: calc(50% - 12px);
}
@media screen and (max-width: 767px)
{
    .top-product-list__image
    {
        width: 100%;
    }
}
.top-product-list__content
{
    width: calc(50% - 12px);
}
@media screen and (max-width: 767px)
{
    .top-product-list__content
    {
        width: 100%;
    }
}
.top-product-list__subtit
{
    font-size: 18px;
}
.top-product-list__tit
{
    font-size: 22px;
    font-weight: 500;

    margin-bottom: 24px;
    padding-bottom: 24px;

    border-bottom: 1px solid;
}
.top-product-list__txt
{
    font-size: 16px;
}
@media screen and (max-width: 767px)
{
    .top-product-list .btn-wrap
    {
        margin: 32px auto 0;

        text-align: center;
    }
}
@media screen and (max-width: 767px)
{
    .top-product-list .btn-wrap .btn
    {
        margin: auto;
    }
}

.top-info
{
    margin-bottom: 40px;
}
.top-info__list
{
    display: flex;

    flex-wrap: wrap;
    gap: 32px 24px;
}
.top-info__item
{
    display: flex;
    flex-direction: column;

    width: calc((100% - 24px * 2) / 3);

    border-right: 1px solid #eee;

    align-items: center;
}
@media screen and (max-width: 767px)
{
    .top-info__item
    {
        width: 100%;

        border-right: none;
        border-bottom: 1px solid #eee;
    }
}
.top-info__item:last-child
{
    border-right: none;
}
@media screen and (max-width: 767px)
{
    .top-info__item:last-child
    {
        border: none;
    }
}
.top-info__item img
{
    max-width: 96px;
}
.top-info__tit
{
    font-size: 18px;
    font-weight: 400;

    margin-bottom: 16px;
}
.top-info__txt
{
    margin-bottom: 0;

    text-align: center;
}
@media screen and (max-width: 767px)
{
    .top-info .btn-wrap
    {
        margin: 16px 0 40px;
    }
}

.top-contents
{
    min-width: 1280px;
    padding: 80px 0;

    background-image: url(../../../../Contents/ImagesPkg/top/bg_info.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
@media screen and (max-width: 767px)
{
    .top-contents
    {
        min-width: 100%;
    }
}
.top-contents .heading-wrap
{
    display: block;
}
.top-contents .heading
{
    font-size: 24px;

    text-align: center;

    color: #fff;
}
@media screen and (max-width: 767px)
{
    .top-contents .heading
    {
        font-size: 18px;

        margin-bottom: 48px;
    }
}
.top-contents__item
{
    display: flex;
    flex-direction: column;

    padding: 24px;

    border-radius: 1rem;
    background-color: #fff;

    align-items: center;
}
@media screen and (max-width: 767px)
{
    .top-contents__item
    {
        width: 100%;
    }
}
.top-contents__item img
{
    max-width: 90px;
}
.top-contents__tit
{
    font-size: 20px;
    font-weight: bold;

    margin: auto 0;

    color: #12475c;
}
.top-contents__tit img
{
    padding-bottom: 16px;
}
.top-contents__tel
{
    font-family: 'Inter', 'Zen Kaku Gothic New', 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 18px;
}

.news
{
    margin: 80px 0;
}
.news__item
{
    display: flex;

    gap: 8px;
}
.news .news__title
{
    font-size: 16px;
}
.news .news__list
{
    width: 752px;
    margin-right: 0;
    margin-left: auto;
}
@media screen and (max-width: 767px)
{
    .news .news__list
    {
        width: 100%;
    }
}
.news .article__body
{
    padding: 24px 0;

    border-bottom: 1px solid #eee;
}
.news .article__contents
{
    display: flex;

    gap: 8px;
}
@media screen and (max-width: 767px)
{
    .news .article__contents
    {
        flex-direction: column;

        align-items: flex-start;
    }
}
@media screen and (min-width: 768px)
{
    .news .article__contents .timeArea
    {
        line-height: 2;

        width: 10%;
    }
    .news .article__contents .textArea
    {
        width: 90%;
    }
}

@media screen and (max-width: 767px)
{
    .page-product-list
    {
        padding-top: 1px;
    }
}
.page-product-list .search-section .form__row
{
    display: flex;

    flex-wrap: wrap;
    gap: 40px 24px;
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .form__row
    {
        gap: 16px;
    }
}
.page-product-list .search-section .form__row--col3 > *
{
    width: calc((100% - 24px * 2) / 3);
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .form__row--col3 > *
    {
        width: 100%;
    }
}
.page-product-list .search-section .accordion
{
    margin: 0 0 40px 0;

    border-radius: 5px;
    background-color: rgba(108, 127, 134, .1);
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .accordion
    {
        margin: 0 0 24px 0;
    }
}
.page-product-list .search-section label
{
    line-height: 2;

    cursor: pointer;
}
.page-product-list .search-section .accordion__toggle
{
    margin: 0;
    padding: 0;
}
.page-product-list .search-section .accordion__header
{
    font-size: 18px;
    font-weight: bold;

    position: relative;

    display: flex !important;

    padding: 24px;

    cursor: pointer;
    transition: background-color .3s ease;

    border-radius: 5px;

    align-items: center;
    gap: 8px;
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .accordion__header
    {
        font-size: 16px;

        padding: 16px;
    }
}
.page-product-list .search-section .accordion__header::before,
.page-product-list .search-section .accordion__header::after
{
    position: absolute;
    top: 50%;
    right: 24px;

    width: 20px;
    height: 1px;

    content: '';
    transition: transform .3s ease;
    transform: translateY(-50%);

    background-color: #333;
}
.page-product-list .search-section .accordion__header::before
{
    transform: translateY(-50%) rotate(90deg);
}
.page-product-list .search-section .accordion__header.open::before
{
    transform: translateY(-50%) rotate(0deg);
}
.page-product-list .search-section .accordion__body
{
    overflow: hidden;

    max-height: 0;

    transition: max-height .3s ease-out;
}
.page-product-list .search-section .accordion__body.active
{
    visibility: visible;

    transform: translateY(0);

    opacity: 1;
}
.page-product-list .search-section .accordion__body.open
{
    max-height: 500px;

    border-top: 1px solid #ddd;
}
.page-product-list .search-section .accordion__body input[type=text],
.page-product-list .search-section .accordion__body select
{
    width: 100%;
    margin: 0 0;
    padding: 8px 16px;

    border: 1px solid #ccc;
    border-radius: 5px;
}
.page-product-list .search-section .radio-group,
.page-product-list .search-section .checkbox-group
{
    margin-bottom: 24px;
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .radio-group,
    .page-product-list .search-section .checkbox-group
    {
        width: 100%;
    }
}
.page-product-list .search-section .radio-group label
{
    margin: 0 24px 0 0;
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .radio-group label
    {
        margin: 0;
    }
}
.page-product-list .search-section .accordion__group
{
    padding: 24px 24px 0 24px;
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .accordion__group
    {
        padding: 16px 16px 0 16px;
    }
}
.page-product-list .search-section .accordion__group .form__field
{
    display: flex;
    flex-direction: column;

    flex-wrap: wrap;
}
.page-product-list .search-section .accordion__group .form__field .horizon
{
    display: flex;

    gap: 8px;
    flex-wrap: wrap;
}
.page-product-list .search-section .accordion__group .form__field .horizon li
{
    padding-right: 8px;
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .accordion__group .form__field .horizon li
    {
        width: 48%;
    }
}
.page-product-list .search-section .accordion__group .form__box
{
    display: flex;
    flex-direction: row-reverse;

    justify-content: flex-end;
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .accordion__group .form__box
    {
        flex-direction: column;
    }
}
.page-product-list .search-section .accordion__group .form__box .form__field
{
    width: 40%;
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .accordion__group .form__box .form__field
    {
        width: 100%;
    }
}
.page-product-list .search-section .accordion__group .radio-group
{
    display: flex;

    flex-wrap: wrap;
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .accordion__group .radio-group
    {
        display: flex;
        flex-direction: row;

        margin-bottom: 16px;

        gap: 8px;
        flex-wrap: wrap;
    }
}
.page-product-list .search-section .accordion__group .radio-group li
{
    width: 25%;
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .accordion__group .radio-group li
    {
        width: 48%;
    }
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-section .accordion__group .radio-group label
    {
        width: calc(100% / 2 - 8px);
    }
}
.page-product-list .search-section .form__label
{
    font-weight: 500;
}
.page-product-list .search-section input
{
    vertical-align: bottom;
}
.page-product-list .search-section input[type=radio],
.page-product-list .search-section input[type=checkbox]
{
    margin-top: -1px;
    margin-right: 8px;
}
.page-product-list .search-section .form__actions
{
    display: flex;

    margin-top: 40px;
    padding: 24px 0;

    border-top: 1px solid #d9d9d9;

    justify-content: center;
}
.page-product-list .search-section .button--primary
{
    font-size: 16px;
    font-weight: 500;

    display: inline-block;

    min-width: 280px;
    padding: 10px 20px;

    text-align: center;
    text-decoration: none;

    border: 1px solid;
    border-radius: 5px;
    background-color: #fff;
}
.page-product-list .search-section .button--primary:hover
{
    opacity: 1;
    color: #fff;
    border-color: #09689d;
    background-color: #09689d;
}
.page-product-list .search-section input[type=checkbox]
{
    position: relative;

    width: 20px;
    height: 20px;

    border: 1px solid #09689d;
    border-radius: 2px;

    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}
.page-product-list .search-section input[type=checkbox]:checked:before
{
    position: absolute;
    top: 1px;
    left: 5px;

    width: 6px;
    height: 10px;

    content: '';
    transform: rotate(50deg);

    border-right: 2px solid #09689d;
    border-bottom: 2px solid #09689d;
}
.page-product-list .search-section input[type=radio]
{
    position: relative;

    width: 24px;
    height: 24px;

    border: 1px solid #09689d;
    border-radius: 20px;

    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}
.page-product-list .search-section input[type=radio]:checked:before
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    width: 14px;
    height: 14px;
    margin: auto;

    content: '';
    transform: rotate(50deg);

    border-radius: 10px;
    background: #09689d;
}
.page-product-list .paging__item
{
    line-height: 26px;

    width: 30px;
    height: 30px;

    text-align: center;

    color: #666 !important;
    border: 1px solid #d9d9d9;
    border-radius: 3rem;
}
.page-product-list .paging__item--active
{
    line-height: 26px;

    width: 30px;
    height: 30px;

    text-align: center;

    color: #fff !important;
    border: 1px solid #09689d;
    border-radius: 3rem;
    background-color: #09689d;
}
.page-product-list .tabs
{
    display: flex;

    flex-wrap: wrap;
}
@media screen and (max-width: 767px)
{
    .page-product-list .tabs
    {
        margin-top: 8px;

        gap: 8px;
    }
}
.page-product-list .tab
{
    margin: 0 16px 0 0;

    cursor: pointer;

    color: #09689d;
    border: 1px solid #09689d;
    border-radius: 2rem;
    background-color: #fff;
}
.page-product-list .tab a
{
    padding: 2px 16px;
}
@media screen and (max-width: 767px)
{
    .page-product-list .tab
    {
        margin: 0 8px 0 0;
    }
}
.page-product-list .tab.active
{
    color: #fff;
    background-color: #09689d;
}
.page-product-list .tab-content
{
    display: none;

    border-top: none;
}
@media screen and (max-width: 767px)
{
    .page-product-list .tab-content
    {
        padding: 0;
    }
}
.page-product-list .tab-content.active
{
    display: block;
}
.page-product-list .search-list
{
    display: flex;

    margin-bottom: 40px;

    justify-content: space-between;
    align-items: center;
}
@media screen and (max-width: 767px)
{
    .page-product-list .search-list
    {
        flex-direction: column;

        align-items: flex-start;
    }
}

.page-product-list__connection
{
    margin: 40px auto;
}
@media screen and (max-width: 767px)
{
    .page-product-list__connection
    {
        margin: 40px 0 0;
        padding-top: 0;
        padding-bottom: 40px;
    }
}
.page-product-list__connection .section-inner
{
    position: relative;
}
@media screen and (max-width: 767px)
{
    .page-product-list__connection .section-inner
    {
        width: 100vw;
        margin: 0 calc(50% - 50vw);
        padding: 0;
    }
}
.page-product-list__connection .section-inner .heading-wrap
{
    margin-bottom: 40px;
}
@media screen and (max-width: 767px)
{
    .page-product-list__connection .section-inner .heading-wrap
    {
        margin-bottom: 24px;
        padding-right: 4.0712468193vw;
        padding-left: 4.0712468193vw;
    }
}
.page-product-list__connection .section-inner::after
{
    position: absolute;
    bottom: -40px;
    left: 50%;
    /* 要素の中央基準 */

    width: 1200px;
    /* border-bottom の長さを1200px に */
    height: 0;

    content: '';
    /* 太さと色を指定 */
    transform: translateX(-50%);

    border-bottom: 1px solid #d9d9d9;
    /* 中央に配置 */
}
@media screen and (max-width: 767px)
{
    .page-product-list__connection .section-inner::after
    {
        width: 100%;
    }
}
.page-product-list__recommend
{
    margin: 40px auto;
    padding: 40px 0;
}
@media screen and (max-width: 767px)
{
    .page-product-list__recommend
    {
        margin: 40px 0 0 0;
        padding-top: 0;
        padding-bottom: 40px;
    }
}
.page-product-list__recommend .section-inner
{
    position: relative;
}
@media screen and (max-width: 767px)
{
    .page-product-list__recommend .section-inner
    {
        width: 100vw;
        margin: 0 calc(50% - 50vw);
        padding: 0;
    }
}
.page-product-list__recommend .section-inner .heading-wrap
{
    margin-bottom: 40px;
}
@media screen and (max-width: 767px)
{
    .page-product-list__recommend .section-inner .heading-wrap
    {
        margin-bottom: 24px;
        padding-right: 4.0712468193vw;
        padding-left: 4.0712468193vw;
    }
}
.page-product-list__recommend .section-inner::after
{
    position: absolute;
    bottom: -40px;
    left: 50%;
    /* 要素の中央基準 */

    width: 1200px;
    /* border-bottom の長さを1200px に */
    height: 0;

    content: '';
    /* 太さと色を指定 */
    transform: translateX(-50%);

    border-bottom: 1px solid #d9d9d9;
    /* 中央に配置 */
}
@media screen and (max-width: 767px)
{
    .page-product-list__recommend .section-inner::after
    {
        width: 100%;
    }
}
.page-product-list .content-wrap
{
    display: flex;
}
@media screen and (max-width: 767px)
{
    .page-product-list .content-wrap
    {
        margin-top: 0;
    }
}
.page-product-list .productWrap
{
    margin: 0;
    padding: 0;

    flex: 1;
}
.page-product-list .list-product
{
    display: flex;

    flex-wrap: wrap;
    gap: 32px 24px;
}
@media screen and (max-width: 767px)
{
    .page-product-list .list-product
    {
        gap: 40px 2.0356234097vw;
    }
}
.page-product-list .list-product--col4 > *
{
    width: calc((100% - 24px * 3) / 4);
}
@media screen and (max-width: 767px)
{
    .page-product-list .list-product--col4 > *
    {
        width: calc(50% - vw(16));
    }
}

.history
{
    margin: 40px 0 80px;
}
@media screen and (max-width: 767px)
{
    .history .section-inner
    {
        width: 100vw;
        margin: 0 calc(50% - 50vw);
        padding: 0;
    }
}
.history .section-inner .heading-wrap
{
    margin-bottom: 40px;
}
@media screen and (max-width: 767px)
{
    .history .section-inner .heading-wrap
    {
        margin-bottom: 24px;
        padding-right: 4.0712468193vw;
        padding-left: 4.0712468193vw;
    }
}

.productCart-primary,
.productCart-secondary
{
    border-radius: 8px;
    background-color: #f3f5f5;
}

.productCart__item
{
    display: flex;

    padding: 16px 24px !important;

    justify-content: space-between;
}
@media screen and (max-width: 767px)
{
    .productCart__item
    {
        flex-direction: column;

        padding: 0 !important;
    }
}

.addCart p
{
    padding: 0;
}
@media screen and (max-width: 767px)
{
    .addCart p
    {
        padding: 16px;
    }
}

@media screen and (max-width: 767px)
{
    .addCart
    {
        flex-basis: 55%;
    }
}

.productCart-primary__label
{
    font-size: 16px;
    font-weight: bold;

    color: #09689d;
    border-bottom: 1px solid #d9d9d9;
}
@media screen and (min-width: 768px)
{
    .productCart-primary__price
    {
        padding: 0 24px 0 0 !important;
    }
}
.productCart-primary__price .sprice
{
    font-family: 'Inter', 'Zen Kaku Gothic New', 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 32px;
    font-weight: bold;

    color: #333;
}
.productCart-primary__price .tax
{
    font-size: 12px;
    font-weight: normal;

    padding-left: 8px;
}
.productCart-primary .productCart__item
{
    padding: 16px 24px;

    justify-content: space-between;
}
.productCart-primary .btnCart a
{
    font-weight: 500;

    width: 280px;
    padding: 15px;

    text-align: center;

    background-color: #09689d !important;
}
@media screen and (max-width: 767px)
{
    .productCart-primary .btnCart a
    {
        margin: -8px 0 16px 0;
    }
}

.productCart-secondary__label
{
    font-size: 16px;
    font-weight: bold;

    margin-right: auto !important;
    padding: 0 0 0 0 !important;

    color: #09689d;
}
@media screen and (max-width: 767px)
{
    .productCart-secondary__label
    {
        padding: 16px 0 16px 16px !important;

        border-bottom: 1px solid #d9d9d9;

        flex-basis: 100%;
    }
}
.productCart-secondary__price
{
    font-family: 'Inter', 'Zen Kaku Gothic New', 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 24px;
    font-weight: bold;

    margin: 0 24px 0 auto !important;
    padding: 0 !important;
}
@media screen and (max-width: 767px)
{
    .productCart-secondary__price
    {
        padding: 0 0 0 16px !important;

        flex-basis: 45%;
    }
}
.productCart-secondary__price--sale
{
    font-family: 'Inter', 'Zen Kaku Gothic New', 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 24px;
    font-weight: bold;

    margin: 0 0 0 auto !important;
    padding: 0 !important;

    color: #d52626;
}
@media screen and (max-width: 767px)
{
    .productCart-secondary__price--sale
    {
        font-size: 5.5979643766vw;

        display: inline-block;
    }
}
.productCart-secondary__price--normal
{
    font-size: 16px;

    text-decoration: line-through;
}
.productCart-secondary__price .tax
{
    font-size: 12px;
    font-weight: normal;
}
.productCart-secondary__price .btnCart
{
    padding: 0;
}
.productCart-secondary__sale
{
    font-size: 120%;

    color: red;
}
.productCart-secondary .btnCart a
{
    font-size: 13px;
    font-weight: 500;

    width: 180px;
    padding: 16px;

    text-align: center;

    background-color: #09689d !important;
}
@media screen and (max-width: 767px)
{
    .productCart-secondary .btnCart a
    {
        width: 100%;
    }
}
@media screen and (max-width: 767px)
{
    .productCart-secondary .btnCart
    {
        flex-basis: 55%;
    }
}
.productCart-secondary .productCart__item
{
    display: flex;
    flex-direction: row;

    flex-wrap: nowrap;
    justify-content: space-between;
}
@media screen and (max-width: 767px)
{
    .productCart-secondary .productCart__item
    {
        flex-wrap: wrap;
    }
}

@media screen and (max-width: 767px)
{
    .productCart-price--special .productCart-secondary__price
    {
        display: flex;
        flex-direction: column;
    }
}

.productCart__item
{
    display: flex;

    align-items: center;
    justify-content: space-around;
}

#detailOne .productSellInfo p
{
    margin: 0;
}

.wrapDetailImage
{
    margin-top: 24px;
}
.wrapDetailImage .mainImage
{
    display: flex;

    gap: 12px;
}
.wrapDetailImage .mainImage a
{
    max-width: 64px;
}

.btnListContact
{
    font-weight: 400;

    display: flex;

    margin: 24px 0;

    gap: 0 24px;
}
.btnListContact li:last-child
{
    margin-left: auto;
}
@media screen and (max-width: 767px)
{
    .btnListContact li:last-child
    {
        display: flex;

        margin-top: 24px;
        padding: 16px 0 0 0;

        border-top: 1px solid #d9d9d9;

        flex-basis: 100%;
        justify-content: flex-end;
    }
}
@media screen and (max-width: 767px)
{
    .btnListContact
    {
        flex-direction: row;

        flex-wrap: wrap;
        justify-content: space-between;
    }
}
.btnListContact img
{
    width: 24px;
    margin-right: 8px;
}

.detail
{
    padding: 1px 0 1px;

    background-color: #f3f5f5;
}
@media screen and (max-width: 767px)
{
    .detail
    {
        padding: 0 0 1px;
    }
}
@media screen and (max-width: 767px)
{
    .detail__wrap
    {
        margin-bottom: 40px;
    }
}
@media screen and (max-width: 767px)
{
    .detail .section-inner
    {
        padding: 0;
    }
}
.detail .detail__wrap
{
    width: 792px;
    min-width: 792px;
    margin: 0 auto 80px;
}
@media screen and (max-width: 767px)
{
    .detail .detail__wrap
    {
        font-weight: 400;

        width: 100%;
        min-width: 100%;
        max-width: 100%;
        margin: 0 auto 64px;
        padding-right: 0;
        padding-left: 0;
    }
}
.detail__tit
{
    font-size: 28px;
    font-weight: 500;

    margin-bottom: 40px;

    text-align: center;
}
.detail__block
{
    background-color: #fff;
}
.detail__block-tit
{
    font-weight: bold;

    padding: 16px;

    color: #09689d;
}
.detail__block-subtit
{
    font-size: 20px;
    font-weight: 500;

    margin-bottom: 24px;

    color: #12475c;
}
.detail__block-txt
{
    line-height: 1.8;
}

.detail__block-content img
{
    display: block;

    margin: 0 auto 40px;
}

.detail__block
{
    overflow: hidden;

    margin-bottom: 24px;

    border-radius: 5px;
}

.detail__block-tit
{
    font-size: 16px;
    font-weight: bold;

    position: relative;

    padding: 24px;

    cursor: pointer;

    border-radius: 5px;
}
@media screen and (max-width: 767px)
{
    .detail__block-tit
    {
        padding: 16px;
    }
}

.detail__block-tit::before,
.detail__block-tit::after
{
    position: absolute;
    top: 50%;
    right: 24px;

    width: 20px;
    height: 1px;

    content: '';
    transition: transform .3s ease;
    transform: translateY(-50%);

    background-color: #09689d;
}

.detail__block-tit::before
{
    transform: translateY(-50%) rotate(90deg);
}

.detail__block.open .detail__block-tit::before
{
    transform: translateY(-50%) rotate(0deg);
}

.detail__block-content
{
    display: none;

    padding: 40px;

    border-top: 1px solid #d9d9d9;
    background-color: #fff;
}
@media screen and (max-width: 767px)
{
    .detail__block-content
    {
        padding: 40px 24px 24px;
    }
}

.detail__block.open .detail__block-content
{
    display: block;
}

.review
{
    position: relative;

    width: 792px;
    min-width: 792px;
    margin: auto;
    padding: 0 0 80px 0;
}
@media screen and (max-width: 767px)
{
    .review
    {
        font-weight: 400;

        width: 100%;
        min-width: 100%;
        max-width: 100%;
        padding: 64px 0;
        padding-right: 0;
        padding-left: 0;
    }
}
.review__tit
{
    font-size: 28px;
    font-weight: bold;

    margin-bottom: 40px;

    text-align: center;
}
@media screen and (max-width: 767px)
{
    .review__tit
    {
        font-size: 24px;
    }
}
.review__block
{
    margin-bottom: 24px;
    padding: 24px;

    border-radius: 1rem;
    background-color: #fff;
}
@media screen and (max-width: 767px)
{
    .review__block
    {
        margin-bottom: 16px;
    }
}
.review__item
{
    display: flex;

    gap: 16px;
}
.review__item .star
{
    width: 78px;

    color: #09689d;
}
.review__item .star img
{
    vertical-align: middle;
}
.review__subtit
{
    font-size: 16px;
    font-weight: bold;

    margin: 16px 0 16px;

    color: #09689d;
}
.review__btn
{
    font-weight: 500;

    display: flex;

    margin-top: 40px;

    justify-content: center;
}
.review__btn a
{
    display: block;

    width: 261px;
    padding: 16px 16px;

    text-align: center;

    color: #09689d;
    border: 1px solid #09689d;
    border-radius: 8px;
    background-color: #fff;
}
@media screen and (max-width: 767px)
{
    .review__btn a
    {
        font-size: 14px;
    }
}

.detailText
{
    position: relative;

    padding-top: 80px;
    padding-bottom: 1px;
}
@media screen and (max-width: 767px)
{
    .detailText
    {
        margin-bottom: 0;
        padding-top: 80px;
    }
}
.detailText::after
{
    position: absolute;
    bottom: 0;
    left: 50%;
    /* 要素の中央基準 */

    width: 1200px;
    /* border-bottom の長さを1200px に */
    height: 0;

    content: '';
    /* 太さと色を指定 */
    transform: translateX(-50%);

    border-top: 1px solid #d9d9d9;
    /* 中央に配置 */
}
@media screen and (max-width: 767px)
{
    .detailText::after
    {
        width: 100%;
    }
}

.sub-list
{
    margin-top: 37px;
    margin-bottom: 36px;
}

@media screen and (max-width: 767px)
{
    .sub-list
    {
        margin: 32px 0;
    }
}
.sub-list__top
{
    display: flex;

    width: 1200px;

    align-items: center;
    justify-content: space-between;
}

@media screen and (max-width: 767px)
{
    .sub-list__top
    {
        width: 100%;

        flex-wrap: wrap;
    }
}
.sub-list__top > p
{
    font-size: 14px;
    font-weight: 500;
}

.sub-list__top .search_wrap
{
    margin: 0;
}

.sub-list__input.input-select
{
    width: auto;
}

/* ページャ */
#pagination
{
    clear: both;

    margin: 0;
}
@media screen and (max-width: 767px)
{
    #pagination.paging.top
    {
        margin-bottom: 24px;
    }
}
#pagination.paging.bottom
{
    padding: 80px 0;

    gap: 16px;
}
#pagination .pagelinks a
{
    line-height: 20px;

    width: 30px;
    height: 30px;

    text-align: center;

    color: #666 !important;
    border: 1px solid #d9d9d9;
    border-radius: 3rem;
}
#pagination .pagelinks b
{
    line-height: 20px;

    width: 30px;
    height: 30px;

    text-align: center;

    color: #fff !important;
    border: 1px solid #09689d;
    border-radius: 3rem;
    background-color: #09689d;
}

/* ページャ　ページ上部 */
.sub-list__top #pagination.above .pagelinks
{
    display: none;
}

/* ページャ　ページ下部 */
.listProduct #pagination.below .pageL1
{
    display: none;
}

/* ページャ　デフォルトスタイル打ち消し */
.sub-list__top .pagelinks a,
.listProduct .pagelinks a
{
    font-size: 14px;
    font-weight: 400;

    width: auto;

    background: none;
}

.listProduct .pagenation__page.next
{
    transform: rotate(180deg);
}

.listProduct .pagenation__page a
{
    margin: 0 24px;

    border: 0 !important;
    background-image: url(../../../../Contents/ImagesPkg/common/arrow_page.svg);
    background-repeat: no-repeat;
    background-position: center;
}

.listProduct .pagelinks
{
    align-items: center;
}

@media screen and (max-width: 767px)
{
    .listProduct .pagelinks
    {
        gap: 10px;
    }
}
.listProduct .pagelinks b
{
    width: auto;
    padding: 4px 12px;

    background-color: #09689d;
}

.pagelinks
{
    gap: 16px;
}

#pagination .displayContentText span
{
    font-size: 18px;
    font-weight: 600;

    color: #333;
}

.newsAll .article__contents
{
    align-items: flex-start;
}
.newsAll .article__contents .textArea .news-body
{
    font-size: 16px;
    line-height: 1.8;

    display: block;

    margin-top: 8px;
}
.newsAll .article__contents .news__title
{
    font-size: 18px;

    pointer-events: none;
}

.top-contents-news .news-body
{
    display: none;
}
.top-contents-news .news .article__contents
{
    align-items: center;
}
.top-contents-news .article-list__item:nth-child(n+6)
{
    display: none;
}

.static
{
    font-size: 16px;
}
.static.inner--narrow
{
    width: 1280px;
    min-width: 1280px;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 40px;
    padding-left: 40px;
}
@media screen and (max-width: 767px)
{
    .static.inner--narrow
    {
        width: 100%;
        min-width: 100%;
        padding-right: 4.0712468193vw;
        padding-left: 4.0712468193vw;
    }
}
.static .static__page-title
{
    font-size: 32px;
    font-weight: 400;

    margin: 40px 0;
}
.static .static__heading--m
{
    font-size: 22px;

    margin: 64px 0 16px;
}
.static .static__heading--s
{
    font-size: 16px;

    margin: 16px 0 8px;
}
.static .static__small
{
    font-size: .8rem;
}
.static table
{
    width: 100%;
    margin: 24px 0 40px;

    border-collapse: collapse;

    border-top: 1px solid rgba(0, 0, 0, .2);
    border-left: 1px solid rgba(0, 0, 0, .2);
}
.static table th,
.static table td
{
    padding: 12px 12px;

    border-right: 1px solid rgba(0, 0, 0, .2);
    border-bottom: 1px solid rgba(0, 0, 0, .2);
}
.static table th
{
    background-color: #f7f7f7;
}
.static-member .static__heading--s
{
    padding: .5rem 1rem;

    background-color: #f3f5f5;
}
.static-member .static__text-box
{
    margin: 2rem 0;
    padding: 2rem;

    background: #f3f5f5;
}
.static-member .static__text-box p
{
    margin: 0 0 1rem 0;
}
.static-member .subBox
{
    margin-top: 1rem;
}
.static-member .entryTypeBox
{
    display: flex;

    margin: 30px 0 40px;
    padding: 0;

    list-style: none;

    gap: 16px;
}
@media screen and (max-width: 767px)
{
    .static-member .entryTypeBox
    {
        flex-direction: column;
    }
}
.static-member .entryTypeBox li
{
    display: flex;

    width: calc(33.33% - 8px);
}
@media screen and (max-width: 767px)
{
    .static-member .entryTypeBox li
    {
        width: 100%;
    }
}
.static-member .entryTypeBox li:last-child
{
    margin-right: 0;
}
.static-member .entryTypeBox .entryTypeBox__item
{
    display: flex;

    min-height: 80px;
    padding: 12px 15px;

    text-decoration: none;

    color: #09689d;
    border: 1px solid #09689d;
    border-radius: 5px;
    background: #fff;

    flex: 1;
    align-items: center;
    gap: 16px;
}
.static-member .entryTypeBox li a:hover
{
    transition: .3s;

    box-shadow: 0 0 10px rgba(0, 0, 0, .2);
}
.static-member .entryTypeBox li .material-icons
{
    width: 3rem;
}
@media screen and (max-width: 767px)
{
    .static-member .entryTypeBox li .material-icons
    {
        width: 2rem;
    }
}
.static-member .entryTypeBox li em
{
    font-size: 18px;
    line-height: 1.5;

    display: inline-block;

    vertical-align: middle;
}
.static-member .entryTypeBox.__secondary .entryTypeBox__item
{
    display: block;
}
.static-member .entryTypeBox__small
{
    font-size: 14px;

    color: #000;
}
.static-member .entryTypeBox__content
{
    display: flex;

    align-items: center;
    gap: 16px;
}
.static-member .benefitBox
{
    padding: 1rem 0;
}
.static-member .benefitBox.benefitBox1
{
    padding: 0 0 1rem 0;
}
.static-member .benefitBox h4
{
    display: flex;
    flex-direction: row;

    margin: 1rem 0 1rem 0;

    background: #f3f5f5;

    align-items: center;
}
.static-member .benefitBox h4 .number
{
    padding: 1rem;

    color: #fff;
    background-color: #09689d;
}
.static-member .benefitBox h4 .title
{
    margin-left: .5rem;
}
.static-member .memberAboutView .text
{
    margin-bottom: 1rem;
}
.static-member .col2
{
    display: flex;

    gap: 16px;
}
@media screen and (max-width: 767px)
{
    .static-member .col2
    {
        flex-direction: column;
    }
}
.static-member .updateBox
{
    width: calc(50% - 8px);
    padding: 15px 15px 10px;

    border: 1px solid #ccc;
    border-radius: 5px;
}
@media screen and (max-width: 767px)
{
    .static-member .updateBox
    {
        width: 100%;
    }
}
.static-member .updateBox:last-child
{
    margin-right: 0;
}
.static-member .updateBox dl
{
    margin: 0;
    padding: 0;
}
.static-member .updateBox dl dt
{
    font-size: 18px;

    width: 5em;
    margin: 0 auto 10px;

    text-align: center;

    color: #fff;
    border-radius: 1em;
    background: #09689d;
}
.static-member .updateBox dl dd
{
    font-size: 18px;

    text-align: center;
}
.static-member .updateBox .image
{
    line-height: 180px;

    padding: 0;

    text-align: center;
}
.static-member .updateBox .image img
{
    max-width: 300px;

    vertical-align: middle;
}
.static-member .aboutTermsView dl
{
    margin: 5px 0 20px;
}
.static-member .aboutTermsView dl dt
{
    font-size: 16px;

    color: #000;
}
.static-member .aboutTermsView dl dd
{
    font-size: 14px;

    color: #555;
}
.static-member .aboutTermsView dl dd ol
{
    margin: 0;
}
.static-member .aboutTermsView .termsBox
{
    padding: 1em;

    border: 1px solid #aaa;
}
.static-member .more .btn
{
    display: block;

    width: 261px;
    margin: 0 auto;
    padding: 16px 16px;

    text-align: center;

    color: #09689d;
    border: 1px solid #09689d;
    border-radius: 8px;
    background-color: #fff;
}
.static-member .backnumber
{
    display: flex;
    flex-direction: row;

    gap: 16px;
    flex-wrap: wrap;
}
.static-member .backnumber li
{
    width: calc(25% - 12px);
    margin-bottom: 25px;
    padding-bottom: 5px;

    border: 1px solid #ccc;
}
@media screen and (max-width: 767px)
{
    .static-member .backnumber li
    {
        width: calc(50% - 8px);
    }
}
.static-member .aboutEntryView .benefitListBox:after
{
    display: block;
    clear: both;

    content: '';
}
.static-member .benefitListBox
{
    display: flex;

    gap: 16px;
    flex-wrap: wrap;
}
.static-member .aboutEntryView .benefitListBox dl
{
    overflow: hidden;

    width: calc(50% - 8px);
    margin: 0;
    padding: 0;

    border: 1px solid #ccc;
    border-radius: 5px;
}
@media screen and (max-width: 767px)
{
    .static-member .aboutEntryView .benefitListBox dl
    {
        width: 100%;
    }
}
.static-member .aboutEntryView .benefitListBox dl:nth-child(2n)
{
    margin-right: 0;
}
.static-member .aboutEntryView .benefitListBox dl dt
{
    font-size: 20px;
    font-weight: bold;
    line-height: 2;

    margin-bottom: 10px;
    padding: 15px 0 0 15px;

    vertical-align: middle;

    color: #09689d;
}
@media screen and (max-width: 767px)
{
    .static-member .aboutEntryView .benefitListBox dl dt
    {
        line-height: 1.5;
    }
}
.static-member .aboutEntryView .benefitListBox dl dt span
{
    font-size: 28px;
    line-height: 36px;

    display: inline-block;

    width: 40px;
    margin-right: 5px;
    padding-bottom: 4px;

    text-align: center;

    color: #fff;
    border-radius: 50%;
    background: #09689d;
}
.static-member .aboutEntryView .benefitListBox dl dd
{
    text-align: center;
}
.static-member .aboutEntryView .fullButton
{
    margin: 5px 0 10px;
}

.static-migration .password-reset-step .step-title
{
    font-size: 18px;

    margin-bottom: .5rem;

    color: #09689d;
}
.static-migration .password-reset-step .step-content
{
    display: flex;

    margin-bottom: 2em;

    flex-wrap: wrap;
    gap: 16px;
}
@media screen and (min-width: 768px)
{
    .static-migration .password-reset-step .step-content
    {
        align-items: center;
    }
}
@media screen and (max-width: 767px)
{
    .static-migration .password-reset-step .step-content
    {
        flex-direction: column;
    }
}
.static-migration .password-reset-step .step-btn
{
    display: flex;

    margin: 24px auto;

    justify-content: center;
}
.static-migration .password-reset-step .step-btn a
{
    text-align: center;
}
.static-migration .password-reset-step .step-image
{
    max-width: calc(60% - 8px);

    flex: 0 0 calc(60% - 8px);
}
@media screen and (max-width: 767px)
{
    .static-migration .password-reset-step .step-image
    {
        max-width: 100%;

        flex: 0 0 100%;
    }
}
.static-migration .password-reset-step .step-image img
{
    width: 100%;
    max-width: 100%;
    height: auto;

    border: 1px solid #ddd;
}
.static-migration .password-reset-step .step-text
{
    max-width: calc(40% - 8px);

    flex: 0 0 calc(40% - 8px);
}
@media screen and (max-width: 767px)
{
    .static-migration .password-reset-step .step-text
    {
        max-width: 100%;

        flex: 0 0 100%;
    }
}

.dvUserInfo select
{
    width: auto;

    border: 1px solid #ccc;
}

.dvUserInquiryInput-contact__box
{
    line-height: 1.6;

    margin: 40px 0;
    padding: 40px;

    text-align: center;

    background: #f1f1f1;
}
.dvUserInquiryInput-contact__box li
{
    padding-bottom: 8px;

    list-style-type: disc;
}

.dvUserInfo input.mailAddr
{
    max-width: 600px;
}
@media screen and (max-width: 767px)
{
    .dvUserInfo input.mailAddr
    {
        width: 100%;
    }
}
.dvUserInfo textarea.inquirytext
{
    width: 600px;
    max-width: 600px;
}
@media screen and (max-width: 767px)
{
    .dvUserInfo textarea.inquirytext
    {
        width: 100%;
    }
}
.dvUserInfo input.nameFirst
{
    width: 300px;
}
@media screen and (max-width: 767px)
{
    .dvUserInfo input.nameFirst
    {
        width: 50%;
    }
}
.dvUserInfo input.nameLast
{
    width: 300px;
}
@media screen and (max-width: 767px)
{
    .dvUserInfo input.nameLast
    {
        width: 50%;
    }
}
.dvUserInfo select
{
    width: 90%;
    width: 600px;
    max-width: 600px;

    border: 1px solid #ccc;
}
@media screen and (max-width: 767px)
{
    .dvUserInfo select
    {
        width: 100%;
        max-width: 100%;
    }
}
.dvUserInfo .year
{
    width: auto;
}
.dvUserInfo .month
{
    width: auto;
}
.dvUserInfo .date
{
    width: auto;
}
.dvUserInfo .btn_add_sea .btn-mini
{
    border-radius: 3px;
    background-color: #f2f2f2;
}
.dvUserInfo input[type=radio]
{
    position: relative;

    width: 24px;
    height: 24px;

    border: 1px solid #ccc;
    border-radius: 20px;

    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}
.dvUserInfo input[type=radio]:checked:before
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    width: 14px;
    height: 14px;
    margin: auto;

    content: '';
    transform: rotate(50deg);

    border-radius: 10px;
    background: #333;
}
.dvUserInfo input[type=checkbox]
{
    position: relative;

    width: 20px;
    height: 20px;

    border: 1px solid #ccc;
    border-radius: 2px;

    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}
.dvUserInfo input[type=checkbox]:checked:before
{
    position: absolute;
    top: 1px;
    left: 5px;

    width: 6px;
    height: 10px;

    content: '';
    transform: rotate(50deg);

    border-right: 2px solid #333;
    border-bottom: 2px solid #333;
}

.btn_add_sea .btn-mini
{
    border-radius: 3px;
    background-color: #f2f2f2;
}

.couponBox #hgcCouponList
{
    width: 40% !important;
}
@media screen and (max-width: 767px)
{
    .couponBox #hgcCouponList
    {
        width: 90% !important;
    }
}
.couponBox #hgcCouponList div
{
    padding: 16px;
}
.couponBox #hgcCouponList tr
{
    border-bottom: 1px solid #ccc;
}
@media screen and (max-width: 767px)
{
    .couponBox #hgcCouponList tr
    {
        display: flex;
        flex-direction: column;

        padding-bottom: 20px;
    }
}
@media screen and (max-width: 767px)
{
    .couponBox #hgcCouponList td
    {
        width: 100%;
        margin: 0 auto;

        border-bottom: none !important;
    }
}
.couponBox #hgcCouponList td a
{
    font-size: 13px;
    line-height: 18px;

    margin-bottom: 0;
    padding: 8px 16px 8px;

    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;

    color: #fff !important;
    border-radius: 2px;
    background-color: #333 !important;
}

#CartList div.productList div.product
{
    width: 100%;
    padding: 20px 0;

    border-bottom: #ddd solid 1px;
}

.pointBox div.boxbtm dl,
.couponBox div.boxbtm dl
{
    padding: 16px 0;
}

.orderBox .list
{
    flex-direction: column;

    gap: 0;
}

.boxbtm select,
.boxbtm input[type=text]
{
    width: 100%;
    margin: 0 0 0 0;
}
.boxbtm .pointBox div.boxbtm dl,
.boxbtm .couponBox div.boxbtm dl
{
    padding: 16px 0;
}

.kiyaku h4
{
    padding-top: 16px;
}
.kiyaku p
{
    margin-bottom: 8px;
}
.kiyaku ol
{
    padding: 0 24px;

    list-style-type: decimal;
}
.kiyaku ol li
{
    padding: 8px 0;

    list-style-type: decimal;
}
.kiyaku li strong
{
    font-size: 110%;
    font-weight: bold;
}

#dvProductReviewArea
{
    margin: 80px 0 0 0;
}
@media screen and (max-width: 767px)
{
    #dvProductReviewArea
    {
        margin: 0 0 0 0;
    }
}

.wrapProductPrice
{
    margin: 0 0 80px;
}

.forgetPass
{
    font-size: 1.2em;
}
.forgetPass a
{
    text-decoration: underline;
}

#dvLogin h3.sTtl
{
    text-align: center;
}

.userList dt
{
    font-weight: bold;

    margin-top: 10px;
    padding: 0 0;

    color: #333;
}

.userList dd
{
    margin-bottom: 10px;
    padding: 0 0;
}

.review
{
    margin: 0 auto;
}
.review .btn
{
    width: 120px;
    margin-right: 8px;
    padding: 8px 8px;

    text-align: center;

    color: #09689d;
    border: 1px solid #09689d;
    border-radius: 8px;
    background-color: #fff;
}
.review .btn-inverse
{
    width: 173px;
    padding: 8px 8px;

    text-align: center;

    color: #fff;
    border: 1px solid #09689d;
    border-radius: 8px;
    background-color: #09689d !important;
    background-color: #fff;
}

.tblReviewInput
{
    margin: 0 auto;
}
@media screen and (max-width: 767px)
{
    .tblReviewInput
    {
        margin: 0 4%;
        padding: 0 4%;
    }
}

#dvProductReviewArea table th
{
    vertical-align: middle;
}
@media screen and (max-width: 767px)
{
    #dvProductReviewArea table th
    {
        display: block;

        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        margin: 0 0 0 0;
        padding: 0;

        text-align: left;
    }
    #dvProductReviewArea table th input[type=text]
    {
        width: 100%;
        max-width: 100%;
    }
}

@media screen and (max-width: 767px)
{
    #dvProductReviewArea table td
    {
        display: block;

        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        margin: 0 0 10px 0;
        padding: 0;
    }
    #dvProductReviewArea table td input[type=text]
    {
        width: 100%;
        max-width: 100%;
    }
}

.order-confirmation__box
{
    display: flex;

    flex-flow: column;
}

#dvUserMenu
{
    margin-top: 40px;
}

#dvUserBox #dvUserCreditCardInput table th,
#dvUserBox #dvUserCreditCardConfirm table th
{
    width: 200px;
}

.btn-mini-secondary
{
    font-size: 12px;

    padding: 4px 8px;

    border: 1px solid #ccc;
    border-radius: 3px;
    background-color: #f2f2f2;
}

.btnMini
{
    border-radius: 3px;
}

#dvUserBox #dvFavoriteList table tr
{
    gap: 20px;
}

.itemArea .itemImage
{
    gap: 20px;
}

.orderBox div.userProduct dt a img
{
    width: 100px !important;
}

.orderBox div.userProduct dt
{
    float: left;

    width: 100px !important;
    margin-right: 10px;
}

.pdg_topC
{
    display: flex;
    float: left;

    padding-top: 2px;

    flex-wrap: nowrap;
}
@media screen and (max-width: 767px)
{
    .pdg_topC .pdg_text-box
    {
        width: 60%;
    }
    .pdg_topC .btn_add_sea
    {
        width: 40%;
    }
}

.orderBox div.userProduct dd
{
    width: 100%;
}

.productCart-primary__price--syokai
{
    font-family: 'Inter', 'Zen Kaku Gothic New', 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;

    padding: 0 !important;
}
@media screen and (max-width: 767px)
{
    .productCart-primary__price--syokai
    {
        margin-bottom: -16px !important;
        padding-top: 8px !important;
    }
}
.productCart-primary__price--syokai span
{
    font-size: 120%;
    font-weight: bold;
    /* color: #333; */

    padding: 0 0 0 4px;
}

#dvErrorInfoBox #dvErrorInfo div.dvErrorContents
{
    line-height: 1.5;

    padding: 20px 10px;

    text-align: center;

    color: #d52626;
}

.btn--blue
{
    display: inline-block;

    min-width: 100px;
    margin-right: 8px;
    padding: 8px 8px;

    text-align: center;

    color: #fff;
    border: 1px solid #09689d;
    border-radius: 8px;
    background-color: #09689d;
}

.item_slider .swiper
{
    border: none;
}

#dvProductDetailArea #detailImage img
{
    width: 100%;

    border-radius: 5px;
}

div.singleProduct dl
{
    display: flex !important;

    padding: 10px 0;

    gap: 10px;
}

div.singleProduct dt a
{
    display: block;

    width: 96px;

    text-align: center;
}

@media screen and (min-width: 768px)
{
    .editwrap .order-payment__title
    {
        width: 140px !important;

        background: #fff !important;
    }
}

.order-box__detail dt
{
    width: 100% !important;
}

.receipt-title
{
    width: 240px;
    padding: 16px;

    text-align: left;

    border-bottom: 1px solid #ccc;
    background: #f8f8f8;
}
@media screen and (max-width: 767px)
{
    .receipt-title
    {
        width: 100%;
    }
}

.receipt-text
{
    padding: 16px;

    border-bottom: 1px solid #ccc;
}
@media screen and (max-width: 767px)
{
    .receipt-text
    {
        width: 100%;
    }
}

@media screen and (max-width: 767px)
{
    #dvUserBox select
    {
        width: auto !important;
        max-width: 100%;
    }
}
#dvCouponList
{
    /* モバイル用：カードデザイン */
}
@media screen and (max-width: 767px)
{
    #dvCouponList
    {
        position: relative !important;
        z-index: 2 !important;
        top: unset !important;
        left: unset !important;

        width: 92% !important;
        margin: 0 auto !important;
        margin: 120px auto 0 auto !important;

        text-align: center;

        border: 2px solid #aaa;
        background: #fff;
    }
}
#dvCouponList .coupon-container
{
    overflow-x: auto;
    overflow-y: auto;

    max-width: 100%;
    height: 400px;
    padding: 0 20px;
}
#dvCouponList .coupon-table thead
{
    display: block;

    margin-bottom: 10px;

    background-color: #ececec;
}
#dvCouponList .coupon-table
{
    width: 100%;

    border-collapse: collapse;
}
#dvCouponList .coupon-table th,
#dvCouponList .coupon-table td
{
    padding: 10px;

    text-align: center;
    white-space: nowrap;

    border-bottom: 1px solid #ccc;
}
#dvCouponList .coupon-table th
{
    background-color: #ececec;
}
#dvCouponList .coupon-table td
{
    background-color: #fff;
}
#dvCouponList .coupon-action a
{
    font-size: 14px;

    display: inline-block;

    padding: 6px 12px;

    text-decoration: none;

    color: #fff !important;
    border-radius: 4px;
    background-color: #000 !important;
}
@media (max-width: 768px)
{
    #dvCouponList
    {
        width: 90% !important;
        /* モバイル時に全幅表示 */
    }
    #dvCouponList .coupon-container
    {
        overflow: visible;

        height: auto;
    }
    #dvCouponList .coupon-table,
    #dvCouponList .coupon-table thead,
    #dvCouponList .coupon-table tbody,
    #dvCouponList .coupon-table th,
    #dvCouponList .coupon-table td,
    #dvCouponList .coupon-table tr
    {
        display: block;

        width: 100%;
    }
    #dvCouponList .coupon-table thead
    {
        display: none;
    }
    #dvCouponList .coupon-table tr
    {
        margin-bottom: 10px;
        padding: 10px;
    }
}
@media screen and (max-width: 768px) and (min-width: 768px)
{
    #dvCouponList .coupon-table tr
    {
        display: flex;
        flex-direction: row;

        align-items: center;
        gap: 1%;
    }
}
@media (max-width: 768px)
{
    #dvCouponList .coupon-table td
    {
        display: flex;

        margin-bottom: 10px;
        padding: 8px;

        text-align: left;

        border-bottom: none;

        justify-content: space-between;
    }
}
@media (max-width: 768px)
{
    #dvCouponList .coupon-table td::before
    {
        font-weight: bold;

        min-width: 120px;

        content: attr(data-label);

        flex: 1;
    }
}
@media (max-width: 768px)
{
    #dvCouponList .coupon-action
    {
        text-align: center;
    }
}

.mt-s
{
    margin-top: 8px;
}

.mt-m
{
    margin-top: 16px;
}

.mt-l
{
    margin-top: 24px;
}

.mb-s
{
    margin-bottom: 8px;
}

#dvUserBox #dvOrderHistoryDetail table td
{
    padding: 16px;
}

#dvUserBox #dvUserCreditCardList table td
{
    padding: 10px 0 20px;
}

.btn-mid
{
    width: 261px;
    padding: 16px 16px;

    text-align: center;

    color: #fff !important;
    border: 1px solid #09689d;
    border-radius: 8px;
    background-color: #09689d !important;
}

.dvFixedPurchaseDetail #dvCouponList
{
    width: 800px;
    padding: 0;
}
@media screen and (max-width: 767px)
{
    .dvFixedPurchaseDetail #dvCouponList
    {
        width: 90%;
        padding: 0;
    }
}
@media screen and (max-width: 767px)
{
    .dvFixedPurchaseDetail #dvCouponList .coupon-container
    {
        padding: 0 20px;
    }
}
.dvFixedPurchaseDetail #dvCouponList .coupon-container thead tr
{
    background-color: #ececec !important;
}
@media screen and (min-width: 768px)
{
    .dvFixedPurchaseDetail #dvCouponList .coupon-container tr
    {
        display: flex;

        align-items: center;
    }
}
@media screen and (max-width: 767px)
{
    .dvFixedPurchaseDetail #dvCouponList .coupon-container tr
    {
        padding: 0;
    }
}
.dvFixedPurchaseDetail #dvCouponList .coupon-container th
{
    width: 15% !important;
    padding: 8px;

    white-space: normal;

    background-color: #ececec !important;
}
@media screen and (max-width: 767px)
{
    .dvFixedPurchaseDetail #dvCouponList .coupon-container th
    {
        width: 100%;
    }
}
.dvFixedPurchaseDetail #dvCouponList .coupon-container td
{
    padding: 0 8px !important;

    text-align: left;
    white-space: normal;
}
@media screen and (min-width: 768px)
{
    .dvFixedPurchaseDetail #dvCouponList .coupon-container td
    {
        width: 15% !important;
    }
}
@media screen and (max-width: 767px)
{
    .dvFixedPurchaseDetail #dvCouponList .coupon-container td
    {
        width: 100%;
    }
}

.riyou_btn
{
    line-height: 18px;

    display: inline-block;

    margin: 0 10px;
    margin-bottom: 0;
    padding: 4px 10px 4px;

    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;

    color: #fff !important;
    border: 1px solid #ccc;
    border-color: rgba(0, 0, 0, .1) rgba(0, 0, 0, .1) rgba(0, 0, 0, .25);
    border-radius: 4px;
    background-color: #333 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .25);
}
.riyou_btn--secondary
{
    line-height: 34px;
    /* border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); */
    /* text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); */

    display: inline-block;

    height: 44px;
    margin-bottom: 0;
    padding: 4px 10px 4px;

    cursor: pointer;
    /* line-height: 18px; */
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;

    color: #fff !important;
    /* border: 1px solid #cccccc; */
    border-radius: 4px;
    background-color: #333 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
}

@media screen and (max-width: 767px)
{
    .Next_coupon_wrap select
    {
        width: 60% !important;
    }
}

.clearBtn
{
    margin: 0 0 0 8px;
    padding: 4px;

    border-radius: 3px;
    background-color: #f2f2f2;
}

.btnLight
{
    display: block;

    width: 200px;
    padding: 8px 10px;

    color: #000 !important;
    border-width: 1px;
    border-style: solid;
    border-color: #ccc;
    border-radius: 4px;
    background-color: #fff !important;
}

.dvFixedPurchaseShipping .btn,
.dvFixedPurchaseDetail .btn,
.dvOrderHistoryInfo .btn,
.dvOrderHistoryShipping .btn
{
    display: block;

    width: 200px;
    margin-top: 8px;
    padding: 8px 10px;

    color: #333 !important;
    border-width: 1px;
    border-style: solid;
    border-color: #ccc;
    border-radius: 4px;
    background-color: '#fff' !important;
}

.dvFixedPurchaseShipping .btn,
.dvFixedPurchaseDetail .btn,
.dvOrderHistoryInfo .btn,
.dvOrderHistoryShipping .btn
{
    margin-top: 8px;
}

@media screen and (max-width: 767px)
{
    .dvFixedPurchaseItem .dvFixedPurchaseItem-table
    {
        width: 100%;

        table-layout: fixed;
    }
}
.dvFixedPurchaseItem .dvFixedPurchaseItem-table .imgProductImage
{
    width: 80px !important;
}
.dvFixedPurchaseItem .dvFixedPurchaseItem-table .dvFixedPurchaseItem-box__img
{
    width: 80px !important;
}
@media screen and (max-width: 767px)
{
    .dvFixedPurchaseItem .dvFixedPurchaseItem-table .dvFixedPurchaseItem-box__img
    {
        margin: 0 0 0 0;
    }
}
@media screen and (max-width: 767px)
{
    .dvFixedPurchaseItem .dvFixedPurchaseItem-table .dvFixedPurchaseItem-box__text__secondary
    {
        display: flex;
        flex-direction: column;

        width: 90%;
    }
}
@media screen and (max-width: 767px)
{
    .dvFixedPurchaseItem .dvFixedPurchaseItem-table .dvFixedPurchaseItem-box__text__secondary .editwrap .BtnFlex .btnBasic
    {
        width: 50%;
        max-width: 150px;
    }
}
@media screen and (max-width: 767px)
{
    .dvFixedPurchaseItem .dvFixedPurchaseItem-table .dvFixedPurchaseItem-box__text
    {
        width: 90%;
    }
}
@media screen and (max-width: 767px)
{
    .dvFixedPurchaseItem .dvFixedPurchaseItem-table #imgProductImage
    {
        margin: 0 0 0 0;
    }
}
.dvFixedPurchaseItem .dvFixedPurchaseItem-table .editwrap .BtnFlex
{
    display: flex;
    flex-direction: row-reverse;

    margin: 12px 0;

    justify-content: flex-end;
}

.dvFixedPurchaseItem-box__wrap
{
    display: flex;
    flex-direction: row;

    gap: 20px;
}

.dvFixedPurchaseItem .dvFixedPurchaseItem-table #imgProductImage
{
    float: none !important;

    width: 80px !important;
    margin-right: 0 !important;
}

.editwrap .BtnFlex .btnBasic
{
    max-width: 150px;
}

#dvUserBox #dvUserCreditCardList table tr td
{
    border: none !important;
}

#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr.flex_row_center
{
    display: flex;
    flex-direction: row;

    align-items: center;
    justify-content: space-between;
}

@media screen and (max-width: 768px)
{
    #dvUserBox #dvUserFltContents #dvUserCreditCardList table tr.flex_row_center
    {
        flex-direction: column;
    }
}
#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr th.productPatternNum
{
    width: 180px;
}

@media screen and (max-width: 768px)
{
    #dvUserBox #dvUserFltContents #dvUserCreditCardList table tr th.productPatternNum
    {
        width: 100%;
        max-width: 100%;
        padding-bottom: 0;

        border: none;
    }
}
#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr th.productName
{
    width: calc(100% - 400px);
}

@media screen and (max-width: 768px)
{
    #dvUserBox #dvUserFltContents #dvUserCreditCardList table tr th.productName
    {
        width: 100%;
        max-width: 100%;
    }
}
#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr th.delete
{
    width: 220px;
}

@media screen and (max-width: 768px)
{
    #dvUserBox #dvUserFltContents #dvUserCreditCardList table tr th.delete
    {
        display: none;
    }
}
#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.CreditcardName
{
    font-weight: bold;

    width: 180px;
    padding: 10px;
}

@media screen and (max-width: 768px)
{
    #dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.CreditcardName
    {
        width: 100%;
        max-width: 100%;
    }
}
#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.CreditCardDetail
{
    display: flex;
    flex-direction: column;

    width: calc(100% - 400px);
    height: 100%;
    padding: 0 10px;

    justify-content: center;
    gap: 8px;
}

@media screen and (max-width: 768px)
{
    #dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.CreditCardDetail
    {
        width: 100%;
        max-width: 100%;
        padding: 0;
    }
}
#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.CreditCardDetail ul
{
    display: flex;
    flex-direction: row;
}

#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.CreditCardDetail ul li
{
    float: none;
}

@media screen and (max-width: 768px)
{
    #dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.CreditCardDetail ul li.itemname
    {
        font-size: 13px !important;

        float: none;

        width: 22.2vw;
        margin: 0 !important;
        padding: 0 0 0 10px;
    }
}
#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.CreditCardDetail ul li.separator
{
    width: 2.6666666667vw;
}

#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.CreditCardDetail ul li.iteminfo
{
    width: calc(100% - 21.8666666667vw);
}

#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.updatedelete
{
    width: 220px;
    max-width: 220px;
}

@media screen and (max-width: 768px)
{
    #dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.updatedelete
    {
        display: flex;

        width: 100%;
        max-width: 100%;
        padding: 10px;

        gap: 8px;
    }
}
#dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.updatedelete a.btn.btnBasic
{
    font-size: 14px;

    width: 200px;
    max-width: 200px;
}

@media screen and (max-width: 768px)
{
    #dvUserBox #dvUserFltContents #dvUserCreditCardList table tr td.updatedelete a.btn.btnBasic
    {
        width: 50%;
        max-width: 50%;
    }
}
#dvUserBox #dvUserFltContents .btnFlex.FixedPurchaseEditFlex,
#dvUserBox #dvUserFltContents .btnFlex.orderHistoryEditFlex
{
    display: flex !important;
    display: flex !important;

    width: 100%;
    padding: 24px 0;

    border-top: 1px solid #ccc;
}

@media screen and (max-width: 767px)
{
    #dvUserBox #dvUserFltContents .btnFlex.FixedPurchaseEditFlex,
    #dvUserBox #dvUserFltContents .btnFlex.orderHistoryEditFlex
    {
        flex-direction: column;
    }
}
#dvUserBox #dvUserFltContents .btnFlex.FixedPurchaseEditFlex a,
#dvUserBox #dvUserFltContents .btnFlex.orderHistoryEditFlex a
{
    margin: 0;
}

#dvUserBox #dvUserFltContents .btnFlex.FixedPurchaseEditFlex a.btn.wht,
#dvUserBox #dvUserFltContents .btnFlex.orderHistoryEditFlex a.btn.wht
{
    color: #333 !important;
    background: #fff !important;
}

@media screen and (max-width: 767px)
{
    #dvUserCreditCardInput .dvUserBtnBox p span .btnBasic.wht
    {
        margin-bottom: 10px;
    }
}
#dvUserShippingList .btndelete.dark
{
    background: #333;
}

#dvMyPage .mypage-point__box ul
{
    display: flex;

    gap: 16px;
}
#dvMyPage .mypage-point__box ul li
{
    width: 50%;
    margin-top: 16px;
    padding: .5rem;

    text-align: center;

    border: 1px solid #ccc;
    border-radius: 4px;
}