@charset "utf-8";

/*

products.css
Version: 2023.08.21

*/

/* --------------------------------------------------------
/* .page-products
/* .products
/* .products-detail
/* .products-detail-photo
/* .products-detail-summary
/* .products-detail-summary-info
/* .products-detail-summary-basket
/* .products-detail-summary-sale
/* .products-detail-summary-price
/* .products-detail-summary-label
/* .products-detail-summary-point
/* .products-detail-summary-list
/* .products-detail-summary-guide
/* .products-detail-summary-btn
/* .products-detail-summary-bnr
/* .products-detail-content
/* .shop-detail
-------------------------------------------------------- */


/* .page-products
-------------------------------------------------------- */
.visual-sub-bg {
    position: relative;
    background: #fff url(../../assets/img/products/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}
.term-outlet .visual-sub-bg {
    background: #fff url(../../assets/img/products/productscampaign/outlet/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}
.term-fukubukuro .visual-sub-bg {
    background: #fff url(../../assets/img/products/productscampaign/fukubukuro/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}
.term-sale .visual-sub-bg {
    background: #fff url(../../assets/img/products/productscampaign/sale/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}
.term-mothersday .visual-sub-bg {
    background: #fff url(../../assets/img/products/productsfeature/mothersday/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}
.term-fathersday .visual-sub-bg {
    background: #fff url(../../assets/img/products/productsfeature/fathersday/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}
.term-birthday .visual-sub-bg {
    background: #fff url(../../assets/img/products/productsfeature/birthday/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}
.term-bridal .visual-sub-bg {
    background: #fff url(../../assets/img/products/productsfeature/bridal/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}
.term-baby .visual-sub-bg {
    background: #fff url(../../assets/img/products/productsfeature/baby/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}
.term-house .visual-sub-bg {
    background: #fff url(../../assets/img/products/productsfeature/house/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}
.term-umbrella .visual-sub-bg {
    background: #fff url(../../assets/img/products/productsfeature/umbrella/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}
.term-summer-item .visual-sub-bg {
    background: #fff url(../../assets/img/products/productsfeature/summer-item/bg_visual-sub-bg_sp.jpg) no-repeat center center;
    background-size: cover !important;
}

/* pc（1200px以上の場合に適用） */
@media (min-width: 1200px) {
    .visual-sub-bg {
        background: #fff url(../../assets/img/products/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
    .term-outlet .visual-sub-bg {
        background: #fff url(../../assets/img/products/productscampaign/outlet/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
    .term-fukubukuro .visual-sub-bg {
        background: #fff url(../../assets/img/products/productscampaign/fukubukuro/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
    .term-sale .visual-sub-bg {
        background: #fff url(../../assets/img/products/productscampaign/sale/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
    .term-mothersday .visual-sub-bg {
        background: #fff url(../../assets/img/products/productsfeature/mothersday/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
    .term-fathersday .visual-sub-bg {
        background: #fff url(../../assets/img/products/productsfeature/fathersday/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
    .term-birthday .visual-sub-bg {
        background: #fff url(../../assets/img/products/productsfeature/birthday/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
    .term-bridal .visual-sub-bg {
        background: #fff url(../../assets/img/products/productsfeature/bridal/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
    .term-baby .visual-sub-bg {
        background: #fff url(../../assets/img/products/productsfeature/baby/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
    .term-house .visual-sub-bg {
        background: #fff url(../../assets/img/products/productsfeature/house/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
    .term-umbrella .visual-sub-bg {
        background: #fff url(../../assets/img/products/productsfeature/umbrella/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
    .term-summer-item .visual-sub-bg {
        background: #fff url(../../assets/img/products/productsfeature/summer-item/bg_visual-sub-bg_pc.jpg) no-repeat center center;
        background-size: cover !important;
    }
}


/* .products
-------------------------------------------------------- */
.products {
    position: relative;
    margin: 0 auto;
    padding: 0;
    width: 100%;
}


/* .products-detail
-------------------------------------------------------- */
.products-detail {
    position: relative;
    display: flex;
    flex-direction: column;
    margin: 0 auto 60px;
    /* padding: 0 14px;
    max-width: 1520px; */
    width: 100%;

    justify-content: space-between;
}

/* pc（1200px以上の場合に適用） */
@media (min-width: 1200px) {
    .products-detail {
        flex-direction: row;
        padding: 0 0;
    }
}


/* .products-detail-photo
-------------------------------------------------------- */
.products-detail-photo {
    width: 100%;
}

/* pc（1200px以上の場合に適用） */
@media (min-width: 1200px) {
    .products-detail-photo {
        margin-right: 4.054054054054055%; /* 60.00px */
        width: 53.09734513274337%; /* 600.00px */
    }
}


/* .products-detail-summary
-------------------------------------------------------- */
.products-detail-summary {
    margin-top: 20px;
    width: 100%;
}

/* pc（1200px以上の場合に適用） */
@media (min-width: 1200px) {
    .products-detail-summary {
        margin-top: 0;

        flex: 1;
    }
}


/* .products-detail-summary-info
-------------------------------------------------------- */
/* .products-detail-summary-info table */
.products-detail-summary-info table th,
.products-detail-summary-info table td {
    padding: 10px 10px !important;
}
.products-detail-summary-info table th {
    color: #020202;
    font-weight: 700;
    font-size: 1.4rem;
}
.products-detail-summary-info table td .price {
    color: #bf0000;
    font-weight: 700;
    font-size: 200%;
    line-height: 170%;
}
.products-detail-summary-info table td .price::after {
    margin-left: .1em;
    content: "円";
    font-size: 1.6rem;
}

/* .products-detail-summary-info ul */
.products-detail-summary-info .pay,
.products-detail-summary-info .option {
    font-size: 0;
}
.products-detail-summary-info .pay li,
.products-detail-summary-info .option li {
    display: inline-block;
    margin: 0 3px 5px 0;
    padding: .3em .6em;
    border: 1px solid #ccc;
    border-radius: 3px;
    background-color: #fff;
    color: #ccc;
    font-size: 1.1rem;
}
.products-detail-summary-info .pay li.on,
.products-detail-summary-info .option li.on {
    border: 1px solid #212121;
    background-color: #212121;
    color: #fff;
}


/* .products-detail-summary-basket
-------------------------------------------------------- */
.products-detail-summary-basket {
    margin: 0 0 40px 0;
}
.products-detail-summary-basket-ttl {
    color: #020202;
    /* letter-spacing: 2px; */
    font-weight: 600;
    font-size: 2.0rem;
    line-height: 1.6;
}
.products-detail-summary-basket-number {
    margin: 0 0 1em;
    color: #999;
    font-weight: 500;
    font-size: 1.4rem;
}
.products-detail-summary-basket-price {
    margin-top: 1em;
    color: #bf0000;
    font-weight: 700;
    font-size: 1.8rem;
    font-family: "Noto Sans JP", sans-serif;
    line-height: 1.4;
}
.products-detail-summary-basket-price .price {
    letter-spacing: -.01em;
    font-weight: 700;
    font-size: 200%;
    font-family: "Schibsted Grotesk", sans-serif;
}
.products-detail-summary-basket-discount {
    margin-top: 0;
    color: #999;
    font-size: 1.6rem;
}
.products-detail-summary-basket-discount .price {
    /* text-decoration: line-through; */
    font-size: 110%;
}
.products-detail-summary-basket-rate {
    margin-top: 1em;
}
.products-detail-summary-basket-rate .rate {
    display: inline-flex;
    margin-bottom: 0;
    padding: .4em 1em;
    border-color: #bf0000;
    border-radius: 3px;
    background-color: #bf0000;
    color: #fff;
    letter-spacing: .1em;
    font-weight: 700;
    font-size: 1.4rem;
    /* font-family: "Noto Serif JP", serif; */
    font-family: "Schibsted Grotesk", sans-serif;
    line-height: 1;

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


/* .products-detail-summary-sale
-------------------------------------------------------- */
.products-detail-summary-sale {
    display: inline-block;
    margin: 0 0 15px 0;
    padding: 1px 12px;
    background-color: #c10000;
    color: #fff;
    font-weight: 700;
    font-size: 1.8rem;
    line-height: 1.6;
}


/* .products-detail-summary-price
-------------------------------------------------------- */
.products-detail-summary-price {
    margin: 0 0 20px 0;
    color: #c10000;
    font-weight: 700;
    font-size: 1.8rem;
}
.products-detail-summary-price span {
    letter-spacing: -1px;
    font-size: 2.8rem;
    line-height: 1;
}


/* .products-detail-summary-label
-------------------------------------------------------- */
.products-detail-summary-label {
    margin: 0 0 20px 0;
}
.products-detail-summary-label .label {
    font-size: 0;
    line-height: 1.5;
}
.products-detail-summary-label span {
    display: inline-block;
    margin: 0 .6em .6em 0;
    padding: .3em .6em;
    border-radius: 3px;
    background-color: #fc5252;
    color: #fff;
    font-size: 1.0rem;
    line-height: 1.4;
}
.products-detail-summary-label span.free {
    background-color: #fc5252;
}
.products-detail-summary-label span.new {
    background-color: #dc9610;
}
.products-detail-summary-label span.popular {
    background-color: #c2007b;
}
.products-detail-summary-label span.rearrival {
    background-color: #a0c238;
}
.products-detail-summary-label span.recommended {
    background-color: #019fe6;
}
.products-detail-summary-label span.reserve {
    background-color: #00984b;
}
.products-detail-summary-label span.sale {
    background-color: #c60019;
}
.products-detail-summary-label span.soldout {
    border: 1px dotted #c60019;
    background-color: transparent;
    color: #c60019;
}
.products-detail-summary-label span.stockonly {
    background-color: #f4bf33;
}
.products-detail-summary-label span.limited {
    background-color: #afafaf;
}
.products-detail-summary-label span.subscription {
    background-color: #313131;
}


/* .products-detail-summary-point
-------------------------------------------------------- */
.products-detail-summary-point {
    margin: 0 0 24px 0;
}
.products-detail-summary-point span {
    display: inline-block;
    margin: 0 3px 3px 0;
    padding: 6px 10px 7px;
    border-radius: 3px;
    background-color: #fc5252;
    color: #fff;
    font-size: 1.6rem;
    line-height: 1;
}


/* .products-detail-summary-list
-------------------------------------------------------- */
.products-detail-summary-list {
    margin: 30px 0;
    padding: 0 20px;
    /* border: 1px solid #64aa96; */
    border-radius: 5px;
    background-color: #fff;
}
.products-detail-summary-list li {
    padding: 20px 0;
}
.products-detail-summary-list li + li {
    border-top: 1px solid #ddd;
}
.products-detail-summary-list .ttl {
    color: #020202;
    font-weight: 700;
    font-size: 1.6rem;
}
.products-detail-summary-list .txt {
    margin-top: .5em;
    margin-bottom: 0;
    color: #515151;
    font-size: 1.2rem;
}
.products-detail-summary-list .txt a {
    color: #515151;
    /* text-decoration: underline; */
}


/* .products-detail-summary-guide
-------------------------------------------------------- */
.products-detail-summary-guide {
    margin: 0 0 35px 0;
    padding: 0 0 0;
    text-align: left;
}
.products-detail-summary-guide .item {
    display: inline-block;
    margin: 0 .4em .4em 0;
}
.products-detail-summary-guide .item:last-child {
    margin: 0;
}
.products-detail-summary-guide .item a {
    position: relative;
    padding: .6em 1em;
    border-radius: 2px;
    background: #ebebeb;
    color: #020202;
    font-size: 1.2rem;
    cursor: pointer;
}
.products-detail-summary-guide .item a:hover {
    color: #020202;
    text-decoration: none;
}
.products-detail-summary-guide .item a::before {
    display: inline-block;
    margin-top: -2px;
    margin-right: 8px;
    color: #777;
    content: "\e89d";
    vertical-align: middle;
    font-weight: 700;
    font-size: 1.3rem;
    font-family: "webfont";
}


/* .products-detail-summary-btn
-------------------------------------------------------- */
.products-detail-summary-btn {
    display: flex;
    padding: 0 0 15px;
    border-bottom: 1px solid #ebebeb;

    flex-wrap: wrap;
    justify-content: space-between;
}
.products-detail-summary-btn .item {
    width: 48%;
}
.products-detail-summary-btn .item-box .item-box-link {
    position: relative;
    display: flex;
    padding: .8em .5em;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    text-align: center;
    text-decoration: none;
    font-weight: 600;
    font-size: 1.6rem;
    line-height: 1;
    transition: .2s;

    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.products-detail-summary-btn .item-box.semi .item-box-link {
    border: 1px solid #c7aa58;
    background: #c7aa58;
    color: #fff;
}
.products-detail-summary-btn .item-box.resale .item-box-link {
    border: 1px solid #d3dbdd;
    background: #f4f7f8;
    color: #1387c5;
}
.products-detail-summary-btn .item-box .item-box-link-ico {
    display: inline-block;
    margin: 0 5px 0 0;
    padding: .5em;
    /* width: 26px;
    height: 26px; */
    border-radius: 3px;
    text-align: center;
    font-size: .9rem;
}
.products-detail-summary-btn .item-box.semi .item-box-link-ico {
    /* background: #fff;
    color: #c7aa58; */
    border: 1px solid #fff;
}
.products-detail-summary-btn .item-box.resale .item-box-link-ico {
    /* background: #1387c5;
    color: #fff; */
    border: 1px solid #1387c5;
}
.products-detail-summary-btn .item-box .item-box-link-txt {
    width: auto;
}
.products-detail-summary-btn .item-box .item-box-link-sub {
    margin-top: 10px;
    width: 100%;
    font-size: 1.1rem;
}


/* .products-detail-summary-bnr
-------------------------------------------------------- */
.products-detail-summary-bnr {
    margin-bottom: 30px;
    padding: 0;
}
.products-detail-summary-bnr .link {
    position: relative;
    display: block;
    margin: 15px 0 0;
    padding: .8em 1.2em;
    width: 100%;
    border-radius: 3px;
    background: #000 url(../../assets/img/common/bg_products-detail-summary-bnr.png) no-repeat center right;
    color: #fff;
    text-align: center;
    font-weight: 600;
    font-size: 1.6rem;
}
.products-detail-summary-bnr .link:hover {
    text-decoration: none;
}
.products-detail-summary-bnr .link-sub {
    display: block;
    margin: 3px 0 0 0;
    color: #13a7c5;
    font-size: 1.3rem;
}

/* .products-detail-summary-tagcloud */
.products-detail-summary-tagcloud {
    width: 100%;
}
.products-detail-summary-tagcloud .keyword a {
    display: inline-block;
    margin: 0 .2em .4em 0;
    padding: 2px 5px;
    /* background: rgba(235, 235, 235, 0); */
    border: 1px solid #e7e7e7;
    border-radius: 3px;
    color: #020202;
    text-decoration: none;
    font-size: 1.2rem;
}
.products-detail-summary-tagcloud .keyword a::before {
    display: inline-block;
    margin-right: 2px;
    content: "#";
}
.products-detail-summary-tagcloud .keyword a:hover {
    background-color: #e7e7e7;
    color: #020202;
    text-decoration: none;
}


/* .products-detail-content
-------------------------------------------------------- */
.products-detail-content .ttl {
    margin: 0 0 .5em;
    padding: 0 0 .5em;
    color: #020202;
    font-weight: 600;
    font-size: 2.0rem;
}


/* .shop-detail
-------------------------------------------------------- */
.shop-detail .dl {
    margin: 0 0 1.5em;
    padding: 0;
    border: 0;
    background-color: #f6f6f5;
}
.shop-detail .dl dt {
    padding: .6em .2em;
    background-color: #313131;
    color: #fff;
    text-align: center;
    letter-spacing: .1em;
    font-weight: 600;
    font-size: 1.7rem;
}
.shop-detail .dl dd {
    padding: 1em 2em 2em;
    font-weight: 400;
    font-size: 1.4rem;
}