@charset "UTF-8";

/* body {
    margin: auto;
} */

/* store */
/*position:stickey;を適用するために必須*/
.page-layout-1column,
.page-layout-2columns-left,
.page-layout-2columns-right,
.page-layout-1column-fullwidth {
    overflow-x: visible !important;
}

/* ★☆★ cocorothanks ★☆★ */

:root {
    --bg-all-color: #fdfdfd;
    --bg-section-color: #fff8ed;
    --bg-cpdetailTtl-color: #ffd345;
    --bg-attention-color: #eee9e3;
    --border-attention-color: #929292;
    --border-section-color: #d3a051;
    --border-cpdetail-color: #3d0d00;
    --txt-default-color: #3d0d00;
    --txt-white-color: #fff;
}


/* === lp all === */
.lp__wrap {
    position: relative;
    text-align: center;
    padding-bottom: 50px;
    background-color: var(--bg-all-color);
    color: var(--txt-default-color);
    font-size: clamp(17px, 1.4vw, 23px);
    letter-spacing: 1px;
}

.lp__wrap a,
.lp__wrap a:hover,
.lp__wrap a:visited {
    color: var(--txt-default-color);
}

@media screen and (min-width: 820px) {

    .sp-visible_lg {
        display: none;
    }

}

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

    .pc-visible_lg {
        display: none;
    }

}

@media screen and (min-width: 576px) {

    .sp-visible_sm {
        display: none;
    }

}

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

    .pc-visible_sm {
        display: none;
    }

}


/* === ALL === */

.cocorothanks__wrap section {
    max-width: 1500px;
    padding: 50px 1%;
    margin: 50px auto;
    scroll-margin-top: 65px;
}

.cocorothanks__wrap h2,
.cocorothanks__wrap h3,
.cocorothanks__wrap h4,
.cocorothanks__wrap p,
.cocorothanks__wrap dl,
.cocorothanks__wrap dl dt,
.cocorothanks__wrap dl dd,
.cocorothanks__wrap ul,
.cocorothanks__wrap ol,
.cocorothanks__wrap ul>li,
.cocorothanks__wrap ol>li,
.cocorothanks__wrap .block-static-block.widget {
    margin-bottom: 0;
}

.ctg--detail {
    padding: 15px 0;
}

.ctg--detail .ttl {
    width: 50%;
    max-width: 750px;
    margin: auto;
}

.item__area {
    padding-bottom: 15px;
}

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

    .cocorothanks__wrap section {
        margin: 20px auto;
        scroll-margin-top: 15px;
    }

}

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

    .cocorothanks__wrap section {
        padding: 50px 0;
    }

    .cocorothanks__wrap section .intro--txt {
        line-height: 2.65rem;
    }

    .item__area {
        padding: 15px 0 0 0 !important;
    }

    .ctg--detail .ttl {
        width: 90%;
    }

}


/* === mv&intro === */
.cocorothanks__wrap .mv--area {
    text-align: center;
    margin: auto;
    background: linear-gradient(180deg, #ca1603 88%, transparent 89%);
}

.cocorothanks__wrap .mv--area img {
    width: 100%;
    max-width: 1500px;
}

.cocorothanks__wrap .wrapIntro {
    font-weight: bold;
    margin: 50px auto auto;
    letter-spacing: 2px;
    line-height: 3.25rem;
}

@media screen and (max-width:767px) {
    .cocorothanks__wrap .mv--area {
        background: none;
    }
}



/* === prize === */

.cocorothanks__wrap section#prize {
    margin: auto auto 25px;
}

.prize--area {
    background: var(--bg-section-color);
    border: 3px solid var(--border-section-color);
    margin: 50px auto;
    padding: 75px 0 0;
    border-radius: 7px;
}

.prize--area .ttl img {
    max-width: 600px;
    width: 40%;
}

.prize--detail {
    max-width: 1000px;
    width: 90%;
    margin: auto;
    padding: 50px 0;
}

.prize--detail img.sp-visible_sm {
    padding-top: 15px;
}

.entry--area {
    max-width: 750px;
    width: 50%;
    margin: auto;
}


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

    .prize--area {
        padding: 50px 0;
        max-width: 98%;
    }

    .prize--area .ttl img {
        width: 85%;
    }

    .prize--detail {
        padding: 15px 0 0;
    }

    .entry--area {
        width: 90%;
    }

}


/* === products === */
.cocorothanks__wrap section#product {
    margin: auto auto 75px;
}

.products--area {
    background: var(--bg-section-color);
    border: 3px solid var(--border-section-color);
    margin: auto;
    padding: 75px 0;
    border-radius: 7px;
}

.products--area .ttl img {
    max-width: 600px;
    width: 40%;
    padding-bottom: 25px;
}

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

    .products--area {
        padding: 50px 0;
        max-width: 98%;
    }

    .products--area .ttl img {
        width: 85%;
    }
}


/* == cp == */
.cocorothanks__wrap section#cp {
    background: var(--bg-section-color);
    border: 3px solid var(--border-section-color);
    border-left: none;
    border-right: none;
    max-width: 100%;
    padding: 75px 0;
}

.cocorothanks__wrap section#cp .ttl img {
    max-width: 600px;
    width: 40%;
}

.details--area {
    max-width: 1000px;
    width: 90%;
    margin: auto;
    padding: 30px 0 50px;
    background-size: 18px 2px;
    background-repeat: repeat-x;
    background-image: linear-gradient(to right, var(--border-cpdetail-color) 8px, transparent 8px);
    background-position: left top;
}

.introTxt {
    padding: 75px 0 50px;
}

.details--area dl {
    padding: 30px 0;
    text-align: left;
}

.details--area dl dt {
    background: var(--bg-cpdetailTtl-color);
    font-weight: bold;
    padding: 7px 15px;
    letter-spacing: 3px;
    display: inline-block;
    border-radius: 30px;
    margin-bottom: 15px;
    letter-spacing: 0;
}

.details--area dl dd {
    line-height: 2.75rem;
}

.details--area dl.prize dd>ul {
    list-style: none;
    padding-left: 0;
}

.details--area dl.prize dd>ul li {
    margin-bottom: 5px;
}

.details--area dl dd>ul {
    display: inline-block;
    text-align: left;
}

.attention--area {
    max-width: 1000px;
    margin: auto;
    background: var(--bg-attention-color);
    border: 3px solid var(--border-attention-color);
    border-radius: 7px;
    text-align: left;
    padding: 30px 50px;
}

.attention--area dl:first-child {
    padding-bottom: 15px;
}

.attention--area dl dt.ttlTxt {
    text-align: center;
    padding-bottom: 15px;
}

.attention--area dl dd ul li ul li::marker {
    content: "※";
}

.attention--area dl dd {
    font-size: clamp(15px, 1.25vw, 18px);
}

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

    .cocorothanks__wrap section#cp .ttl img {
        width: 85%;
    }

    .introTxt {
        padding: 30px 0;
    }

    .details--area {
        margin: auto 15px;
        padding: 30px 0;
    }

    .attention--area {
        margin: auto 10px;
        padding: 30px 15px;
    }
}

/* == cp == */
.cocorothanks__wrap section#feature {
    max-width: 1000px;
    margin: auto;
    width: 95%;
}


/* SKU */
/* 商品 */
@media screen and (max-width:1024px) {
    .item__area {
        max-width: 90%;
        margin: auto;
    }
}

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

.product-items {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center;
}

.page-layout-1column .block.widget .products-grid .product-item {
    background: #fff;
    margin: 10px;
    padding: 10px;
}

li.product-item {
    /* border: 2px solid #c9bb81; */
    padding: 5px;
    border-radius: 2px;
    /* box-shadow: 0 3px 3px rgb(153 153 153 / 50%); */
    font-family: 'Noto Sans JP', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.product-items .product-item .product-item-details a {
    font-size: clamp(13px, 1.3vw, 17px);
    font-weight: 700;
    color: #454545;
    line-height: 1.35;
}

.products-grid .price-box .price-wrapper .price {
    color: #e84c25;
}

#creative-area-lp .action.primary,
#creative-area-lp .action-primary {
    display: none;
}

.widget-product-grid .product-reviews-summary {
    display: none !important;
}

[data-content-type=row] li.product-item .action.primary,
[data-content-type=row] li.product-item .action-primary {
    text-align: center;
}

.product-items .product-item .product-item-details a {
    text-decoration: none;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: initial;
    white-space: unset;
    margin-bottom: 0;
}


.products-grid .price-box .price-wrapper .price {
    font-size: clamp(19px, 1.75vw, 23px);
}

/* 2025/09/10 */
.products-grid .price-box .tax-label {
    font-size: clamp(13px, 1.15vw, 15px);
    color: #454545;
}

.product-items .product-item-info span.rewards__product-points,
.product-item-actions .actions-secondary,
.product-item-actions .actions-primary:has(form) {
    display: none;
}

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

    .anchor-box::before {
        height: 9.2rem;
        margin-top: -9.2rem;
    }

    #creative-area-lp .action.primary,
    #creative-area-lp .action-primary {
        width: auto;
    }

    .product-items .product-item .product-item-details a {
        -webkit-line-clamp: 4;
    }

}

.products-grid .product-item-actions {
    display: flex;
    /* 仮 */
}

@media (min-width: 640px) {
    .products-grid .product-item-actions {
        margin: 0;
    }

}

/* 4列表示 */

.page-layout-1column .block.widget .products-grid .product-item {
    width: calc((100% - 8%) / 4);
}

@media (min-width: 769px),
print {

    .page-layout-1column .block.widget .products-grid .product-item:nth-child(3n+1) {
        margin-left: 0;
    }

}

@media (min-width: 1024px),
print {

    .page-layout-1column .block.widget .products-grid .product-item,
    .page-layout-1column .block.widget .products-grid .product-item:nth-child(4n+1) {
        margin-left: 0;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
    }

    /* .page-layout-1column .block.widget .products-grid .product-item {
        } */
}

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

    .page-layout-1column .block.widget .products-grid .product-item {
        width: calc((100% - 9.65%) / 4);
    }
}

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

    /* .page-layout-1column .block.widget .products-grid .product-item {
            height: 270px;
        } */
}

@media screen and (max-width:1023px) {
    .page-layout-1column .block.widget .products-grid .product-item {
        width: calc((100% - 8.5%) / 4);
        margin: 0 7px 15px !important;
        /* height: 250px; */
        letter-spacing: 0;
        line-height: 2.5rem;
    }
}

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

    .page-layout-1column .block.widget .products-grid .product-item {
        width: calc(100% / 2 - 10px);
        margin: 0 5px 10px !important;
        padding: 7px;
    }

}

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

    /* .page-layout-1column .block.widget .products-grid .product-item {
            height: 230px;
        } */
}

/* 商品レイアウト fin */