@charset "UTF-8";

:root {
    --maincolor: #009944;
    --shopbtncolor: #f08200;
}

/*---------- header ----------*/
@media screen and (max-width: 640px) {
    .header_logo img {
        width: auto;
        height: 25px;
        margin: 0.5rem;
    }
}

/*---------- campaign ----------*/
.campaign_box h2 {
    width: 100%;
    paint-order: stroke;
    left: 50%;
    font-size: 1.2em;
    letter-spacing: 1px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    padding: 0.8em 0;
    margin-bottom: 1.5rem;
}
.campaign_box h2:before,
.campaign_box h2:after {
    display: none;
}
.campaign_box h2 .title_l strong.num {
    font-family: "Barlow", sans-serif;
    font-size: 2em;
}
.campaign_box h2 .title_l .unit {
    font-size: 0.8em;
    font-weight: bold;
}
.campaign_box h2 .title_r {
    font-size: 2em;
    font-weight: bold;
    -webkit-text-stroke: 3px #fff;
    color: #e3007f;
}
.campaign_box h2 .title_r strong {
    font-size: 2em;
    margin-right: 3px;
}
@media screen and (max-width: 640px) {
    .campaign_box h2 {
        display: block;
        font-size: 3.2vw;
        letter-spacing: 0.5px;
    }
    .campaign_box h2 strong {
        font-size: 1.5em;
    }
    .campaign_box h2 .title_l,
    .campaign_box h2 .title_r {
        display: inline;
    }
    .campaign_box h2 .title_r {
        position: relative;
        font-size: 1.5em;
        padding-left: 60px;
    }
    .campaign_box h2 .title_r strong {
        font-size: 2.5em;
    }
    .double_fukidashi {
        position: absolute;
        top: -21px;
        left: 0;
        width: 50px;
        height: 50px;
        font-size: 10px;
        font-weight: bold;
        text-align: center;
        line-height: 1;
        background: #fff;
        border-radius: 50em;
        box-shadow: 1px 2px 2px #00000050;
        padding-top: 14px;
        letter-spacing: 0;
        -webkit-text-stroke: 0;
    }
    .double_fukidashi:after {
        content: "";
        position: absolute;
        top: 55%;
        left: 75%;
        background: #fff;
        width: 20px;
        height: 20px;
        clip-path: polygon(34% 0, 0 48%, 100% 63%);
    }
    .double_fukidashi .zoryo {
        font-size: 15px !important;
        font-weight: bold;
    }
}

/*---------- feature ----------*/
.recharge_step li p:not(.step_circle) {
    text-align: center;
}
.recharge_step li:nth-of-type(2) img {
    height: auto;
    margin: 3rem 0;
}
.btn_list {
    margin: 1rem 0 2rem;
}
@media screen and (min-width: 641px) {
    .feature_txt {
        padding-left: 7rem;
    }
    .multi_copy .feature_txt {
        padding-left: 3rem;
    }
}
@media screen and (max-width: 640px) {
    .feature_list_box.multi_copy img {
        margin-bottom: 3.5rem;
    }
    .recharge_step {
        padding-bottom: 1rem;
    }
}

/*---------- 商品紹介 ----------*/
.price_table .after_gb .cpGb {
    color: #333;
}
.doubleGb {
    position: absolute;
    top: calc(100% + 5px);
    font-size: 0.8em;
    line-height: 1;
}
@media screen and (min-width: 641px) {
    .price_table tr:nth-of-type(2) {
        display: flex;
        align-items: end;
        justify-content: space-between;
        margin-right: 1rem;
    }
}
@media screen and (max-width: 640px) {
    .price_list li:nth-of-type(2n) .price_table .after_gb {
        text-align: left;
    }
    .doubleGb {
        position: relative;
        font-size: 10px;
    }
}

/*---------- 注意事項 ----------*/
#contact h3 {
    font-weight: bold;
    color: var(--maincolor);
    text-indent: -0.5em;
    line-height: 2;
}