.note_box {
    max-width: 940px;
    border: solid 1px #ffe55f;
    padding: 0 0 10px 0;
    margin: 0 auto 30px;
}

.info--list {
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr 1fr 1fr;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.info__list--product {
    display: grid;
    grid-template-areas:
        "img"
        "name"
        "detail"
        "price_1"
        "price_2";
    grid-template-rows: subgrid;
    grid-row: span 5;
    gap: 8px;
    border: 1px solid #ddd;
    /* ボーダーの追加 */
    padding: 12px;
    /* 内側の余白 */
    background-color: #fff;
    /* 背景色 */
}

.section-title {
    border-top: 3px solid #ffe55f;
    border-bottom: 3px solid #ffe55f;
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 20px;
    padding: 0.75em 0;
    text-align: center;
}

.section-title h3 {
    color: #ff6bb0;
    font-size: 20px;
    text-align: center;
    font-weight: bold;
}

.product--name {
    grid-area: name;
    font-weight: bold;
    font-size: 14px;
    line-break: strict;
}

.product--detail {
    grid-area: detail;
    color: #666;
    word-break: break-all;
}

.product--price_2 {
    grid-area: price_2;
    color: #333;
    font-size: 24px;
    font-weight: bold;
}

.product--price_1 .tax {
    font-size: 16px;
    display: inline-block;
    line-height: 1em;
}

.product--price_2 .tax {
    font-size: 16px;
    display: inline-block;
    line-height: 1em;
}

.product--img {
    grid-area: img;
    max-width: 100%;
}

.product--name {
    grid-area: name;
    font-weight: bold;
    font-size: 14px;
}

.product--detail {
    grid-area: detail;
    color: #666;
    word-break: break-all;
}

.product--price_2 {
    grid-area: price_2;
    color: #333;
    font-size: 24px;
    font-weight: bold;
}

.info__list--product a {
    display: contents;
}


.item_limited {
    grid-area: price_1;
    color: #333;
    font-size: 24px;
    font-weight: bold;
}

.section p {
    padding: 0 10px;
    font-weight: 700;
    line-height: 1;
}

a .early-date {
  font-size: 18px;
  font-weight:bold;
  color: #fff;
  background-color:#ba1d66;
  text-align:center;
  padding:10px 0;
  border-bottom: solid 2px #fff;
}

.bonus {
    font-size: 12px;
    background-color: #ba1d66;
    color: #fff;
    padding: 5px 10px;
}

a .point {
  font-size: 12px;
  padding:0 10px;
  line-height: 1.6;
  font-weight:bold;
  margin:10px 0;
}

.span_l_red {
    font-size: 32px;
    font-weight: 800;
    color: #d70146;
    padding-left: 4px;
}

.span_red {
    color: #fff;
    font-size: 14px;
    font-weight: 900;
}

.point span.span_b{
  font-size:16px;
}

.span_b {
    font-weight: 700;
    font-size: 18px;
}

.including_tax {
    font-size: 12px;
}

.bonus_point {
    margin-left: 10px;
    color: #fff;
    position: relative;
        z-index: 0;
}

.span_l_red.marker_s{
  font-size:18px;
  background-color:#f00;
  color:#fff;
  padding:5px;
  border-radius:5px;
  margin-right: 4px;
}

.span_red.marker_l{
  font-size:12px;
}

/* .marker_l {
    position: relative;
    display: inline-block;
    z-index: 0;
}

.marker_l::before {
    content: "";
    position: absolute;
    left: -1px;
    bottom: -3px;
    width: 120%;
    height: 2.75em;
    background: #fff;
    z-index: -1;
    border-radius: 4px;
}

.marker_s {
    position: relative;
    display: inline-block;
    z-index: 0;
}

.marker_s::before {
    content: "";
    position: absolute;
    left: -1.5px;
    bottom: 3px;
    width: 130%;
    height: 1.2em;
    background: #fff;
    z-index: -1;
    border-radius: 4px;
} */

.sp {
    display: none;
}

.pc {
    display: block;
}

a .price {
  background-color:#FFF;
  width:95%;
  padding:5px 10px;
  color:#f00;
  font-weight:bold;
  font-size:24px;
  margin:20px auto 0;
}

.product--price_1 {
    background-color: #ffe200;
}

span.tax{
  font-size:16px;
}

a:hover {
    color: black;
}

p.point_note {
    font-size: 12px;
    color: black;
    padding: 10px;
    line-height: 1.6;
}

.section ul li {
    margin-top: 0;
}

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

    .info--list {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .info__list--product {
        padding: 8px;
    }

    .section p {
        padding: 0px 5px;
    }

    a .point {
        line-height: 1.8;
    }

    a .early-date {
        font-size: 16px;
        padding: 5px;
    }

    a .price {
        font-size: 24px;
        margin-top: 10px;
    }
    .product--price_1 {
        padding-bottom: 0;
    }

    .product--price_1 .tax {
        font-size: 12px;
    }

    .product--price_2 {
        font-size: 16px;
    }

    .product--price_2 .tax {
        font-size: 12px;
    }

    .sp {
        display: block;
    }
    .pc {
        display: none;
    }

    p.point_note {
    font-size: 11px;
    color: black;
    padding: 10px;
}
}