@charset "UTF-8";
/* ---------------------------------------------
*   Custom Properties
--------------------------------------------- */
:root {
    --design-width: 1440;
    --contents-width: 900;
    --contents-side-padding: 540;
    --minwidth: 320;
    --fixed-header-height: 80;
    --root-fz: 16;
    --line-height: 1.5;
    --hover-opacity-ratio: 0.8;
    --hover-duration: .3s;
    --color-base-1: #333;
    --color-base-1-rgb: 51, 51, 51;
    --color-black-1: #000;
    --color-black-1-rgb: 0, 0, 0;
    --color-black-2: #111;
    --color-black-2-rgb: 17, 17, 17;
    --color-white-1: #fff;
    --color-white-1-rgb: 255, 255, 255;
    --color-white-2: #fefefe;
    --color-white-2-rgb: 254, 254, 254;
    --color-sample-1: #9b2019;
    --color-sample-1-rgb: 155, 32, 25;
    --color-sample-2: #223a70;
    --color-sample-2-rgb: 34, 58, 112;
    --ff-root: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "meiryo", sans-serif;
    --ff-noto: "Noto Sans JP", sans-serif;
}
@media screen and (max-width: 750px) {
    :root {
        --design-width: 375;
        --contents-width: 335;
        --contents-side-padding: 20;
        --minwidth: 320;
        --fixed-header-height: 60;
        --root-fz: 16;
        --line-height: 1.5;
    }
}

/* ---------------------------------------------
*   l-header
--------------------------------------------- */
/* ---------------------------------------------
*   header
--------------------------------------------- */
.header {
    background-color: #fff;
}

@media screen and (max-width: 750px) {
    .header {
        position: relative;
        height: 49px;
        border-bottom: 1px solid #ccc;
    }
}
/*  header-container
--------------------------------------------- */
/*  header-logo
--------------------------------------------- */
.header-logo {
    margin: 0 auto;
    max-width: 1080px;
    width: 100%;
    height: 50px;
}

@media screen and (max-width: 750px) {
    .header-logo {
        float: left;
        margin-left: 9px;
        max-width: none;
        width: auto;
        height: auto;
        font-weight: bold;
        line-height: 49px;
    }
}
.header-logo__link {
    display: block;
    margin: 0 auto;
    padding: 15px 0px 0px 5px;
}

@media screen and (min-width: 751px) {
    .header-logo__link {
        transition: opacity 300ms;
    }
    .header-logo__link:hover {
        opacity: 0.7;
    }
}
@media screen and (max-width: 750px) {
    .header-logo__link {
        display: inline;
        margin: auto;
        padding: 0;
        font-size: 0.78em;
    }
}
.header-logo__link:before {
    margin-right: 0.2em;
    content: url(../202205img/icon_logomark.png);
}

@media screen and (max-width: 750px) {
    .header-logo__link:before {
        display: inline-block;
        margin: 0;
        width: 2.5em;
        height: 1.5em;
        background: url(../202205img/icon_logomark.png) no-repeat;
        background-size: contain;
        content: "";
        vertical-align: middle;
    }
}
.header-logo__img {
    vertical-align: baseline;
}

@media screen and (max-width: 750px) {
    .header-logo__img {
        position: absolute;
        top: 50%;
        left: 10.7%;
        width: 60%;
        vertical-align: top;
        transform: translateY(-50%);
    }
}
/*  header-nav
--------------------------------------------- */
@media screen and (min-width: 751px) {
    .header-nav__link {
        transition: opacity 300ms;
    }
    .header-nav__link:hover {
        opacity: 0.7;
    }
}
/* ---------------------------------------------
*   l-contents
--------------------------------------------- */
/* ---------------------------------------------
*   contents
--------------------------------------------- */
.contents {
    color: #333;
}

/* ---------------------------------------------
*   l-footer
--------------------------------------------- */
@media screen and (min-width: 751px) {
    .footer-wrap {
        position: relative;
    }
    .footer {
        position: relative;
    }
    .footer-pagetop {
        position: fixed;
        right: 20px;
        bottom: 30px;
        z-index: 999;
        display: none;
        width: 62px;
        height: 62px;
    }
    .footer-pagetop--2 {
        bottom: 190px !important;
    }
    .footer-pagetop--2.is-absolute {
        top: -310px !important;
        bottom: auto;
    }
    .footer-pagetop--2 .footer-pagetop__link {
        transition: opacity 0.3s;
    }
    .footer-pagetop--2 .footer-pagetop__link:hover {
        opacity: 0.8;
    }
    .footer-pagetop--icon {
        right: 30px;
        bottom: 100px;
        z-index: 1000;
        width: 156px;
        height: auto;
    }
    .footer-pagetop--icon.is-absolute {
        top: -247px !important;
        bottom: auto;
    }
    .footer-pagetop--use {
        right: 30px;
        bottom: 100px;
        z-index: 1000;
        width: 98px;
        height: auto;
        filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16));
    }
    .footer-pagetop--use.is-absolute {
        top: -210px !important;
        bottom: auto;
    }
    .footer-pagetop.is-absolute {
        position: absolute;
        top: -110px;
        bottom: auto;
    }
    .footer-pagetop__link {
        display: block;
    }
    .footer-pagetop__link-txt {
        display: block;
    }
    .footer-pagetop__link-txt::before {
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        width: 100%;
        height: 100%;
        background-image: url(../202205img/icon_pagetop_hover.png);
        background-position: 0 0;
        background-size: contain;
        background-repeat: no-repeat;
        content: "";
        opacity: 0;
    }
    .footer-pagetop__link-txt:hover {
        opacity: 1;
    }
    .footer-pagetop__link-txt:hover::before {
        opacity: 1;
    }
    .footer-pagetop--icon .footer-pagetop__link-txt::before {
        background-image: url(../202205img/img_fixed_btn_hover.png);
    }
    .footer-pagetop--use .footer-pagetop__link-txt::before {
        background-image: url(../202205img/mfgroup/btn_benefit_use_hover.png);
    }
    .footer-facility {
        margin: 0 auto;
        padding: 2em 0;
        width: 100%;
        background: #0068b7;
        color: #fff;
    }
    .footer-facility__list {
        display: flex;
        -ms-flex-pack: start;
        margin: 0 auto;
        max-width: 1080px;
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}
@media screen and (min-width: 751px) and (max-width: 1234px) {
    .footer-facility__list {
        max-width: 900px;
    }
}
@media screen and (min-width: 751px) and (max-width: 1028px) {
    .footer-facility__list {
        max-width: 720px;
    }
}
@media screen and (min-width: 751px) and (max-width: 822px) {
    .footer-facility__list {
        max-width: 540px;
    }
}
@media screen and (min-width: 751px) {
    .footer-facility__list li {
        margin: 5px;
        width: 170px;
        height: 70px;
        border-radius: 5px;
        background-color: #fff;
    }
    .footer-facility__list li a {
        display: flex;
        -ms-flex-pack: center;
        -ms-flex-align: center;
        width: 100%;
        height: 100%;
        align-items: center;
        justify-content: center;
    }
    .num_01 {
        width: 115px;
    }
    .num_02 {
        width: 145px;
    }
    .num_03 {
        width: 150px;
    }
    .num_04 {
        width: 88px;
    }
    .num_05 {
        width: 83px;
    }
    .num_06 {
        width: 120px;
    }
    .num_07 {
        width: 90px;
    }
    .num_08 {
        width: 155px;
    }
    .num_09 {
        width: 125px;
    }
    .num_10 {
        width: 127px;
    }
    .num_11 {
        width: 115px;
    }
    .num_12 {
        width: 78px;
    }
    .num_15 {
        width: 89px;
    }
    .footer-facility__txtlink-list {
        display: flex;
        -ms-flex-pack: center;
        margin-top: 25px;
        margin-right: auto;
        margin-left: auto;
        max-width: 1080px;
        justify-content: center;
        flex-wrap: wrap;
    }
    .footer-facility__txtlink {
        margin-top: 15px;
        padding: 0 12px;
        border-left: 1px solid #fff;
        font-weight: normal;
        font-size: 14px;
        line-height: 1;
    }
    .footer-facility__txtlink:nth-child(4) {
        border-right: 1px solid #fff;
    }
    .footer-facility__txtlink:last-child {
        border-right: 1px solid #fff;
    }
    .footer_bottom .footer_bottom_wrap {
        position: relative;
        margin: 30px auto 0;
        padding-bottom: 30px;
        width: 810px;
        background: #ffffff;
        font-size: 12px;
    }
    .mf-logo {
        position: absolute;
        top: 0;
        right: 0;
    }
    .mf-logo:hover {
        opacity: 0.7;
    }
    .mf-logo img {
        width: 206px;
        height: auto;
    }
    .footer_bottom_list {
        display: flex;
        color: #908d7d;
        font-weight: normal;
    }
    .footer_bottom_list li {
        margin-right: 1em;
    }
    .footer_bottom_list li:first-child {
        color: #000;
    }
    #footer .copyright {
        min-width: auto;
        height: auto;
        background: none;
        color: #d2cdba;
    }
    #footer .copyright span {
        display: inline;
        padding-top: 0;
        color: #d2cdba;
        text-align: left;
    }
    .footer__bnr {
        display: flex;
        -ms-flex-pack: center;
        -ms-flex-align: center;
        height: 90px;
        background-color: #77c2dd;
        justify-content: center;
        align-items: center;
    }
    .footer__bnr-item {
        width: 450px;
        height: 45px;
    }
    .footer__bnr-item--large {
        width: 530px;
    }
    .footer__bnr-link {
        position: relative;
        display: flex;
        -ms-flex-pack: center;
        -ms-flex-align: center;
        margin: 0 auto;
        height: 100%;
        background-color: white;
        color: #77c2dd;
        font-size: 18px;
        transition: 0.3s;
        align-items: center;
        justify-content: center;
    }
    .footer__bnr-link:after {
        position: absolute;
        top: 50%;
        right: 6%;
        width: 10px;
        height: 10px;
        border-top: 2px solid #77c2dd;
        border-right: 2px solid #77c2dd;
        content: "";
        transform: translateY(-50%) rotate(45deg);
        transform-origin: center;
    }
    .footer__bnr-link:hover {
        background-color: #0068b7;
        color: white;
    }
    .footer__bnr-link:hover:after {
        border-top: 2px solid white;
        border-right: 2px solid white;
    }
    .footer__bnr-link--rounded {
        border-radius: 5px;
    }
}
@media screen and (max-width: 750px) {
    #footer {
        padding-bottom: 0;
        background-color: #fffae6;
    }
    .footer--rower {
        margin-bottom: 17.53333vw;
    }
    .footer--type2 {
        margin-bottom: 28.8vw;
    }
    .footer-wrap {
        position: relative;
    }
    .footer {
        position: relative;
    }
    .footer-pagetop {
        position: absolute;
        top: -33.33333vw;
        right: 1.73333vw;
        left: auto;
        z-index: 999;
        display: none;
        width: 18.13333vw;
        height: 18.13333vw;
    }
    .footer-pagetop--icon {
        position: fixed;
        top: auto;
        right: 3.2vw;
        right: 0;
        bottom: 16vw;
        bottom: 0;
        left: 0;
        z-index: 1000;
        width: 100%;
        height: 12.8vw;
    }
    .windows .footer-pagetop--icon {
        bottom: -0.8vw;
    }
    .footer-pagetop--icon.is-absolute {
        position: absolute;
        top: auto !important;
        bottom: 100%;
    }
    .windows .footer-pagetop--icon.is-absolute {
        bottom: 99%;
    }
    .footer-pagetop--use {
        position: fixed;
        top: auto;
        right: 3.2vw;
        right: 0;
        bottom: 16vw;
        bottom: 0;
        left: 0;
        z-index: 1000;
        width: 100%;
        height: 11.73333vw;
    }
    .windows .footer-pagetop--use {
        bottom: -0.8vw;
    }
    .footer-pagetop--use.is-absolute {
        position: absolute;
        top: auto !important;
        bottom: 99%;
    }
    .footer-pagetop__link {
        display: block;
    }
    .footer_bottom {
        background-color: #ffffff;
    }
    .footer-facility {
        padding-bottom: 3.33333vw;
        background: #0068b7;
    }
    .footer-facility__list {
        display: flex;
        -ms-flex-pack: start;
        margin: 0 auto;
        padding-top: 5.33333vw;
        width: 80vw;
        flex-wrap: wrap;
        justify-content: flex-start;
    }
    .footer-facility__list li {
        margin: 0.66667vw;
        width: 25.33333vw;
        height: 9.33333vw;
        border-radius: 5px;
        background-color: #fff;
    }
    .footer-facility__list li a {
        display: inline-block;
        display: flex;
        -ms-flex-pack: center;
        -ms-flex-align: center;
        width: 100%;
        height: 100%;
        align-items: center;
        justify-content: center;
    }
    .num_01 {
        width: 15.33333vw;
    }
    .num_02 {
        width: 15.73333vw;
    }
    .num_03 {
        width: 20vw;
    }
    .num_04 {
        width: 11.73333vw;
    }
    .num_05 {
        width: 11.06667vw;
    }
    .num_06 {
        width: 16vw;
    }
    .num_07 {
        width: 12vw;
    }
    .num_08 {
        width: 20.66667vw;
    }
    .num_09 {
        width: 16.66667vw;
    }
    .num_10 {
        width: 16.93333vw;
    }
    .num_11 {
        width: 15.33333vw;
    }
    .num_12 {
        width: 10.4vw;
    }
    .num_15 {
        width: 11.86667vw;
    }
    .footer-facility__txtlink-list {
        display: flex;
        -ms-flex-pack: center;
        margin: 0 auto;
        margin-top: 3.33333vw;
        width: 80vw;
        flex-wrap: wrap;
        justify-content: center;
    }
    .footer-facility__txtlink-list--facility {
        margin-top: 0;
        padding-top: 5.33333vw;
    }
    .footer-facility__txtlink {
        display: inherit;
        margin-bottom: 0.35em;
        padding: 0 1.46667vw;
        border-left: 1px solid #fff;
        font-weight: normal;
        line-height: 1;
    }
    .footer-facility__txtlink:nth-of-type(3n) {
        border-right: 1px solid #fff;
    }
    .footer-facility__txtlink:last-child {
        border-right: 1px solid #fff;
    }
    .footer-facility__txtlink a {
        color: #fff;
        font-size: 1.86667vw;
    }
    .footer_bottom .footer_bottom_wrap {
        position: relative;
        margin: 4vw auto;
        padding: 0 5.33333vw;
        width: 100%;
        background: #ffffff;
        font-size: 1.6vw;
    }
    .mf-logo {
        position: static;
        text-align: center;
    }
    .mf-logo:hover {
        opacity: 0.7;
    }
    .mf-logo img {
        margin: 2.66667vh auto;
        max-width: 200px;
        width: 50%;
        height: auto;
    }
    .footer_bottom_list {
        display: flex;
        -ms-flex-pack: center;
        margin: 0 auto;
        width: 66.66667vw;
        color: #908d7d;
        font-weight: normal;
        font-size: 1.6vw;
        justify-content: center;
        flex-wrap: wrap;
    }
    .footer_bottom_list li {
        margin-right: 1em;
        margin-bottom: 1em;
    }
    .footer_bottom_list li:first-child {
        color: #000;
    }
    .footer_bottom_list li:last-of-type {
        margin-right: 0;
        margin-bottom: 0;
    }
    .footer_bottom_list li a {
        font-size: 1.6vw;
    }
    #footer .copyright {
        min-width: auto;
        height: auto;
        background: none;
        color: #d2cdba;
        text-align: center;
    }
    #footer .copyright span {
        display: inline;
        padding-top: 0;
        color: #d2cdba;
        text-align: left;
        font-size: 1.6vw;
    }
    .footer__bnr {
        display: flex;
        -ms-flex-pack: center;
        -ms-flex-align: center;
        height: 12vw;
        background-color: #77c2dd;
        justify-content: center;
        align-items: center;
    }
    .footer__bnr-item {
        width: 57.33333vw;
        height: 6vw;
    }
    .footer__bnr-item--large {
        width: 70.66667vw;
    }
    .footer__bnr-link {
        position: relative;
        display: flex;
        -ms-flex-pack: center;
        -ms-flex-align: center;
        margin: 0 auto;
        height: 100%;
        background-color: white;
        color: #77c2dd;
        font-size: 2.4vw;
        transition: 0.3s;
        align-items: center;
        justify-content: center;
    }
    .footer__bnr-link:after {
        position: absolute;
        top: 50%;
        right: 6%;
        width: 1.33333vw;
        height: 1.33333vw;
        border-top: 2px solid #77c2dd;
        border-right: 2px solid #77c2dd;
        content: "";
        transform: translateY(-50%) rotate(45deg);
        transform-origin: center;
    }
    .footer__bnr-link:hover {
        background-color: #0068b7;
        color: white;
    }
    .footer__bnr-link:hover:after {
        border-top: 2px solid white;
        border-right: 2px solid white;
    }
    .footer__bnr-link--rounded {
        border-radius: 5px;
    }
    .footer--top {
        margin-bottom: 15.33333vw;
    }
}
/* ---------------------------------------------
*   c-item-12
--------------------------------------------- */
@media screen and (min-width: 751px) {
    .c-item-12 {
        display: none !important;
    }
}
@media screen and (max-width: 750px) {
    .c-item-12 {
        display: block;
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: 999;
        background-color: rgba(0, 0, 0, 0.45);
        padding: calc(10 / var(--design-width) * 100vw) calc(12 / var(--design-width) * 100vw);
    }
    .c-item-12 img {
        width: 100%;
    }
    .c-item-12 a {
        display: block;
        width: 100%;
        height: 100%;
    }
}
.js-fixed-mfgr {
    display: none;
}

/* ---------------------------------------------
*   p-top-nav
--------------------------------------------- */
.p-top-nav {
    padding-block: 50px 60px;
    background-color: #fff;
}

@media screen and (max-width: 750px) {
    .p-top-nav {
        padding-block: 16.6vw;
    }
}
.p-top-nav__container {
    max-width: 820px;
    margin: 0 auto;
}

@media screen and (max-width: 750px) {
    .p-top-nav__container {
        max-width: initial;
        width: 89.3333333333vw;
    }
}
.p-top-nav__ttl {
    width: 220px;
    margin: 0 auto 40px;
}

@media screen and (max-width: 750px) {
    .p-top-nav__ttl {
        width: 50.6666666667vw;
        margin: 0 auto 8vw;
    }
}
.p-top-nav__ttl img {
    width: 100%;
    height: 100%;
}

.p-top-nav__inner {
    display: flex;
    align-items: center;
    padding: 12px 17px 13px 20px;
    border-bottom: 1px solid #D3D9E0;
}

@media screen and (max-width: 750px) {
    .p-top-nav__inner {
        display: block;
        padding: 4.333333vw 5.3333333333vw 3.833333vw;
    }
}
.p-top-nav__category {
    margin-right: 59px;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.05em;
    color: #133755;
    transition: all 0.3s;
}

@media screen and (min-width: 751px) {
    .safari .p-top-nav__category {
        margin-right: 55px;
    }
}
@media screen and (max-width: 750px) {
    .p-top-nav__category {
        display: block;
        font-size: 3.2vw;
        margin-right: 0;
        margin-bottom: 2.6666666667vw;
    }
}
@media screen and (min-width: 751px) and (hover: hover) and (pointer: fine) {
    .p-top-nav__category:hover {
        color: #0057AA;
    }
}
.p-top-nav--sekisan {
    padding-top: 70px;
}
@media screen and (max-width: 750px) {
    .p-top-nav--sekisan {
        padding-top: calc(48 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   p-top-list-nav
--------------------------------------------- */
.p-top-list-nav {
    display: flex;
    flex-wrap: wrap;
    -moz-column-gap: 20px;
    column-gap: 20px;
}

@media screen and (max-width: 750px) {
    .p-top-list-nav {
        display: block;
    }
}
.p-top-list-nav--1 .p-top-list-nav__item {
    border-top: 1px solid #D3D9E0;
}

@media screen and (max-width: 750px) {
    .p-top-list-nav--1 .p-top-list-nav__item {
        border-top: 0.2666666667vw solid #D3D9E0;
    }
    .p-top-list-nav--1 .p-top-list-nav__item:nth-of-type(2) {
        border-top: none;
    }
}
.p-top-list-nav--2 {
    gap: 55px;
}

@media screen and (max-width: 750px) {
    .p-top-list-nav--2 {
        display: flex;
        flex-wrap: wrap;
        -moz-column-gap: 10.6666666667vw;
        column-gap: 10.6666666667vw;
        row-gap: 2.033333vw;
    }
}
.p-top-list-nav--2 .p-top-list-nav__item {
    width: 97px;
    padding: 0;
    border-bottom: none;
}

@media screen and (min-width: 751px) {
    .p-top-list-nav--2 .p-top-list-nav__item:nth-of-type(4) {
        width: 107px;
    }
}
@media screen and (max-width: 750px) {
    .p-top-list-nav--2 .p-top-list-nav__item {
        width: 33.8666666667vw;
    }
}
.p-top-list-nav__item {
    width: 48.7804878049%;
    padding: 14px 20px 15px;
    border-bottom: 1px solid #D3D9E0;
}

@media screen and (max-width: 750px) {
    .p-top-list-nav__item {
        width: 100%;
        padding: 3.533333vw 5.033333vw 3.833333vw;
        border-bottom: 0.2666666667vw solid #D3D9E0;
    }
}
.p-top-list-nav__link {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

@media screen and (min-width: 751px) and (hover: hover) and (pointer: fine) {
    .p-top-list-nav__link:hover .p-top-list-nav__txt {
        color: #0057AA;
    }
}
.p-top-list-nav__link::before {
    content: "";
    position: absolute;
    background: url(/msppoint/membersprogram/202405img/icon_arrow_blue.svg) 0 0 no-repeat;
    background-size: contain;
    width: 5px;
    height: 10px;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

@media screen and (max-width: 750px) {
    .p-top-list-nav__link::before {
        width: 1.3333333333vw;
        height: 2.6666666667vw;
    }
}
.p-top-list-nav__txt {
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.05em;
    color: #133755;
    transition: all 0.3s;
}

@media screen and (max-width: 750px) {
    .p-top-list-nav__txt {
        font-size: 3.2vw;
    }
}
/* ==========================================================
*
*   javascript style hooks
*
========================================================== */
/* ---------------------------------------------
*   js-acc-target
--------------------------------------------- */
.js-acc-target {
    display: none;
}

.js-acc-inner-target {
    display: none;
}

/* ---------------------------------------------
*   Magnific Popup
--------------------------------------------- */
/* Magnific Popup CSS */
.mfp-bg {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1042;
    overflow: hidden;
    width: 100%;
    height: 100%;
    background-color: #0b0b0b;
    opacity: 0.8;
}

.mfp-wrap {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1043;
    width: 100%;
    height: 100%;
    outline: none !important;
    -webkit-backface-visibility: hidden;
}

/* ---------------------------------------------
*   mfp-container
--------------------------------------------- */
.mfp-container {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.mfp-container {
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    text-align: center;
}

.mfp-container:before {
    display: inline-block;
    height: 100%;
    content: "";
    vertical-align: middle;
}

.mfp-align-top .mfp-container:before {
    display: none;
}

/* ---------------------------------------------
*   mfp-content
--------------------------------------------- */
.mfp-content {
    margin: 0 auto !important;
    padding: 70px 0 170px;
    width: 100%;
    height: auto;
    color: #333;
}

@media screen and (max-width: 750px) {
    .mfp-content {
        padding: 21.33333vw 0 46.66667vw;
    }
}
.mfp-content {
    position: relative;
    z-index: 1045;
    display: inline-block;
    margin: 0 auto;
    vertical-align: middle;
    text-align: left;
}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
    width: 100%;
    cursor: auto;
}

.mfp-ajax-cur {
    cursor: progress;
}

.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
    cursor: zoom-out;
}

.mfp-zoom {
    cursor: pointer;
    cursor: zoom-in;
}

.mfp-auto-cursor .mfp-content {
    cursor: auto;
}

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.mfp-loading.mfp-figure {
    display: none;
}

.mfp-hide {
    display: none !important;
}

.mfp-preloader {
    position: absolute;
    top: 50%;
    right: 8px;
    left: 8px;
    z-index: 1044;
    margin-top: -0.8em;
    width: auto;
    color: #CCC;
    text-align: center;
}

.mfp-preloader a {
    color: #CCC;
}

.mfp-preloader a:hover {
    color: #FFF;
}

.mfp-s-ready .mfp-preloader {
    display: none;
}

.mfp-s-error .mfp-content {
    display: none;
}

button.mfp-close,
button.mfp-arrow {
    z-index: 1046;
    display: block;
    overflow: visible;
    padding: 0;
    outline: none;
    border: 0;
    background: transparent;
    box-shadow: none;
    cursor: pointer;
    -webkit-appearance: none;
    touch-action: manipulation;
}

button::-moz-focus-inner {
    padding: 0;
    border: 0;
}

.mfp-close {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0 0 18px 10px;
    width: 44px;
    height: 44px;
    color: #FFF;
    text-align: center;
    text-decoration: none;
    font-style: normal;
    font-size: 28px;
    font-family: Arial, Baskerville, monospace;
    line-height: 44px;
    opacity: 0.65;
}

.mfp-close:hover,
.mfp-close:focus {
    opacity: 1;
}

.mfp-close:active {
    top: 1px;
}

.mfp-close-btn-in .mfp-close {
    color: #333;
}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
    right: -6px;
    padding-right: 6px;
    width: 100%;
    color: #FFF;
    text-align: right;
}

.mfp-counter {
    position: absolute;
    top: 0;
    right: 0;
    color: #CCC;
    white-space: nowrap;
    font-size: 12px;
    line-height: 18px;
}

.mfp-arrow {
    position: absolute;
    top: 50%;
    margin: 0;
    margin-top: -55px;
    padding: 0;
    width: 90px;
    height: 110px;
    opacity: 0.65;
    -webkit-tap-highlight-color: transparent;
}

.mfp-arrow:active {
    margin-top: -54px;
}

.mfp-arrow:hover,
.mfp-arrow:focus {
    opacity: 1;
}

.mfp-arrow:before,
.mfp-arrow:after {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    margin-top: 35px;
    margin-left: 35px;
    width: 0;
    height: 0;
    border: medium inset transparent;
    content: "";
}

.mfp-arrow:after {
    top: 8px;
    border-top-width: 13px;
    border-bottom-width: 13px;
}

.mfp-arrow:before {
    border-top-width: 21px;
    border-bottom-width: 21px;
    opacity: 0.7;
}

.mfp-arrow-left {
    left: 0;
}

.mfp-arrow-left:after {
    margin-left: 31px;
    border-right: 17px solid #FFF;
}

.mfp-arrow-left:before {
    margin-left: 25px;
    border-right: 27px solid #3F3F3F;
}

.mfp-arrow-right {
    right: 0;
}

.mfp-arrow-right:after {
    margin-left: 39px;
    border-left: 17px solid #FFF;
}

.mfp-arrow-right:before {
    border-left: 27px solid #3F3F3F;
}

.mfp-iframe-holder {
    padding-top: 40px;
    padding-bottom: 40px;
}

.mfp-iframe-holder .mfp-content {
    max-width: 900px;
    width: 100%;
    line-height: 0;
}

.mfp-iframe-holder .mfp-close {
    top: -40px;
}

.mfp-iframe-scaler {
    overflow: hidden;
    padding-top: 56.25%;
    width: 100%;
    height: 0;
}

.mfp-iframe-scaler iframe {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background: #000;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
}

/* Main image in popup */
img.mfp-img {
    display: block;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 40px 0 40px;
    max-width: 100%;
    width: auto;
    height: auto;
    line-height: 0;
}

/* The shadow behind the image */
.mfp-figure {
    line-height: 0;
}

.mfp-figure:after {
    position: absolute;
    top: 40px;
    right: 0;
    bottom: 40px;
    left: 0;
    z-index: -1;
    display: block;
    width: auto;
    height: auto;
    background: #444;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
    content: "";
}

.mfp-figure small {
    display: block;
    color: #BDBDBD;
    font-size: 12px;
    line-height: 14px;
}

.mfp-figure figure {
    margin: 0;
}

.mfp-bottom-bar {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: -36px;
    width: 100%;
    cursor: auto;
}

.mfp-title {
    padding-right: 36px;
    color: #F3F3F3;
    text-align: left;
    word-wrap: break-word;
    line-height: 18px;
}

.mfp-image-holder .mfp-content {
    max-width: 100%;
}

.mfp-gallery .mfp-image-holder .mfp-figure {
    cursor: pointer;
}

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
    .mfp-img-mobile .mfp-image-holder {
        padding-right: 0;
        padding-left: 0;
    }
    .mfp-img-mobile img.mfp-img {
        padding: 0;
    }
    .mfp-img-mobile .mfp-figure:after {
        top: 0;
        bottom: 0;
    }
    .mfp-img-mobile .mfp-figure small {
        display: inline;
        margin-left: 5px;
    }
    .mfp-img-mobile .mfp-bottom-bar {
        position: fixed;
        top: auto;
        bottom: 0;
        box-sizing: border-box;
        margin: 0;
        padding: 3px 5px;
        background: rgba(0, 0, 0, 0.6);
    }
    .mfp-img-mobile .mfp-bottom-bar:empty {
        padding: 0;
    }
    .mfp-img-mobile .mfp-counter {
        top: 3px;
        right: 5px;
    }
    .mfp-img-mobile .mfp-close {
        position: fixed;
        top: 0;
        right: 0;
        padding: 0;
        width: 35px;
        height: 35px;
        background: rgba(0, 0, 0, 0.6);
        text-align: center;
        line-height: 35px;
    }
}
@media all and (max-width: 900px) {
    .mfp-arrow {
        transform: scale(0.75);
    }
    .mfp-arrow-left {
        transform-origin: 0;
    }
    .mfp-arrow-right {
        transform-origin: 100%;
    }
    .mfp-container {
        padding-right: 6px;
        padding-left: 6px;
    }
}
/* ---------------------------------------------
*   white-popup
--------------------------------------------- */
.white-popup {
    width: 800px;
    margin-inline: auto;
}

@media screen and (max-width: 750px) {
    .white-popup {
        width: 89.3333333333vw;
    }
}
/* ---------------------------------------------
*   c-popup__container
--------------------------------------------- */
.c-popup {
    position: relative;
    padding: 0;
}

.c-popup__ttl {
    font-family: "Shippori Mincho", serif;
}

.c-popup--top .c-popup__container {
    border-radius: 8px;
    overflow: hidden;
}

@media screen and (max-width: 750px) {
    .c-popup--top .c-popup__container {
        border-radius: 1.3333333333vw;
    }
}
.c-popup--top .c-popup__head {
    background-color: #fff;
    padding: 48px 0 0 0;
}

@media screen and (max-width: 750px) {
    .c-popup--top .c-popup__head {
        padding: 10.6666666667vw 0 0 0;
    }
}
.c-popup--top .c-popup__sub-ttl {
    font-family: "Shippori Mincho", serif;
}

.c-popup--top .c-popup__sub-ttl {
    font-family: "Shippori Mincho", serif;
}

.c-popup--top .c-popup__body {
    padding: 37px 70px 30px;
}

@media screen and (max-width: 750px) {
    .c-popup--top .c-popup__body {
        padding: 9.8666666667vw 5.3333333333vw 8vw;
    }
}
.c-popup--top .c-popup__txt {
    background-color: #fff;
    padding: 0;
    margin-bottom: 17px;
}

@media screen and (max-width: 750px) {
    .c-popup--top .c-popup__txt {
        margin-bottom: 4.5333333333vw;
    }
}
.c-popup--top .c-popup__body {
    text-align: center;
}

.c-popup .c-popup__close-btn .p-top-btn {
    position: absolute;
    left: 50%;
    bottom: -92px;
    width: 430px;
    transform: translateX(-50%);
    background: linear-gradient(180deg, #A17F3B 0%, #82672F 100%);
    border: none;
    color: #fff;
}

.c-popup .c-popup__close-btn .p-top-btn--1 {
    bottom: -89px;
    padding-right: 0;
}

@media screen and (max-width: 750px) {
    .c-popup .c-popup__close-btn .p-top-btn {
        bottom: -18.3333333333vw;
        width: 89.3333333333vw;
    }
    .c-popup .c-popup__close-btn .p-top-btn--onlineStore {
        width: calc(204 / var(--design-width) * 100vw);
    }
}
.c-popup .c-popup__close-btn .p-top-btn::before {
    -webkit-mask-image: url(/msppoint/membersprogram/202405img/modal/icon_modal_close.svg);
    mask-image: url(/msppoint/membersprogram/202405img/modal/icon_modal_close.svg);
    background-color: #fff;
}

.c-popup .c-popup__close-btn .p-top-btn:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background: #7E632D;
    opacity: 0;
    transition: all 0.3s;
}

@media screen and (max-width: 750px) {
    .c-popup .c-popup__close-btn .p-top-btn:after {
        border-radius: 1.3333333333vw;
    }
}
@media screen and (min-width: 751px) {
    .c-popup .c-popup__close-btn .p-top-btn:hover::after {
        opacity: 1;
    }
}
.c-popup .c-popup__close-btn .p-top-btn--static {
    position: static;
    transform: translateX(0);
    background: #fff;
    color: #133755;
    margin: 30px auto 0;
}

@media screen and (max-width: 750px) {
    .c-popup .c-popup__close-btn .p-top-btn--static {
        margin: 8vw auto 0;
        width: 100%;
    }
}
.c-popup .c-popup__close-btn .p-top-btn--static::before {
    background-image: url(/msppoint/membersprogram/202405img/icon_arrow_link_btn.svg);
}

.c-popup__container {
    margin: 0 auto;
    max-width: 800px;
    border-radius: 30px;
    background-color: #fff;
}

@media screen and (max-width: 750px) {
    .c-popup__container {
        border-radius: 5.33333vw;
    }
}
.c-popup__head {
    padding: 23px 0 17px;
    border-radius: 20px 20px 0 0;
    background-color: #E2F1FF;
    color: #235EA5;
    text-align: center;
}

@media screen and (max-width: 750px) {
    .c-popup__head {
        padding: 4vw 0 2.66667vw;
    }
}
.c-popup__sub-ttl {
    font-weight: bold;
    font-size: 14px;
}

@media screen and (max-width: 750px) {
    .c-popup__sub-ttl {
        font-size: 3.73333vw;
    }
}
.c-popup__ttl {
    font-weight: bold;
    font-size: 22px;
}

@media screen and (max-width: 750px) {
    .c-popup__ttl {
        font-size: 5.86667vw;
    }
}
.c-popup__body {
    padding: 40px 70px 30px;
}

@media screen and (max-width: 750px) {
    .c-popup__body {
        padding: 8.95522% 5.37313% 7.46269%;
    }
}
.c-popup__txt {
    padding: 27px 1em;
    border-radius: 0 0 20px 20px;
    background-color: #F5F5F5;
    text-align: center;
    font-weight: bold;
    font-size: 12px;
}

@media screen and (max-width: 750px) {
    .c-popup__txt {
        padding: 6.66667vw 1em;
        border-radius: 0 0 4.66667vw 4.66667vw;
        font-size: 3.73333vw;
    }
}
.c-popup__close {
    position: absolute;
    bottom: -80px;
    left: 50%;
    display: inline-block;
    padding: 18px 0;
    width: 335px;
    border-radius: 10px;
    background-color: #E4C754;
    color: #1F3983;
    font-weight: bold;
    font-size: 14px;
    transform: translateX(-50%);
}

@media all and (-ms-high-contrast: none) {
    .c-popup__close {
        padding: 19px 0 11px;
    }
}
@-moz-document url-prefix() {
    .c-popup__close {
        padding: 12px 0;
    }
}
@media screen and (max-width: 750px) {
    .c-popup__close {
        bottom: -20.8vw;
        padding: 4.8vw 0;
        width: 89.33333vw;
        border-radius: 2.66667vw;
        font-size: 3.73333vw;
    }
}
.c-popup__close:hover {
    opacity: 0.8;
}

.c-popup__container--2 {
    background-image: url(/msppoint/membersprogram/assets/img/top/modal/bg_modal_menpro_henkou.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

/* ---------------------------------------------
*   .c-popup-2
--------------------------------------------- */
.c-popup-2 {
    position: relative;
    padding: 0;
}

.c-popup-2__container {
    border-radius: 5px;
}

@media screen and (max-width: 750px) {
    .c-popup-2__container {
        border-radius: 1.3333333333vw;
    }
}
/* ---------------------------------------------
*   c-popup-2
--------------------------------------------- */
@media screen and (max-width: 750px) {
    .c-popup-2 {
        padding: 0 5.33333%;
    }
}
.c-popup-2__container {
    margin-right: auto;
    margin-left: auto;
    max-width: 800px;
    border-radius: 30px;
    background-color: #fff;
}

@media screen and (max-width: 750px) {
    .c-popup-2__container {
        max-width: none;
        border-radius: 5.33333vw;
    }
}
.c-popup-2__head {
    display: flex;
    -ms-flex-pack: center;
    -ms-flex-align: center;
    padding: 15px;
    border-radius: 28px 28px 0 0;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

@media screen and (max-width: 750px) {
    .c-popup-2__head {
        display: block;
        padding: 0.66667vw 0 2.66667vw;
        border-radius: 4.66667vw 4.66667vw 0 0;
        gap: calc(2 / var(--design-width) * 100vw);
    }
}
.c-popup-2--web .c-popup-2__head {
    background-color: #2F69B7;
}

.c-popup-2--app .c-popup-2__head {
    background-color: #5EC6D1;
}

.c-popup-2--app-medal .c-popup-2__head {
    padding-top: 20px;
    background-color: #5EC6D1;
}

@media screen and (max-width: 750px) {
    .c-popup-2--app-medal .c-popup-2__head {
        display: flex;
        padding-top: 4vw;
    }
}
.c-popup-2__head-icon {
    margin-right: 15px;
    width: 50px;
}

@media screen and (max-width: 750px) {
    .c-popup-2__head-icon {
        margin-right: auto;
        margin-bottom: 1.06667vw;
        margin-left: auto;
        width: 12vw;
    }
}
@media screen and (min-width: 751px) {
    .c-popup-2--app .c-popup-2__head-icon {
        margin-right: 7px;
    }
}
@media screen and (max-width: 750px) {
    .c-popup-2--app-medal .c-popup-2__head-icon {
        margin-right: 2.66667vw;
        margin-left: 0;
        width: calc(37 / var(--design-width) * 100vw);
    }
}
.c-popup-2__ttl {
    color: #fff;
    letter-spacing: 0.05em;
    font-weight: bold;
    font-size: 22px;
}

.ie .c-popup-2__ttl {
    margin-top: 7px;
}

@media screen and (max-width: 750px) {
    .c-popup-2__ttl {
        text-align: center;
        font-size: 4.8vw;
    }
    .ie .c-popup-2__ttl {
        margin-top: 0;
    }
}
.c-popup-2__ttl .txt-small {
    font-size: 14px;
}

@media screen and (max-width: 750px) {
    .c-popup-2__ttl .txt-small {
        font-size: 3.73333vw;
    }
}
.c-popup-2--app-medal .c-popup-2__ttl {
    display: flex;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
}

@media screen and (max-width: 750px) {
    .c-popup-2--app-medal .c-popup-2__ttl {
        font-size: 5.86667vw;
    }
}
.c-popup-2__lead {
    text-align: center;
    font-weight: bold;
    font-size: 16px;
}

@media screen and (max-width: 750px) {
    .c-popup-2__lead {
        margin-top: 6.66667vw;
        font-size: 4.26667vw;
    }
}
.c-popup-2__btn {
    display: flex;
    -ms-flex-pack: center;
    margin-top: 30px;
    justify-content: center;
}

@media screen and (max-width: 750px) {
    .c-popup-2__btn {
        margin-top: 6.66667vw;
        padding: 0 5.86667vw;
    }
}
.c-popup-2__close {
    position: absolute;
    bottom: -80px;
    left: 50%;
    display: inline-block;
    padding: 18px 0;
    width: 335px;
    border-radius: 10px;
    background-color: #E4C754;
    color: #1F3983;
    font-weight: bold;
    font-size: 14px;
    transform: translateX(-50%);
}

@media all and (-ms-high-contrast: none) {
    .c-popup-2__close {
        padding: 19px 0 11px;
    }
}
@-moz-document url-prefix() {
    .c-popup-2__close {
        padding: 12px 0;
    }
}
@media screen and (max-width: 750px) {
    .c-popup-2__close {
        bottom: -20.8vw;
        padding: 4.8vw 0;
        width: 89.33333vw;
        border-radius: 2.66667vw;
        font-size: 3.73333vw;
    }
}
.c-popup-2__close:hover {
    opacity: 0.8;
}

/* ---------------------------------------------
*   .c-popup-2
--------------------------------------------- */
.c-popup-2 {
    padding: 0;
}

.c-popup-2__container {
    border-radius: 5px;
}

@media screen and (max-width: 750px) {
    .c-popup-2__container {
        border-radius: 1.3333333333vw;
    }
}
/* ---------------------------------------------
*   p-top-popup
--------------------------------------------- */
.p-top-popup {
    padding-bottom: 50px;
}

@media screen and (max-width: 750px) {
    .p-top-popup {
        padding-bottom: 9.3333333333vw;
    }
}
.p-top-popup--pb0 {
    padding-bottom: 0;
}

@media screen and (min-width: 751px) {
    .p-top-popup--pbpc0 {
        padding-bottom: 0;
    }
}

.p-top-popup--1 {
    background-color: #133755;
    padding: 10px;
}

.p-top-popup--2 {
    padding: 6px;
}
@media screen and (max-width: 750px) {
    .p-top-popup--2 {
        padding: calc(6 / var(--design-width) * 100vw);
    }
}

.p-top-popup--3 {
    padding-block: 36px 42px;
}
@media screen and (max-width: 750px) {
    .p-top-popup--3 {
        padding-block: calc(39 / var(--design-width) * 100vw);
    }
}

.p-top-popup--gold .p-top-popup__head--2 {
    background-color: #F5F1DF;
}

.p-top-popup--gold .p-top-popup__day {
    color: #D3AA03;
}

.p-top-popup--gold .p-top-popup__day::before, .p-top-popup--gold .p-top-popup__day::after {
    background: #D3AA03;
}

.p-top-popup--silver .p-top-popup__day {
    color: #6A6A6A;
}

.p-top-popup--silver .p-top-popup__day::before, .p-top-popup--silver .p-top-popup__day::after {
    background: #BCBCBC;
}

.p-top-popup--bronze .p-top-popup__day {
    color: #E56F4D;
}

.p-top-popup--bronze .p-top-popup__day::before, .p-top-popup--bronze .p-top-popup__day::after {
    background: #E56F4D;
}

.p-top-popup__container--1 {
    background-color: #fff;
    --edge-width: 10px;
    -webkit-clip-path: polygon(var(--edge-width) 0, calc(100% - var(--edge-width)) 0, 100% var(--edge-width), 100% calc(100% - var(--edge-width)), calc(100% - var(--edge-width)) 100%, var(--edge-width) 100%, 0 calc(100% - var(--edge-width)), 0 var(--edge-width));
    clip-path: polygon(var(--edge-width) 0, calc(100% - var(--edge-width)) 0, 100% var(--edge-width), 100% calc(100% - var(--edge-width)), calc(100% - var(--edge-width)) 100%, var(--edge-width) 100%, 0 calc(100% - var(--edge-width)), 0 var(--edge-width));
    padding-block: 32px 28px;
}
@media screen and (max-width: 750px) {
    .p-top-popup__container--1 {
        padding-top: 0;
        padding-bottom: calc(10 / var(--design-width) * 100vw);
    }
}
.p-top-popup__container--2 {
    padding-block: 42px 35px;
    border: 1px solid #A17F3B;
    border-radius: 8px;
}
@media screen and (max-width: 750px) {
    .p-top-popup__container--2 {
        border: calc(1 / var(--design-width) * 100vw) solid #A17F3B;
        padding-block: 0;
        border-radius: calc(5 / var(--design-width) * 100vw);
    }
}
.p-top-popup__container--3 {
    padding-block: 40px 44px;
}
@media screen and (max-width: 750px) {
    .p-top-popup__container--3 {
        padding-block: 0;
    }
}
.p-top-popup__container--service {
    padding-block: 0;
}

.p-top-popup__head {
    max-width: 700px;
    margin: 0 auto;
    padding-top: 50px;
    padding-bottom: 26px;
    border-bottom: 1px solid #333333;
}
@media screen and (max-width: 750px) {
    .p-top-popup__head {
        max-width: initial;
        width: 84vw;
        padding-top: 8.8vw;
        padding-bottom: 5.9333333333vw;
        border-bottom: 0.2666666667vw solid #333333;
    }
}
.p-top-popup__head--top {
    display: block;
    font-family: "Shippori Mincho", serif;
    font-weight: 700;
    text-align: center;
}
.p-top-popup__head--sekisan {
    font-size: 1.625rem;
    font-weight: 700;
    font-family: "Yu Gothic", "游ゴシック", "YuGothic", sans-serif;
    border-bottom: 1px solid #133755;
}
@media screen and (min-width: 751px) {
    .p-top-popup__head--sekisan {
        padding-block: 0 20px;
    }
}
@media screen and (max-width: 750px) {
    .p-top-popup__head--sekisan .p-top-popup__ttl-txt {
        font-size: calc(22 / var(--design-width) * 100vw);
        letter-spacing: 0;
    }
}
.p-top-popup__head--henkou {
    position: relative;
    display: block;
    font-family: "Shippori Mincho", serif;
    font-weight: 700;
    text-align: center;
    color: #133755;
    padding-top: 0;
    padding-bottom: 0;
    border-bottom: none;
}
@media screen and (max-width: 750px) {
    .p-top-popup__head--henkou {
        padding-top: 6.7vw;
        padding-bottom: calc(14 / var(--design-width) * 100vw);
        border-bottom: 0;
    }
}
.p-top-popup__head--henkou::before {
    position: absolute;
    content: "";
    background-color: #133755;
    width: 458px;
    height: 1px;
    top: 0;
    transform: translate(-229px, 41px);
}
@media screen and (max-width: 750px) {
    .p-top-popup__head--henkou::before {
        width: calc(261 / var(--design-width) * 100vw);
        height: calc(1 / var(--design-width) * 100vw);
        right: 11%;
        transform: translate(calc(8 / var(--design-width) * 100vw), calc(65 / var(--design-width) * 100vw));
    }
}
.p-top-popup__head--henkou::after {
    position: absolute;
    content: "";
    background-color: #133755;
    width: 458px;
    height: 1px;
    bottom: 0;
    transform: translate(-229px, 14px);
}
@media screen and (max-width: 750px) {
    .p-top-popup__head--henkou::after {
        width: calc(261 / var(--design-width) * 100vw);
        height: calc(1 / var(--design-width) * 100vw);
        bottom: 0;
        right: 11%;
        transform: translateX(calc(8 / var(--design-width) * 100vw));
    }
}
.p-top-popup__head--1 {
    color: #133755;
}
.p-top-popup__head--2 {
    display: block;
    max-width: 100%;
    color: #A17F3B;
    font-family: "Shippori Mincho", serif;
    text-align: center;
    font-weight: 700;
    padding-top: 0;
    padding-bottom: 0;
    border-bottom: none;
}
@media screen and (max-width: 750px) {
    .p-top-popup__head--2 {
        padding-block: 6.4vw;
        width: 100%;
        border-bottom: 0;
    }
}
.p-top-popup__head--3 {
    padding-bottom: 16px;
}
.p-top-popup__head--service {
    position: relative;
    display: block;
    width: -moz-max-content;
    width: max-content;
    padding-top: 0;
    padding-bottom: 0;
    border-bottom: none;
    font-family: "Shippori Mincho", serif;
    font-weight: 700;
    text-align: center;
    color: #133755;
}
@media screen and (max-width: 750px) {
    .p-top-popup__head--service {
        padding-block: 0;
        border-bottom: 0;
        margin-inline: auto;
    }
}
.p-top-popup__head--service::after {
    content: "";
    position: absolute;
    background-color: #133755;
    width: 100%;
    height: 1px;
    left: 0;
    bottom: 0;
    transform: translateY(5px);
}
@media screen and (max-width: 750px) {
    .p-top-popup__head--service::after {
        transform: translateY(calc(6 / var(--design-width) * 100vw));
    }
}
.p-top-popup__head--radius {
    border-radius: 5px 5px 0 0;
}
@media screen and (max-width: 750px) {
    .p-top-popup__head--radius {
        border-radius: 1.3333333333vw 1.3333333333vw 0 0;
    }
}

.p-top-popup__ttl--2 {
    margin-top: 2px;
}

.p-top-popup__ttl-sub {
    font-size: 1.125rem;
}
@media screen and (max-width: 750px) {
    .p-top-popup__ttl-sub {
        margin-top: calc(15 / var(--design-width) * 100vw);
        font-size: calc(15 / var(--design-width) * 100vw);
    }
}

@media screen and (max-width: 750px) {
    .p-top-popup__ttl-sub--1 {
        display: inline-block;
    }
}

.p-top-popup__ttl-sub--2 {
    position: relative;
    line-height: 1.61111111;
    letter-spacing: 0.02em;
    transform: translateY(-2px);
}
@media screen and (max-width: 750px) {
    .p-top-popup__ttl-sub--2 {
        font-size: calc(13 / var(--design-width) * 100vw);
        margin-top: calc(4 / var(--design-width) * 100vw);
    }
}
.p-top-popup__ttl-sub--2::before {
    position: absolute;
    content: "";
    background-color: #A17F3B;
    width: 1px;
    height: 15px;
    bottom: 0;
    left: 50%;
    transform: translate(-134px, -5px);
}
@media screen and (max-width: 750px) {
    .p-top-popup__ttl-sub--2::before {
        width: calc(1 / var(--design-width) * 100vw);
        height: calc(9 / var(--design-width) * 100vw);
        bottom: 83%;
        right: 7%;
        transform: translate(calc(-99 / var(--design-width) * 100vw), calc(13 / var(--design-width) * 100vw));
    }
}
.p-top-popup__ttl-sub--2::after {
    position: absolute;
    content: "";
    background-color: #A17F3B;
    width: 1px;
    height: 15px;
    bottom: 0;
    right: 0;
    transform: translate(-259px, -5px);
}
@media screen and (max-width: 750px) {
    .p-top-popup__ttl-sub--2::after {
        width: calc(1 / var(--design-width) * 100vw);
        height: calc(9 / var(--design-width) * 100vw);
        bottom: 83%;
        right: 7%;
        transform: translate(calc(-40 / var(--design-width) * 100vw), calc(13 / var(--design-width) * 100vw));
    }
}

.p-top-popup__ttl-sub--onlinestore {
    position: relative;
    letter-spacing: -0.02em;
}

.p-top-popup__ttl-txt {
    display: block;
    font-weight: bold;
    font-size: 1.625rem;
    letter-spacing: 0.05em;
    line-height: 1.3;
    color: #333;
    text-align: center;
}
@media screen and (max-width: 750px) {
    .p-top-popup__ttl-txt {
        font-size: 5.8666666667vw;
    }
}

.p-top-popup__ttl-txt--1 {
    color: #133755;
    font-size: 1.875rem;
    line-height: 1.2;
    letter-spacing: 0;
}
@media screen and (max-width: 750px) {
    .p-top-popup__ttl-txt--1 {
        font-size: calc(22 / var(--design-width) * 100vw);
        line-height: 1.27272727;
    }
}

.p-top-popup__ttl-txt--2 {
    display: flex;
    justify-content: center;
    width: 359px;
    margin-inline: auto;
    color: #A17F3B;
    font-size: 1.75rem;
    line-height: 1.03571429;
    letter-spacing: 0.02em;
    border: 1.2px solid #A17F3B;
    border-radius: 5px;
    padding-block: 10px 10px;
}
@media screen and (max-width: 750px) {
    .p-top-popup__ttl-txt--2 {
        width: calc(243 / var(--design-width) * 100vw);
        font-size: calc(19 / var(--design-width) * 100vw);
        line-height: 1.52631579;
        border-radius: 5px;
        padding-block: calc(3 / var(--design-width) * 100vw) calc(4 / var(--design-width) * 100vw);
    }
}

.p-top-popup__ttl-txt--3 {
    color: #133755;
    font-size: 1.25rem;
}

.p-top-popup__ttl-img {
    width: 111px;
    margin: 0 auto 15px;
}

.p-top-popup__ttl-img--1 {
    width: 111px;
    margin: 0 auto 24px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__ttl-img {
        width: 25.0666666667vw;
        margin: 0 auto 4vw;
    }
}
.p-top-popup__ttl-img--2 {
    width: 86px;
    margin: 0 auto 15px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__ttl-img--2 {
        width: 18.6666666667vw;
        margin: 0 auto 4vw;
    }
}
.p-top-popup__ttl-img--3 {
    width: 85px;
    margin: 0 auto 15px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__ttl-img--3 {
        width: 19.2vw;
        margin: 0 auto 4vw;
    }
}
.p-top-popup__ttl-img--4 {
    width: 103px;
    margin: 0 auto 15px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__ttl-img--4 {
        width: 23.7333333333vw;
        margin: 0 auto 4vw;
    }
}
.p-top-popup__ttl-img img {
    width: 100%;
}

.p-top-popup__ttl-txt--s {
    display: block;
    margin-bottom: 5px;
    color: #333;
    font-size: 1.125rem;
    line-height: 1.125;
}

@media screen and (max-width: 750px) {
    .p-top-popup__ttl-txt--s {
        margin-bottom: 1.3333333333vw;
        font-size: 3.2vw;
    }
}
.p-top-popup__body {
    max-width: 700px;
    margin: 0 auto;
    margin-top: 20px;
    text-align: center;
}

@media screen and (max-width: 750px) {
    .p-top-popup__body {
        max-width: initial;
        width: 84vw;
        margin-top: 6vw;
    }
}
.p-top-popup__body--1 {
    margin-top: 34px;
}
@media screen and (max-width: 750px) {
    .p-top-popup__body--1 {
        margin-top: calc(22 / var(--design-width) * 100vw);
    }
}

.p-top-popup__body--pb {
    /* padding-bottom: 40px; */
}

@media screen and (max-width: 750px) {
    .p-top-popup__body--pb {
        padding-bottom: 5.3333333333vw;
    }
}
@media screen and (max-width: 750px) {
    .p-top-popup__body--center {
        text-align: center;
    }
}
.p-top-popup__body--full {
    max-width: initial;
    width: 100%;
}

.p-top-popup__txt {
    text-align: center;
}

.p-top-popup__txt--1 {
    line-height: 1.75;
}
@media screen and (max-width: 750px) {
    .p-top-popup__txt--1 {
        font-size: calc(14 / var(--design-width) * 100vw);
        line-height: 1.57142857;
    }
}

.p-top-popup__img {
    margin-top: 25px;
    margin-bottom: 17px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__img {
        width: 78.6666666667vw;
        margin-inline: auto;
        margin-top: 8vw;
        margin-bottom: 5.3333333333vw;
    }
}
.p-top-popup__img--1 {
    width: 356px;
    margin: 4px auto 0;
}
@media screen and (max-width: 750px) {
    .p-top-popup__img--1 {
        width: calc(288 / var(--design-width) * 100vw);
        margin-top: calc(6 / var(--design-width) * 100vw);
    }
}

.p-top-popup__img--l {
    margin-top: 20px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__img--l {
        width: 84vw;
        margin-top: 5.3333333333vw;
    }
}
.p-top-popup__img--2 {
    margin-block: 20px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__img--2 {
        margin-block: 4vw;
    }
}
.p-top-popup__img-online {
    width: 299px;
    margin-top: 22px;
    margin-inline: auto;
    margin-bottom: 32px;
    transform: translateX(-4px);
}
@media screen and (max-width: 750px) {
    .p-top-popup__img-online {
        width: calc(243 / var(--design-width) * 100vw);
        margin-top: calc(-30 / var(--design-width) * 100vw);
        margin-inline: auto;
        margin-bottom: calc(32 / var(--design-width) * 100vw);
        transform: translateX(0);
    }
}

.p-top-popup__img-service {
    width: 300px;
    margin-top: 22px;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-top-popup__img-service--1 {
        width: calc(269 / var(--design-width) * 100vw);
    }
}
.p-top-popup__img-service--2 {
    margin-top: 30px;
}
@media screen and (max-width: 750px) {
    .p-top-popup__img-service--2 {
        width: calc(226 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-top-popup__img-service--3 {
        width: calc(225 / var(--design-width) * 100vw);
    }
}

.p-top-popup__service-link {
    display: block;
    width: 300px;
    margin-top: 19px;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-top-popup__service-link {
        width: calc(225 / var(--design-width) * 100vw);
        margin-top: calc(20 / var(--design-width) * 100vw);
    }
}

.p-top-popup-service-note {
    margin-top: 11px;
}
@media screen and (max-width: 750px) {
    .p-top-popup-service-note--1 {
        margin-top: calc(20 / var(--design-width) * 100vw);
    }
    .p-top-popup-service-note--2 {
        margin-top: calc(24 / var(--design-width) * 100vw);
    }
    .p-top-popup-service-note--3 {
        margin-top: calc(33 / var(--design-width) * 100vw);
    }
}
.p-top-popup-service-note__item {
    display: flex;
    justify-content: center;
    font-size: 0.75rem;
    line-height: 1.33333333;
    text-align: left;
}
.p-top-popup-service-note__item--2 {
    margin-top: 12px;
}
.p-top-popup-service-note__link {
    text-decoration: underline;
}
.p-top-popup-service-note__link:hover {
    text-decoration: none;
}

.p-top-popup__txt-sub {
    position: relative;
    font-size: 0.75rem;
    line-height: 1.66666667;
    margin-top: 31px;
}
@media screen and (max-width: 750px) {
    .p-top-popup__txt-sub {
        margin-top: calc(35 / var(--design-width) * 100vw);
    }
}
.p-top-popup__txt-sub::after {
    position: absolute;
    content: "";
    background-color: #133755;
    width: 511px;
    height: 1px;
    bottom: 0;
    transform: translate(-414px, 11px);
}
@media screen and (max-width: 750px) {
    .p-top-popup__txt-sub::after {
        width: calc(284 / var(--design-width) * 100vw);
        height: calc(1 / var(--design-width) * 100vw);
        bottom: 83%;
        right: 7%;
        transform: translate(calc(8 / var(--design-width) * 100vw), calc(65 / var(--design-width) * 100vw));
    }
}

.p-top-popup__anno {
    text-indent: -1.12em;
    padding-left: 1em;
    margin-top: 9px;
    line-height: 0.933333;
    text-align: left;
}

.android .p-top-popup__anno {
    text-indent: -0.85em;
}

.p-top-popup__anno--center {
    text-align: center;
}

@media screen and (max-width: 750px) {
    .p-top-popup__anno {
        margin-top: 1.6666666667vw;
    }
    .p-top-popup__anno--s {
        /* width: 78.6666666667vw; */
        margin-inline: auto;
    }
    .p-top-popup__anno--center {
        text-align: left;
        width: 100%;
    }
}
.p-top-popup__anno .c-txt-anno {
    line-height: 1.433333;
}

.p-top-popup__anno a {
    text-decoration: underline;
}

@media screen and (min-width: 751px) and (hover: hover) and (pointer: fine) {
    .p-top-popup__anno a {
        transition: opacity 300ms;
    }
    .p-top-popup__anno a:hover {
        opacity: 0.8;
    }
}
.p-top-popup__card-area {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-top: 20px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__card-area {
        display: block;
        margin-top: 5.3333333333vw;
    }
}
@media screen and (min-width: 751px) {
    .safari .p-top-popup__card-area--gold {
        gap: 10px;
    }
}
@media screen and (max-width: 750px) {
    .p-top-popup__card-area--gold {
        margin-top: 3.4666666667vw;
    }
}
.p-top-popup__limited {
    position: relative;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 2.1538461538;
}

@media screen and (max-width: 750px) {
    .p-top-popup__limited {
        font-size: 3.4666666667vw;
    }
}
.p-top-popup__limited::before, .p-top-popup__limited:after {
    position: absolute;
    top: 50%;
    content: "";
    width: 1px;
    height: 40%;
    background: #000;
    border-radius: 3px;
}

.p-top-popup__limited::before {
    left: -7px;
    transform: translateY(-50%) rotate(-40deg);
}

.p-top-popup__limited:after {
    right: -7px;
    transform: translateY(-50%) rotate(40deg);
}

.p-top-popup__day {
    position: relative;
    display: block;
    margin-top: 20px;
    margin-bottom: 7px;
    margin-inline: auto;
    width: -moz-fit-content;
    width: fit-content;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: -0.05em;
    line-height: 1;
    text-align: center;
    color: #4DA9D6;
}

@media screen and (max-width: 750px) {
    .p-top-popup__day {
        margin-top: 3.0666666667vw;
        margin-bottom: 1.3333333333vw;
        font-size: 3.7333333333vw;
    }
}
.p-top-popup__day::before, .p-top-popup__day::after {
    position: absolute;
    top: 50%;
    content: "";
    width: 8px;
    height: 1px;
    background: #4DA9D6;
    transform: translateY(-50%);
}

@media screen and (max-width: 750px) {
    .p-top-popup__day::before, .p-top-popup__day::after {
        width: 2.366667vw;
        height: 0.2666666667vw;
    }
}
.p-top-popup__day::before {
    left: -15px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__day::before {
        left: -4vw;
    }
}
.p-top-popup__day:after {
    right: -15px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__day:after {
        right: -4vw;
    }
}
@media screen and (max-width: 750px) {
    .p-top-popup .c-box-1__info {
        width: 78.9333333333vw;
        margin-inline: auto;
        padding-inline: 0;
        margin-top: 14vw;
    }
}
.p-top-popup .c-box-1__info::before, .p-top-popup .c-box-1__info::after {
    width: 145px;
}

.p-top-popup .c-box-1__info-ttl {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
    transform: translateX(20px);
}

@media screen and (max-width: 750px) {
    .p-top-popup .c-box-1__info-ttl {
        transform: translateX(0);
        width: auto;
        padding-left: 0;
        font-size: 4.2666666667vw;
        letter-spacing: 0.1em;
    }
}
.p-top-popup .c-box-1__info-ttl::after {
    background-image: url(/msppoint/membersprogram/202405img/icon_atention.svg);
}

@media screen and (max-width: 750px) {
    .p-top-popup .c-box-1__info-ttl::after {
        background-image: url(/msppoint/membersprogram/202405img/sp/icon_atention.svg);
        top: -8vw;
        left: 50%;
        transform: translateX(-50%);
    }
}
.p-top-popup .c-box-1__info-txt {
    text-align: center;
}

@media screen and (min-width: 751px) {
    .p-top-popup .c-box-1__info-txt {
        width: 102%;
    }
}
@media screen and (max-width: 750px) {
    .p-top-popup .c-box-1__info-txt {
        text-align: left;
        padding: 0;
    }
}
.p-top-popup__btn {
    width: 420px;
    margin: 20px auto 26px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__btn {
        width: 78.6666666667vw;
        /* margin: 8vw auto 4.266666666666667vw; */
        margin: 4.2666666667vw auto 4.2666666667vw;
    }
}
.p-top-popup__note {
    margin: 15px auto 0;
    width: -moz-fit-content;
    width: fit-content;
}

@media screen and (max-width: 750px) {
    .p-top-popup__note {
        margin-top: 4vw;
    }
}
.p-top-popup__note--1 {
    margin-top: 30px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__note--1 {
        margin-top: 8vw;
        width: 90.4761904762%;
    }
}
.p-top-popup__note-item {
    display: flex;
    align-items: start;
    justify-content: flex-start;
    text-align: left;
    color: #666666;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.3333333333;
}

@media screen and (max-width: 750px) {
    .p-top-popup__note-item {
        font-size: 3.2vw;
        line-height: 1.3333333333;
    }
}
.p-top-popup__note-item + .p-top-popup__note-item {
    margin-top: 8px;
}

@media screen and (max-width: 750px) {
    .p-top-popup__note-item + .p-top-popup__note-item {
        margin-top: 2.6666666667vw;
    }
}
/* ---------------------------------------------
*   p-top-pre
--------------------------------------------- */
.p-top-pre {
    margin-top: 30px;
}

@media screen and (max-width: 750px) {
    .p-top-pre {
        margin-block: 6.9333333333vw 5.3333333333vw;
    }
}
.p-top-pre__label {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-inline: auto;
    padding-top: 1px;
    width: 113px;
    height: 23px;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4375;
    letter-spacing: 0.05em;
    border-radius: 12px;
}

@media screen and (max-width: 750px) {
    .p-top-pre__label {
        padding-top: 0.2666666667vw;
        width: 24.2666666667vw;
        height: 4.8vw;
        font-size: 3.4666666667vw;
        line-height: 1.5384615385;
        border-radius: 3.2vw;
    }
}
.p-top-pre__label--2 {
    position: relative;
    width: 129px;
    font-size: 14px;
    line-height: 1.57142857;
    letter-spacing: 0;
}
@media screen and (max-width: 750px) {
    .p-top-pre__label--2 {
        width: calc(134 / var(--design-width) * 100vw);
        font-size: calc(14 / var(--design-width) * 100vw);
    }
}

.p-top-pre__label--2::before {
    position: absolute;
    content: "";
    width: 340px;
    height: 1px;
    background-color: #133755;
    top: 13px;
    right: 125px;
}
@media screen and (max-width: 750px) {
    .p-top-pre__label--2::before {
        width: calc(110 / var(--design-width) * 100vw);
        height: calc(1 / var(--design-width) * 100vw);
        top: 50%;
        right: 93%;
    }
}

.p-top-pre__label--2::after {
    position: absolute;
    content: "";
    width: 340px;
    height: 1px;
    background-color: #133755;
    top: 13px;
    left: 125px;
}
@media screen and (max-width: 750px) {
    .p-top-pre__label--2::after {
        width: calc(110 / var(--design-width) * 100vw);
        height: calc(1 / var(--design-width) * 100vw);
        top: 50%;
        left: 93%;
    }
}

.p-top-pre--premium .p-top-pre__label {
    background-color: #4CA9D6;
}

.p-top-pre--gold .p-top-pre__label {
    background-color: #D4AA02;
}

.p-top-pre--silver .p-top-pre__label {
    background-color: #6A6A6A;
}

.p-top-pre--bronze .p-top-pre__label {
    background-color: #E56F4D;
}

.p-top-pre--blue .p-top-pre__label {
    background-color: #133755;
    padding-block: 13px 12px;
}
@media screen and (max-width: 750px) {
    .p-top-pre--blue .p-top-pre__label {
        padding-block: calc(14 / var(--design-width) * 100vw) calc(12 / var(--design-width) * 100vw);
    }
}

.p-top-pre__txt {
    margin-top: 15px;
    text-align: center;
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
}

@media screen and (max-width: 750px) {
    .p-top-pre__txt {
        margin-top: 2.6666666667vw;
        font-size: 4.5333333333vw;
    }
}
.p-top-pre--premium .p-top-pre__txt {
    color: #4CA9D6;
}

.p-top-pre--gold .p-top-pre__txt {
    color: #D4AA02;
}

.p-top-pre--silver .p-top-pre__txt {
    color: #6A6A6A;
}

.p-top-pre--bronze .p-top-pre__txt {
    color: #E56F4D;
}

.p-top-pre__store-flex {
    display: flex;
    justify-content: center;
    gap: 80px;
    margin-top: 20px;
    font-size: 0.8125rem;
}
@media screen and (max-width: 750px) {
    .p-top-pre__store-flex {
        display: block;
        text-align: left;
        margin-top: calc(20 / var(--design-width) * 100vw);
        font-size: calc(13 / var(--design-width) * 100vw);
        padding-left: calc(11 / var(--design-width) * 100vw);
    }
}

.p-top-pre__store-item {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    transition: color 0.3s;
}

.p-top-pre__store-name {
    position: relative;
    line-height: 1.69230769;
}
@media screen and (max-width: 750px) {
    .p-top-pre__store-name {
        line-height: 1.83333333;
    }
}

.p-top-pre__store-ico {
    display: flex;
    transform: translateY(-1px);
    align-self: center;
}
@media screen and (max-width: 750px) {
    .p-top-pre__store-ico {
        width: calc(14 / var(--design-width) * 100vw);
        height: calc(14 / var(--design-width) * 100vw);
        transform: translateY(calc(0 / var(--design-width) * 100vw));
    }
}

/* ---------------------------------------------
*   p-top-label
--------------------------------------------- */
.p-top-label {
    margin: 18px auto 0;
    padding: 9px 12px 8px;
    width: -moz-fit-content;
    width: fit-content;
    color: #fff;
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.2666666667;
    letter-spacing: 0.05em;
    background: linear-gradient(90deg, rgb(64, 64, 64) 0%, rgb(107, 107, 107) 51%, rgb(64, 64, 64) 100%);
}

@media screen and (max-width: 750px) {
    .p-top-label {
        margin-top: 4.2666666667vw;
        padding: 2.6666666667vw 1.3333333333 vw;
        width: 100%;
        font-size: 3.4666666667vw;
        line-height: 1.4615384615;
    }
}
/* ---------------------------------------------
*   p-top-popup-block-wrap
--------------------------------------------- */
.p-top-popup-block-wrap {
    display: flex;
    justify-content: space-between;
    gap: 28px;
    margin-top: 20px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block-wrap {
        flex-direction: column;
        gap: 2.6666666667vw;
        margin: 4.2666666667vw 2.6666666667vw 0;
    }
}
.p-top-popup-block-wrap--1 {
    padding-inline: 25px;
    gap: 20px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block-wrap--1 {
        padding-inline: 0;
        gap: 4vw;
    }
}
.p-top-popup-block-wrap--1 .p-top-btn {
    width: 48.4615384615%;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block-wrap--1 .p-top-btn {
        width: 100%;
    }
}
.p-top-popup-block-wrap__inner {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: calc(50% - 14px);
}

@media screen and (max-width: 750px) {
    .p-top-popup-block-wrap__inner {
        display: contents;
    }
}
/* ---------------------------------------------
*   .p-top-popup-block
--------------------------------------------- */
.p-top-popup-block {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block--1 {
        order: 1;
    }
    .p-top-popup-block--2 {
        order: 3;
    }
    .p-top-popup-block--3 {
        order: 2;
    }
}
.p-top-popup-block__head {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 30px;
    color: #fff;
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.05em;
}

.mac.safari .p-top-popup-block__head {
    padding-top: 2px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__head {
        height: 6.6666666667vw;
        font-size: 3.4666666667vw;
    }
    .mac.safari .p-top-popup-block__head {
        padding-top: 0.5333333333vw;
    }
}
.p-top-popup-block__head--2rows {
    height: 57px;
    line-height: 140%;
}
@media screen and (max-width: 750px) {
    .p-top-popup-block__head--2rows {
        height: calc(44 / var(--design-width) * 100vw);
        line-height: 138.462%;
    }
}

.p-top-popup-block--premium .p-top-popup-block__head {
    background-color: #133755;
}

.p-top-popup-block--gold .p-top-popup-block__head {
    background-color: #E1BB52;
}

.p-top-popup-block__body {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
    width: 100%;
    background-color: #E1EAF1;
}
@media screen and (max-width: 750px) {
    .p-top-popup-block__body {
        padding: 4.5333333333vw 3.7333333333vw 4vw;
    }
}
.p-top-popup-block__body--2rows {
    padding-block: 15px;
}
@media screen and (max-width: 750px) {
    .p-top-popup-block__body--2rows {
        padding: 4.5333333333vw 3.7333333333vw 4vw;
    }
}
@media screen and (max-width: 750px) {
    .p-top-popup-block__body--2 {
        padding-top: 3.4666666667vw;
    }
}

.p-top-popup-block--premium .p-top-popup-block__body {
    background-color: #E1EAF1;
}

.p-top-popup-block--gold .p-top-popup-block__body {
    background-color: #F4F0DE;
}

.p-top-popup-block__ttl {
    color: #333333;
    font-size: 1.3125rem;
    font-weight: 700;
    line-height: 1;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__ttl {
        font-size: 4.5333333333vw;
    }
}
.p-top-popup-block__ttl2 {
    color: #333333;
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__ttl2 {
        font-size: 4.5333333333vw;
    }
}
.p-top-popup-block__ttl2--s {
    font-size: 1rem;
    line-height: 1.375;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__ttl2--s {
        display: block;
        margin-bottom: 0.8vw;
        font-size: 3.7333333333vw;
    }
}
.p-top-popup-block__txt {
    margin-top: 10px;
    text-align: center;
    color: #333333;
    font-size: 0.6875rem;
    font-weight: 500;
    line-height: 1.4545454545;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__txt {
        margin-top: 2.6666666667vw;
        font-size: 2.9333333333vw;
    }
}
.p-top-popup-block__label {
    margin-inline: auto;
    padding: 3px 13px 4px;
    width: -moz-fit-content;
    width: fit-content;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
    background: linear-gradient(90deg, rgb(64, 64, 64) 0%, rgb(107, 107, 107) 50%, rgb(64, 64, 64) 100%);
    border-radius: 9px;
}

.mac.safari .p-top-popup-block__label {
    padding: 4px 13px 3px;
}

.windows.edge .p-top-popup-block__label {
    padding: 4px 13px 3px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__label {
        padding: 1.0666666667vw 3.7333333333vw 0.8vw;
        font-size: 3.2vw;
        border-radius: 2.4vw;
    }
}
.p-top-popup-block__ttl + .p-top-popup-block__label {
    margin-top: 15px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__ttl + .p-top-popup-block__label {
        margin-top: 4vw;
    }
}
.p-top-popup-block__label + .p-top-popup-block__ttl {
    margin-top: 11px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__label + .p-top-popup-block__ttl {
        margin-top: 2.9333333333vw;
    }
}
.p-top-popup-block__box {
    margin: 20px 30px 0;
    padding: 17px 20px 20px;
    background-color: #fff;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__box {
        margin-top: 4vw;
        margin-inline: 0;
        padding: 3.4666666667vw 3.3vw;
    }
}
.p-top-popup-block__box-ttl {
    position: relative;
    margin-inline: auto;
    width: -moz-fit-content;
    width: fit-content;
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.5714285714;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__box-ttl {
        font-size: 3.2vw;
    }
}
.p-top-popup-block--premium .p-top-popup-block__box-ttl {
    color: #133755;
}

.p-top-popup-block--gold .p-top-popup-block__box-ttl {
    color: #E1BB52;
}

.p-top-popup-block__box-ttl::before {
    content: "";
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
    width: 8px;
    height: 1px;
    background-color: #133755;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__box-ttl::before {
        right: -4vw;
        width: 2.1333333333vw;
        height: 0.2666666667vw;
    }
}
.p-top-popup-block__box-ttl:after {
    content: "";
    position: absolute;
    top: 50%;
    left: -15px;
    transform: translateY(-50%);
    width: 8px;
    height: 1px;
    background-color: #133755;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__box-ttl::after {
        left: -4vw;
        width: 2.1333333333vw;
        height: 0.2666666667vw;
    }
}
.p-top-popup-block--premium .p-top-popup-block__box-ttl::before {
    background-color: #133755;
}

.p-top-popup-block--gold .p-top-popup-block__box-ttl::before {
    background-color: #E1BB52;
}

.p-top-popup-block--premium .p-top-popup-block__box-ttl::after {
    background-color: #133755;
}

.p-top-popup-block--gold .p-top-popup-block__box-ttl::after {
    background-color: #E1BB52;
}

.p-top-popup-block__box-list {
    margin-top: 13px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__box-list {
        margin-top: 2.6666666667vw;
        text-align: left;
    }
}
.p-top-popup-block__box-item {
    display: flex;
    align-items: start;
    justify-content: flex-start;
    color: #333333;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__box-item {
        font-size: 3.2vw;
        line-height: 1.3333333333;
    }
}
.p-top-popup-block__box-item + .p-top-popup-block__box-item {
    margin-top: 8px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__box-item + .p-top-popup-block__box-item {
        margin-top: 2.4vw;
    }
}
.p-top-popup-block__box-num {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 3px;
    width: 13px;
    height: 13px;
    color: #fff;
    font-size: 0.5625rem;
    font-weight: 500;
    line-height: 1;
    background-color: #133755;
    border-radius: 50%;
}

.mac.safari .p-top-popup-block__box-num {
    padding-top: 2px;
}

.windows.edge .p-top-popup-block__box-num {
    padding-top: 2px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-block__box-num {
        margin-top: 0.2666666667vw;
        margin-right: 0.8vw;
        padding-top: 0.2333333333vw;
        padding-right: 0;
        width: 3.4666666667vw;
        height: 3.4666666667vw;
        font-size: 2.4vw;
    }
    .iphone .p-top-popup-block__box-num {
        padding-top: 0;
    }
    .mac.safari .p-top-popup-block__box-num {
        padding-top: 0.2333333333vw;
    }
    .windows.edge .p-top-popup-block__box-num {
        padding-top: 0.23vw;
        padding-right: 0.15vw;
    }
    .windows.edge .p-top-popup-block__box-num--2 {
        padding-top: 0.18vw;
    }
}
.p-top-popup-block--premium .p-top-popup-block__box-num {
    background-color: #133755;
}

.p-top-popup-block--gold .p-top-popup-block__box-num {
    background-color: #E1BB52;
}

/* ---------------------------------------------
*   c-popup-2
--------------------------------------------- */
@media screen and (max-width: 750px) {
    .edge .c-popup-2 {
        padding: 0 3.33333%;
    }
}
.c-popup-2--top .p-top-btn {
    position: absolute;
    left: 50%;
    bottom: -100px;
    width: 430px;
    transform: translateX(-50%);
    background: linear-gradient(to right, #0074A2 0%, #00587B 100%);
    border: none;
    color: #fff;
}

@media screen and (max-width: 750px) {
    .c-popup-2--top .p-top-btn {
        bottom: -19.3333333333vw;
        width: 89.3333333333vw;
    }
}
.c-popup-2--top .p-top-btn::before {
    -webkit-mask-image: url(/msppoint/membersprogram/202405img/modal/icon_modal_close.svg);
    mask-image: url(/msppoint/membersprogram/202405img/modal/icon_modal_close.svg);
    background-color: #fff;
}

.c-popup-2--top .p-top-btn:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background: #00587B;
    opacity: 0;
    transition: all 0.3s;
}

@media screen and (max-width: 750px) {
    .c-popup-2--top .p-top-btn:after {
        border-radius: 1.3333333333vw;
    }
}
@media screen and (min-width: 751px) {
    .c-popup-2--top .p-top-btn:hover::after {
        opacity: 1;
    }
}
.c-popup .c-popup__close-btn .p-top-btn--bl {
    position: absolute;
    left: 50%;
    bottom: -100px;
    width: 430px;
    transform: translateX(-50%);
    background: linear-gradient(45deg, #0074A2 0%, #00587B 100%);
    border: none;
    color: #fff;
}

@media screen and (max-width: 750px) {
    .c-popup .c-popup__close-btn .p-top-btn--bl {
        bottom: -19.3333333333vw;
        width: 89.3333333333vw;
    }
}
.c-popup .c-popup__close-btn .p-top-btn--bl::before {
    -webkit-mask-image: url(/msppoint/membersprogram/202405img/modal/icon_modal_close.svg);
    mask-image: url(/msppoint/membersprogram/202405img/modal/icon_modal_close.svg);
    background-color: #fff;
}

.c-popup .c-popup__close-btn .p-top-btn--bl:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background: #00587B;
    opacity: 0;
    transition: all 0.3s;
}

@media screen and (max-width: 750px) {
    .c-popup .c-popup__close-btn .p-top-btn--bl:after {
        border-radius: 1.3333333333vw;
    }
}
@media screen and (min-width: 751px) {
    .c-popup .c-popup__close-btn .p-top-btn--bl:hover::after {
        opacity: 1;
    }
}
.c-popup-2--top .p-top-btn--static {
    position: static;
    transform: translateX(0);
    background: #fff;
    color: #133755;
    margin: 30px auto 0;
}

@media screen and (max-width: 750px) {
    .c-popup-2--top .p-top-btn--static {
        margin: 8vw auto 0;
        width: 100%;
    }
}
.c-popup-2--top .p-top-btn--static::before {
    background-image: url(/msppoint/membersprogram/202405img/icon_arrow_link_btn.svg);
}

.c-popup-2--app-medal .c-popup-2__head {
    padding-block: 24px 22px;
    background-color: #0A6B9B;
}
@media screen and (max-width: 750px) {
    .c-popup-2--app-medal .c-popup-2__head {
        padding-block: calc(24 / var(--design-width) * 100vw) calc(19 / var(--design-width) * 100vw);
    }
}

.c-popup-2__head {
    border-radius: 5px 5px 0 0;
    padding: 25px;
}

.c-popup-2__head-icon {
    width: 48px;
}

.c-popup-2__body {
    padding: 30px 0 76px;
}

@media screen and (max-width: 750px) {
    .c-popup-2__body {
        padding: 0;
    }
}
/* ---------------------------------------------
*   c-popup-list
--------------------------------------------- */
.c-popup-list__note {
    margin-top: 1px;
}

@media screen and (max-width: 750px) {
    .c-popup-list__note {
        margin-top: 1.3333333333vw;
    }
}
.c-popup-list__caption {
    line-height: 1.6;
}

/* ---------------------------------------------
*   c-cassette-6
--------------------------------------------- */
.c-cassette-6__contents {
    display: flex;
    padding: 0 50px;
    flex-wrap: wrap;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__contents {
        display: block;
        padding: 0 4.66667vw;
    }
}
.c-cassette-6__unit {
    position: relative;
    width: 50%;
    text-align: center;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__unit {
        padding: calc(30 / var(--design-width) * 100vw) 0 calc(30 / var(--design-width) * 100vw);
        width: 100%;
    }
}
@media screen and (min-width: 751px) {
    .c-cassette-6__unit:first-of-type::before {
        position: absolute;
        top: 0;
        right: 0;
        display: block;
        width: 1px;
        height: 98.4%;
        background: url(/msppoint/membersprogram/assets/img/top/modal/img_line_gray_1.svg) 0 0 repeat-y;
        background-size: auto;
        content: "";
        background: #ccc;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__unit::before {
        position: absolute;
        bottom: 0;
        left: 50%;
        display: block;
        width: 100%;
        height: 1px;
        background: url(/msppoint/membersprogram/assets/img/top/modal/sp/img_line_gray.svg) 0 0 repeat-x;
        background-size: auto;
        content: "";
        transform: translateX(-50%);
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__unit:last-of-type::before {
        content: none;
    }
}
.c-cassette-6__unit--wide {
    margin-top: 56px;
    width: 100%;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__unit--wide {
        margin-top: 0;
        padding-bottom: calc(20 / var(--design-width) * 100vw);
    }
}
.c-cassette-6__unit--wide::after {
    position: absolute;
    top: -30px;
    left: 50%;
    display: block;
    width: 100%;
    height: 1px;
    background: url(/msppoint/membersprogram/assets/img/top/modal/img_line_gray.svg) 0 0 repeat-x;
    background-size: auto;
    content: "";
    transform: translateX(-50%);
}

@media screen and (max-width: 750px) {
    .c-cassette-6__unit--wide::after {
        content: none;
    }
}
@media screen and (min-width: 751px) {
    .c-cassette-6__unit--border:first-of-type::before {
        position: absolute;
        top: 0;
        right: 0;
        display: block;
        width: 1px;
        height: 100%;
        background: url(../202205img/img_line_gray.svg) 0 0 repeat-y;
        background-size: 1px 270px;
        content: "";
    }
}
.c-cassette-6__head {
    position: relative;
    display: flex;
    -ms-flex-pack: center;
    -ms-flex-align: center;
    padding-bottom: 15px;
    font-weight: bold;
    font-size: 16px;
    color: #333;
    align-items: center;
    justify-content: center;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__head {
        display: block;
        padding-bottom: calc(9 / var(--design-width) * 100vw);
        font-size: 3.73333vw;
    }
}
.c-cassette-6__head span {
    display: flex;
    -ms-flex-pack: center;
    -ms-flex-align: center;
    margin-right: 10px;
    width: 26px;
    height: 26px;
    border: 1px solid #333333;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
}

.ie .c-cassette-6__head span {
    margin-top: -6px;
    padding-top: 5px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__head span {
        margin-right: auto;
        margin-bottom: 2vw;
        margin-left: auto;
        width: 5.33333vw;
        height: 5.33333vw;
        font-size: 3.2vw;
    }
    .ie .c-cassette-6__head span {
        margin-top: 0;
        padding-top: 1.06667vw;
    }
}
.c-cassette-6__head::before {
    position: absolute;
    bottom: 0;
    left: 50%;
    display: block;
    width: 30px;
    height: 1px;
    background-color: #333333;
    content: "";
    transform: translateX(-50%);
}

@media screen and (max-width: 750px) {
    .c-cassette-6__head::before {
        width: 8vw;
    }
}
.c-cassette-6__app {
    display: flex;
    -ms-flex-pack: center;
    -ms-flex-align: start;
    margin-top: 50px;
    align-items: flex-start;
    justify-content: center;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__app {
        -ms-flex-align: center;
        margin-top: 8vw;
        align-items: center;
    }
}
.c-cassette-6__app-inner {
    margin-right: 14px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__app-inner {
        display: flex;
        -ms-flex-pack: center;
        -ms-flex-align: center;
        margin-right: 0;
        align-items: center;
        justify-content: center;
    }
}
.c-cassette-6__icon {
    margin-right: auto;
    margin-bottom: 25px;
    margin-left: auto;
    width: 80px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__icon {
        margin-right: 7.73333vw;
        margin-bottom: 0;
        margin-left: 0;
        width: 18.66667vw;
    }
}
.c-cassette-6__app-qr {
    text-align: center;
}

.c-cassette-6__app-qr img {
    display: block;
    margin-right: auto;
    margin-left: auto;
    width: 60px;
}

.c-cassette-6__app-qr span {
    display: block;
    margin-top: 10px;
    font-weight: bold;
    font-size: 10px;
}

.c-cassette-6__dl {
    margin-top: -7px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__dl {
        margin-top: 0;
    }
}
.c-cassette-6__dl-link {
    display: block;
    margin-top: 6px;
    width: 143px;
}

@media screen and (min-width: 751px) {
    .c-cassette-6__dl-link {
        transition: opacity 300ms;
    }
    .c-cassette-6__dl-link:hover {
        opacity: 0.7;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__dl-link {
        margin-top: 0;
        width: 38.13333vw;
    }
}
.c-cassette-6__dl-link:first-of-type {
    margin-top: 0;
}

.c-cassette-6__capture {
    margin-top: 18px;
    margin-right: auto;
    margin-left: auto;
    width: 146px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__capture {
        margin-top: 7.33333vw;
        width: 43.66667vw;
    }
}
.c-cassette-6__capture--small {
    width: 146px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__capture--small {
        width: 38.93333vw;
    }
}
.c-cassette-6__txt {
    margin-top: 16px;
    color: #235EA5;
    font-weight: bold;
    font-size: 14px;
    padding: 0 8px;
}

.c-cassette-6__txt-nwp {
    white-space: nowrap;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__txt {
        margin-top: 5.33333vw;
        font-size: 3.73333vw;
        padding-left: 0;
    }
}
.c-cassette-6__txt--login {
    margin-top: 11px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__txt--login {
        margin-top: 3.73333vw;
        letter-spacing: -0.05em;
    }
}
@media screen and (max-width: 750px) {
    .windows .c-cassette-6__txt--login {
        letter-spacing: -0.05em;
    }
}
.c-cassette-6__txt--menu {
    margin-top: 14px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__txt--menu {
        margin-top: 3.73333vw;
    }
}
.c-cassette-6__list {
    display: flex;
    -ms-flex-pack: center;
    -ms-flex-align: end;
    margin-top: 18px;
    align-items: flex-end;
    justify-content: center;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__list {
        display: block;
        margin-top: 8vw;
    }
}
.c-cassette-6__list--flex-start {
    align-items: flex-start;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__list--flex-start {
        margin-top: 4.8vw;
    }
}
.c-cassette-6__item {
    position: relative;
    margin-right: 48px;
    width: 150px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__item {
        margin-top: 8vw;
        margin-right: auto;
        margin-left: auto;
        width: 100%;
    }
}
.c-cassette-6__item::before {
    position: absolute;
    top: 90px;
    right: -34px;
    display: block;
    width: 14px;
    height: 34px;
    background: url(../202205img/icon_triangle_blue.svg) 0 0 no-repeat;
    background-size: 100% 100%;
    content: "";
}

@media screen and (max-width: 750px) {
    .c-cassette-6__item::before {
        top: auto;
        right: auto;
        bottom: -6.66667vw;
        left: 50%;
        width: 2.66667vw;
        height: 6.66667vw;
        transform: translateX(-50%) rotate(90deg);
    }
}
.c-cassette-6__item--menu {
    margin-right: 37px;
    margin-left: -20px;
    width: 296px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__item--menu {
        margin-top: 0;
        margin-right: auto;
        margin-left: auto;
        width: 100%;
    }
}
.c-cassette-6__item--menu::before {
    right: -23px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__item--menu::before {
        right: auto;
    }
}
.c-cassette-6__item:last-of-type {
    margin-right: 0;
}

.c-cassette-6__item:last-of-type::before {
    content: none;
}

.c-cassette-6__item--2col {
    width: 170px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__item--2col {
        width: 100%;
        margin-inline: auto;
    }
}
.c-cassette-6__item--2col.c-cassette-6__item--menu {
    margin-right: 88px;
    margin-left: 0;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__item--2col.c-cassette-6__item--menu {
        margin-inline: auto;
    }
}
.c-cassette-6__item--2col.c-cassette-6__item--menu::before {
    top: 80px;
    right: -51px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__item--2col.c-cassette-6__item--menu::before {
        top: auto;
        right: auto;
        bottom: -8.53333vw;
        left: 50%;
        transform: translateX(-50%) rotate(90deg);
    }
}
.c-cassette-6__item--2col .c-cassette-6__img {
    margin-bottom: 0;
    width: 146px;
    margin-inline: auto;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__item--2col .c-cassette-6__img {
        width: 38.93333vw;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__item--2col:last-of-type {
        margin-top: 10.93333vw;
        margin-right: auto;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__img {
        margin-right: auto;
        margin-left: auto;
        width: 40vw;
    }
}
.c-cassette-6__item--menu .c-cassette-6__img {
    margin-bottom: -15px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__item--menu .c-cassette-6__img {
        margin-bottom: 0;
        width: 70.66667vw;
    }
}
.c-cassette-6__item--2col .c-cassette-6__img {
    margin-bottom: 0;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__item--2col .c-cassette-6__img {
        margin-bottom: 0;
        width: 38.93333vw;
    }
}
.c-cassette-6__detail {
    display: flex;
    -ms-flex-align: center;
    margin-top: 40px;
    margin-right: auto;
    margin-left: auto;
    padding: 17px 65px;
    width: 660px;
    border-radius: 10px;
    background-color: #F5F5F5;
    align-items: center;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__detail {
        position: relative;
        display: block;
        margin-top: 0;
        padding: 6.66667vw 3.33333vw 13.33333vw 6.66667vw;
        width: 100%;
        border-radius: 0 0 2vw 2vw;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__detail--new {
        margin-top: 5.86667vw;
        padding: 6.66667vw 3.33333vw 8vw 3.33333vw;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__detail--new .c-cassette-6__detail-head {
        margin-bottom: 5.33333vw;
        text-align: center;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__detail--new .c-cassette-6__detail-txt {
        margin-top: 2.93333vw;
        margin-left: 0;
        text-align: center;
        font-size: 3.73333vw;
        line-height: 1.7142857143;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__detail--new .c-cassette-6__detail-img {
        position: static;
        width: 59.73333vw;
        margin-inline: auto;
    }
}
.c-cassette-6__detail-img {
    margin-right: 27px;
    width: 128px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__detail-img {
        position: absolute;
        bottom: 8.26667vw;
        left: 6.66667vw;
        margin: 0 auto;
        width: 28.8vw;
    }
}
.c-cassette-6__detail-img--wide {
    margin-right: 60px;
    width: 172px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__detail-img--wide {
        width: 59.73333vw;
        margin-inline: auto;
    }
}
.c-cassette-6__detail-head {
    margin-bottom: 15px;
    font-weight: bold;
    font-size: 16px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__detail-head {
        margin-bottom: 9.33333vw;
        font-size: 4.26667vw;
    }
}
.c-cassette-6__detail-txt {
    font-size: 14px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__detail-txt {
        margin-left: 30.66667vw;
        letter-spacing: -0.06em;
        font-size: 3.73333vw;
    }
    .ie .c-cassette-6__detail-txt {
        letter-spacing: -0.07em;
    }
}
.c-cassette-6__column-list {
    display: flex;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__column-list {
        display: block;
        margin-top: 0;
    }
}
.c-cassette-6__column-item {
    position: relative;
    margin-right: auto;
    margin-left: auto;
    width: 200px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__column-item {
        margin-top: calc(23 / var(--design-width) * 100vw);
        width: 100%;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__column-item::before {
        bottom: -6.66667vw;
        width: 2.66667vw;
        height: 6.66667vw;
    }
}
.c-cassette-6__column-item:first-of-type {
    position: relative;
    margin-top: 0;
    width: 376px;
}
.c-cassette-6__column-item:first-of-type::after {
    position: absolute;
    content: "";
    background-image: url(/msppoint/membersprogram/assets/img/top/modal/ico_arrow.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 13px;
    height: 32px;
    top: 46.3%;
    right: -13%;
}
@media screen and (max-width: 750px) {
    .c-cassette-6__column-item:first-of-type::after {
        display: none;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__column-item:first-of-type {
        width: 100%;
    }
}

.c-cassette-6__column-item:last-of-type {
    width: 100%;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__column-item:last-of-type {
        width: 100%;
    }
}
.c-cassette-6__column-item:last-of-type::before {
    content: none;
}

.c-cassette-6__column-img {
    margin-right: auto;
    margin-left: auto;
    width: 132px;
    margin-top: 27px;
}

.c-cassette-6__toggle-item-wrap {
    display: none;
    margin-top: 7px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__toggle-item-wrap {
        display: block;
        margin-top: 1vw;
    }
}
.c-cassette-6__toggle-img {
    width: 30px;
    margin-inline: auto;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__toggle-img {
        width: 8vw;
    }
}
.c-cassette-6__toggle-txt {
    display: flex;
    align-items: center;
    font-size: 3.73vw;
    font-weight: bold;
    line-height: 1.4285714286;
    color: #333;
    text-align: left;
    letter-spacing: -0.01em;
    margin-top: 1.79vw;
}

.c-cassette-6__toggle-txt:nth-of-type(1) {
    margin-top: 5.4vw;
}

.edge .c-cassette-6__toggle-txt:nth-of-type(2) {
    letter-spacing: -0.06em;
}

.iphone .c-cassette-6__toggle-txt:nth-of-type(2) {
    letter-spacing: -0.03em;
}

.c-cassette-6__toggle-txt:nth-of-type(1)::before {
    content: "A";
    background-color: #DEDEDE;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 5.33vw;
    height: 5.33vw;
    color: #333;
    margin-right: 2.98vw;
    font-size: 2.93vw;
}

.c-cassette-6__toggle-txt:nth-of-type(2)::before {
    content: "B";
    background-color: #DEDEDE;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 5.33vw;
    height: 5.33vw;
    color: #333;
    margin-right: 2.98vw;
    font-size: 2.93vw;
}

.c-cassette-6__toggle-txt:nth-of-type(3)::before {
    content: "C";
    background-color: #DEDEDE;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 5.33vw;
    height: 5.33vw;
    color: #333;
    margin-right: 2.98vw;
    font-size: 2.93vw;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__column-img {
        width: 38.93333vw;
        margin-top: 5.33333vw;
    }
}
.c-cassette-6__column-txt {
    margin-top: 18px;
    color: #235EA5;
    font-weight: bold;
    font-size: 14px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__column-txt {
        margin-top: 4vw;
        font-size: 3.73333vw;
    }
}
.c-cassette-6__check {
    display: flex;
    gap: 18px;
    justify-content: end;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check {
        margin-top: calc(23 / var(--design-width) * 100vw);
        display: block;
    }
}
.c-cassette-6__check-wrap {
    padding: 33px 21px 20px;
}

.ipad.safari .c-cassette-6__check-wrap {
    padding-right: 17px;
    padding-left: 17px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-wrap {
        padding: calc(30 / var(--design-width) * 100vw) calc(3 / var(--design-width) * 100vw) calc(23 / var(--design-width) * 100vw) calc(17 / var(--design-width) * 100vw);
    }
}
.c-cassette-6__check-wrap:nth-of-type(1) {
    width: 191px;
    background: url(../202308img/img_bg_small.png) no-repeat 0 0/100% 100%;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-wrap:nth-of-type(1) {
        width: 100%;
        background: url(../202308img/sp/img_bg_small.png) no-repeat 0 0/100% 100%;
    }
}
.c-cassette-6__check-wrap:nth-of-type(2) {
    width: 191px;
    background: url(../202308img/img_bg_big.png) no-repeat 0 0/100% 100%;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-wrap:nth-of-type(2) {
        width: 100%;
        margin-top: calc(11 / var(--design-width) * 100vw);
        background: url(../202308img/sp/img_bg_big.png) no-repeat 0 0/100% 100%;
        padding-bottom: calc(11 / var(--design-width) * 100vw);
    }
}
.c-cassette-6__check-term {
    position: relative;
    font-size: 1rem;
    font-weight: bold;
    line-height: 1.125;
    color: #333;
    padding-bottom: 14px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-term {
        font-size: 3.73vw;
        padding-bottom: calc(12 / var(--design-width) * 100vw);
    }
}
.c-cassette-6__check-term::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    width: 30px;
    height: 1px;
    background-color: #333;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-term::after {
        width: 8vw;
    }
}
.c-cassette-6__check-item-wrap {
    display: flex;
    justify-content: space-between;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-item-wrap {
        display: block;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__check-item.c-cassette-6__check-item--wide {
        width: 100%;
    }
}
.c-cassette-6__check-item.c-cassette-6__check-item--tight {
    width: 36.7032967033%;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-item.c-cassette-6__check-item--tight {
        width: 100%;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__check-item {
        display: grid;
        grid-template-columns: 29vw 1fr;
        gap: 4.77vw;
        -moz-text-align-last: left;
             text-align-last: left;
        margin-top: calc(21 / var(--design-width) * 100vw);
        margin-right: 0;
        margin-left: 0;
        width: 100%;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__check-item:first-of-type {
        margin-left: 0;
    }
}
.c-cassette-6__check-head {
    position: relative;
    padding-bottom: 8px;
    margin-top: 29px;
    font-weight: bold;
    font-size: 14px;
    line-height: 1.2857142857;
    color: #333;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-head {
        letter-spacing: -0.05em;
        text-align: left;
        font-size: 3.73333vw;
        padding-bottom: 0;
    }
    .ie .c-cassette-6__check-head {
        letter-spacing: -0.06em;
    }
}
.c-cassette-6__check-head-inner {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.125;
    letter-spacing: -0.02em;
}

.c-cassette-6__check-img {
    margin-right: auto;
    margin-left: auto;
    width: 112px;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-img {
        width: 100%;
    }
}
.c-cassette-6__check-head-sp {
    font-size: 3.46vw;
    font-weight: bold;
    color: #333;
    line-height: 1.125;
    text-align: left;
}

.edge .c-cassette-6__check-head-sp--1 {
    letter-spacing: -0.09em;
}

.iphone .c-cassette-6__check-head-sp--1 {
    letter-spacing: -0.09em;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-head-sp--1::before {
        content: "A";
        background-color: #DEDEDE;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 6.4vw;
        height: 6.4vw;
        color: #333;
        font-size: 3.58vw;
        margin-bottom: 1.8vw;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__check-head-sp--2::before {
        content: "B";
        background-color: #DEDEDE;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 6.4vw;
        height: 6.4vw;
        color: #333;
        font-size: 3.58vw;
        margin-bottom: 1.8vw;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__check-head-sp--3::before {
        content: "C";
        background-color: #DEDEDE;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 6.4vw;
        height: 6.4vw;
        color: #333;
        font-size: 3.58vw;
        margin-bottom: 1.8vw;
    }
}
.c-cassette-6__check-head-sp-inner {
    font-size: 4.26vw;
    font-weight: bold;
    color: #333;
    line-height: 1.3846153846;
}

.c-cassette-6__check-txt-wrap {
    align-self: center;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-txt-wrap.c-cassette-6__check-txt-wrap--3 {
        align-self: end;
    }
}
.c-cassette-6__check-txt {
    margin-top: 20px;
    color: #0074A2;
    font-weight: bold;
    font-size: 14px;
}
.c-cassette-6__check-txt--2 {
    margin-top: 13px;
}

.ipad .c-cassette-6__check-txt {
    letter-spacing: -0.04em;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-txt {
        margin-top: 2vw;
        font-size: 3.73333vw;
        text-align: left;
    }
}
@media screen and (max-width: 750px) {
    .iphone .c-cassette-6__check-txt--pr {
        letter-spacing: -0.02em;
    }
}
.c-cassette-6__note {
    margin-top: 35px;
    font-size: 12px;
    color: #333;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__note {
        margin-top: 8vw;
        text-align: left;
        font-size: 3.2vw;
    }
}
/* ---------------------------------------------
*   c-cassette-6
--------------------------------------------- */
.c-cassette-6__head {
    color: #133755;
}

.c-cassette-6__head span {
    border-color: #133755;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__head span {
        padding-top: 0.2666666667vw;
    }
}
.c-cassette-6__head::before {
    background-color: #133755;
}

.c-cassette-6__txt {
    color: #333333;
}

@media screen and (min-width: 751px) {
    .c-cassette-6__txt {
        letter-spacing: -0.02em;
    }
}
.c-cassette-6__unit--wide::after {
    background: #CCCCCC;
}

@media screen and (min-width: 751px) {
    .c-cassette-6__check-head {
        padding-bottom: 20px;
    }
}
.c-cassette-6__check-term {
    color: #133755;
}

.c-cassette-6__check-term::after {
    background-color: #133755 !important;
}

.c-cassette-6__check-item {
    margin-right: auto;
    margin-left: auto;
}

@media screen and (max-width: 750px) {
    .c-cassette-6__check-item:nth-of-type(n+2) {
        margin-top: 4.8vw;
    }
}
@media screen and (min-width: 751px) {
    .c-cassette-6__check-wrap {
        padding: 33px 5px 13px;
    }
}
@media screen and (min-width: 751px) {
    .c-cassette-6__check-img {
        width: 120px;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__check-head-sp-inner {
        font-size: 4.2666666667vw;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__check-head-sp {
        font-size: 3.4666666667vw;
        white-space: nowrap;
    }
}
@media screen and (max-width: 750px) {
    .c-cassette-6__check-txt {
        font-size: 3.43333vw;
        color: #0074A2;
    }
}
.c-cassette-6__column-txt {
    color: #333333;
}

.c-cassette-6__column-txt--color {
    color: #0074A2;
}

.c-cassette-6__check-term::after {
    color: #133755;
}

.c-cassette-6__check-wrap:nth-of-type(1), .c-cassette-6__check-wrap:nth-of-type(2) {
    background: #F8F8F8;
    border: 1px solid #EAEAEA;
    border-radius: 10px;
}

/* ---------------------------------------------
*   p-top-btn
--------------------------------------------- */
.p-top-btn {
    position: relative;
    z-index: 0;
    display: block;
    width: 100%;
    border: 1px solid #133755;
    padding-block: 19px;
    border-radius: 5px;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.4285714286;
    letter-spacing: 0.05em;
    color: #133755;
    background-color: #fff;
    text-align: center;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.15);
    transition: background-color 0.3s, color 0.3s;
}

@media screen and (max-width: 750px) {
    .p-top-btn {
        padding-block: 4vw;
        border-radius: 1.3333333333vw;
        font-size: 3.7333333333vw;
        box-shadow: 0px 0.8vw 2.6666666667vw rgba(0, 0, 0, 0.15);
    }
}
@media screen and (min-width: 751px) {
    .p-top-btn:hover {
        color: #fff;
        background-color: #133755;
    }
    .p-top-btn:hover::before {
        background-color: #fff;
    }
}
.p-top-btn::before {
    content: "";
    position: absolute;
    -webkit-mask: url(/msppoint/membersprogram/assets/img/icon_arrow_link_btn.svg);
            mask: url(/msppoint/membersprogram/assets/img/icon_arrow_link_btn.svg);
    -webkit-mask-size: 100% auto;
            mask-size: 100% auto;
    -webkit-mask-position: center center;
            mask-position: center center;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    background-color: #133755;
    width: 20px;
    height: 20px;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    transition: background-color 0.3s;
}
@media screen and (max-width: 750px) {
    .p-top-btn::before {
        width: calc(20 / var(--design-width) * 100vw);
        height: calc(20 / var(--design-width) * 100vw);
        aspect-ratio: 1/1;
        right: 4.8vw;
        -webkit-mask-size: 100% 100%;
                mask-size: 100% 100%;
    }
}

.p-top-btn--1 {
    padding-right: 10px;
}

@media screen and (max-width: 750px) {
    .p-top-btn--1 {
        padding-right: 6.6666666667vw;
    }
}
.p-top-popup-addition {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 40px 5px;
}

.safari .p-top-popup-addition--1 {
    -moz-column-gap: 0;
         column-gap: 0;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition,
    .safari .p-top-popup-addition--1 {
        gap: 5.3333333333vw 3.8666666667vw;
    }
}
.p-top-popup-addition--2 {
    gap: 40px 25px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition--2 {
        gap: 5.3333333333vw 4.2666666667vw;
    }
}
.p-top-popup-addition__item {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
    width: 130px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__item,
    .safari .p-top-popup-addition__item {
        gap: 0.3333333333vw;
        width: 37.4vw;
    }
}
.p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(1) {
    width: 134px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(1) {
        width: 35.7333333333vw;
    }
}
.p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(2) {
    width: 148px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(2) {
        width: 39.4666666667vw;
    }
}
.p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(3) {
    width: 170px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(3) {
        width: 45.3333vw;
    }
}
.p-top-popup-addition__img {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 110px;
    height: 79px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img {
        width: 29.3333333333vw;
        height: 21.0666666667vw;
    }
}
.p-top-popup-addition__img--1 {
    width: 70px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--1 {
        width: 18.6666666667vw;
    }
}
.p-top-popup-addition__img--2 {
    width: 86px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--2 {
        width: 22.9333333333vw;
    }
}
.p-top-popup-addition__img--3 {
    width: 104px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--3 {
        width: 27.7333333333vw;
    }
}
.p-top-popup-addition__img--4 {
    width: 108px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--4 {
        width: 28.8vw;
    }
}
.p-top-popup-addition__img--5 {
    width: 66px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--5 {
        width: 17.6vw;
    }
}
.p-top-popup-addition__img--6 {
    width: 91px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--6 {
        width: 24.2666666667vw;
    }
}
.p-top-popup-addition__img--7 {
    width: 58px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--7 {
        width: 16.2666666667vw;
    }
}
.p-top-popup-addition__img--8 {
    width: 102px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--8 {
        width: 27.2vw;
    }
}
.p-top-popup-addition__img--9 {
    width: 108px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--9 {
        margin-block: 5vw;
        width: 28.8vw;
        height: 11.0666666667vw;
    }
}
.p-top-popup-addition__img--10 {
    width: 68px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--10 {
        width: 18.1333333333vw;
    }
}
.p-top-popup-addition__img--11 {
    width: 91px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--11 {
        width: 24.2666666667vw;
    }
}
.p-top-popup-addition__img--12 {
    width: 125px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--12 {
        width: 33.3333333333vw;
    }
}
.p-top-popup-addition__img--13 {
    width: 105px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--13 {
        width: 28vw;
    }
}
.p-top-popup-addition__img--14 {
    width: 111px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--14 {
        width: 29.6vw;
    }
}
.p-top-popup-addition__img--15 {
    width: 112px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--15 {
        width: 29.8666666667vw;
    }
}
.p-top-popup-addition__img--16 {
    width: 91px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--16 {
        width: 24.2666666667vw;
    }
}
.p-top-popup-addition__img--17 {
    width: 157px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--17 {
        width: 41.8666666667vw;
    }
}
.p-top-popup-addition__img--18 {
    width: 110px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--18 {
        width: 29.3333333333vw;
    }
}
.p-top-popup-addition__img--19 {
    width: 108px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--19 {
        width: 28.8vw;
    }
}
.p-top-popup-addition__img--20 {
    width: 116px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--20 {
        width: 30.9333333333vw;
    }
}
.p-top-popup-addition__img img {
    width: 100%;
    height: auto;
}

.p-top-popup-addition__txt {
    color: #000;
    font-size: 12px;
    line-height: 1.5;
    font-weight: 500;
    word-break: keep-all;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__txt {
        font-size: 3.2vw;
    }
}
.p-top-popup-note {
    margin: 40px auto 0;
    width: -moz-fit-content;
    width: fit-content;
}

@media screen and (max-width: 750px) {
    .p-top-popup-note {
        margin-top: 8vw;
    }
}
.p-top-popup-note__item {
    display: flex;
    gap: 4px;
    color: #333;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.3333333333;
}

@media screen and (max-width: 750px) {
    .p-top-popup-note__item {
        gap: 0.8vw;
        text-align: left;
        font-size: 3.2vw;
        line-height: 1.3333333333;
    }
}
.p-top-popup-note__item + .p-top-popup-note__item {
    margin-top: 5px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-note__item + .p-top-popup-note__item {
        margin-top: 2.667vw;
    }
}
#mfp-shop-super .p-top-popup__head,
#mfp-shop-electronicsRetail .p-top-popup__head {
    border-color: #133755;
}

#mfp-shop-super .p-top-popup__ttl-txt,
#mfp-shop-electronicsRetail .p-top-popup__ttl-txt {
    color: #133755;
}

.p-top-popup-addition__img--23 {
    width: 58px;
    transform: translateY(-6px);
}
@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--23 {
        width: calc(58 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   メンプロ9月更新
--------------------------------------------- */
.p-top-popup-addition__img--25 {
    width: 84px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--25 {
        width: 22.4vw;
    }
}
.p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(3) {
    width: 173px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(3) {
        margin-left: -8vw;
        width: 43.2vw;
    }
}
/* ---------------------------------------------
*   20250903追記
--------------------------------------------- */
.p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(3) .p-top-popup-addition__txt {
    letter-spacing: -0.04em;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(3) .p-top-popup-addition__txt {
        letter-spacing: -0.07em;
    }
}
.p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(4) {
    width: 148px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition--2 .p-top-popup-addition__item:nth-of-type(4) {
        width: 26.6666666667vw;
    }
}
.p-top-popup-addition__img--26 {
    width: 100px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--26 {
        width: 26.6666666667vw;
    }
}
/* ---------------------------------------------
*   20251022追記
--------------------------------------------- */
.p-top-addition-acc__content--2 .p-top-addition-acc__body {
    flex-wrap: wrap;
    justify-content: center;
    gap: 70px 30px;
}

@media screen and (max-width: 750px) {
    .p-top-addition-acc__content--2 .p-top-addition-acc__body {
        gap: 8vw;
    }
}
.p-top-addition-acc__cassette-head--3 {
    margin-bottom: 16px;
}

@media screen and (max-width: 750px) {
    .p-top-addition-acc__cassette-head--3 {
        margin-bottom: 4vw;
    }
}
/* ---------------------------------------------
*   20251110追記
--------------------------------------------- */
/* .p-top-popup-addition--4 {
    margin-inline: auto;
    width: 90%;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition--4 {
        width: 100%;
    }
} */
.p-top-popup-addition__img--27 {
    margin-bottom: 5px;
    width: 97px;
    height: 81px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--27 {
        margin-bottom: 0;
        width: 21.6vw;
        height: 21.0666666667vw;
    }
}
.p-top-popup-addition--5 {
    gap: 25px 45px;
    margin-top: 50px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition--5 {
        gap: 2.4vw;
        margin-top: 13.3333333333vw;
    }
}
.p-top-popup-addition__txt.txt-indent {
    text-indent: -0.5em;
}

@media screen and (min-width: 751px) {
    .p-top-popup-addition__item--1 {
        margin-right: 14px;
    }
}

@media screen and (min-width: 751px) {
    .p-top-popup-addition__item--2 {
        width: 100px;
        margin-left: 14px;
        margin-right: 30px;
    }
}

.p-top-popup-note--1 {
    text-align: left;
}

.p-top-popup-addition__img--22 {
    width: 78px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--22 {
        width: 20.8vw;
    }
}
/* ---------------------------------------------
*   footer-pagetop
--------------------------------------------- */
@media screen and (max-width: 750px) {
    .footer-pagetop--top {
        top: -13.93333vw !important;
        width: 16.13333vw !important;
        height: 16.13333vw !important;
    }
}
@media screen and (max-width: 750px) {
    .footer-pagetop--faq {
        top: -23.93333vw !important;
        width: 16.13333vw !important;
        height: 16.13333vw !important;
    }
}
/* ---------------------------------------------
*   sekisan_modal
--------------------------------------------- */
.p-top-addition-acc__btn-list {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 25px 20px;
}

@media screen and (max-width: 750px) {
    .p-top-addition-acc__btn-list {
        gap: 4vw;
    }
}
.p-top-addition-acc__link {
    position: relative;
    z-index: 0;
    display: block;
    width: 305px;
    border: 1px solid #A77523;
    padding-block: 19px;
    border-radius: 5px;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.4285714286;
    letter-spacing: 0.05em;
    color: #A77523;
    background-color: #fff;
    text-align: center;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.15);
    transition: background-color 0.3s, color 0.3s;
}

@media screen and (max-width: 750px) {
    .p-top-addition-acc__link {
        width: 60vw;
        padding-block: 3.7333333333vw;
        border-radius: 1.3333333333vw;
        font-size: 3.7333333333vw;
        line-height: 1.4285714286;
        box-shadow: 0px 0.8vw 2.6666666667vw rgba(0, 0, 0, 0.15);
        border-width: 0.2666666667vw;
    }
}
@media screen and (max-width: 750px) {
    .p-top-addition-acc__link--1 {
        padding-right: 2.6666666667vw;
        letter-spacing: -0.03em;
    }
}
.p-top-addition-acc__link::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    transition: background-color 0.3s;
    background: url(../202410img/ico_plus.svg) no-repeat center center/cover;
    transform: translateY(-50%);
    transition: transform 0.3s;
}

@media screen and (max-width: 750px) {
    .p-top-addition-acc__link::before {
        width: 4.5333333333vw;
        height: 4.6vw;
        background-size: contain;
        right: 4.8vw;
    }
}
@media print, screen and (min-width: 751px) {
    .p-top-addition-acc__link:hover {
        color: #fff;
        background-color: #A77523;
    }
    .p-top-addition-acc__link:hover::before {
        background-image: url(../202410img/ico_plus-white.svg);
    }
}
.p-top-addition-acc__link--l {
    color: #133755;
    border-color: #133755;
}

@media print, screen and (min-width: 751px) {
    .p-top-addition-acc__link--l {
        width: 420px;
    }
}
.p-top-addition-acc__link--l::before {
    background-image: url(../202410img/ico_right.svg);
}

@media print, screen and (min-width: 751px) {
    .p-top-addition-acc__link--l:hover {
        background-color: #133755;
    }
    .p-top-addition-acc__link--l:hover::before {
        background-image: url(../202410img/ico_right-white.svg);
    }
}
/* ---------------------------------------------
*   c-block-card
--------------------------------------------- */
.c-block-card {
    position: relative;
    margin-top: 70px;
}
@media screen and (max-width: 750px) {
    .c-block-card {
        margin-top: calc(33 / var(--design-width) * 100vw);
    }
}
.c-block-card::before {
    position: absolute;
    content: "";
    background-image: url(/msppoint/membersprogram/assets/img/sekisan/deco_line_target_card_top.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 320px;
    height: 11px;
    top: 2.1%;
    left: 0;
}
@media screen and (max-width: 750px) {
    .c-block-card::before {
        background-image: url(/msppoint/membersprogram/assets/img/sekisan/sp/deco_line_target_card_top.png);
        background-repeat: no-repeat;
        background-size: cover;
        width: calc(101 / var(--design-width) * 100vw);
        height: calc(5 / var(--design-width) * 100vw);
        top: 3.8%;
        left: 0;
    }
}
.c-block-card::after {
    position: absolute;
    content: "";
    background-image: url(/msppoint/membersprogram/assets/img/sekisan/deco_line_target_card_top.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 320px;
    height: 11px;
    top: 2.1%;
    right: 1px;
}
@media screen and (max-width: 750px) {
    .c-block-card::after {
        background-image: url(/msppoint/membersprogram/assets/img/sekisan/sp/deco_line_target_card_top.png);
        background-repeat: no-repeat;
        background-size: cover;
        width: calc(101 / var(--design-width) * 100vw);
        height: calc(5 / var(--design-width) * 100vw);
        top: 3.8%;
        right: 0%;
    }
}
.c-block-card__ttl {
    font-family: "Noto Serif JP", serif;
    color: #FEDF8F;
    font-weight: 700;
    font-size: 1.25rem;
    text-align: center;
    line-height: 1.25;
}
@media screen and (max-width: 750px) {
    .c-block-card__ttl {
        font-size: calc(16 / var(--design-width) * 100vw);
        line-height: 1.5625;
    }
}

/* ---------------------------------------------
*   c-block-note
--------------------------------------------- */
.c-block-note {
    margin-top: 44px;
    padding-left: 1px;
}
@media screen and (max-width: 750px) {
    .c-block-note {
        margin-top: calc(38 / var(--design-width) * 100vw);
        padding-left: calc(4 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-block-nav
--------------------------------------------- */
.c-block-nav {
    padding-block: 54px 53px;
    background-color: #F3F9FF;
}
@media screen and (max-width: 750px) {
    .c-block-nav {
        padding-block: calc(35 / var(--design-width) * 100vw);
    }
}
.c-block-nav__container {
    max-width: 690px;
    margin: 0 auto;
}
@media screen and (max-width: 750px) {
    .c-block-nav__container {
        max-width: initial;
        width: calc(316 / var(--design-width) * 100vw);
    }
}
.c-block-nav__ttl {
    width: 220px;
    margin-inline: auto;
    margin-bottom: 40px;
}
@media screen and (max-width: 750px) {
    .c-block-nav__ttl {
        width: calc(190 / var(--design-width) * 100vw);
        margin-bottom: calc(36 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-block-list-nav
--------------------------------------------- */
.c-block-list-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 22px 40px;
    padding: 22px 7.5px 0 9px;
    border-top: 1px solid #AEC5D8;
    color: #133755;
    font-weight: 700;
    font-size: 0.75rem;
    line-height: 1.5;
    letter-spacing: 0.05em;
    margin-top: 22px;
}
@media screen and (max-width: 750px) {
    .c-block-list-nav {
        display: block;
        font-size: calc(12 / var(--design-width) * 100vw);
        padding: calc(20 / var(--design-width) * 100vw) calc(9 / var(--design-width) * 100vw) 0;
        margin-top: calc(20 / var(--design-width) * 100vw);
    }
}
.c-block-list-nav--1 {
    margin-top: 0;
}
.c-block-list-nav--sub {
    padding-top: 0;
    border-top: none;
}
@media screen and (max-width: 750px) {
    .c-block-list-nav--sub {
        display: block;
        padding-left: calc(17 / var(--design-width) * 100vw);
        margin-top: calc(17 / var(--design-width) * 100vw);
    }
}
.c-block-list-nav:last-of-type {
    padding-bottom: 22px;
    border-bottom: 1px solid #AEC5D8;
}
.c-block-list-nav__item {
    position: relative;
}
@media screen and (min-width: 751px) {
    .c-block-list-nav__item:nth-of-type(3n + 1) {
        width: 217px;
    }
    .c-block-list-nav__item:nth-of-type(3n + 2) {
        width: 192px;
    }
    .c-block-list-nav__item:nth-of-type(3n + 3) {
        width: 182px;
    }
}
@media screen and (max-width: 750px) {
    .c-block-list-nav__item {
        margin-top: calc(18 / var(--design-width) * 100vw);
    }
    .c-block-list-nav__item:first-of-type {
        margin-top: 0;
    }
}
.c-block-list-nav__item--sub::before {
    display: none;
}
@media screen and (min-width: 751px) {
    .c-block-list-nav__item--sub:nth-of-type(3n + 1) {
        padding-left: 10px;
    }
}
.c-block-list-nav__item--1 {
    display: inline-flex;
}
.c-block-list-nav__link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: fill 0.3s;
    align-items: baseline;
}
@media screen and (max-width: 750px) {
    .c-block-list-nav__link {
        justify-content: left;
        gap: calc(7 / var(--design-width) * 100vw);
    }
}
@media screen and (min-width: 751px) {
    .safari .c-block-list-nav__link {
        letter-spacing: -0.01em;
    }
}
.c-block-list-nav__link:hover {
    color: #0075D7;
}
.c-block-list-nav__link:hover .c-block-list-nav__ico path {
    fill: #fff !important;
}
.c-block-list-nav__link:hover .c-block-list-nav__ico-2 path {
    fill: #fff !important;
    stroke: #0075D7 !important;
}
.c-block-list-nav__ico {
    display: flex;
    align-self: center;
}
@media screen and (max-width: 750px) {
    .c-block-list-nav__ico {
        width: calc(14 / var(--design-width) * 100vw);
        height: calc(14 / var(--design-width) * 100vw);
        overflow: visible;
    }
}
.c-block-list-nav__ico--2 {
    transform: translateY(0px);
}
.c-block-list-nav__ico--3 {
    transform: translateY(3px);
    align-self: baseline;
}
.c-block-list-nav__ico-head {
    transform: translateY(1px);
}
@media screen and (max-width: 750px) {
    .c-block-list-nav__ico-head {
        width: calc(2 / var(--design-width) * 100vw);
        height: calc(11 / var(--design-width) * 100vw);
        transform: translate(calc(0 / var(--design-width) * 100vw), calc(0 / var(--design-width) * 100vw));
    }
}
.c-block-list-nav__ico-2 {
    transform: translateY(0);
}
@media screen and (max-width: 750px) {
    .c-block-list-nav__ico-2 {
        width: calc(6 / var(--design-width) * 100vw);
        height: calc(8 / var(--design-width) * 100vw);
        transform: translate(calc(0 / var(--design-width) * 100vw), calc(0 / var(--design-width) * 100vw));
    }
}
.c-block-list-nav .c-block-list-nav__link:hover * {
    fill: #0075D7 !important;
}
.c-block-list-nav--ico-adjust::after {
    position: absolute;
    content: "";
    background: url(/msppoint/membersprogram/assets/img/ico_nav_arrow.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 14px;
    height: 14px;
    transform: translate(44px, -15px);
}

/* ---------------------------------------------
*   hr
--------------------------------------------- */
hr[id^=anchor-] {
    display: block;
    width: 100%;
    height: 0;
    padding: 75px;
    border: 0;
    margin: -75px;
    background: 0;
    pointer-events: none;
}
hr[id^=anchor-] #anchor-member {
    padding: 0;
    margin: -10px;
}

@media screen and (max-width: 750px) {
    hr[id^=""] {
        padding-top: 21.3333333333vw !important;
        margin-top: -21.3333333333vw !important;
    }
}
hr.c-anchor {
    display: block;
    width: 100%;
    height: 0;
    padding: 75px;
    border: 0;
    margin: -75px;
    background: 0;
    pointer-events: none;
}
@media screen and (max-width: 750px) {
    hr.c-anchor {
        padding-top: 21.3333333333vw !important;
        margin-top: -21.3333333333vw !important;
    }
}

hr[id^=top-] {
    display: block;
    width: 100%;
    height: 0;
    padding: 0px;
    border: 0;
    margin: 0px;
    background: 0;
    pointer-events: none;
}

@media screen and (max-width: 750px) {
    hr[id^=top] {
        padding-top: 21.3333333333vw !important;
        margin-top: -21.3333333333vw !important;
    }
}
.p-top-addition-acc__cassette-link {
    position: relative;
    z-index: 0;
    display: block;
    width: 300px;
    border: 1px solid #133755;
    padding-block: 20px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2857142857;
    letter-spacing: 0.05em;
    color: #133755;
    background-color: #fff;
    text-align: center;
    box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.15);
    transition: background-color 0.3s, color 0.3s;
    margin-top: 19px;
    margin-inline: auto;
}

@media screen and (max-width: 750px) {
    .p-top-addition-acc__cassette-link {
        width: 60vw;
        padding-block: 3.7333333333vw;
        border-radius: 1.3333333333vw;
        font-size: 3.7333333333vw;
        line-height: 1.4285714286;
        box-shadow: 0px calc(3 / var(--design-width) * 100vw) calc(5 / var(--design-width) * 100vw) rgba(0, 0, 0, 0.15);
        border-width: 0.2666666667vw;
        margin-top: calc(20 / var(--design-width) * 100vw);
    }
}
.p-top-addition-acc__cassette-link::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    transition: background-color 0.3s;
    background: url(/msppoint/membersprogram/202410img/ico_right.svg) no-repeat center center/cover;
    transform: translateY(-50%);
    transition: transform 0.3s;
}

@media screen and (max-width: 750px) {
    .p-top-addition-acc__cassette-link::before {
        width: 4.5333333333vw;
        height: 4.6vw;
        background-size: contain;
        right: 4.8vw;
    }
}
@media print, screen and (min-width: 751px) {
    .p-top-addition-acc__cassette-link:hover {
        color: #fff;
        background-color: #133755;
    }
    .p-top-addition-acc__cassette-link:hover::before {
        background-image: url(/msppoint/membersprogram/202410img/ico_right-white.svg);
    }
}
.p-top-popup-note--1 {
    text-align: left;
}

.p-top-popup-addition__img--22 {
    width: 78px;
}

@media screen and (max-width: 750px) {
    .p-top-popup-addition__img--22 {
        width: 20.8vw;
    }
}
/* ---------------------------------------------
*   p-top-box-medal
--------------------------------------------- */
.p-top-box-medal {
    width: 715px;
    margin: 45px auto 0;
    padding-block: 14px 33px;
    background-color: rgba(19, 55, 85, 0.1);
    border-radius: 8px;
}
@media screen and (max-width: 750px) {
    .p-top-box-medal {
        width: calc(301 / var(--design-width) * 100vw);
        margin-top: calc(16 / var(--design-width) * 100vw);
        padding-block: calc(12 / var(--design-width) * 100vw) calc(21 / var(--design-width) * 100vw);
        border-radius: calc(8 / var(--design-width) * 100vw);
    }
}
.p-top-box-medal__head {
    display: flex;
    justify-content: center;
    gap: 11px;
    align-items: center;
}
@media screen and (max-width: 750px) {
    .p-top-box-medal__head {
        gap: calc(11 / var(--design-width) * 100vw);
    }
}
.p-top-box-medal__ico {
    width: 62px;
    transform: translateX(2px);
}
@media screen and (max-width: 750px) {
    .p-top-box-medal__ico {
        width: calc(46 / var(--design-width) * 100vw);
        transform: translateX(-14%);
    }
}
.p-top-box-medal__ttl {
    font-family: "Shippori Mincho", serif;
    color: #133755;
    font-weight: 700;
    font-size: 1.75rem;
    transform: translateY(-3px);
}
@media screen and (max-width: 750px) {
    .p-top-box-medal__ttl {
        font-size: calc(18.5 / var(--design-width) * 100vw);
        line-height: 1.18918919;
        transform: translate(-10%, 5%);
    }
}
.p-top-box-medal__lead {
    margin-top: 16px;
    text-align: center;
}
@media screen and (max-width: 750px) {
    .p-top-box-medal__lead {
        margin-top: calc(14 / var(--design-width) * 100vw);
        font-size: calc(14 / var(--design-width) * 100vw);
        line-height: 1.57142857;
    }
}
.p-top-box-medal__anno {
    display: flex;
    justify-content: center;
}
.p-top-box-medal__flex {
    display: flex;
    justify-content: center;
    gap: 16px;
    transform: translateX(2px);
    margin-top: 20px;
}
@media screen and (max-width: 750px) {
    .p-top-box-medal__flex {
        display: block;
        transform: translateX(0);
        margin-top: calc(9 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-box-sekisan-store
--------------------------------------------- */
.c-box-sekisan-store {
    background-image: url(/msppoint/membersprogram/assets/img/sekisan/bg_cream_1.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding-block: 30px 36px;
}
@media screen and (max-width: 750px) {
    .c-box-sekisan-store {
        background-image: url(/msppoint/membersprogram/assets/img/sekisan/sp/bg_cream_1.png);
        background-repeat: no-repeat;
        background-size: 100% 100%;
        padding-block: calc(17 / var(--design-width) * 100vw) calc(26 / var(--design-width) * 100vw);
    }
}
.c-box-sekisan-store__ttl {
    position: relative;
    font-family: "Noto Serif JP", serif;
    color: #133755;
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 1.25;
    text-align: center;
}
@media screen and (max-width: 750px) {
    .c-box-sekisan-store__ttl {
        font-size: calc(16 / var(--design-width) * 100vw);
        transform: translateX(-1%);
    }
}
.c-box-sekisan-store__ttl::after {
    position: absolute;
    content: "";
    width: 306px;
    height: 1px;
    background-color: #133755;
    bottom: -22%;
    right: 30%;
}
@media screen and (max-width: 750px) {
    .c-box-sekisan-store__ttl::after {
        width: calc(253.5 / var(--design-width) * 100vw);
        height: calc(1 / var(--design-width) * 100vw);
        bottom: -19%;
        right: 7%;
    }
}
.c-box-sekisan-store__ttl-sub {
    font-size: 1rem;
    line-height: 1.5625;
}
@media screen and (max-width: 750px) {
    .c-box-sekisan-store__ttl-sub {
        font-size: calc(13 / var(--design-width) * 100vw);
        line-height: 1.53846154;
    }
}
.c-box-sekisan-store__link {
    display: flex;
    color: #133755;
    font-weight: 700;
    font-size: 1.125rem;
    line-height: 1.11111111;
    letter-spacing: 0.05em;
    text-decoration: underline;
    text-underline-offset: 1.5px;
    text-decoration-thickness: 1px;
    text-align: center;
    margin-top: 38px;
    transform: translateX(1px);
    justify-content: center;
    margin-inline: auto;
    width: 284px;
    align-items: center;
    gap: 3px;
}
@media screen and (max-width: 750px) {
    .c-box-sekisan-store__link {
        width: 100%;
        font-size: calc(13 / var(--design-width) * 100vw);
        line-height: 1.53846154;
        margin-top: calc(23 / var(--design-width) * 100vw);
        transform: translateX(1.7%);
        gap: calc(3 / var(--design-width) * 100vw);
    }
}
.c-box-sekisan-store__link:hover {
    text-decoration: none;
}
.c-box-sekisan-store__ico {
    display: flex;
}
@media screen and (max-width: 750px) {
    .c-box-sekisan-store__ico {
        width: calc(14 / var(--design-width) * 100vw);
        height: calc(14 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-box-sekisan-mitsui
--------------------------------------------- */
.c-box-sekisan-mitsui {
    background-image: url(/msppoint/membersprogram/assets/img/sekisan/bg_cream_2.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding-block: 40px 51px;
    margin-top: 61px;
}
@media screen and (max-width: 750px) {
    .c-box-sekisan-mitsui {
        background-image: url(/msppoint/membersprogram/assets/img/sekisan/sp/bg_cream_2.png);
        background-repeat: no-repeat;
        background-size: 100% 100%;
        padding-block: calc(15 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw);
        margin-top: calc(37 / var(--design-width) * 100vw);
    }
}
.c-box-sekisan-mitsui__ttl {
    position: relative;
    font-family: "Noto Serif JP", serif;
    color: #133755;
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 1.25;
    text-align: center;
    transform: translateX(4px);
}
@media screen and (max-width: 750px) {
    .c-box-sekisan-mitsui__ttl {
        font-size: calc(16 / var(--root-fz) * 1rem);
        line-height: 1.375;
        transform: translateX(0);
    }
}
.c-box-sekisan-mitsui__ttl::after {
    position: absolute;
    content: "";
    width: 359px;
    height: 1px;
    background-color: #133755;
    bottom: -60%;
    right: 26.7%;
}
@media screen and (max-width: 750px) {
    .c-box-sekisan-mitsui__ttl::after {
        width: calc(253.5 / var(--design-width) * 100vw);
        height: calc(1 / var(--design-width) * 100vw);
        bottom: -22%;
        right: 8%;
    }
}

/* ---------------------------------------------
*   c-btn
--------------------------------------------- */
.c-btn {
    position: relative;
    z-index: 0;
    display: flex;
    width: 320px;
    border-radius: 5px;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.4285714286;
    letter-spacing: 0.05em;
    text-align: center;
    box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.2);
    transition: background-color 0.3s, color 0.3s;
    margin: 0 auto;
    height: 65px;
    justify-content: center;
    align-items: center;
}
@media screen and (max-width: 750px) {
    .c-btn {
        font-size: calc(16 / var(--root-fz) * 1rem);
        font-weight: 700;
        line-height: 1.25;
        width: calc(263 / var(--design-width) * 100vw);
        height: calc(60 / var(--design-width) * 100vw);
        border-radius: calc(5 / var(--design-width) * 100vw);
    }
}
.c-btn::before {
    content: "";
    position: absolute;
    background: url(/msppoint/membersprogram/assets/img/top/ico_arrow.svg) 0 0 no-repeat;
    background-size: contain;
    width: 21px;
    height: 21px;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
}
@media screen and (max-width: 750px) {
    .c-btn::before {
        width: calc(17 / var(--design-width) * 100vw);
        height: calc(17 / var(--design-width) * 100vw);
        transform: translate(calc(-3 / var(--design-width) * 100vw), calc(-8 / var(--design-width) * 100vw));
    }
}
.c-btn::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background: #00506E;
    opacity: 0;
    transition: all 0.3s;
    will-change: opacity;
}
@media screen and (max-width: 750px) {
    .c-btn::after {
        border-radius: calc(5 / var(--design-width) * 100vw);
    }
}
.c-btn:hover::after {
    opacity: 1;
}
.c-btn--1 {
    background: linear-gradient(-45deg, #00587B 0%, #0074A2 100%);
}
.c-btn--2 {
    background: linear-gradient(180deg, #A17F3B 0%, #82672F 100%);
}
.c-btn--2::after {
    background: #7E632D;
}
.c-btn--2:hover::after {
    opacity: 1;
}
.c-btn--small {
    width: 307px;
}
.c-btn--small::before {
    right: 13px;
}
@media screen and (max-width: 750px) {
    .c-btn--small {
        width: calc(263 / var(--design-width) * 100vw);
    }
}
.c-btn--small2 {
    height: 55px;
    margin-top: 6px;
}
@media screen and (max-width: 750px) {
    .c-btn--small2 {
        height: calc(50 / var(--design-width) * 100vw);
    }
}
.c-btn--last {
    margin-inline: 0;
}
.c-btn--last::before {
    background: url(/msppoint/membersprogram/assets/img/top/ico_plus.svg) 0 0 no-repeat;
}
@media screen and (max-width: 750px) {
    .c-btn--last::before {
        background-size: contain;
        width: calc(17 / var(--design-width) * 100vw);
        height: calc(17 / var(--design-width) * 100vw);
        transform: translate(calc(-3 / var(--design-width) * 100vw), calc(-8 / var(--design-width) * 100vw));
    }
}
@media screen and (max-width: 750px) {
    .c-btn--last {
        height: calc(50 / var(--design-width) * 100vw);
        margin-inline: auto;
    }
}
.c-btn--last2::before {
    background: url(/msppoint/membersprogram/assets/img/top/ico_arrow.svg) 0 0 no-repeat;
}
@media screen and (max-width: 750px) {
    .c-btn--last2::before {
        background-size: contain;
        width: calc(17 / var(--design-width) * 100vw);
        height: calc(17 / var(--design-width) * 100vw);
        transform: translate(calc(-3 / var(--design-width) * 100vw), calc(-8 / var(--design-width) * 100vw));
    }
}
@media screen and (max-width: 750px) {
    .c-btn--last2 {
        margin-top: calc(13 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .c-btn--smallSp {
        width: calc(125 / var(--design-width) * 100vw);
        height: calc(65 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .c-btn--smallSp1::before {
        transform: translate(calc(-3 / var(--design-width) * 100vw), calc(-7 / var(--design-width) * 100vw));
    }
}
.c-btn--smallSp2::before {
    background: url(/msppoint/membersprogram/assets/img/top/ico_plus.svg) 0 0 no-repeat;
}
@media screen and (max-width: 750px) {
    .c-btn--smallSp2::before {
        background-size: contain;
        width: calc(17 / var(--design-width) * 100vw);
        height: calc(17 / var(--design-width) * 100vw);
        transform: translate(calc(-3 / var(--design-width) * 100vw), calc(-8 / var(--design-width) * 100vw));
    }
}
@media screen and (max-width: 750px) {
    .c-btn--sp3::before {
        transform: translate(calc(-3 / var(--design-width) * 100vw), calc(-9 / var(--design-width) * 100vw));
    }
}
@media screen and (max-width: 750px) {
    .c-btn--sp4::before {
        transform: translate(calc(-3 / var(--design-width) * 100vw), calc(-9 / var(--design-width) * 100vw));
    }
}
@media screen and (max-width: 750px) {
    .c-btn--sp5::before {
        transform: translate(calc(-3 / var(--design-width) * 100vw), calc(-9 / var(--design-width) * 100vw));
    }
}
.c-btn__txt {
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.25;
    letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
    .c-btn__txt {
        font-size: calc(16 / var(--design-width) * 100vw);
        transform: translate(-4%, -1%);
    }
}
.c-btn__txt--2 {
    line-height: 1.3125;
    letter-spacing: -0.02em;
}
@media screen and (max-width: 750px) {
    .c-btn__txt--2 {
        transform: translate(-3%, -4%);
    }
}
.c-btn__txt--3 {
    transform: translate(-5px, -1px);
}
@media screen and (max-width: 750px) {
    .c-btn__txt--3 {
        line-height: 1.35;
        letter-spacing: -0.02em;
        transform: translate(-5%, 0%);
    }
}
.c-btn__txt--sub {
    font-weight: 500;
    font-size: 0.8125rem;
}
@media screen and (max-width: 750px) {
    .c-btn__txt--sub {
        font-size: calc(11 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .c-btn__txt--smallSp {
        font-size: calc(14 / var(--design-width) * 100vw);
        line-height: 1.42857143;
    }
}
@media screen and (max-width: 750px) {
    .c-btn__txt--smallSp1 {
        letter-spacing: 0.05em;
        transform: translate(-16%, 5%);
    }
}
@media screen and (max-width: 750px) {
    .c-btn__txt--smallSp2 {
        transform: translate(-16%, 5%);
    }
}

/* ---------------------------------------------
*   c-btn-benefits
--------------------------------------------- */
.c-btn-benefits {
    position: relative;
    z-index: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(204 / var(--design-width) * 100vw);
    height: calc(66 / var(--design-width) * 100vw);
    padding: calc(3 / var(--design-width) * 100vw);
    border-radius: calc(8 / var(--design-width) * 100vw);
    background: linear-gradient(21deg, #06315E 14.03%, #0C4A8A 95.9%);
    box-shadow: calc(4 / var(--design-width) * 100vw) calc(4 / var(--design-width) * 100vw) calc(6 / var(--design-width) * 100vw) calc(1 / var(--design-width) * 100vw) rgba(0, 0, 0, 0.25);
    margin: 0 auto;
}
@media screen and (max-width: 750px) {
    .c-btn-benefits {
        width: calc(263 / var(--design-width) * 100vw);
        height: calc(50 / var(--design-width) * 100vw);
    }
}
.c-btn-benefits::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: calc(8 / var(--design-width) * 100vw);
    background: #06315E;
    opacity: 0;
    transition: all 0.3s;
    will-change: opacity;
}
@media screen and (min-width: 751px) {
    .c-btn-benefits {
        transition: background-color 0.3s, color 0.3s;
    }
    .c-btn-benefits:hover::before {
        opacity: 1;
    }
}
.c-btn-benefits::after {
    content: "";
    position: absolute;
    background: url(/msppoint/membersprogram/assets/img/top/ico_arrow_benefits.svg) 0 0 no-repeat;
    background-size: contain;
    width: calc(17 / var(--design-width) * 100vw);
    height: calc(17 / var(--design-width) * 100vw);
    top: 50%;
    right: calc(8 / var(--design-width) * 100vw);
    transform: translateY(-50%);
}
@media screen and (max-width: 750px) {
    .c-btn-benefits::after {
        right: calc(12 / var(--design-width) * 100vw);
    }
}
.safari .c-btn-benefits::after {
    background-size: 100% 100%;
}

.c-btn-benefits__txt {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding-right: calc(16 / var(--design-width) * 100vw);
    border: calc(1 / var(--design-width) * 100vw) solid #E5CE52;
    border-radius: calc(5 / var(--design-width) * 100vw);
    text-align: center;
    color: #E5CE52;
    font-size: calc(13 / var(--design-width) * 100vw);
    font-weight: 700;
    line-height: 119.4%;
}

/* ---------------------------------------------
*   c-card-wrap
--------------------------------------------- */
.c-card-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
@media screen and (max-width: 750px) {
    .c-card-wrap {
        flex-direction: column;
        gap: 2.6666666667vw;
    }
}

/* ---------------------------------------------
*   c-card
--------------------------------------------- */
.c-card {
    display: flex;
    width: 100%;
    border-width: 2px;
    border-style: solid;
}
@media screen and (max-width: 750px) {
    .c-card {
        width: 78.6666666667vw;
        margin-top: 2.13333vw;
        margin-inline: auto;
        border-width: 1px;
    }
    .c-card:first-of-type {
        margin-inline: auto;
    }
    .c-card + .c-card {
        margin-top: 0;
    }
}
.c-card--2 {
    width: 400px;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .c-card--2 {
        width: 78.6666666667vw;
    }
}
.c-card--premium {
    border: 1px solid #94D2EF;
}
@media screen and (max-width: 750px) {
    .c-card--premium {
        border: 0.2666666667vw solid #94D2EF;
    }
}
.c-card--premium .c-card__body {
    background-color: #94D2EF;
}
.c-card--premium + .c-card--premium {
    border-color: #CBE7F5;
}
.c-card--premium + .c-card--premium .c-card__body {
    background-color: #CBE7F5;
}
.c-card--gold {
    border: 1px solid #EAD03B;
}
@media screen and (max-width: 750px) {
    .c-card--gold {
        border: 0.2666666667vw solid #EAD03B;
    }
}
.c-card--gold .c-card__body {
    background-color: #EAD03B;
}
.c-card--gold + .c-card--gold {
    border-color: #F5EAAE;
}
.c-card--gold + .c-card--gold .c-card__body {
    background-color: #F5EAAE;
}
.c-card--gold-top, .c-card--premium-top {
    margin-top: 25px;
}
.c-card--silver {
    border: 1px solid #DBDBDB;
}
@media screen and (max-width: 750px) {
    .c-card--silver {
        border: 0.2666666667vw solid #DBDBDB;
    }
}
.c-card--silver .c-card__body {
    background-color: #DBDBDB;
}
.c-card--bronze {
    border: 1px solid #FF8D6C;
}
@media screen and (max-width: 750px) {
    .c-card--bronze {
        border: 0.2666666667vw solid #FF8D6C;
    }
}
.c-card--bronze .c-card__body {
    background-color: #FF8D6C;
}
.c-card__head {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    padding: 13px 14px;
    font-weight: 700;
    font-size: 0.625rem;
    letter-spacing: -0.05em;
    line-height: 1.2;
    text-align: center;
    color: #333;
    flex: none;
}
@media screen and (max-width: 750px) {
    .c-card__head {
        padding: 3.7333333333vw 2.9333333333vw;
        font-size: 2.6666666667vw;
        line-height: 1.2;
    }
}
.c-card__body {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    text-align: center;
}
.c-card__txt {
    font-size: 0.8125rem;
    font-weight: bold;
    line-height: 1.5;
}
@media screen and (max-width: 750px) {
    .c-card__txt {
        font-size: 3.4666666667vw;
    }
}
.c-card__txt--s {
    display: block;
    font-size: 0.75rem;
}
@media screen and (max-width: 750px) {
    .c-card__txt--s {
        font-size: 3.2vw;
    }
}
@media screen and (max-width: 750px) {
    .safari .c-card__txt--ss {
        letter-spacing: -0.05em;
    }
}
.c-card__anno-wrap {
    margin-top: 33px;
}
@media screen and (max-width: 750px) {
    .c-card__anno-wrap {
        margin-top: 5vw;
    }
}
.c-card__anno-wrap--left {
    text-align: left;
    margin-inline: auto;
    width: 310px;
}
@media screen and (max-width: 750px) {
    .c-card__anno-wrap--left {
        width: 80vw;
    }
}
.c-card__anno-wrap--left2 {
    width: 330px;
}
@media screen and (max-width: 750px) {
    .c-card__anno-wrap--left2 {
        width: 80vw;
    }
    .safari .c-card__anno-wrap--left2 {
        width: 83vw;
    }
}
.c-card__anno-wrap--center {
    width: -moz-max-content;
    width: max-content;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .c-card__anno-wrap--center {
        width: 80vw;
        text-align: left;
    }
}

/* ---------------------------------------------
*   p-top-cassette-step
--------------------------------------------- */
.p-top-cassette-step {
    margin-top: 36px;
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step {
        margin-top: calc(28 / var(--design-width) * 100vw);
    }
}
.p-top-cassette-step__ttl {
    display: flex;
    justify-content: center;
    width: 309px;
    margin-inline: auto;
    font-family: "Shippori Mincho", serif;
    color: #A17F3B;
    font-weight: 700;
    font-size: 1.375rem;
    border: 1px solid #A17F3B;
    border-radius: 8px;
    font-feature-settings: "palt";
    line-height: 1.9;
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__ttl {
        width: calc(237 / var(--design-width) * 100vw);
        font-size: calc(16 / var(--root-fz) * 1rem);
        line-height: 1.3125;
        border-radius: min(8 / var(--design-width) * 100vw, 8px);
        text-align: center;
        padding-block: calc(6 / var(--design-width) * 100vw) calc(6 / var(--design-width) * 100vw);
        padding-right: calc(8 / var(--design-width) * 100vw);
    }
}
.p-top-cassette-step__ttl--adjust {
    letter-spacing: -0.3em;
}
.p-top-cassette-step__lead {
    margin-top: 9px;
    text-align: center;
    transform: translateX(6px);
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__lead {
        margin-top: calc(8 / var(--design-width) * 100vw);
        font-size: calc(13 / var(--root-fz) * 1rem);
        line-height: 1.69230769;
        text-align: center;
        transform: translateX(1%);
    }
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__lead--1 {
        width: calc(261 / var(--design-width) * 100vw);
        margin-inline: auto;
    }
}
.p-top-cassette-step__list {
    display: flex;
    justify-content: center;
    margin-top: 15px;
    gap: 36px;
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__list {
        margin-top: calc(17 / var(--design-width) * 100vw);
        gap: calc(14 / var(--design-width) * 100vw);
    }
}
.p-top-cassette-step__list-item {
    text-align: center;
}
.p-top-cassette-step__list-item--1 {
    width: 259px;
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__list-item--1 {
        width: calc(104 / var(--design-width) * 100vw);
    }
}
.p-top-cassette-step__list-item--2 {
    width: 145px;
    transform: translateX(-12px);
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__list-item--2 {
        width: calc(94 / var(--design-width) * 100vw);
        transform: translateX(0%);
    }
}
.p-top-cassette-step__list-item--3 {
    width: 145px;
    transform: translateX(-4px);
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__list-item--3 {
        width: calc(82 / var(--design-width) * 100vw);
        transform: translateX(-5%);
    }
}
.p-top-cassette-step__list-img {
    margin-inline: auto;
}
.p-top-cassette-step__list-img--1 {
    width: 196px;
    margin-top: 8px;
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__list-img--1 {
        width: calc(100 / var(--design-width) * 100vw);
        margin-top: calc(24 / var(--design-width) * 100vw);
        transform: translateX(4%);
    }
}
.p-top-cassette-step__list-img--2 {
    width: 61px;
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__list-img--2 {
        width: calc(55 / var(--design-width) * 100vw);
    }
}
.p-top-cassette-step__list-img--3 {
    width: 61px;
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__list-img--3 {
        width: calc(55 / var(--design-width) * 100vw);
        transform: translateX(-6%);
    }
}
.p-top-cassette-step__list-txt {
    font-weight: bold;
    font-size: 0.8125rem;
    line-height: 1.38461538;
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__list-txt {
        font-size: calc(11 / var(--root-fz) * 1rem);
        line-height: 1.27272727;
    }
}
.p-top-cassette-step__list-txt--1 {
    margin-top: 10px;
    transform: translateX(4px);
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__list-txt--1 {
        margin-top: calc(32 / var(--design-width) * 100vw);
        transform: translateX(2%);
    }
}
.p-top-cassette-step__list-txt--2 {
    margin-top: 18px;
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__list-txt--2 {
        margin-top: calc(9 / var(--design-width) * 100vw);
    }
}
.p-top-cassette-step__list-txt--3 {
    margin-top: 8px;
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__list-txt--3 {
        margin-top: calc(8 / var(--design-width) * 100vw);
    }
}
.p-top-cassette-step__anno {
    width: 653px;
    margin-inline: auto;
    margin-top: 31px;
}
@media screen and (max-width: 750px) {
    .p-top-cassette-step__anno {
        width: calc(284 / var(--design-width) * 100vw);
        margin-top: calc(35 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-figure
--------------------------------------------- */
/* ---------------------------------------------
*   c-form
--------------------------------------------- */
/* ---------------------------------------------
*   c-img
--------------------------------------------- */
/* ---------------------------------------------
*   c-kv
--------------------------------------------- */
.c-kv {
    position: relative;
    width: 100%;
}
.c-kv__container {
    width: 100%;
}
@media screen and (max-width: 750px) {
    .c-kv__container {
        margin-top: 21vw;
    }
}
.c-kv__ttl img {
    width: 100%;
}
.c-kv__bnr {
    position: absolute;
    bottom: calc(43 / var(--design-width) * 100vw);
    left: calc(372 / var(--design-width) * 100vw);
}
@media screen and (max-width: 750px) {
    .c-kv__bnr {
        bottom: calc(28 / var(--design-width) * 100vw);
        left: 50%;
        transform: translateX(-50%);
    }
}

/* ---------------------------------------------
*   c-link
--------------------------------------------- */
/* ---------------------------------------------
*   p-top-section-step-list
--------------------------------------------- */
.p-top-section-step-list {
    display: flex;
    justify-content: center;
    gap: 74px;
    margin-top: 10px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list {
        gap: calc(12 / var(--design-width) * 100vw);
        margin-top: calc(1 / var(--design-width) * 100vw);
    }
}
.p-top-section-step-list__item--1 {
    position: relative;
    width: 170px;
}
.p-top-section-step-list__item--1 ::after {
    position: absolute;
    content: "";
    background-image: url(/msppoint/membersprogram/assets/img/top/ico_step_arrow.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 14px;
    height: 20px;
    top: 0;
    right: 0;
    transform: translate(41px, 91px);
    image-rendering: -webkit-optimize-contrast; /* Safari用 */
    image-rendering: smooth; /* モダンブラウザ用 */
    /* または */
    image-rendering: auto; /* ブラウザ標準（通常はこれで滑らかになる） */
    -o-object-fit: cover;
       object-fit: cover;
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__item--1 ::after {
        width: calc(8 / var(--design-width) * 100vw);
        height: calc(11 / var(--design-width) * 100vw);
        transform: translate(calc(10 / var(--design-width) * 100vw), calc(81 / var(--design-width) * 100vw));
    }
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__item--1 {
        width: calc(93 / var(--design-width) * 100vw);
    }
}
.p-top-section-step-list__item--2 {
    position: relative;
    width: 160px;
}
.p-top-section-step-list__item--2 ::after {
    position: absolute;
    content: "";
    background-image: url(/msppoint/membersprogram/assets/img/top/ico_step_arrow.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 14px;
    height: 20px;
    top: 0;
    right: 0;
    transform: translate(48px, 91px);
    image-rendering: -webkit-optimize-contrast; /* Safari用 */
    image-rendering: smooth; /* モダンブラウザ用 */
    /* または */
    image-rendering: auto; /* ブラウザ標準（通常はこれで滑らかになる） */
    -o-object-fit: cover;
       object-fit: cover;
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__item--2 ::after {
        width: calc(8 / var(--design-width) * 100vw);
        height: calc(11 / var(--design-width) * 100vw);
        transform: translate(calc(10 / var(--design-width) * 100vw), calc(81 / var(--design-width) * 100vw));
    }
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__item--2 {
        width: calc(93 / var(--design-width) * 100vw);
    }
}
.p-top-section-step-list__item--3 {
    width: 174px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__item--3 {
        width: calc(93 / var(--design-width) * 100vw);
    }
}
.p-top-section-step-list__step {
    font-family: "Shippori Mincho", serif;
    color: #674E00;
    font-weight: 700;
    font-size: 0.875rem;
    line-height: 2.07142857;
    text-align: center;
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__step {
        font-size: calc(11 / var(--root-fz) * 1rem);
        line-height: 2.63636364;
    }
}
.p-top-section-step-list__num {
    font-size: 1.5rem;
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__num {
        font-size: calc(21 / var(--root-fz) * 1rem);
    }
}
.p-top-section-step-list__img {
    width: 112px;
    margin: -4px auto 0;
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__img {
        width: calc(81 / var(--design-width) * 100vw);
        margin-top: calc(-8 / var(--design-width) * 100vw);
    }
}
.p-top-section-step-list__head {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    font-weight: bold;
    font-size: 1.125rem;
    line-height: 1.22222222;
    background-color: #A17F3B;
    margin-top: 15px;
}
.p-top-section-step-list__head--1 {
    width: 169px;
    height: 26px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__head--1 {
        width: calc(93 / var(--design-width) * 100vw);
        height: calc(43 / var(--design-width) * 100vw);
        line-height: 1.2;
    }
}
.p-top-section-step-list__head--2 {
    width: 160px;
    height: 26px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__head--2 {
        width: calc(93 / var(--design-width) * 100vw);
        height: calc(43 / var(--design-width) * 100vw);
        line-height: 1.2;
    }
}
.p-top-section-step-list__head--3 {
    width: 176px;
    height: 26px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__head--3 {
        width: calc(93 / var(--design-width) * 100vw);
        height: calc(43 / var(--design-width) * 100vw);
        line-height: 1.2;
    }
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__head {
        font-size: calc(15 / var(--root-fz) * 1rem);
        line-height: 1.2;
        margin-top: calc(8 / var(--design-width) * 100vw);
        width: calc(93 / var(--design-width) * 100vw);
        height: calc(43 / var(--design-width) * 100vw);
    }
}
.p-top-section-step-list__head--1 {
    width: 169px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__head--1 {
        width: 100%;
    }
}
.p-top-section-step-list__desc {
    margin-top: 10px;
    font-size: 1rem;
    line-height: 1.375;
    padding-left: 4px;
    font-feature-settings: "palt";
}
@media screen and (max-width: 750px) {
    .p-top-section-step-list__desc {
        margin-top: calc(5 / var(--design-width) * 100vw);
        font-size: calc(13 / var(--root-fz) * 1rem);
        line-height: 1.46153846;
    }
}

/* ---------------------------------------------
*   p-top-list
--------------------------------------------- */
.p-top-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    -moz-column-gap: 13px;
         column-gap: 13px;
    row-gap: 13px;
    margin-top: 22px;
}
@media screen and (max-width: 750px) {
    .p-top-list {
        -moz-column-gap: calc(13 / var(--design-width) * 100vw);
             column-gap: calc(13 / var(--design-width) * 100vw);
        row-gap: calc(13 / var(--design-width) * 100vw);
        margin-top: calc(23 / var(--design-width) * 100vw);
    }
}
.p-top-list__item--1 {
    align-self: end !important;
}
@media screen and (max-width: 750px) {
    .p-top-list__item--1 {
        transform: translateX(6%);
    }
}
.p-top-list__item--2 {
    padding-top: 20px;
}
@media screen and (max-width: 750px) {
    .p-top-list__item--2 {
        padding-top: 0;
    }
}
@media screen and (max-width: 750px) {
    .p-top-list__item--3 {
        margin-top: calc(1 / var(--design-width) * 100vw);
    }
}
.p-top-list__txt-sub {
    display: block;
    text-align: center;
    color: #A17F3B;
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.42857143;
}
@media screen and (max-width: 750px) {
    .p-top-list__txt-sub {
        font-size: calc(12 / var(--design-width) * 100vw);
    }
}
.p-top-list__txt-sub--1 {
    transform: translate(3px, -3px);
}
@media screen and (max-width: 750px) {
    .p-top-list__txt-sub--1 {
        line-height: 1.08333333;
    }
}
.p-top-list__txt-sub--2 {
    transform: translate(1px, -2px);
}
@media screen and (max-width: 750px) {
    .p-top-list__txt-sub--2 {
        line-height: 1.7;
    }
}
.p-top-list__txt-sub--3 {
    transform: translate(6px, -3px);
}
@media screen and (max-width: 750px) {
    .p-top-list__txt-sub--3 {
        transform: translate(0.5%, 0);
    }
}
.p-top-list__txt-sub--4 {
    transform: translate(0, -4px);
}
@media screen and (max-width: 750px) {
    .p-top-list__txt-sub--4 {
        transform: translate(0%, -31%);
    }
}

/* ---------------------------------------------
*   c-list-store
--------------------------------------------- */
.c-list-store {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 25px 23px;
    margin-top: 36px;
}
@media screen and (max-width: 750px) {
    .c-list-store {
        gap: calc(13 / var(--design-width) * 100vw) calc(12 / var(--design-width) * 100vw);
        margin-top: calc(23 / var(--design-width) * 100vw);
    }
}
.c-list-store__link {
    position: relative;
    z-index: 0;
    display: flex;
    justify-content: center;
    width: 136px;
    height: 96px;
    border: 1px solid #A17F3B;
    padding-block: 23px 10px;
    border-radius: 5px;
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 1.11111111;
    letter-spacing: 0.05em;
    color: #A17F3B;
    background-color: #fff;
    text-align: center;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.15);
    transition: background-color 0.3s, color 0.3s, box-shadow 0.3s;
}
@media screen and (max-width: 750px) {
    .c-list-store__link {
        justify-content: flex-start;
        width: calc(124 / var(--design-width) * 100vw);
        height: calc(55 / var(--design-width) * 100vw);
        padding-block: calc(18 / var(--design-width) * 100vw) calc(5 / var(--design-width) * 100vw);
        border-radius: calc(5 / var(--design-width) * 100vw);
        font-size: calc(13 / var(--design-width) * 100vw);
        line-height: 1.53846154;
    }
}
.c-list-store__link:hover {
    outline: 2px solid #A17F3B;
    outline-offset: -2px;
}
.c-list-store__link::before {
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    top: 48%;
    right: 42%;
    transition: background-color 0.3s;
    background: url(/msppoint/membersprogram/assets/img/sekisan/ico_plus.svg) no-repeat center center/cover;
    transform: translateY(86%);
}
@media screen and (max-width: 750px) {
    .c-list-store__link::before {
        width: calc(16 / var(--design-width) * 100vw);
        height: calc(16 / var(--design-width) * 100vw);
        transform: translate(calc(43 / var(--design-width) * 100vw), calc(-7 / var(--design-width) * 100vw));
    }
}
.c-list-store__link--1 {
    padding-top: 12px;
}
@media screen and (max-width: 750px) {
    .c-list-store__link--1 {
        padding-top: calc(12 / var(--design-width) * 100vw);
        padding-left: calc(12 / var(--design-width) * 100vw);
        line-height: 1.15384615;
    }
}
@media screen and (max-width: 750px) {
    .c-list-store__link--2 {
        padding-left: calc(17 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .c-list-store__link--3 {
        padding-left: calc(33 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .c-list-store__link--4 {
        padding-left: calc(27 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-list-service
--------------------------------------------- */
.c-list-service {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 25px 35px;
    margin-top: 50px;
}
@media screen and (max-width: 750px) {
    .c-list-service {
        gap: calc(13 / var(--design-width) * 100vw) calc(12 / var(--design-width) * 100vw);
        margin-top: calc(24 / var(--design-width) * 100vw);
    }
}
.c-list-service__link {
    position: relative;
    z-index: 0;
    display: block;
    width: 159px;
    height: 150px;
    border: 1px solid #A17F3B;
    padding-bottom: 35px;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.15);
    transition: background-color 0.3s, color 0.3s, box-shadow 0.3s;
}
@media screen and (max-width: 750px) {
    .c-list-service__link {
        width: calc(124 / var(--design-width) * 100vw);
        height: calc(124 / var(--design-width) * 100vw);
        padding-bottom: calc(15 / var(--design-width) * 100vw);
        border-radius: calc(5 / var(--design-width) * 100vw);
    }
}
.c-list-service__link:hover {
    outline: 2px solid #A17F3B;
    outline-offset: -2px;
}
.c-list-service__link::before {
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    top: 70%;
    right: 43%;
    transition: background-color 0.3s;
    background: url(/msppoint/membersprogram/assets/img/sekisan/ico_plus.svg) no-repeat center center/cover;
    transform: translateY(86%);
}
@media screen and (max-width: 750px) {
    .c-list-service__link::before {
        width: calc(16 / var(--design-width) * 100vw);
        height: calc(16 / var(--design-width) * 100vw);
        transform: translate(calc(0 / var(--design-width) * 100vw), calc(14 / var(--design-width) * 100vw));
    }
}
.c-list-service__link--1 {
    padding-top: 14px;
}
@media screen and (max-width: 750px) {
    .c-list-service__link--1 {
        padding-top: calc(9 / var(--design-width) * 100vw);
    }
}
.c-list-service__link--2 {
    padding-top: 16px;
    transform: translateX(-1px);
}
@media screen and (max-width: 750px) {
    .c-list-service__link--2 {
        padding-top: calc(13 / var(--design-width) * 100vw);
        transform: translateX(-1%);
    }
}
.c-list-service__link--3 {
    padding-top: 21px;
    transform: translateX(-4px);
}
@media screen and (max-width: 750px) {
    .c-list-service__link--3 {
        padding-top: calc(16 / var(--design-width) * 100vw);
        transform: translateX(1%);
    }
}
.c-list-service__img {
    width: 139px;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .c-list-service__img {
        width: calc(101 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-list-card
--------------------------------------------- */
.c-list-card {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 24px 45px;
    padding-block: 41px 38px;
}
@media screen and (max-width: 750px) {
    .c-list-card {
        gap: calc(19 / var(--design-width) * 100vw) calc(1 / var(--design-width) * 100vw);
        padding-block: calc(28 / var(--design-width) * 100vw) calc(34 / var(--design-width) * 100vw);
    }
}
.c-list-card::after {
    position: absolute;
    content: "";
    background-image: url(/msppoint/membersprogram/assets/img/sekisan/deco_line_target_card_bottom.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 770px;
    height: 9px;
    bottom: -2px;
}
@media screen and (max-width: 750px) {
    .c-list-card::after {
        background-image: url(/msppoint/membersprogram/assets/img/sekisan/sp/deco_line_target_card_bottom.png);
        width: calc(298 / var(--design-width) * 100vw);
        height: calc(5 / var(--design-width) * 100vw);
        bottom: -2%;
    }
}
.c-list-card__item {
    width: 190px;
}
@media screen and (max-width: 750px) {
    .c-list-card__item {
        width: calc(99 / var(--design-width) * 100vw);
    }
}
.c-list-card__item--1 {
    transform: translateX(-1px);
}
@media screen and (max-width: 750px) {
    .c-list-card__item--1 {
        transform: translateX(2%);
    }
}
.c-list-card__item--2 {
    transform: translateX(1px);
}
@media screen and (max-width: 750px) {
    .c-list-card__item--2 {
        transform: translateX(8%);
    }
}
.c-list-card__item--3 {
    transform: translateX(13px);
}
@media screen and (max-width: 750px) {
    .c-list-card__item--3 {
        transform: translateX(13%);
    }
}
.c-list-card__item--4 {
    transform: translateX(25px);
}
@media screen and (max-width: 750px) {
    .c-list-card__item--4 {
        transform: translate(20%, 0);
    }
}
.c-list-card__item--5 {
    width: 238px;
    text-align: center;
    transform: translateX(7px);
}
@media screen and (max-width: 750px) {
    .c-list-card__item--5 {
        width: calc(188 / var(--design-width) * 100vw);
        transform: translate(9%, 0);
    }
}
.c-list-card__img {
    width: 188px;
}
@media screen and (max-width: 750px) {
    .c-list-card__img {
        width: calc(86 / var(--design-width) * 100vw);
    }
}
.c-list-card__img--last {
    display: inline-block;
}
.c-list-card__txt {
    font-size: 0.6875rem;
    text-align: center;
    line-height: 1.45454545;
    margin-top: 10px;
}
@media screen and (max-width: 750px) {
    .c-list-card__txt {
        font-size: calc(9 / var(--design-width) * 100vw);
        line-height: 1.44444444;
        margin-top: calc(8 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .c-list-card__txt--1 {
        transform: translate(-6%, 0);
    }
}
@media screen and (max-width: 750px) {
    .c-list-card__txt--2 {
        transform: translate(-6%, 0);
    }
}
@media screen and (max-width: 750px) {
    .c-list-card__txt--3 {
        transform: translate(-6%, 0);
    }
}
@media screen and (max-width: 750px) {
    .c-list-card__txt--4 {
        transform: translate(-6%, 4%);
    }
}
@media screen and (max-width: 750px) {
    .c-list-card__txt--5 {
        transform: translate(0, 4%);
    }
}

/* ---------------------------------------------
*   c-list-note
--------------------------------------------- */
.c-list-note {
    text-spacing-trim: space-all;
}
.c-list-note__item {
    display: flex;
    font-size: 0.75rem;
    line-height: 1.33333333;
    margin-top: 9px;
}
@media screen and (max-width: 750px) {
    .c-list-note__item {
        gap: 1.0666666667vw;
        font-size: calc(12 / var(--design-width) * 100vw);
        margin-top: calc(7 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   p-top-section
--------------------------------------------- */
.p-top-section {
    padding-block: 23px 100px;
    padding-inline: 20px;
    background: linear-gradient(to right, #005187 0%, #0b6f9e 49%, #08588c 100%);
}
@media screen and (max-width: 750px) {
    .p-top-section {
        padding-block: calc(26 / var(--design-width) * 100vw) calc(26 / var(--design-width) * 100vw);
        padding-inline: calc(20 / var(--design-width) * 100vw);
    }
}
.p-top-section__container {
    position: relative;
    max-width: 900px;
    margin: 70px auto 0;
    padding-block: 60px 50px;
    background-color: #F6F2E6;
    border-radius: 8px;
}
@media screen and (max-width: 750px) {
    .p-top-section__container {
        padding-block: calc(35 / var(--design-width) * 100vw) calc(50 / var(--design-width) * 100vw);
        margin-top: 0;
    }
}
.p-top-section__container::before {
    position: absolute;
    content: "";
    background-image: url(/msppoint/membersprogram/assets/img/top/deco_menpro_top.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 880px;
    height: 8px;
    top: 0;
    transform: translate(11px, 11px);
}
@media screen and (max-width: 750px) {
    .p-top-section__container::before {
        background-image: url(/msppoint/membersprogram/assets/img/top/sp/deco_menpro_top.png);
        width: calc(317 / var(--design-width) * 100vw);
        height: calc(7 / var(--design-width) * 100vw);
        transform: translate(calc(10 / var(--design-width) * 100vw), calc(9 / var(--design-width) * 100vw));
    }
}
.p-top-section__container::after {
    position: absolute;
    content: "";
    background-image: url(/msppoint/membersprogram/assets/img/top/deco_menpro_bottom.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 880px;
    height: 8px;
    bottom: 0;
    transform: translate(10px, -9px);
}
@media screen and (max-width: 750px) {
    .p-top-section__container::after {
        background-image: url(/msppoint/membersprogram/assets/img/top/sp/deco_menpro_bottom.png);
        width: calc(317 / var(--design-width) * 100vw);
        height: calc(7 / var(--design-width) * 100vw);
        transform: translate(calc(10 / var(--design-width) * 100vw), calc(-9 / var(--design-width) * 100vw));
    }
}
.p-top-section__ttl {
    font-family: "Shippori Mincho", serif;
    color: #133755;
    text-align: center;
    font-weight: 700;
    font-size: 2.125rem;
    line-height: 1.17241379;
}
@media screen and (max-width: 750px) {
    .p-top-section__ttl {
        font-size: calc(24 / var(--root-fz) * 1rem);
        line-height: 1.20833333;
    }
}
.p-top-section__body {
    margin-top: 17px;
}
@media screen and (max-width: 750px) {
    .p-top-section__body {
        margin-top: calc(20 / var(--design-width) * 100vw);
    }
}
.p-top-section__lead {
    color: #133755;
    text-align: center;
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.75;
    letter-spacing: 0.05em;
    width: 503px;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-top-section__lead {
        text-align: left;
        font-size: calc(14 / var(--root-fz) * 1rem);
        line-height: 1.57142857;
        width: calc(280 / var(--design-width) * 100vw);
    }
}
.p-top-section__graph {
    width: 702px;
    margin: 37px auto 0;
    transform: translateX(4px);
}
@media screen and (max-width: 750px) {
    .p-top-section__graph {
        width: calc(289 / var(--design-width) * 100vw);
        margin-top: calc(47 / var(--design-width) * 100vw);
        transform: translateX(0);
    }
}

/* ---------------------------------------------
*   p-top-bg
--------------------------------------------- */
.p-top-bg {
    padding-block: 113px 101px;
    padding-inline: 20px;
    background-color: #F1EBDD;
}
@media screen and (max-width: 750px) {
    .p-top-bg {
        padding-block: calc(55 / var(--design-width) * 100vw) calc(22 / var(--design-width) * 100vw);
        padding-inline: calc(20 / var(--design-width) * 100vw);
    }
}
.p-top-bg__container {
    max-width: 900px;
    margin: 0 auto;
}
/* ---------------------------------------------
*   p-top-section-step
--------------------------------------------- */
.p-top-section-step {
    position: relative;
    background-color: #fff;
    border: 2px solid #A17F3B;
    border-top: 0;
    border-radius: 8px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step {
        border: calc(2 / var(--design-width) * 100vw) solid #A17F3B;
        border-top: 0;
        border-radius: min(8 / var(--design-width) * 100vw, 8px);
    }
}
.p-top-section-step::before {
    position: absolute;
    content: "";
    width: 386px;
    height: 8px;
    border-top: 2px solid #A17F3B;
    border-left: 2px solid #A17F3B;
    border-radius: 8px 0 0 0;
    top: -1px;
    left: -2px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step::before {
        width: calc(128 / var(--design-width) * 100vw);
        height: calc(8 / var(--design-width) * 100vw);
        border-top: calc(2 / var(--design-width) * 100vw) solid #A17F3B;
        border-left: calc(2 / var(--design-width) * 100vw) solid #A17F3B;
        border-radius: min(8 / var(--design-width) * 100vw, 8px) 0 0 0;
        left: calc(-2 / var(--design-width) * 100vw);
    }
}
.p-top-section-step::after {
    position: absolute;
    content: "";
    width: 385px;
    height: 8px;
    border-top: 2px solid #A17F3B;
    border-right: 2px solid #A17F3B;
    border-radius: 0 8px 0 0;
    top: -1px;
    right: -2px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step::after {
        width: calc(127 / var(--design-width) * 100vw);
        height: calc(8 / var(--design-width) * 100vw);
        border-top: calc(2 / var(--design-width) * 100vw) solid #A17F3B;
        border-right: calc(2 / var(--design-width) * 100vw) solid #A17F3B;
        border-radius: 0 min(8 / var(--design-width) * 100vw, 8px) 0 0;
        right: calc(-2 / var(--design-width) * 100vw);
    }
}
.p-top-section-step--1 {
    padding-block: 66px 27px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step--1 {
        padding-block: calc(41 / var(--design-width) * 100vw) calc(23 / var(--design-width) * 100vw);
    }
}
.p-top-section-step--2 {
    margin-top: 92px;
    padding-block: 64px 56px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step--2 {
        margin-top: calc(53 / var(--design-width) * 100vw);
        padding-block: calc(44 / var(--design-width) * 100vw) calc(30 / var(--design-width) * 100vw);
    }
}
.p-top-section-step--3 {
    margin-top: 92px;
    padding-block: 70px 32px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step--3 {
        margin-top: calc(55 / var(--design-width) * 100vw);
        padding-block: calc(40 / var(--design-width) * 100vw) calc(39 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__ico {
    position: absolute;
    content: "";
    width: 130px;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
}
@media screen and (max-width: 750px) {
    .p-top-section-step__ico {
        width: calc(82 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__head {
    position: relative;
    display: flex;
    justify-content: center;
    gap: 21px;
    color: #A17F3B;
    font-weight: 700;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__head--1 {
        gap: calc(22 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-top-section-step__head--2 {
        gap: calc(17 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-top-section-step__head--3 {
        gap: calc(14 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__head::after {
    position: absolute;
    content: "";
    width: 343px;
    height: 1px;
    bottom: -7px;
    right: 31.5%;
    background-color: #A17F3B;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__head::after {
        width: calc(256 / var(--design-width) * 100vw);
        height: calc(1 / var(--design-width) * 100vw);
        bottom: -30%;
        right: 11%;
    }
}
.p-top-section-step__head--2::after {
    transform: translate(6px, 1px);
}
@media screen and (max-width: 750px) {
    .p-top-section-step__head--2::after {
        width: calc(271 / var(--design-width) * 100vw);
        bottom: -22%;
        right: 11%;
    }
}
.p-top-section-step__head--3::after {
    transform: translate(6px, 1px);
}
@media screen and (max-width: 750px) {
    .p-top-section-step__head--3::after {
        width: calc(271 / var(--design-width) * 100vw);
        bottom: -32%;
        right: 11%;
    }
}
.p-top-section-step__txt {
    position: relative;
    font-family: "Shippori Mincho", serif;
    font-size: 0.875rem;
    line-height: 2.07142857;
    text-align: center;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__txt {
        font-size: calc(11 / var(--root-fz) * 1rem);
        line-height: initial;
        transform: translateX(8%);
    }
}
.p-top-section-step__txt::after {
    position: absolute;
    content: "";
    width: 1px;
    height: 15px;
    top: 20px;
    right: -9px;
    background-color: #A17F3B;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__txt::after {
        width: calc(1 / var(--design-width) * 100vw);
        height: calc(13 / var(--design-width) * 100vw);
        top: 31%;
        right: -19%;
    }
}
.p-top-section-step__txt--2 {
    transform: translateX(-3px);
}
.p-top-section-step__txt--2::after {
    right: -11px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__txt--2::after {
        right: -26%;
        transform: translateY(10%);
    }
}
.p-top-section-step__txt--3 {
    transform: translateX(-3px);
}
.p-top-section-step__txt--3::after {
    right: -13px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__txt--3::after {
        right: -17%;
        transform: translateY(10%);
    }
}
.p-top-section-step__num {
    font-size: 1.5rem;
    padding-left: 3px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__num {
        font-size: calc(21 / var(--design-width) * 100vw);
        padding-left: calc(3 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__ttl {
    font-family: "Shippori Mincho B1", serif;
    font-size: 2.125rem;
    line-height: 1.5;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__ttl {
        font-size: calc(24 / var(--root-fz) * 1rem);
        line-height: initial;
        font-weight: 700;
    }
}
.p-top-section-step__body {
    margin-top: 30px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__body--1 {
        margin-top: calc(29 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-top-section-step__body--2 {
        margin-top: calc(26 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-top-section-step__body--3 {
        margin-top: calc(27 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__lead {
    text-align: center;
    line-height: 1.75;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__lead {
        text-align: left;
        font-size: calc(14 / var(--root-fz) * 1rem);
        line-height: 1.57142857;
        transform: translateX(0.7%);
    }
}
.p-top-section-step__lead--1 {
    text-align: left;
    width: 480px;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__lead--1 {
        width: calc(254 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__lead--2 {
    text-align: left;
    width: 436px;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__lead--2 {
        width: calc(271 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__lead--3 {
    text-align: left;
    width: 436px;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__lead--3 {
        width: calc(283 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__img--1 {
    width: 294px;
    margin: 14px auto 0;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__img--1 {
        width: calc(249 / var(--design-width) * 100vw);
        margin-top: calc(21 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__img--2 {
    width: 409px;
    margin: 18px auto 0;
    transform: translateX(-5px);
}
@media screen and (max-width: 750px) {
    .p-top-section-step__img--2 {
        width: calc(272 / var(--design-width) * 100vw);
        margin-top: calc(11 / var(--design-width) * 100vw);
        transform: translateX(0);
    }
}
.p-top-section-step__img--3 {
    width: 496px;
    margin: 20px auto 0;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__img--3 {
        width: calc(276 / var(--design-width) * 100vw);
        margin-top: calc(14 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__btn {
    text-align: center;
}
.p-top-section-step__btn--1 {
    margin-top: 34px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__btn--1 {
        margin-top: calc(19 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__btn--2 {
    margin-top: 34px;
}
.p-top-section-step__btn--3 {
    margin-top: 20px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__btn--3 {
        margin-top: calc(30 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    margin-top: 13px;
}
@media screen and (max-width: 750px) {
    .p-top-section-step__link {
        gap: calc(4 / var(--design-width) * 100vw);
        margin-top: calc(16 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__link-icon {
    width: 19px;
    height: 19px;
    display: flex; /* 子要素のimgを操作可能に */
    align-items: center; /* imgを上下中央へ */
}
@media screen and (max-width: 750px) {
    .p-top-section-step__link-icon {
        width: calc(19 / var(--design-width) * 100vw);
        height: calc(19 / var(--design-width) * 100vw);
    }
}
.p-top-section-step__link-txt {
    color: #C81700;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.25;
    text-decoration: underline;
    text-underline-offset: 1.5px;
    text-decoration-thickness: 1px;
}
.p-top-section-step__link-txt:hover {
    text-decoration: none;
}

/* ---------------------------------------------
*   p-top-target
--------------------------------------------- */
.p-top-target {
    margin-top: 81px;
}
@media screen and (max-width: 750px) {
    .p-top-target {
        margin-top: calc(56 / var(--design-width) * 100vw);
    }
}
.p-top-target__head {
    position: relative;
    background-color: #133755;
    border-radius: 8px 8px 0 0;
    text-align: center;
    padding-block: 15px 10px;
}
@media screen and (max-width: 750px) {
    .p-top-target__head {
        border-radius: min(8 / var(--design-width) * 100vw, 8px) min(8 / var(--design-width) * 100vw, 8px) 0 0;
        text-align: left;
        padding-block: calc(8 / var(--design-width) * 100vw) calc(13 / var(--design-width) * 100vw);
    }
}
.p-top-target__ico {
    position: absolute;
    content: "";
    width: 90px;
    top: -16%;
    right: 67.6%;
}
@media screen and (max-width: 750px) {
    .p-top-target__ico {
        width: calc(60 / var(--design-width) * 100vw);
        top: -18%;
        right: 79.1%;
    }
}
.p-top-target__ttl {
    font-family: "Shippori Mincho", serif;
    color: #fff;
    font-weight: 700;
    font-size: 1.75rem;
    transform: translate(47px, -4px);
}
@media screen and (max-width: 750px) {
    .p-top-target__ttl {
        font-size: calc(18 / var(--root-fz) * 1rem);
        transform: translate(0%, 8%);
        line-height: 1.22222222;
        padding-left: calc(70 / var(--design-width) * 100vw);
        letter-spacing: -0.03em;
    }
}
@media screen and (max-width: 750px) {
    .p-top-target__adjust {
        letter-spacing: -0.11em;
    }
}
.p-top-target__body {
    background-color: #fff;
    border: 1.5px solid #133755;
    border-top: none;
    border-radius: 0 0 8px 8px;
    padding-block: 32px 28px;
}
@media screen and (max-width: 750px) {
    .p-top-target__body {
        border: min(1.5 / var(--design-width) * 100vw, 1.5px) solid #133755;
        border-radius: 0 0 min(8 / var(--design-width) * 100vw, 8px) min(8 / var(--design-width) * 100vw, 8px);
        padding-block: calc(22 / var(--design-width) * 100vw) calc(30 / var(--design-width) * 100vw);
    }
}
.p-top-target__lead {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
@media screen and (max-width: 750px) {
    .p-top-target__lead {
        gap: calc(12 / var(--design-width) * 100vw);
    }
}
.p-top-target__lead-icon {
    width: 59px;
    transform: translateX(-4px);
}
@media screen and (max-width: 750px) {
    .p-top-target__lead-icon {
        width: calc(50 / var(--design-width) * 100vw);
        transform: translateX(-4%);
    }
}
.p-top-target__lead-txt {
    font-size: 1rem;
    line-height: 1.75;
}
@media screen and (max-width: 750px) {
    .p-top-target__lead-txt {
        font-size: calc(14 / var(--design-width) * 100vw);
        line-height: 1.57142857;
    }
}
.p-top-target__anno {
    display: flex;
    justify-content: center;
    margin-top: 20px;
    transform: translateX(-2px);
}
@media screen and (max-width: 750px) {
    .p-top-target__anno {
        width: calc(301 / var(--design-width) * 100vw);
        text-indent: -0.75em;
        padding-left: 0.75em;
        margin-top: calc(9 / var(--design-width) * 100vw);
        margin-inline: auto;
        transform: none;
    }
}
.p-top-target__link {
    text-decoration: underline;
    text-underline-offset: 1.5px;
    text-decoration-thickness: 1px;
}
.p-top-target__link:hover {
    text-decoration: none;
}

/* ---------------------------------------------
*   c-section-sekisan
--------------------------------------------- */
.c-section-sekisan {
    position: relative;
    color: #fff;
    background-color: #013B6B;
    padding-block: 83px 132px;
}
@media screen and (max-width: 750px) {
    .c-section-sekisan {
        padding-block: calc(50 / var(--design-width) * 100vw) calc(33 / var(--design-width) * 100vw);
    }
}
.c-section-sekisan::before {
    position: absolute;
    content: "";
    background-image: url(/msppoint/membersprogram/assets/img/sekisan/bg_deco_left.png);
    background-repeat: no-repeat;
    background-size: auto 100%;
    top: 0;
    bottom: 0;
    left: 0;
    width: 471px;
    pointer-events: none; /* 重なりによるクリック不可を防ぐ（推奨） */
}
@media screen and (max-width: 750px) {
    .c-section-sekisan::before {
        background-image: url(/msppoint/membersprogram/assets/img/sekisan/sp/bg_deco_left.png);
        width: 111px;
    }
}
.c-section-sekisan::after {
    position: absolute;
    content: "";
    background-image: url(/msppoint/membersprogram/assets/img/sekisan/bg_deco_right.png);
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: right bottom; /* 右下を基準にする */
    top: 0;
    bottom: 0;
    right: 0;
    width: 466px;
    pointer-events: none; /* 重なりによるクリック不可を防ぐ（推奨） */
}
@media screen and (max-width: 750px) {
    .c-section-sekisan::after {
        background-image: url(/msppoint/membersprogram/assets/img/sekisan/sp/bg_deco_right.png);
        width: 111px;
    }
}
@media screen and (max-width: 750px) {
    .c-section-sekisan {
        margin-top: 21vw;
    }
}
.c-section-sekisan__container {
    position: relative;
    max-width: 770px;
    margin: 0 auto;
}
.c-section-sekisan__lead {
    font-size: 1rem;
    line-height: 1.75;
    text-align: center;
    margin-top: 5px;
}
@media screen and (max-width: 750px) {
    .c-section-sekisan__lead {
        font-size: calc(13 / var(--design-width) * 100vw);
        line-height: 1.53846154;
        margin-top: calc(16 / var(--design-width) * 100vw);
    }
}
.c-section-sekisan__lead-card {
    width: 486px;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .c-section-sekisan__lead-card {
        width: calc(249 / var(--design-width) * 100vw);
    }
}
.c-section-sekisan__line {
    width: 100%;
}
.c-section-sekisan__line--top {
    transform: translate(3px, 1px);
}
@media screen and (max-width: 750px) {
    .c-section-sekisan__line--top {
        transform: translate(0, -5%);
    }
    .c-section-sekisan__line--top img {
        width: 100%;
    }
}
.c-section-sekisan__line--bottom {
    transform: translate(3px, -3px);
}
@media screen and (max-width: 750px) {
    .c-section-sekisan__line--bottom {
        transform: translate(0, -42%);
    }
    .c-section-sekisan__line--bottom img {
        width: 100%;
    }
}
.c-section-sekisan__lead-flex {
    display: flex;
    justify-content: space-between;
    margin-top: 17px;
    align-items: center;
}
@media screen and (max-width: 750px) {
    .c-section-sekisan__lead-flex {
        margin-top: calc(8 / var(--design-width) * 100vw);
        gap: calc(8 / var(--design-width) * 100vw);
    }
}
.c-section-sekisan__lead-card-img {
    width: 94px;
    transform: translateX(3px);
}
@media screen and (max-width: 750px) {
    .c-section-sekisan__lead-card-img {
        width: calc(73 / var(--design-width) * 100vw);
        transform: translateX(-1%);
    }
}
.c-section-sekisan__lead-card-txt {
    font-size: 0.9375rem;
    line-height: 1.33333333;
    transform: translateX(3px);
}
@media screen and (max-width: 750px) {
    .c-section-sekisan__lead-card-txt {
        font-size: calc(12 / var(--root-fz) * 1rem);
        line-height: 1.41666667;
        transform: translateX(1%);
    }
}
.c-section-sekisan__note {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 9px;
    width: 485px;
    margin-top: 23px;
    margin-inline: auto;
    background-color: #fff;
    padding-block: 8px;
    transform: translateX(3px);
}
@media screen and (max-width: 750px) {
    .c-section-sekisan__note {
        gap: calc(17 / var(--design-width) * 100vw);
        width: calc(249 / var(--design-width) * 100vw);
        margin-top: calc(2 / var(--design-width) * 100vw);
        padding-block: calc(9 / var(--design-width) * 100vw) calc(5 / var(--design-width) * 100vw);
        border-radius: calc(2 / var(--design-width) * 100vw);
        transform: translateX(0);
    }
}
.c-section-sekisan__note-ico {
    width: 17px;
    height: 17px;
    transform: translateX(3px);
}
@media screen and (max-width: 750px) {
    .c-section-sekisan__note-ico {
        width: calc(23 / var(--design-width) * 100vw);
        height: calc(23 / var(--design-width) * 100vw);
        transform: translate(15%, -9%);
    }
}
.c-section-sekisan__note-txt {
    font-family: "Noto Serif JP", serif;
    color: #B01F24;
    font-weight: 700;
    font-size: 0.6875rem;
    text-align: center;
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 0.7px;
    transform: translateY(-1px);
}
@media screen and (max-width: 750px) {
    .c-section-sekisan__note-txt {
        font-size: calc(11 / var(--root-fz) * 1rem);
        text-align: left;
        text-underline-offset: 3px;
        transform: translate(-1%, -7%);
        line-height: 1.7;
    }
}
.c-section-sekisan__body {
    margin-top: 54px;
}
@media screen and (max-width: 750px) {
    .c-section-sekisan__body {
        margin-top: calc(32 / var(--design-width) * 100vw);
        padding-inline: calc(38 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   p-top-slide
--------------------------------------------- */
.p-top-slide {
    padding-block: 32px;
}

@media screen and (max-width: 750px) {
    .p-top-slide {
        padding-block: calc(25 / var(--design-width) * 100vw) calc(40 / var(--design-width) * 100vw);
    }
}
.p-top-slide__container {
    max-width: 1000px;
    margin: 0 auto;
}

@media screen and (max-width: 750px) {
    .p-top-slide__container {
        width: 88vw;
    }
}
.p-top-slide__img {
    width: 490px;
}

@media screen and (max-width: 750px) {
    .p-top-slide__img {
        width: 88vw;
    }
}
.p-top-slide__img img {
    width: 100%;
}

@media (hover: hover) and (pointer: fine) and (hover: hover) and (pointer: fine) {
    .p-top-slide__link {
        transition: opacity 300ms;
    }
    .p-top-slide__link:hover {
        opacity: 0.8;
    }
}
.p-top-slide__lead {
    position: relative;
    font-family: "Shippori Mincho", serif;
    color: #133755;
    font-weight: 700;
    font-size: 1.8125rem;
    line-height: 1;
    text-align: center;
    margin-bottom: 28px;
}
@media screen and (max-width: 750px) {
    .p-top-slide__lead {
        font-size: calc(18 / var(--design-width) * 100vw);
        line-height: 1.61111111;
        margin-bottom: calc(18 / var(--design-width) * 100vw);
    }
}
.p-top-slide__lead::before {
    position: absolute;
    content: "";
    background: url(/msppoint/membersprogram/assets/img/top/deco_campaign_left.svg) 0 0 no-repeat;
    background-size: contain;
    width: 13px;
    height: 40px;
    top: 50%;
    transform: translate(-146%, -20%);
}
@media screen and (max-width: 750px) {
    .p-top-slide__lead::before {
        background: url(/msppoint/membersprogram/assets/img/top/sp/deco_campaign_left.svg) 0 0 no-repeat;
        width: calc(10 / var(--design-width) * 100vw);
        height: calc(40 / var(--design-width) * 100vw);
        transform: translate(-115%, -20%);
    }
}
.p-top-slide__lead::after {
    position: absolute;
    content: "";
    background: url(/msppoint/membersprogram/assets/img/top/deco_campaign_right.svg) 0 0 no-repeat;
    background-size: contain;
    width: 13px;
    height: 40px;
    top: 50%;
    transform: translate(63%, -20%);
}
@media screen and (max-width: 750px) {
    .p-top-slide__lead::after {
        background: url(/msppoint/membersprogram/assets/img/top/sp/deco_campaign_right.svg) 0 0 no-repeat;
        width: calc(10 / var(--design-width) * 100vw);
        height: calc(40 / var(--design-width) * 100vw);
        transform: translate(26%, -20%);
    }
}

/*  .c-slider
--------------------------------------------- */
.c-slider .splide__slide {
    transform: translate3d(0, 0, 0);
}

.c-slider .splide__pagination {
    margin-top: 27px;
    gap: 16px;
}

@media screen and (max-width: 750px) {
    .c-slider .splide__pagination {
        margin-top: 4.5333333333vw;
        gap: 4.2666666667vw;
    }
}
.c-slider .splide__pagination li {
    font-size: 0;
}

.c-slider .splide__pagination__page {
    width: 10px;
    height: 10px;
    background-color: #D8D8D8;
    border-radius: 50%;
    touch-action: manipulation;
    cursor: pointer;
}

@media screen and (max-width: 750px) {
    .c-slider .splide__pagination__page {
        width: 2.6666666667vw;
        height: 2.6666666667vw;
    }
}
.c-slider .splide__pagination__page.is-active {
    background-color: #999999;
}

.c-slider .splide__pagination__page:focus-visible {
    outline: 3px solid #999999;
    outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
    .c-slider .splide__pagination__page {
        transition: opacity 0.3s;
    }
    .c-slider .splide__pagination__page:hover {
        opacity: 0.8;
    }
}
.c-slider__img img {
    width: 100%;
    height: auto;
    vertical-align: bottom;
}

.splide__list--single {
    justify-content: center;
}

/* ---------------------------------------------
*   c-table
--------------------------------------------- */
/* ---------------------------------------------
*   c-tile
--------------------------------------------- */
/* ---------------------------------------------
*   c-ttl-sekisan
--------------------------------------------- */
.c-ttl-sekisan__sub {
    width: 322px;
    margin-inline: auto;
    transform: translateX(7px);
}
@media screen and (max-width: 750px) {
    .c-ttl-sekisan__sub {
        width: calc(237 / var(--design-width) * 100vw);
        transform: translateX(0);
    }
}
.c-ttl-sekisan__main {
    font-family: "Noto Serif JP", serif;
    color: #FEDF8F;
    font-weight: 700;
    font-size: 2.4375rem;
    text-align: center;
    margin-top: 4px;
    transform: translateX(3px);
}
@media screen and (max-width: 750px) {
    .c-ttl-sekisan__main {
        font-size: calc(23 / var(--root-fz) * 1rem);
        line-height: 1.13043478;
        margin-top: calc(8 / var(--design-width) * 100vw);
        transform: translateX(0);
    }
}
.c-ttl-sekisan__main--strong {
    font-size: 2.5rem;
    letter-spacing: 0.04em;
}
@media screen and (max-width: 750px) {
    .c-ttl-sekisan__main--strong {
        font-size: calc(24 / var(--root-fz) * 1rem);
    }
}

/* ---------------------------------------------
*   c-txt
--------------------------------------------- */
.c-txt {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.75;
    letter-spacing: 0.05em;
    color: #333333;
}
@media screen and (max-width: 750px) {
    .c-txt {
        font-size: 3.7333333333vw;
        line-height: 1.5714285714;
    }
}
.c-txt--white {
    color: #fff;
}
.c-txt--center {
    text-align: center;
}
@media screen and (min-width: 751px) {
    .c-txt--l {
        white-space: nowrap;
    }
}
@media screen and (max-width: 750px) {
    .safari .c-txt--ls {
        letter-spacing: 0.03em;
    }
    .android .c-txt--ls {
        letter-spacing: 0.03em;
    }
}
.c-txt--flex {
    display: flex;
}
.c-txt--flex small {
    font-size: 0.875rem;
}
@media screen and (max-width: 750px) {
    .c-txt--flex small {
        font-size: 3.2vw;
    }
}

/* ---------------------------------------------
*   c-txt-modal-anno
--------------------------------------------- */
.c-txt-modal-anno {
    font-size: 0.75rem;
    line-height: 1.33333333;
    margin-top: 26px;
    padding-left: 90px;
    text-align: left;
}
@media screen and (max-width: 750px) {
    .c-txt-modal-anno {
        font-size: calc(12 / var(--design-width) * 100vw);
        margin-top: calc(33 / var(--design-width) * 100vw);
        margin-bottom: calc(14 / var(--design-width) * 100vw);
        padding-left: calc(14 / var(--design-width) * 100vw);
    }
}
.c-txt-modal-anno__item {
    margin-top: 6px;
}
@media screen and (max-width: 750px) {
    .c-txt-modal-anno__item {
        margin-top: calc(6 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-txt-anno
--------------------------------------------- */
/* ---------------------------------------------
*   c-txt-anno
--------------------------------------------- */
.c-txt-anno {
    display: block;
    color: #666666;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.3333333333;
}
@media screen and (max-width: 750px) {
    .c-txt-anno {
        font-size: 3.1vw;
        line-height: 1.25;
    }
}
.c-txt-anno--1 {
    margin-top: 8px;
}
@media screen and (max-width: 750px) {
    .c-txt-anno--1 {
        margin-top: calc(11 / var(--design-width) * 100vw);
        transform: translateX(-3.5%);
    }
}
.c-txt-anno--2 {
    margin-top: 10px;
}
@media screen and (max-width: 750px) {
    .c-txt-anno--2 {
        margin-top: calc(9 / var(--design-width) * 100vw);
    }
}
.c-txt-anno--flex {
    display: flex;
}
.c-txt-anno--flex + .c-txt-anno--flex {
    margin-top: 5px;
}
@media screen and (max-width: 750px) {
    .c-txt-anno--flex + .c-txt-anno--flex {
        margin-top: 1.6vw;
    }
}
.c-txt-anno--flex2 {
    display: flex;
    gap: 2px;
    margin-inline: auto;
    text-align: left;
}
@media screen and (max-width: 750px) {
    .c-txt-anno--flex2 {
        gap: 0;
    }
}
.c-txt-anno--center {
    text-align: center;
    padding-bottom: 60px;
}
@media screen and (max-width: 750px) {
    .c-txt-anno--center {
        line-height: 1.6;
        padding-bottom: 8vw;
    }
    .c-txt-anno--center a {
        text-decoration: underline;
    }
}
@media screen and (max-width: 750px) and (hover: hover) and (pointer: fine) and (hover: hover) and (pointer: fine) {
    .c-txt-anno--center a {
        transition: opacity 300ms;
    }
    .c-txt-anno--center a:hover {
        opacity: 0.8;
    }
}
@media screen and (max-width: 750px) {
    .c-txt-anno--top {
        display: block;
    }
}

/* ---------------------------------------------
*   c-txt-anno-2
--------------------------------------------- */
.c-txt-anno-2 {
    display: flex;
    gap: 4px;
    margin-top: 30px;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.3333333333;
    color: #ffffff;
}

@media screen and (max-width: 750px) {
    .c-txt-anno-2 {
        gap: 0.5333333333vw;
        margin-top: 4vw;
        font-size: 3.2vw;
    }
}
.c-txt-anno-2 + .c-txt-anno-2 {
    margin-top: 5px;
}

@media screen and (max-width: 750px) {
    .c-txt-anno-2 + .c-txt-anno-2 {
        margin-top: 1.6vw;
    }
}
/* ---------------------------------------------
*   c-txt-living
--------------------------------------------- */
.c-txt-living {
    display: block;
    margin-top: 8px;
    font-weight: 500;
    font-size: 12px;
    color: #666;
    text-align: left;
    /* margin-bottom: 11px; */
}

@media screen and (max-width: 750px) {
    .c-txt-living {
        display: block;
        margin-top: 2.6666666667vw;
        font-size: 3.2vw;
        text-align: left;
        padding-left: 1em;
        text-indent: -1em;
        /* margin-bottom: calc(20 / 375 * 100vw); */
    }
}
.c-txt-living-2 {
    display: block;
    font-weight: 500;
    font-size: 12px;
    line-height: 1.3333333333;
    text-align: left;
    color: #666;
}

.c-txt-living-2-mgt {
    margin-top: 20px;
}

@media screen and (max-width: 750px) {
    .c-txt-living-2 {
        display: block;
        font-size: 3.2vw;
        text-align: left;
        padding-left: 1em;
        text-indent: -1em;
    }
    .c-txt-living-2-mgt {
        margin-top: 5.3333333333vw;
    }
    .c-txt-living-2-outer {
        padding-inline: 1.6vw;
    }
    .c-txt-living small {
        margin-right: 5px;
    }
}
/* ---------------------------------------------
*   p-top-card-3
--------------------------------------------- */
.p-top-card-3 {
    width: 100%;
    margin-top: 35px;
}

@media screen and (max-width: 750px) {
    .p-top-card-3 {
        width: 100%;
        margin: 2.6666666667vw auto 0;
    }
}
.p-top-card-3__body {
    text-align: center;
}

.p-top-card-3__list {
    display: flex;
    justify-content: center;
    margin-top: 40px;
    gap: 20px;
    text-align: center;
}

@media screen and (max-width: 750px) {
    .p-top-card-3__list {
        display: block;
        margin-top: 6.6666666667vw;
        padding-inline: 2.6666666667vw;
    }
}
.p-top-card-3__list-item {
    width: 220px;
}

@media screen and (max-width: 750px) {
    .p-top-card-3__list-item {
        display: flex;
        align-items: center;
        width: auto;
        gap: 2.1333333333vw;
    }
    .p-top-card-3__list-item:nth-of-type(n+2) {
        margin-top: 3.7333333333vw;
    }
}
@media screen and (max-width: 750px) {
    .p-top-card-3__list-img {
        width: 37.3333333333vw;
        flex-shrink: 0;
    }
}
.p-top-card-3__list-txt {
    display: block;
    margin-top: 7px;
    color: #333333;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1.5384615385;
}

.mac.safari .p-top-card-3__list-txt {
    font-size: 0.7925rem;
}

@media screen and (max-width: 750px) {
    .p-top-card-3__list-txt {
        font-size: 3.4666666667vw;
        text-align: left;
        white-space: nowrap;
    }
    .mac.safari .p-top-card-3__list-txt {
        font-size: 3.4666666667vw;
    }
}
@media screen and (max-width: 750px) {
    .p-top-card-3__txt-wrap {
        margin-inline: 4.8vw 2.9333333333vw;
    }
}
.p-top-card-3__txt {
    display: block;
    margin-block: 40px 20px;
    color: #333333;
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0.05em;
}

@media screen and (max-width: 750px) {
    .p-top-card-3__txt {
        margin-block: 6.9333333333vw 5.3333333333vw;
        font-size: 3.7333333333vw;
        line-height: 1;
    }
}
.p-top-card-3__btn {
    width: 420px;
    margin: 25px auto 0;
}

@media screen and (max-width: 750px) {
    .p-top-card-3__btn {
        width: 100%;
        margin: 1.875rem auto 0;
        padding-inline: 2.6666666667vw;
    }
}
@media screen and (max-width: 750px) {
    .p-top-card-3__anno {
        margin-left: 0.2666666667vw;
        text-indent: -1em;
        padding-left: 1em;
        text-align: left;
    }
}
/* ---------------------------------------------
*   p-top-card-4
--------------------------------------------- */
.p-top-card-4 {
    margin-top: 35px;
}

@media screen and (max-width: 750px) {
    .p-top-card-4 {
        margin-top: 6.6666666667vw;
    }
}
.p-top-card-4 + .p-top-card-4 {
    margin-top: 21px;
}

@media screen and (max-width: 750px) {
    .p-top-card-4 + .p-top-card-4 {
        margin-top: 5.3333333333vw;
    }
}
@media screen and (max-width: 750px) {
    .p-top-card-4:nth-of-type(2) {
        margin-top: 8vw;
    }
}
.p-top-card-4__container {
    border: 1px solid #EAEAEA;
    border-radius: 5px;
}

.p-top-card-4__head {
    background-color: #133755;
    text-align: center;
    padding-bottom: 5px;
    border-radius: 4px 4px 0px 0px;
}

@media screen and (max-width: 750px) {
    .p-top-card-4__head {
        padding-block: 3.366667vw;
        padding-block: 0.37vw 1.37vw;
    }
}
.p-top-card-4__head-living {
    position: relative;
}

.p-top-card-4__head-living:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    background-color: #fff;
    bottom: 2px;
    left: 0;
}

.p-top-card-4__ttl {
    display: block;
    padding-block: 22px 19px;
    font-weight: 700;
    font-family: "Shippori Mincho", serif;
    font-size: 1.25rem;
    line-height: 1.2;
    color: #fff;
    border-bottom: 0.5px solid #fff;
}

@media screen and (max-width: 750px) {
    .p-top-card-4__ttl {
        padding-block: 3.57vw;
        font-size: 4.2666666667vw;
        line-height: 1.5;
    }
}
.p-top-card-4-living .p-top-card-4__ttl {
    border-bottom: none;
}

.p-top-card-4__body {
    border-top: none;
    padding: 20px 19px 30px;
    border-radius: 0px 0px 4px 4px;
    box-sizing: border-box;
}

@media screen and (max-width: 750px) {
    .p-top-card-4__body {
        border: 0.5333333333vw solid #EAEAEA;
        border-radius: 0px 0px 1.0666666667vw 1.0666666667vw;
        padding: 4.733333vw 4vw 8vw;
    }
}
.p-top-card-4__body-living {
    background-color: #F6F6F6;
}

.p-group-section-2__limited-txt-living {
    line-height: 1.5;
}

.p-top-card-4__body--flex {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    -moz-column-gap: 28px;
         column-gap: 28px;
}

@media screen and (max-width: 750px) {
    .p-top-card-4__body--flex {
        display: block;
    }
}
.p-top-card-4__wrap {
    display: flex;
    /* align-items: flex-start; */
    justify-content: space-between;
    gap: 20px;
    margin-top: 20px;
}

@media screen and (max-width: 750px) {
    .p-top-card-4__wrap {
        flex-direction: column;
        gap: 5.3333333333vw;
        margin-top: 3.7333333333vw;
    }
}
.p-top-card-4__logo {
    width: 186px;
    margin: 0 auto 22px;
}

@media screen and (max-width: 750px) {
    .p-top-card-4__logo {
        width: 46.9333333333vw;
        margin: 0 auto 3.4666666667vw;
    }
}
.p-top-card-4__contents:first-of-type {
    flex-shrink: 0;
    width: 315px;
}

@media screen and (max-width: 750px) {
    .p-top-card-4__contents:first-of-type {
        width: 100%;
    }
}
.p-top-card-4__contents--flex {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.p-top-card-4__txt {
    text-align: left;
    color: #333333;
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: -0.027em;
    line-height: 1.5;
}

@media screen and (max-width: 750px) {
    .p-top-card-4__txt {
        font-size: 3.7333333333vw;
        letter-spacing: 0.04em;
        line-height: 1.5714285714;
    }
    .p-top-card-4__txt--l {
        font-size: 4.2666666667vw;
        letter-spacing: -0.027em;
        line-height: 1.75;
    }
}
.p-top-card-4__btn {
    margin-top: 15px;
}

@media screen and (max-width: 750px) {
    .p-top-card-4__btn {
        margin-top: 5.3333333333vw;
    }
}
/* ---------------------------------------------
*   p-top-card-5
--------------------------------------------- */
.p-top-card-5 {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 4;
}

@media screen and (max-width: 750px) {
    .p-top-card-5 + .p-top-card-5 {
        margin-top: 10.9333333333vw;
    }
}
.p-top-card-5__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-inline: auto;
    width: 206px;
}

@media screen and (max-width: 750px) {
    .p-top-card-5__logo {
        width: 49.6vw;
    }
}
.p-top-card-5__logo--2 {
    width: 197px;
}

@media screen and (max-width: 750px) {
    .p-top-card-5__logo--2 {
        width: 54.9333333333vw;
    }
}
.p-top-card-5__img {
    margin-top: 14px;
    width: 100%;
}

@media screen and (max-width: 750px) {
    .p-top-card-5__img {
        margin-top: 5.3333333333vw;
    }
}
.p-top-card-5__txt {
    margin-top: 13px;
    text-align: justify;
    color: #333333;
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: -0.027em;
    line-height: 1.5;
}

@media screen and (max-width: 750px) {
    .p-top-card-5__txt {
        margin-top: 5.3333333333vw;
        font-size: 3.7333333333vw;
        letter-spacing: 0.04em;
        line-height: 1.5714285714;
    }
}
.p-top-card-5__txt--ls {
    letter-spacing: 0;
}

@media screen and (max-width: 750px) {
    .p-top-card-5__txt--ls {
        letter-spacing: 0.05em;
    }
}
.p-top-card-5__btn {
    margin-top: 20px;
}

@media screen and (max-width: 750px) {
    .p-top-card-5__btn {
        margin-top: 5.3333333333vw;
    }
}
/* ---------------------------------------------
*   p-benefits-ttl
--------------------------------------------- */
.p-benefits-ttl {
    margin-block: 62px 50px;
}
@media screen and (max-width: 750px) {
    .p-benefits-ttl {
        margin-block: calc(113 / var(--design-width) * 100vw) calc(22 / var(--design-width) * 100vw);
    }
}
.p-benefits-ttl__year {
    display: block;
    color: #133755;
    text-align: center;
    font-family: "Shippori Mincho";
    font-size: 27px;
    font-weight: 700;
}
@media screen and (max-width: 750px) {
    .p-benefits-ttl__year {
        font-size: calc(18 / var(--design-width) * 100vw);
        line-height: 205.556%;
    }
}
.p-benefits-ttl__txt {
    display: block;
    width: 269px;
    padding-block: 3px;
    border: solid #133755;
    border-width: 2.5px 0 2.5px;
    color: #133755;
    text-align: center;
    font-family: "Shippori Mincho";
    font-size: 34px;
    font-weight: 700;
    letter-spacing: -0.012em;
    margin-top: 2px;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-benefits-ttl__txt {
        width: calc(191 / var(--design-width) * 100vw);
        padding-block: 0;
        border-width: calc(2 / var(--design-width) * 100vw) 0 calc(2 / var(--design-width) * 100vw);
        font-size: calc(24 / var(--design-width) * 100vw);
        margin-top: 2px;
    }
}

/* ---------------------------------------------
*   p-benefits-link-list
--------------------------------------------- */
.p-benefits-link-list {
    display: flex;
    justify-content: center;
    gap: 26px;
}
@media screen and (max-width: 750px) {
    .p-benefits-link-list {
        display: block;
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-link-list__item {
        text-align: center;
    }
    .p-benefits-link-list__item:not(:first-of-type) {
        margin-top: calc(3 / var(--design-width) * 100vw);
    }
}
.p-benefits-link-list__link {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: underline;
}
@media screen and (min-width: 751px) {
    .p-benefits-link-list__link:hover {
        text-decoration: none;
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-link-list__link {
        display: inline-flex;
        gap: calc(8 / var(--design-width) * 100vw);
    }
}
.p-benefits-link-list__txt {
    color: #133755;
    font-size: 18px;
    font-weight: 700;
    line-height: 111.111%;
}
@media screen and (max-width: 750px) {
    .p-benefits-link-list__txt {
        font-size: calc(15 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-link-list__ico {
        width: calc(20 / var(--design-width) * 100vw);
    }
    .p-benefits-link-list__ico img {
        width: 100%;
    }
}

/* ---------------------------------------------
*   p-benefits-block-top
--------------------------------------------- */
.p-benefits-block-top {
    margin-top: 25px;
}
@media screen and (max-width: 750px) {
    .p-benefits-block-top {
        margin-top: calc(23 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   p-benefits-btn
--------------------------------------------- */
.p-benefits-btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 496px;
    height: 63px;
    padding-right: 29px;
    border-radius: 5px;
    background: #133755;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-benefits-btn {
        width: calc(335 / var(--design-width) * 100vw);
        height: calc(50 / var(--design-width) * 100vw);
        padding-right: calc(11 / var(--design-width) * 100vw);
        border-radius: calc(5 / var(--design-width) * 100vw);
    }
}
@media screen and (min-width: 751px) {
    .p-benefits-btn {
        transition: background-color 0.3s;
    }
    .p-benefits-btn:hover {
        background-color: #081b2b;
    }
}
.p-benefits-btn__txt {
    color: #FFF;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    line-height: 127.778%;
}
@media screen and (max-width: 750px) {
    .p-benefits-btn__txt {
        font-size: calc(15 / var(--design-width) * 100vw);
        line-height: 133.333%;
    }
}
.p-benefits-btn__ico {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
}
@media screen and (max-width: 750px) {
    .p-benefits-btn__ico {
        width: calc(21.5 / var(--design-width) * 100vw);
        right: calc(11 / var(--design-width) * 100vw);
    }
    .p-benefits-btn__ico img {
        width: 100%;
    }
}

/* ---------------------------------------------
*   p-benefits-tab-selector
--------------------------------------------- */
.p-benefits-tab-selector {
    max-width: 1440px;
    margin: 38px auto 0;
}
@media screen and (max-width: 750px) {
    .p-benefits-tab-selector {
        margin-top: calc(27 / var(--design-width) * 100vw);
    }
}
.p-benefits-tab-selector__list {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 1px;
    width: 100%;
}
.p-benefits-tab-selector__item {
    width: calc((100% - 3px) / 4);
    height: 125px;
    border-style: solid;
    border-width: 0 0 5px;
    transition: opacity 0.3s;
    cursor: pointer;
}
@media screen and (max-width: 750px) {
    .p-benefits-tab-selector__item {
        height: calc(120 / var(--design-width) * 100vw);
        border-width: 0 0 calc(5 / var(--design-width) * 100vw);
    }
}
.p-benefits-tab-selector__item.is-current {
    border-width: 0 2px 5px;
    opacity: 1;
}
@media screen and (max-width: 750px) {
    .p-benefits-tab-selector__item.is-current {
        border-width: 0 calc(2 / var(--design-width) * 100vw) calc(5 / var(--design-width) * 100vw);
    }
}
@media screen and (min-width: 751px) {
    .p-benefits-tab-selector__item:hover {
        border-width: 0 2px 5px;
        opacity: 1;
    }
}
.p-benefits-tab-selector__item--premium {
    background-color: #e1e7ef;
    border-color: #000;
    opacity: 0.4;
}
@media screen and (max-width: 750px) {
    .p-benefits-tab-selector__item--premium img {
        width: calc(68 / var(--design-width) * 100vw);
    }
}
.p-benefits-tab-selector__item--gold {
    background-color: rgba(230, 207, 82, 0.3);
    border-color: #CCA201;
    opacity: 0.35;
}
@media screen and (max-width: 750px) {
    .p-benefits-tab-selector__item--gold img {
        width: calc(68 / var(--design-width) * 100vw);
    }
}
.p-benefits-tab-selector__item--silver {
    background-color: rgba(113, 128, 146, 0.3);
    border-color: #718092;
    opacity: 0.3;
}
@media screen and (max-width: 750px) {
    .p-benefits-tab-selector__item--silver img {
        width: calc(68 / var(--design-width) * 100vw);
    }
}
.p-benefits-tab-selector__item--bronze {
    background-color: rgba(219, 77, 40, 0.2);
    border-color: #DA4D28;
    opacity: 0.2;
}
@media screen and (max-width: 750px) {
    .p-benefits-tab-selector__item--bronze img {
        width: calc(66 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   p-benefits-block
--------------------------------------------- */
/* ---------------------------------------------
*   p-benefits-tab
--------------------------------------------- */
.p-benefits-tab {
    background-position: center 0;
    background-repeat: no-repeat;
    background-size: cover;
}
.p-benefits-tab--premium {
    background-image: url(/msppoint/membersprogram/assets/img/benefits/bg_premium.jpg);
}
@media screen and (max-width: 750px) {
    .p-benefits-tab--premium {
        background-color: #000;
        background-image: url(/msppoint/membersprogram/assets/img/benefits/sp/bg_premium.png);
        background-size: 100%;
    }
}
.p-benefits-tab--gold {
    background-image: url(/msppoint/membersprogram/assets/img/benefits/bg_gold.jpg);
}
@media screen and (max-width: 750px) {
    .p-benefits-tab--gold {
        background-image: url(/msppoint/membersprogram/assets/img/benefits/sp/bg_gold.jpg);
    }
}
.p-benefits-tab--silver {
    background-image: url(/msppoint/membersprogram/assets/img/benefits/bg_silver.jpg);
}
@media screen and (max-width: 750px) {
    .p-benefits-tab--silver {
        background-image: url(/msppoint/membersprogram/assets/img/benefits/sp/bg_silver.jpg);
    }
}
.p-benefits-tab--bronze {
    background-image: url(/msppoint/membersprogram/assets/img/benefits/bg_bronze.jpg);
}
@media screen and (max-width: 750px) {
    .p-benefits-tab--bronze {
        background-image: url(/msppoint/membersprogram/assets/img/benefits/sp/bg_bronze.jpg);
    }
}
.p-benefits-tab__container {
    padding-block: 69px 58px;
}
@media screen and (max-width: 750px) {
    .p-benefits-tab__container {
        padding-block: calc(40 / var(--design-width) * 100vw) calc(25 / var(--design-width) * 100vw);
        overflow: hidden;
    }
}
.p-benefits-tab__head {
    text-align: center;
}
.p-benefits-tab__label {
    display: flex;
    width: 130px;
    height: 27px;
    flex-direction: column;
    justify-content: center;
    border-radius: 18px;
    background-color: #FFF;
    margin-bottom: 7px;
    text-align: center;
    font-family: "Shippori Mincho";
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.3em;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-benefits-tab__label {
        width: calc(108 / var(--design-width) * 100vw);
        height: calc(22 / var(--design-width) * 100vw);
        border-radius: calc(11 / var(--design-width) * 100vw);
        margin-bottom: calc(10 / var(--design-width) * 100vw);
        font-size: calc(12 / var(--design-width) * 100vw);
    }
}
.p-benefits-tab__label--premium {
    color: #25211D;
}
.p-benefits-tab__label--gold {
    color: #BA7518;
}
.p-benefits-tab__label--silver {
    color: #666C78;
}
.p-benefits-tab__label--bronze {
    color: #813D2A;
}
.p-benefits-tab__ttl {
    color: #FFF;
}
.p-benefits-tab__ttl-main {
    display: block;
    font-family: "Shippori Mincho", serif;
    font-size: 40px;
    font-weight: 700;
}
@media screen and (min-width: 751px) {
    .p-benefits-tab__ttl-main {
        filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.25));
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-tab__ttl-main {
        font-size: calc(24 / var(--design-width) * 100vw);
    }
}
.p-benefits-tab__ttl-sub {
    display: block;
    color: #FFF;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    line-height: 110%;
    letter-spacing: 0.05em;
    margin-top: 0.25em;
}
@media screen and (max-width: 750px) {
    .p-benefits-tab__ttl-sub {
        font-size: calc(14 / var(--design-width) * 100vw);
    }
}
.p-benefits-tab__body {
    max-width: 1000px;
    margin: 53px auto 0;
}
@media screen and (max-width: 750px) {
    .p-benefits-tab__body {
        margin-top: calc(22 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   p-benefits-list
--------------------------------------------- */
.p-benefits-list {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}
@media screen and (max-width: 750px) {
    .p-benefits-list {
        display: block;
        width: calc(335 / var(--design-width) * 100vw);
        border-radius: calc(8 / var(--design-width) * 100vw);
        margin-inline: auto;
    }
}
.p-benefits-list__item {
    position: relative;
    display: flex;
    align-items: center;
    width: 50%;
    height: 99px;
    border-bottom: 1px solid #BEBEBE;
    z-index: 0;
}
@media screen and (max-width: 750px) {
    .p-benefits-list__item {
        width: 100%;
        height: auto;
    }
}
@media screen and (min-width: 751px) {
    .p-benefits-list__item--premium {
        height: 111px;
    }
}
.p-benefits-list__item::before {
    content: "";
    position: absolute;
    background: url(/msppoint/membersprogram/assets/img/benefits/ico/ico_modal_bk.svg) 0 0 no-repeat;
    background-size: contain;
    width: 20px;
    height: 20px;
    top: 50%;
    right: 17px;
    transform: translateY(-50%);
    pointer-events: none;
}
@media screen and (max-width: 750px) {
    .p-benefits-list__item::before {
        width: calc(21.5 / var(--design-width) * 100vw);
        height: calc(21.5 / var(--design-width) * 100vw);
        right: calc(10.5 / var(--design-width) * 100vw);
    }
}
.p-benefits-list__item:nth-of-type(even) {
    border-left: 1px solid #BEBEBE;
}
.p-benefits-list__item--none::before, .p-benefits-list__item--none::after {
    display: none;
}
.p-benefits-list__item--full {
    width: 100%;
}
.p-benefits-list__img {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 106px;
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img {
        width: calc(83 / var(--design-width) * 100vw);
    }
}
@media screen and (min-width: 751px) {
    .p-benefits-list__item:nth-of-type(even) .p-benefits-list__img {
        width: 115px;
    }
}

@media screen and (max-width: 750px) {
    .p-benefits-list__img--p img {
        width: calc(37 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--cp_10pp img {
        width: calc(44 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--8pp img {
        width: calc(40 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--free img {
        width: calc(50 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--pointup img {
        width: calc(61 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--coupon img {
        width: calc(51 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--present img {
        width: calc(36 / var(--design-width) * 100vw);
    }
}
.p-benefits-list__img--3d {
    translate: 7%;
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--3d img {
        width: calc(47 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--facility img {
        width: calc(56 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--special img {
        width: calc(47 / var(--design-width) * 100vw);
    }
}
@media screen and (min-width: 751px) {
    .p-benefits-list__img--benefits {
        width: 120px;
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--benefits img {
        width: calc(59 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--cp_5pp img {
        width: calc(44 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 750px) {
    .p-benefits-list__img--5pp img {
        width: calc(41 / var(--design-width) * 100vw);
    }
}
.p-benefits-list__btn {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    padding-right: 70px;
    background-color: #fff;
}
@media screen and (max-width: 750px) {
    .p-benefits-list__btn {
        padding-block: calc(14 / var(--design-width) * 100vw);
        padding-right: calc(23 / var(--design-width) * 100vw);
    }
}
@media screen and (min-width: 751px) {
    .p-benefits-list__btn[href] {
        transition: background-color 0.3s;
    }
    .p-benefits-list__btn[href]:hover {
        background-color: #bbb;
    }
}
.p-benefits-list__item--none .p-benefits-list__btn {
    padding-right: 0;
}

@media screen and (min-width: 751px) {
    .p-benefits-list__btn--full {
        justify-content: center;
        width: 100%;
        padding-right: 50px;
    }
}
.p-benefits-list__txt-wrap {
    display: flex;
    flex-direction: column;
}
.p-benefits-list__txt {
    color: #333;
    font-size: 18px;
    font-weight: 700;
    line-height: 127.778%;
    margin-bottom: 5px;
}
@media screen and (max-width: 750px) {
    .p-benefits-list__txt {
        font-size: calc(15 / var(--design-width) * 100vw);
        line-height: 133.333%;
        margin-bottom: calc(1 / var(--design-width) * 100vw);
    }
}
.p-benefits-list__txt--s {
    color: #333;
    font-size: 15px;
    font-weight: 700;
    line-height: 153.333%;
    margin-right: 4px;
}
@media screen and (max-width: 750px) {
    .p-benefits-list__txt--s {
        display: block;
        font-size: calc(12 / var(--design-width) * 100vw);
        line-height: 1.5;
    }
}
.p-benefits-list__txt-link {
    text-decoration: underline;
}
@media screen and (min-width: 751px) {
    .p-benefits-list__txt-link:hover {
        text-decoration: none;
    }
}
.p-benefits-list__txt-small {
    display: block;
    color: #333;
    font-size: 12px;
}
@media screen and (max-width: 750px) {
    .p-benefits-list__txt-small {
        font-size: calc(12 / var(--design-width) * 100vw);
        line-height: 133.333%;
        letter-spacing: -0.04em;
    }
}
.p-benefits-list__item--none .p-benefits-list__txt-small {
    letter-spacing: -0.05em;
}

.safari .p-benefits-list__txt-small {
    letter-spacing: -0.02em;
}

.mac.firefox .p-benefits-list__txt-small {
    letter-spacing: -0.02em;
}

.windows .p-benefits-list__txt-small {
    letter-spacing: -0.01em;
}

.p-benefits-list__txt-small--blue {
    display: block;
    color: #0074A2;
}
@media screen and (max-width: 750px) {
    .p-benefits-list__txt-small--blue {
        letter-spacing: 0;
    }
}
.p-benefits-list__note {
    color: #333;
    font-size: 10px;
    font-weight: 500;
    line-height: 160%;
}
@media screen and (max-width: 750px) {
    .p-benefits-list__note {
        display: flex;
        gap: calc(1.5 / var(--design-width) * 100vw);
        font-size: calc(10 / var(--design-width) * 100vw);
        line-height: 130%;
        margin-top: calc(1 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   p-benefits-modal-cassette
--------------------------------------------- */
.p-benefits-modal-cassette {
    width: 430px;
    padding-bottom: 26px;
    border-bottom: 1px solid #133755;
    margin-top: 36px;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette {
        width: calc(269 / var(--design-width) * 100vw);
        padding-bottom: calc(16 / var(--design-width) * 100vw);
        margin-top: calc(15 / var(--design-width) * 100vw);
    }
}
.p-benefits-modal-cassette__head {
    position: relative;
    margin-bottom: 27px;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette__head {
        margin-bottom: calc(11 / var(--design-width) * 100vw);
    }
}
.p-benefits-modal-cassette__head::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    height: 1px;
    width: 100%;
    background-color: #133755;
    transform: translateY(-50%);
}
.p-benefits-modal-cassette__ttl {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 301px;
    height: 31px;
    border-radius: 20px;
    border: 1px solid #133755;
    background-color: #fff;
    color: #133755;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.05em;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette__ttl {
        width: calc(211 / var(--design-width) * 100vw);
        height: calc(25 / var(--design-width) * 100vw);
        border-radius: calc(20 / var(--design-width) * 100vw);
        font-size: calc(13 / var(--design-width) * 100vw);
    }
}
.safari .p-benefits-modal-cassette__ttl {
    padding-top: 0.2em;
}

.windows .p-benefits-modal-cassette__ttl {
    padding-top: 0.1em;
}

.p-benefits-modal-cassette__body {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette__body {
        gap: calc(11 / var(--design-width) * 100vw);
    }
}
.p-benefits-modal-cassette__img {
    width: 152px;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette__img {
        width: calc(73 / var(--design-width) * 100vw);
    }
}
.p-benefits-modal-cassette__txt {
    text-align: left;
    color: #333;
    font-size: 16px;
    font-weight: 500;
    line-height: 162.5%;
    letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette__txt {
        font-size: calc(12 / var(--design-width) * 100vw);
        line-height: 141.667%;
    }
}

/* ---------------------------------------------
*   p-benefits-modal-cassette-2
--------------------------------------------- */
.p-benefits-modal-cassette-2 {
    position: relative;
    padding: 32px 75px 36px;
    border-top: 1px solid #133755;
    margin-top: 70px;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette-2 {
        padding: calc(42 / var(--design-width) * 100vw) calc(23 / var(--design-width) * 100vw) calc(24 / var(--design-width) * 100vw);
        border-width: calc(1 / var(--design-width) * 100vw);
        margin-top: calc(60 / var(--design-width) * 100vw);
    }
}
.p-benefits-modal-cassette-2__ttl {
    position: absolute;
    top: -0.5px;
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 129px;
    height: 26px;
    border-radius: 13px;
    background-color: #133755;
    color: #fff;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    transform: translate(-50%, -50%);
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette-2__ttl {
        width: calc(134 / var(--design-width) * 100vw);
        height: calc(26 / var(--design-width) * 100vw);
        border-radius: calc(13 / var(--design-width) * 100vw);
        font-size: calc(14 / var(--design-width) * 100vw);
    }
}
.safari .p-benefits-modal-cassette-2__ttl {
    padding-top: 0.2em;
}

.windows .p-benefits-modal-cassette-2__ttl {
    padding-top: 0.05em;
}

/* ---------------------------------------------
*   p-benefits-modal-list-col
--------------------------------------------- */
@media screen and (min-width: 751px) {
    .p-benefits-modal-list-col {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 25px;
    }
}
.p-benefits-modal-list-col__item {
    width: calc((100% - 39px) / 2);
    text-align: left;
    color: #333;
    font-size: 13px;
    font-weight: 500;
    line-height: 169.231%;
    letter-spacing: -0.04em;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-list-col__item {
        width: 100%;
        font-size: calc(12 / var(--design-width) * 100vw);
        line-height: 183.333%;
    }
    .p-benefits-modal-list-col__item:not(:first-of-type) {
        margin-top: calc(6 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   p-benefits-modal-cassette-3
--------------------------------------------- */
.p-benefits-modal-cassette-3 {
    margin-top: 32px;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette-3 {
        margin-top: calc(15.5 / var(--design-width) * 100vw);
    }
}
.p-benefits-modal-cassette-3__ttl {
    position: relative;
    width: -moz-max-content;
    width: max-content;
    font-size: 18px;
    font-weight: 700;
    margin-inline: auto;
    margin-bottom: 10px;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette-3__ttl {
        font-size: calc(15 / var(--design-width) * 100vw);
        margin-bottom: calc(8 / var(--design-width) * 100vw);
    }
}
.p-benefits-modal-cassette-3__ttl--premium {
    color: #4CA9D6;
}
.p-benefits-modal-cassette-3__ttl--premium::before, .p-benefits-modal-cassette-3__ttl--premium::after {
    background-color: #4CA9D6;
}
.p-benefits-modal-cassette-3__ttl--gold {
    color: #D4AA02;
}
.p-benefits-modal-cassette-3__ttl--gold::before, .p-benefits-modal-cassette-3__ttl--gold::after {
    background-color: #D4AA02;
}
.p-benefits-modal-cassette-3__ttl--silver {
    color: #6A6A6A;
}
.p-benefits-modal-cassette-3__ttl--silver::before, .p-benefits-modal-cassette-3__ttl--silver::after {
    background-color: #6A6A6A;
}
.p-benefits-modal-cassette-3__ttl--bronze {
    color: #E56F4D;
}
.p-benefits-modal-cassette-3__ttl--bronze::before, .p-benefits-modal-cassette-3__ttl--bronze::after {
    background-color: #E56F4D;
}
.p-benefits-modal-cassette-3__ttl::before, .p-benefits-modal-cassette-3__ttl::after {
    content: "";
    position: absolute;
    top: 50%;
    height: 17.5px;
    width: 2px;
    transform-origin: center bottom;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette-3__ttl::before, .p-benefits-modal-cassette-3__ttl::after {
        height: calc(17.5 / var(--design-width) * 100vw);
        width: calc(2 / var(--design-width) * 100vw);
    }
}
.p-benefits-modal-cassette-3__ttl::before {
    right: calc(100% + 5px);
    transform: translateY(-50%) rotate(-20deg);
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette-3__ttl::before {
        right: calc(100% + (5 / var(--design-width) * 100vw));
    }
}
.p-benefits-modal-cassette-3__ttl::after {
    left: calc(100% + 3px);
    transform: translateY(-50%) rotate(20deg);
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette-3__ttl::after {
        left: calc(100% + (3 / var(--design-width) * 100vw));
    }
}
.p-benefits-modal-cassette-3__txt {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 133px;
    width: -moz-max-content;
    width: max-content;
    height: 27px;
    padding-inline: 0.5em;
    border-radius: 11px;
    text-align: center;
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    margin-inline: auto;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-cassette-3__txt {
        min-width: calc(121 / var(--design-width) * 100vw);
        height: calc(25 / var(--design-width) * 100vw);
        border-radius: calc(11 / var(--design-width) * 100vw);
        font-size: calc(14 / var(--design-width) * 100vw);
    }
}
.safari .p-benefits-modal-cassette-3__txt {
    padding-top: 0.2em;
}
@media screen and (max-width: 750px) {
    .safari .p-benefits-modal-cassette-3__txt {
        padding-top: 0.1em;
    }
}

.windows .p-benefits-modal-cassette-3__txt {
    padding-top: 0.1em;
}

.p-benefits-modal-cassette-3__txt--premium {
    background-color: #4CA9D6;
}
.p-benefits-modal-cassette-3__txt--gold {
    background-color: #D4AA02;
}
.p-benefits-modal-cassette-3__txt--silver {
    background-color: #6A6A6A;
}
.p-benefits-modal-cassette-3__txt--bronze {
    background-color: #E56F4D;
}

/* ---------------------------------------------
*   p-benefits-modal-txt
--------------------------------------------- */
.p-benefits-modal-txt {
    color: #333;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    margin-top: 23px;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-txt {
        font-size: calc(14 / var(--design-width) * 100vw);
        margin-top: calc(21 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   p-benefits-modal-note
--------------------------------------------- */
.p-benefits-modal-note {
    display: flex;
    justify-content: center;
    gap: 4px;
    color: #666;
    font-size: 12px;
    font-weight: 500;
    margin-top: 7px;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-note {
        gap: calc(2 / var(--design-width) * 100vw);
        padding-inline: calc(20 / var(--design-width) * 100vw);
        text-align: left;
        font-size: calc(12 / var(--design-width) * 100vw);
        margin-top: calc(10 / var(--design-width) * 100vw);
    }
}
/* ---------------------------------------------
*   p-benefits-modal-txt-bg
--------------------------------------------- */
.p-benefits-modal-txt-bg {
    padding-block: 20px 22px;
    text-align: center;
    color: #333;
    font-size: 16px;
    font-weight: 500;
    line-height: 162.5%;
    margin-top: 33px;
}
@media screen and (max-width: 750px) {
    .p-benefits-modal-txt-bg {
        padding-block: calc(14 / var(--design-width) * 100vw);
        font-size: calc(14 / var(--design-width) * 100vw);
        line-height: 1.5714285714;
        letter-spacing: 0.05em;
        margin-top: calc(20 / var(--design-width) * 100vw);
    }
}
.p-benefits-modal-txt-bg--premium {
    background-color: #DAF3FF;
}
.p-benefits-modal-txt-bg--gold {
    background-color: #FFF6DA;
}
.p-benefits-modal-txt-bg--silver {
    background-color: #EBEBEB;
}
.p-benefits-modal-txt-bg--bronze {
    background-color: #FEE5D2;
}

/* ---------------------------------------------
*   background-color
--------------------------------------------- */
.bg-white {
    background-color: var(--color-white-1) !important;
}

/* ---------------------------------------------
*   font-wight
--------------------------------------------- */
.fw-normal {
    font-weight: 500 !important;
}

.fw-bold {
    font-weight: 700 !important;
}

/* ---------------------------------------------
*   text-align
--------------------------------------------- */
.txt-al-center {
    text-align: center !important;
}

.txt-al-right {
    text-align: right !important;
}

.txt-al-left {
    text-align: left !important;
}

/*  js-tab-target
--------------------------------------------- */
.js-tab-target-2 {
    display: none;
}
.js-tab-target-2.is-current {
    display: block;
}

@media print and (min-width: 751px), screen and (min-width: 751px) {
    .pc-hide {
        display: none !important;
    }
}
@media print and (max-width: 750px), screen and (max-width: 750px) {
    .sp-hide {
        display: none !important;
    }
}
/* ---------------------------------------------
*   margin-top
--------------------------------------------- */
.mgt-pc--0 {
    margin-top: 0 !important;
}

.mgt-pc--5 {
    margin-top: 5px !important;
}

.mgt-pc--10 {
    margin-top: 10px !important;
}

.mgt-pc--15 {
    margin-top: 15px !important;
}

.mgt-pc--20 {
    margin-top: 20px !important;
}

.mgt-pc--25 {
    margin-top: 25px !important;
}

.mgt-pc--30 {
    margin-top: 30px !important;
}

.mgt-pc--35 {
    margin-top: 35px !important;
}

.mgt-pc--40 {
    margin-top: 40px !important;
}

.mgt-pc--45 {
    margin-top: 45px !important;
}

.mgt-pc--50 {
    margin-top: 50px !important;
}

.mgt-pc--55 {
    margin-top: 55px !important;
}

.mgt-pc--60 {
    margin-top: 60px !important;
}

.mgt-pc--65 {
    margin-top: 65px !important;
}

.mgt-pc--70 {
    margin-top: 70px !important;
}

.mgt-pc--75 {
    margin-top: 75px !important;
}

.mgt-pc--80 {
    margin-top: 80px !important;
}

.mgt-pc--85 {
    margin-top: 85px !important;
}

.mgt-pc--90 {
    margin-top: 90px !important;
}

.mgt-pc--95 {
    margin-top: 95px !important;
}

.mgt-pc--100 {
    margin-top: 100px !important;
}

.mgt-pc--105 {
    margin-top: 105px !important;
}

.mgt-pc--110 {
    margin-top: 110px !important;
}

.mgt-pc--115 {
    margin-top: 115px !important;
}

.mgt-pc--120 {
    margin-top: 120px !important;
}

.mgt-pc--125 {
    margin-top: 125px !important;
}

.mgt-pc--130 {
    margin-top: 130px !important;
}

.mgt-pc--135 {
    margin-top: 135px !important;
}

.mgt-pc--140 {
    margin-top: 140px !important;
}

.mgt-pc--145 {
    margin-top: 145px !important;
}

.mgt-pc--150 {
    margin-top: 150px !important;
}

.mgt-pc--155 {
    margin-top: 155px !important;
}

.mgt-pc--160 {
    margin-top: 160px !important;
}

.mgt-pc--165 {
    margin-top: 165px !important;
}

.mgt-pc--170 {
    margin-top: 170px !important;
}

.mgt-pc--175 {
    margin-top: 175px !important;
}

.mgt-pc--180 {
    margin-top: 180px !important;
}

.mgt-pc--185 {
    margin-top: 185px !important;
}

.mgt-pc--190 {
    margin-top: 190px !important;
}

.mgt-pc--195 {
    margin-top: 195px !important;
}

.mgt-pc--200 {
    margin-top: 200px !important;
}

.mgt-pc--205 {
    margin-top: 205px !important;
}

.mgt-pc--210 {
    margin-top: 210px !important;
}

.mgt-pc--215 {
    margin-top: 215px !important;
}

.mgt-pc--220 {
    margin-top: 220px !important;
}

.mgt-pc--225 {
    margin-top: 225px !important;
}

.mgt-pc--230 {
    margin-top: 230px !important;
}

.mgt-pc--235 {
    margin-top: 235px !important;
}

.mgt-pc--240 {
    margin-top: 240px !important;
}

.mgt-pc--245 {
    margin-top: 245px !important;
}

.mgt-pc--250 {
    margin-top: 250px !important;
}

@media screen and (max-width: 750px) {
    .mgt-sp--0 {
        margin-top: 0 !important;
    }
    .mgt-sp--5 {
        margin-top: calc(5 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--10 {
        margin-top: calc(10 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--15 {
        margin-top: calc(15 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--20 {
        margin-top: calc(20 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--25 {
        margin-top: calc(25 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--30 {
        margin-top: calc(30 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--35 {
        margin-top: calc(35 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--40 {
        margin-top: calc(40 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--45 {
        margin-top: calc(45 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--50 {
        margin-top: calc(50 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--55 {
        margin-top: calc(55 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--60 {
        margin-top: calc(60 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--65 {
        margin-top: calc(65 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--70 {
        margin-top: calc(70 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--75 {
        margin-top: calc(75 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--80 {
        margin-top: calc(80 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--85 {
        margin-top: calc(85 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--90 {
        margin-top: calc(90 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--95 {
        margin-top: calc(95 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--100 {
        margin-top: calc(100 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--105 {
        margin-top: calc(105 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--110 {
        margin-top: calc(110 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--115 {
        margin-top: calc(115 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--120 {
        margin-top: calc(120 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--125 {
        margin-top: calc(125 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--130 {
        margin-top: calc(130 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--135 {
        margin-top: calc(135 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--140 {
        margin-top: calc(140 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--145 {
        margin-top: calc(145 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--150 {
        margin-top: calc(150 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--155 {
        margin-top: calc(155 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--160 {
        margin-top: calc(160 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--165 {
        margin-top: calc(165 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--170 {
        margin-top: calc(170 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--175 {
        margin-top: calc(175 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--180 {
        margin-top: calc(180 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--185 {
        margin-top: calc(185 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--190 {
        margin-top: calc(190 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--195 {
        margin-top: calc(195 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--200 {
        margin-top: calc(200 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--205 {
        margin-top: calc(205 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--210 {
        margin-top: calc(210 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--215 {
        margin-top: calc(215 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--220 {
        margin-top: calc(220 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--225 {
        margin-top: calc(225 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--230 {
        margin-top: calc(230 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--235 {
        margin-top: calc(235 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--240 {
        margin-top: calc(240 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--245 {
        margin-top: calc(245 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--250 {
        margin-top: calc(250 / var(--design-width) * 100vw) !important;
    }
}
/* ---------------------------------------------
*   margin-bottom
--------------------------------------------- */
.mgb-pc--0 {
    margin-bottom: 0 !important;
}

.mgb-pc--5 {
    margin-bottom: 5px !important;
}

.mgb-pc--10 {
    margin-bottom: 10px !important;
}

.mgb-pc--15 {
    margin-bottom: 15px !important;
}

.mgb-pc--20 {
    margin-bottom: 20px !important;
}

.mgb-pc--25 {
    margin-bottom: 25px !important;
}

.mgb-pc--30 {
    margin-bottom: 30px !important;
}

.mgb-pc--35 {
    margin-bottom: 35px !important;
}

.mgb-pc--40 {
    margin-bottom: 40px !important;
}

.mgb-pc--45 {
    margin-bottom: 45px !important;
}

.mgb-pc--50 {
    margin-bottom: 50px !important;
}

.mgb-pc--55 {
    margin-bottom: 55px !important;
}

.mgb-pc--60 {
    margin-bottom: 60px !important;
}

.mgb-pc--65 {
    margin-bottom: 65px !important;
}

.mgb-pc--70 {
    margin-bottom: 70px !important;
}

.mgb-pc--75 {
    margin-bottom: 75px !important;
}

.mgb-pc--80 {
    margin-bottom: 80px !important;
}

.mgb-pc--85 {
    margin-bottom: 85px !important;
}

.mgb-pc--90 {
    margin-bottom: 90px !important;
}

.mgb-pc--95 {
    margin-bottom: 95px !important;
}

.mgb-pc--100 {
    margin-bottom: 100px !important;
}

.mgb-pc--105 {
    margin-bottom: 105px !important;
}

.mgb-pc--110 {
    margin-bottom: 110px !important;
}

.mgb-pc--115 {
    margin-bottom: 115px !important;
}

.mgb-pc--120 {
    margin-bottom: 120px !important;
}

.mgb-pc--125 {
    margin-bottom: 125px !important;
}

.mgb-pc--130 {
    margin-bottom: 130px !important;
}

.mgb-pc--135 {
    margin-bottom: 135px !important;
}

.mgb-pc--140 {
    margin-bottom: 140px !important;
}

.mgb-pc--145 {
    margin-bottom: 145px !important;
}

.mgb-pc--150 {
    margin-bottom: 150px !important;
}

.mgb-pc--155 {
    margin-bottom: 155px !important;
}

.mgb-pc--160 {
    margin-bottom: 160px !important;
}

.mgb-pc--165 {
    margin-bottom: 165px !important;
}

.mgb-pc--170 {
    margin-bottom: 170px !important;
}

.mgb-pc--175 {
    margin-bottom: 175px !important;
}

.mgb-pc--180 {
    margin-bottom: 180px !important;
}

.mgb-pc--185 {
    margin-bottom: 185px !important;
}

.mgb-pc--190 {
    margin-bottom: 190px !important;
}

.mgb-pc--195 {
    margin-bottom: 195px !important;
}

.mgb-pc--200 {
    margin-bottom: 200px !important;
}

.mgb-pc--205 {
    margin-bottom: 205px !important;
}

.mgb-pc--210 {
    margin-bottom: 210px !important;
}

.mgb-pc--215 {
    margin-bottom: 215px !important;
}

.mgb-pc--220 {
    margin-bottom: 220px !important;
}

.mgb-pc--225 {
    margin-bottom: 225px !important;
}

.mgb-pc--230 {
    margin-bottom: 230px !important;
}

.mgb-pc--235 {
    margin-bottom: 235px !important;
}

.mgb-pc--240 {
    margin-bottom: 240px !important;
}

.mgb-pc--245 {
    margin-bottom: 245px !important;
}

.mgb-pc--250 {
    margin-bottom: 250px !important;
}

@media screen and (max-width: 750px) {
    .mgb-sp--0 {
        margin-bottom: 0 !important;
    }
    .mgb-sp--5 {
        margin-bottom: calc(5 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--10 {
        margin-bottom: calc(10 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--15 {
        margin-bottom: calc(15 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--20 {
        margin-bottom: calc(20 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--25 {
        margin-bottom: calc(25 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--30 {
        margin-bottom: calc(30 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--35 {
        margin-bottom: calc(35 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--40 {
        margin-bottom: calc(40 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--45 {
        margin-bottom: calc(45 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--50 {
        margin-bottom: calc(50 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--55 {
        margin-bottom: calc(55 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--60 {
        margin-bottom: calc(60 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--65 {
        margin-bottom: calc(65 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--70 {
        margin-bottom: calc(70 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--75 {
        margin-bottom: calc(75 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--80 {
        margin-bottom: calc(80 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--85 {
        margin-bottom: calc(85 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--90 {
        margin-bottom: calc(90 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--95 {
        margin-bottom: calc(95 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--100 {
        margin-bottom: calc(100 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--105 {
        margin-bottom: calc(105 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--110 {
        margin-bottom: calc(110 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--115 {
        margin-bottom: calc(115 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--120 {
        margin-bottom: calc(120 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--125 {
        margin-bottom: calc(125 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--130 {
        margin-bottom: calc(130 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--135 {
        margin-bottom: calc(135 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--140 {
        margin-bottom: calc(140 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--145 {
        margin-bottom: calc(145 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--150 {
        margin-bottom: calc(150 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--155 {
        margin-bottom: calc(155 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--160 {
        margin-bottom: calc(160 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--165 {
        margin-bottom: calc(165 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--170 {
        margin-bottom: calc(170 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--175 {
        margin-bottom: calc(175 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--180 {
        margin-bottom: calc(180 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--185 {
        margin-bottom: calc(185 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--190 {
        margin-bottom: calc(190 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--195 {
        margin-bottom: calc(195 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--200 {
        margin-bottom: calc(200 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--205 {
        margin-bottom: calc(205 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--210 {
        margin-bottom: calc(210 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--215 {
        margin-bottom: calc(215 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--220 {
        margin-bottom: calc(220 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--225 {
        margin-bottom: calc(225 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--230 {
        margin-bottom: calc(230 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--235 {
        margin-bottom: calc(235 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--240 {
        margin-bottom: calc(240 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--245 {
        margin-bottom: calc(245 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--250 {
        margin-bottom: calc(250 / var(--design-width) * 100vw) !important;
    }
}