.c-banner {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
    width: 100%;
    padding: 15px;
    background-color: rgba(51, 51, 51, 0.8);
}
.c-banner__note {
    display: block;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3888888889;
    text-align: center;
    color: var(--color-white-1);
    margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
    .c-banner__note {
        font-size: calc(24 / var(--design-width) * 100vw);
        margin-bottom: 2vw;
    }
}
.c-banner__note strong {
    color: var(--color-yellow-1);
}
.c-banner__list {
    max-width: calc(var(--contents-width) * 1px + 30px);
    margin-inline: auto;
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: 4px;
}
@media screen and (max-width: 767px) {
    .c-banner__list {
        max-width: none;
        gap: calc(8 / var(--design-width) * 100vw);
    }
}
.c-banner__item {
    width: calc((100% - 8px) / 3);
    flex-shrink: 0;
}
@media screen and (max-width: 767px) {
    .c-banner__item {
        width: calc((100% - 1vw) / 3);
    }
}
.c-banner__link {
    position: relative;
    padding: 14px 20px 14px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.5555555556;
    background: linear-gradient(90deg, rgb(250, 15, 19) 0%, rgb(255, 74, 236) 100%);
    width: 100%;
    white-space: nowrap;
    text-align: center;
    color: #ffffff;
}
.c-banner__link {
    background: linear-gradient(90deg, rgb(204, 0, 51) 0%, rgb(204, 0, 51) 100%);
}
.c-banner__link--brown {
    background: linear-gradient(90deg, rgb(93, 59, 58) 0%, rgb(93, 59, 58) 100%);
}
.c-banner__link--blue {
    background: linear-gradient(90deg, rgb(25, 0, 255) 0%, rgb(26, 188, 156) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
@media (hover: hover) and (pointer: fine) {
    .c-banner__link {
        transition: opacity var(--hover-duration);
    }
    .c-banner__link:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
@media screen and (max-width: 767px) {
    .c-banner__link {
        padding: calc(28 / var(--design-width) * 100vw) calc(5 / var(--design-width) * 100vw) calc(27 / var(--design-width) * 100vw);
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.25;
    }
}
.c-banner__link::before {
    content: "";
    position: absolute;
    right: 30px;
    display: inline-block;
    vertical-align: middle;
    color: var(--color-white-1);
    line-height: 1;
    width: 0.5em;
    height: 0.5em;
    border: 0.1em solid currentColor;
    border-left: 0;
    border-bottom: 0;
    box-sizing: border-box;
    transform: translateX(-25%) rotate(45deg);
}
@media screen and (max-width: 767px) {
    /*
    .c-banner__link::before {
        right: calc(38 / var(--design-width) * 100vw);
    }
    */
    .c-banner__link::before {
        content: none;
    }
}
.c-banner__link::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    border-radius: 50%;
    border: 1px solid var(--color-white-1);
    display: block;
    width: 30px;
    aspect-ratio: 1/1;
}
@media screen and (max-width: 767px) {
    /*
    .c-banner__link::after {
        right: calc(30 / var(--design-width) * 100vw);
        width: calc(30 / var(--design-width) * 100vw);
    }
    */
    .c-banner__link::after {
        content: none;
    }
}


/* ---------------------------------------------
*   c-submenu
--------------------------------------------- */
.c-banner__item:first-child {
    position: relative;
}
.c-submenu {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 8px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    min-width: 300px;
    z-index: 1001;
}
.c-submenu.is-active {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(-2px);
}
.c-submenu::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 8px solid transparent;
    border-top-color: white;
}
.c-submenu__list {
    list-style: none;
    padding: 8px;
}
.c-submenu__item {
    margin: 0;
}
.c-submenu__item:not(:last-child) {
    border-bottom: 1px solid #e0e0e0;
}
.c-submenu__link {
    display: block;
    padding: 12px 16px;
    color: #333;
    text-decoration: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
    transition: background-color 0.2s ease;
    white-space: nowrap;
}
.c-submenu__link:hover {
    background-color: #f0f8ff;
    color: #0066cc;
}
@media screen and (max-width: 767px) {
    .c-submenu {
        position: absolute;
        bottom: 100%;
        left: 0;
        transform: translateX(0);
        margin-bottom: 8px;
        width: max-content;
        min-width: 200px;
        max-width: 280px;
    }
    .c-submenu.is-active {
        transform: translateX(0) translateY(-2px);
    }
    .c-submenu::after {
        left: 25%;
        transform: translateX(-50%);
    }
    .c-submenu__link {
        font-size: calc(26 / var(--design-width) * 100vw);
        padding: calc(24 / var(--design-width) * 100vw) calc(32 / var(--design-width) * 100vw);
    }
    .c-submenu__link {
        font-size: calc(26 / var(--design-width) * 100vw);
        padding: calc(24 / var(--design-width) * 100vw) calc(32 / var(--design-width) * 100vw);
    }
}


/* ---------------------------------------------
*   c-banner-renew
--------------------------------------------- */
.c-banner-renew {
    background-color: rgba(51, 51, 51, 0.64);
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
    padding: 15px;
    width: 100%;
}
.c-banner-renew__lead {
    position: relative;
    padding-inline: 18px;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    font-size: 16px;
    font-weight: bold;
    margin-inline: auto;
    text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.4);
}
@media screen and (max-width: 767px) {
    .c-banner-renew__lead {
        padding-inline: calc(20 / var(--design-width) * 100vw);
        font-size: calc(24 / var(--design-width) * 100vw);
    }
}
.c-banner-renew__lead::before, .c-banner-renew__lead::after {
    content: "";
    position: absolute;
    top: 0;
    display: block;
    width: 2px;
    height: 21px;
    background-color: var(--color-white-1);
    text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.4);
}
@media screen and (max-width: 767px) {
    .c-banner-renew__lead::before, .c-banner-renew__lead::after {
        top: calc(3 / var(--design-width) * 100vw);
        width: calc(2 / var(--design-width) * 100vw);
        height: calc(30 / var(--design-width) * 100vw);
    }
}
.c-banner-renew__lead::before {
    left: 0;
    transform: rotate(-33deg);
    transform-origin: bottom left;
}
.c-banner-renew__lead::after {
    right: 0;
    transform: rotate(33deg);
    transform-origin: bottom left;
}
.c-banner-renew__btn {
    position: relative;
    margin-top: 8px;
    margin-inline: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--color-red-1);
    color: var(--color-white-1);
    border-radius: 4px;
    padding: 11px 43px;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.5555555556;
    width: -moz-fit-content;
    width: fit-content;
    box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.4);
}
@media (hover: hover) and (pointer: fine) {
    .c-banner-renew__btn {
        transition: opacity var(--hover-duration);
    }
    .c-banner-renew__btn:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
@media screen and (max-width: 767px) {
    .c-banner-renew__btn {
        padding: calc(16 / var(--design-width) * 100vw) calc(139 / var(--design-width) * 100vw) calc(19 / var(--design-width) * 100vw);
        font-size: calc(24 / var(--design-width) * 100vw);
        margin-top: calc(7 / var(--design-width) * 100vw);
        max-width: none;
        border-radius: calc(4 / var(--design-width) * 100vw);
    }
}
.c-banner-renew__btn::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 13px;
    display: block;
    width: 9px;
    aspect-ratio: 19/13;
    background: url(../img/icon_outlink-2.png) center center no-repeat;
    background: contain;
    transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
    .c-banner-renew__btn::after {
        right: calc(26 / var(--design-width) * 100vw);
        width: calc(18 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-block-plan
--------------------------------------------- */
.c-block-plan__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}
@media screen and (max-width: 767px) {
    .c-block-plan__list {
        gap: calc(10 / var(--design-width) * 100vw);
    }
}
.c-block-plan__item img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.c-block-plan__lemio {
    padding: 28px 10px;
    margin-top: 10px;
    border: 2px solid var(--color-red-2);
    border-radius: 4px;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-block-plan__lemio {
        padding: calc(43 / var(--design-width) * 100vw) calc(47 / var(--design-width) * 100vw) calc(53 / var(--design-width) * 100vw);
        margin-top: calc(14 / var(--design-width) * 100vw);
        border-width: calc(2 / var(--design-width) * 100vw);
        border-radius: calc(4 / var(--design-width) * 100vw);
    }
}
.c-block-plan__lemio-wh {
    display: block;
    font-size: 20px;
    font-weight: 600;
}
@media screen and (max-width: 767px) {
    .c-block-plan__lemio-wh {
        font-size: calc(28 / var(--design-width) * 100vw);
    }
}
.c-block-plan__lemio-st {
    position: relative;
    display: block;
    color: var(--color-red-2);
    font-size: 28px;
    font-weight: bold;
    line-height: 1.6428571429;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-block-plan__lemio-st {
        margin-top: calc(8 / var(--design-width) * 100vw);
        font-size: calc(36 / var(--design-width) * 100vw);
        line-height: 1.077778;
    }
}
.c-block-plan__lemio-st sup {
    position: absolute;
    top: -0.5em;
    right: -2.1em;
    font-size: 12px;
    font-weight: 300;
    line-height: 2.8333333333;
}
@media screen and (max-width: 767px) {
    .c-block-plan__lemio-st sup {
        top: 0em;
        right: -1.9em;
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
    }
}
.c-block-plan__lemio-small {
    display: inline-block;
    font-size: 18px;
    line-height: 2.5555555556;
    margin-inline: -7px;
}
@media screen and (max-width: 767px) {
    .c-block-plan__lemio-small {
        font-size: calc(28 / var(--design-width) * 100vw);
        line-height: 1.6428571429;
        margin-inline: calc(-10 / var(--design-width) * 100vw);
    }
}
.c-block-plan__link {
    display: block;
    width: 100%;
}
@media (hover: hover) and (pointer: fine) {
    .c-block-plan__link {
        transition: opacity var(--hover-duration);
    }
    .c-block-plan__link:hover {
        opacity: var(--hover-opacity-ratio);
    }
}

/* ---------------------------------------------
*   c-box-howto
--------------------------------------------- */
.c-box-howto {
    padding: 31px 20px 31px;
    background-color: #3E3E3E;
}
@media screen and (max-width: 767px) {
    .c-box-howto {
        padding: calc(31 / var(--design-width) * 100vw) calc(36 / var(--design-width) * 100vw) calc(31 / var(--design-width) * 100vw);
    }
}
.c-box-howto__container {
    max-width: 599px;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-box-howto__container {
        max-width: none;
    }
}
.c-box-howto__lead {
    display: inline-block;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.5555555556;
}
@media screen and (max-width: 767px) {
    .c-box-howto__lead {
        font-size: calc(26 / var(--design-width) * 100vw);
    }
}
.c-box-howto__txt {
    display: inline-block;
    font-size: 16px;
    line-height: 1.75;
    margin-block: 7px 7px;
}
@media screen and (max-width: 767px) {
    .c-box-howto__txt {
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
        margin-block: calc(18 / var(--design-width) * 100vw) calc(18 / var(--design-width) * 100vw);
    }
}

.c-btn-1--howto01 {
    background-image: url(../img/howto_btn01.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    border: none !important;
    padding: 23px 60px !important;
    box-shadow: 0px 5px 25px -10px #000000 !important;
}

.c-btn-1--howto02 {
    background-image: url(../img/howto_btn02.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    color: var(--color-red) !important;
    padding: 6px 60px !important;
    border: none !important;
    box-shadow: 0px 5px 25px -10px #000000 !important;
}
.c-btn-1--howto03 {
    background-image: url(../img/howto_btn03.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    border: none !important;
    padding: 23px 60px !important;
    box-shadow: 0px 5px 25px -10px #000000 !important;
}

.c-btn-1--howto04 {
    background-image: url(../img/howto_btn04.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    color: var(--color-red) !important;
    padding: 6px 60px !important;
    border: none !important;
    padding: 5px 60px !important;
    box-shadow: 0px 5px 25px -10px #000000 !important;
    color: #ffffff !important;
}

.c-btn-1--howto04 .c-banner__shopbaloon {
    position: relative;
    padding: calc(15 / var(--design-width) * 100vw) calc(15 / var(--design-width) * 100vw);
    font-size: calc(17 / var(--design-width) * 100vw);
    left: 33%;
}
.c-btn-1--howto04.balloon02 .c-banner__shopbaloon {
    position: relative;
    padding: 15px;
    font-size: 17px;
    left: 120px;
}

.c-btn-1--howto02.c-btn-1::after {
    background: url(../img/icon_outlink-4.png) center center no-repeat;
    background-size: contain;
}
@media screen and (max-width: 767px) {
    .c-btn-1--howto01 {
        padding: calc(32 / var(--design-width) * 100vw) calc(60 / var(--design-width) * 100vw) !important;
    }
    .c-btn-1--howto03 {
        padding: calc(32 / var(--design-width) * 100vw) calc(60 / var(--design-width) * 100vw) !important;
    }
    .c-btn-1--howto04 {
        padding: calc(12 / var(--design-width) * 100vw) calc(60 / var(--design-width) * 100vw) !important;
        font-size: calc(22 / var(--design-width) * 100vw);
    }
    .c-btn-1--howto04  .c-banner__shopbaloon {
        padding: calc(20 / var(--design-width) * 100vw)
    }
    .c-btn-1--howto04.balloon02 .c-banner__shopbaloon {
        padding: calc(15 / var(--design-width) * 100vw) calc(15 / var(--design-width) * 100vw);
        font-size: calc(12 / var(--design-width) * 100vw);
        left: calc(75 / var(--design-width) * 100vw);
    }

}
@media screen and (max-width: 640px) {
    .c-btn-1--howto04.balloon02 .c-banner__shopbaloon {
        font-size: calc(17 / var(--design-width) * 100vw);
    }
}


/* ---------------------------------------------
*   c-box-plan
--------------------------------------------- */
.c-box-plan {
    padding-block: 42px 45px;
    max-width: 670px;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-box-plan {
        padding-block: calc(43 / var(--design-width) * 100vw) calc(30 / var(--design-width) * 100vw);
        max-width: none;
    }
}
.c-box-plan--p0 {
    padding-top: 0;
    padding-bottom: 0;
}
.c-box-plan__ttl {
    display: block;
    font-size: 32px;
    font-weight: bold;
    line-height: 1.25;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-box-plan__ttl {
        font-size: calc(32 / var(--design-width) * 100vw);
    }
}
.c-box-plan__ttl--small {
    font-size: 28px;
    line-height: 1.2142857143;
    margin-top: 8px;
}
@media screen and (max-width: 767px) {
    .c-box-plan__ttl--small {
        font-size: calc(28 / var(--design-width) * 100vw);
        margin-top: calc(18 / var(--design-width) * 100vw);
    }
}
.c-box-plan__ttl--x-small {
    font-size: 22px;
    line-height: 1.3;
}
@media screen and (max-width: 767px) {
    .c-box-plan__ttl--x-small {
        font-size: calc(22 / var(--design-width) * 100vw);
    }
}
.c-box-plan__list {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 42px;
}
@media screen and (max-width: 767px) {
    .c-box-plan__list {
        gap: calc(6 / var(--design-width) * 100vw);
        margin-top: calc(43 / var(--design-width) * 100vw);
    }
}
.c-box-plan__item {
    width: calc((100% - 16px) / 3);
    flex-shrink: 0;
    border-radius: 4px;
    border: 2px solid var(--color-white-1);
    overflow: hidden;
}
@media screen and (max-width: 767px) {
    .c-box-plan__item {
        width: calc((100% - 0.0166666667vw) / 3);
        border-radius: calc(4 / var(--design-width) * 100vw);
        border-width: calc(2 / var(--design-width) * 100vw);
    }
}
.c-box-plan__item--1col {
    width: 100%;
}
.c-box-plan__term {
    position: relative;
    padding: 10px 5px;
    display: block;
    color: var(--color-yellow-1);
    font-size: 22px;
    font-weight: bold;
    line-height: 1.5454545455;
    background-color: var(--color-base-1);
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-box-plan__term {
        padding: calc(12 / var(--design-width) * 100vw) calc(5 / var(--design-width) * 100vw) calc(11 / var(--design-width) * 100vw);
        font-size: calc(22 / var(--design-width) * 100vw);
        line-height: 1.3076923077;
    }
}
.c-box-plan__term--wh {
    color: var(--color-white-1);
}
.c-box-plan__term span {
    position: relative;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
}
.c-box-plan__term span sup {
    position: absolute;
    top: -0.5em;
    right: -2.1em;
    font-size: 12px;
    font-weight: 300;
    line-height: 2.8333333333;
}
@media screen and (max-width: 767px) {
    .c-box-plan__term span sup {
        top: 0em;
        right: -1.9em;
        font-size: calc(18 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
    }
}
.c-box-plan__place {
    padding: 12px 5px 13px;
    display: block;
    background-color: var(--color-white-1);
    color: var(--color-base-1);
    font-size: 18px;
    font-weight: bold;
    line-height: 1.588889;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-box-plan__place {
        padding: calc(18 / var(--design-width) * 100vw) calc(3 / var(--design-width) * 100vw);
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
    }
}
.c-box-plan__place-st {
    font-size: 30px;
    line-height: 1.1333333333;
}
@media screen and (max-width: 767px) {
    .c-box-plan__place-st {
        font-size: calc(34 / var(--design-width) * 100vw);
        line-height: 1;
    }
}
.c-box-plan__lead {
    margin-top: 25px;
    display: block;
    font-size: 28px;
    font-weight: bold;
    line-height: 1.3571428571;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-box-plan__lead {
        margin-top: calc(29 / var(--design-width) * 100vw);
        font-size: calc(32 / var(--design-width) * 100vw);
        line-height: 1.4375;
    }
}
.c-box-plan__lead-small {
    display: inline-block;
    font-size: 18px;
    line-height: 2.1111111111;
}
@media screen and (max-width: 767px) {
    .c-box-plan__lead-small {
        font-size: calc(26 / var(--design-width) * 100vw);
        line-height: 1.7692307692;
    }
}
.c-box-plan__logo {
    margin-top: 28px;
    margin-inline: auto;
    width: 86px;
}
.c-box-plan__logo img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
@media screen and (max-width: 767px) {
    .c-box-plan__logo {
        margin-top: calc(25 / var(--design-width) * 100vw);
        width: calc(94 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-box-value
--------------------------------------------- */
.c-box-value {
    text-align: center;
    font-weight: bold;
    padding-block: 0 38px;
}
@media screen and (max-width: 767px) {
    .c-box-value {
        padding-block: 0 calc(38 / var(--design-width) * 100vw);
    }
}
.c-box-value__sarani {
    position: relative;
    padding-inline: 37px;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    font-size: 22px;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-box-value__sarani {
        padding-inline: calc(31 / var(--design-width) * 100vw);
        font-size: calc(26 / var(--design-width) * 100vw);
    }
}
.c-box-value__sarani::before, .c-box-value__sarani::after {
    content: "";
    position: absolute;
    top: 0;
    display: block;
    width: 2px;
    height: 28px;
    background-color: var(--color-white-1);
}
@media screen and (max-width: 767px) {
    .c-box-value__sarani::before, .c-box-value__sarani::after {
        top: calc(8 / var(--design-width) * 100vw);
        width: calc(2 / var(--design-width) * 100vw);
        height: calc(28 / var(--design-width) * 100vw);
    }
}
.c-box-value__sarani::before {
    left: 0;
    transform: rotate(-33deg);
    transform-origin: bottom left;
}
.c-box-value__sarani::after {
    right: 0;
    transform: rotate(33deg);
    transform-origin: bottom left;
}
.c-box-value__ttl-txt {
    display: inline-block;
    font-size: 28px;
    margin-top: 5px;
}
@media screen and (max-width: 767px) {
    .c-box-value__ttl-txt {
        font-size: calc(28 / var(--design-width) * 100vw);
        margin-top: calc(8 / var(--design-width) * 100vw);
    }
}
.c-box-value__graf {
    margin-top: 22px;
    display: block;
    width: 100%;
}
.c-box-value__graf img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
@media screen and (max-width: 767px) {
    .c-box-value__graf {
        margin-top: calc(18 / var(--design-width) * 100vw);
    }
}
.c-box-value__btn {
    max-width: 598px;
    margin-inline: auto;
    margin-top: 29px;
}
@media screen and (max-width: 767px) {
    .c-box-value__btn {
        max-width: none;
        margin-top: calc(40 / var(--design-width) * 100vw);
        width: calc(584 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-box-point
--------------------------------------------- */
.c-box-point {
    margin-top: 30px;
}
@media screen and (max-width: 767px) {
    .c-box-point {
        margin-top: calc(40 / var(--design-width) * 100vw);
    }
}
.c-box-point__kangen {
    display: block;
    width: 100%;
}
.c-box-point__kangen img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.c-box-point__term {
    padding: 15px 15px 13px;
    display: block;
    font-size: 22px;
    font-weight: bold;
    line-height: 1.5454545455;
    text-align: center;
    border-radius: 4px;
    background-color: var(--color-yellow-3);
    margin-top: 30px;
}
@media screen and (max-width: 767px) {
    .c-box-point__term {
        padding: calc(10 / var(--design-width) * 100vw);
        font-size: calc(28 / var(--design-width) * 100vw);
        border-radius: calc(4 / var(--design-width) * 100vw);
        margin-top: calc(30 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-box-entry
--------------------------------------------- */
.c-box-entry__lead {
    position: relative;
    padding-inline: 24px;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    font-size: 24px;
    font-weight: bold;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-box-entry__lead {
        padding-inline: calc(31 / var(--design-width) * 100vw);
        font-size: calc(26 / var(--design-width) * 100vw);
    }
}
.c-box-entry__lead::before, .c-box-entry__lead::after {
    content: "";
    position: absolute;
    top: 0;
    display: block;
    width: 2px;
    height: 34px;
    background-color: var(--color-white-1);
}
@media screen and (max-width: 767px) {
    .c-box-entry__lead::before, .c-box-entry__lead::after {
        top: calc(-1 / var(--design-width) * 100vw);
        width: calc(2 / var(--design-width) * 100vw);
        height: calc(37 / var(--design-width) * 100vw);
    }
}
.c-box-entry__lead::before {
    left: 0;
    transform: rotate(-33deg);
    transform-origin: bottom left;
}
.c-box-entry__lead::after {
    right: 0;
    transform: rotate(33deg);
    transform-origin: bottom left;
}
.c-box-entry__btn {
    position: relative;
    margin-top: 33px;
    margin-inline: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--color-red-1);
    color: var(--color-white-1);
    border-radius: 999px;
    padding: 28px 60px;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.1724137931;
    max-width: 600px;
    box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.4);
}
@media (hover: hover) and (pointer: fine) {
    .c-box-entry__btn {
        transition: opacity var(--hover-duration);
    }
    .c-box-entry__btn:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
@media screen and (max-width: 767px) {
    .c-box-entry__btn {
        padding: calc(32 / var(--design-width) * 100vw) calc(112 / var(--design-width) * 100vw);
        font-size: calc(30 / var(--design-width) * 100vw);
        margin-top: calc(27 / var(--design-width) * 100vw);
        max-width: none;
        width: calc(559 / var(--design-width) * 100vw);
        border-radius: calc(4 / var(--design-width) * 100vw);
    }
}
.c-box-entry__btn::after {
    content: "";
    position: absolute;
    top: 53%;
    right: 34px;
    display: block;
    width: 18px;
    aspect-ratio: 19/13;
    background: url(../img/icon_outlink-2.png) center center no-repeat;
    background-size: contain;
    transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
    .c-box-entry__btn::after {
        top: 50%;
        right: calc(32 / var(--design-width) * 100vw);
        width: calc(18 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-btn-1
--------------------------------------------- */
.c-btn-1 {
    position: relative;
    padding: 23px 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--color-white-1);
    font-size: 20px;
    font-weight: bold;
    line-height: 1.7;
    text-align: center;
    border-radius: 999px;
    border: 1px solid;
    width: 100%;
    box-shadow: 0px 5px 5px 0px #999999;
}
@media (hover: hover) and (pointer: fine) {
    .c-btn-1 {
        transition: opacity var(--hover-duration);
    }
    .c-btn-1:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
@media screen and (max-width: 767px) {
    .c-btn-1 {
        padding: calc(24 / var(--design-width) * 100vw) calc(60 / var(--design-width) * 100vw);
        font-size: calc(26 / var(--design-width) * 100vw);
    }
}
.c-btn-1::after {
    content: "";
    position: absolute;
    top: 53%;
    right: 34px;
    display: block;
    width: 18px;
    aspect-ratio: 19/13;
    background: url(../img/icon_outlink-2.png) center center no-repeat;
    background-size: contain;
    transform: translateY(-50%);
}
.c-btn-1.set02::after {
    width: 19px;
    aspect-ratio: 19 / 13;
    background: url(../img/icon_outlink-3.svg) 0 0 no-repeat;
    background-size: cover;
}
@media screen and (max-width: 767px) {
    .c-btn-1::after {
        top: 50%;
        right: calc(32 / var(--design-width) * 100vw);
        width: calc(18 / var(--design-width) * 100vw);
    }
    .c-btn-1.set02::after {
        width: calc(19 / var(--design-width) * 100vw);
    }
}
.c-btn-1--red {
    background: linear-gradient(90deg, rgb(250, 15, 19) 0%, rgb(255, 74, 236) 100%);
    border-color: transparent;
}
.c-btn-1--red {
    background: linear-gradient(90deg, rgb(204, 0, 51) 0%, rgb(204, 0, 51) 100%);
    border-color: transparent;
}
.c-btn-1--red02 {
    background: linear-gradient(90deg, rgb(255, 13, 71) 0%, rgb(255, 13, 71) 100%);
    border-color: transparent;
    padding: 6px 60px;
}
.c-btn-1--brown {
    background: linear-gradient(90deg, rgb(63, 81, 181) 0%, rgb(0, 187, 255) 100%);
    border-color: var(--color-white-1);
}
.c-btn-1--brown {
    background: linear-gradient(90deg, rgb(93, 59, 58) 0%, rgb(93, 59, 58) 100%);
    border-color: transparent;
}
.c-btn-1--white {
    border-color: var(--color-white);
}
@media screen and (max-width: 767px) {
    .c-btn-1--white {
        padding-block: calc(15 / var(--design-width) * 100vw);
        font-size: calc(26 / var(--design-width) * 100vw);
    }
    .c-btn-1--red02 {
        background: linear-gradient(90deg, rgb(255, 13, 71) 0%, rgb(255, 13, 71) 100%);
        border-color: transparent;
        padding: calc(3 / var(--design-width) * 100vw) calc(60 / var(--design-width) * 100vw);
        line-height: 1.55;
    }
}
.c-btn-1--gray {
    border-color: var(--color-white-1);
    background-color: var(--color-black-3);
    color: var(--color-white-1);
}
.c-btn-1--contact {
    border-color: var(--color-red-1);
    border-width: 3px;
    width: 430px;
    box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.2);
    color: var(--color-red-1);
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-btn-1--contact {
        padding-inline: calc(40 / var(--design-width) * 100vw);
        border-width: calc(3 / var(--design-width) * 100vw);
        width: 100%;
        box-shadow: calc(3 / var(--design-width) * 100vw) calc(3 / var(--design-width) * 100vw) calc(12 / var(--design-width) * 100vw) rgba(0, 0, 0, 0.2);
    }
}
.c-btn-1--contact::after {
    width: 19px;
    aspect-ratio: 19/13;
    background: url(../img/icon_outlink-3.svg) 0 0 no-repeat;
    background-size: cover;
}
@media screen and (max-width: 767px) {
    .c-btn-1--contact::after {
        width: calc(19 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 767px) {
    .c-btn-1--contact .c-btn-1__txt {
        transform: translateX(-1.7vw);
    }
}
@media screen and (max-width: 767px) {
    .c-btn-1--contact-small {
        padding-block: calc(12 / var(--design-width) * 100vw);
        width: 89%;
    }
}
.c-btn-1--feature {
    background: linear-gradient(90deg, #413d0d 0%, #222 100%);
}
@media screen and (max-width: 767px) {
    .c-btn-1--feature {
        background: linear-gradient(90deg, #413d0d 0%, #222 100%);
    }
}
.c-btn-1--w599 {
    max-width: 599px;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-btn-1--w599 {
        max-width: none;
        width: calc(584 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-card
--------------------------------------------- */
/* ---------------------------------------------
*   c-cassette-contact
--------------------------------------------- */
.c-cassette-contact {
    border-radius: 10px 10px 20px 20px;
    border: 4px solid var(--color-red-1);
    background-color: var(--color-white-1);
    max-width: 776px;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact {
        border-radius: calc(10 / var(--design-width) * 100vw) calc(10 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw);
        border-width: calc(4 / var(--design-width) * 100vw);
        max-width: none;
    }
}
.c-cassette-contact + .c-cassette-contact {
    margin-top: 30px;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact + .c-cassette-contact {
        margin-top: calc(55 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact--online {
    border-radius: 0;
    border: none;
    background: none;
}
.c-cassette-contact__head {
    border-radius: 5px 5px 0 0;
    padding: 31px;
    background-color: var(--color-red-1);
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__head {
        border-radius: calc(5 / var(--design-width) * 100vw) calc(5 / var(--design-width) * 100vw) 0 0;
        padding: calc(37 / var(--design-width) * 100vw) calc(33 / var(--design-width) * 100vw) calc(33 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact__ttl {
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    line-height: 1.3333333333;
    color: #ffffff;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__ttl {
        font-size: calc(36 / var(--design-width) * 100vw);
        line-height: 1.5;
    }
}
.c-cassette-contact__body {
    padding: 31px 42px 24px;
    color: var(--color-base-1);
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__body {
        padding: calc(16 / var(--design-width) * 100vw) calc(26 / var(--design-width) * 100vw) calc(47 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact__body--staf {
    padding: 31px 42px 54px;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__body--staf {
        padding: calc(51 / var(--design-width) * 100vw) calc(29 / var(--design-width) * 100vw) calc(57 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact__body--online {
    padding: 34px 42px 32px;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__body--online {
        padding: calc(25 / var(--design-width) * 100vw) calc(26 / var(--design-width) * 100vw) calc(60 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact__txt {
    display: block;
    font-size: 16px;
    line-height: 1.75;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__txt {
        font-size: calc(26 / var(--design-width) * 100vw);
        line-height: 1.6923076923;
        text-align: left;
    }
}
.c-cassette-contact__lead {
    display: block;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.4;
    text-align: center;
    margin-top: 10px;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__lead {
        font-size: calc(28 / var(--design-width) * 100vw);
        line-height: 1.3571428571;
        text-align: left;
        margin-top: calc(7 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact__lead--spcenter {
    color: var(--color-base-1);
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__lead--spcenter {
        text-align: center;
    }
}
.c-cassette-contact__tels {
    padding: 19px 10px 28px;
    border: 2px solid var(--color-gray-2);
    margin-block: 19px 20px;
    text-align: center;
    border-radius: 6px;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__tels {
        padding: calc(51 / var(--design-width) * 100vw) calc(49 / var(--design-width) * 100vw) calc(29 / var(--design-width) * 100vw);
        border-width: calc(2 / var(--design-width) * 100vw);
        border-radius: calc(6 / var(--design-width) * 100vw);
        margin-block: calc(31 / var(--design-width) * 100vw) calc(27 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact__tel {
    display: block;
    color: var(--color-red-1);
    font-size: 54px;
    font-weight: bold;
    line-height: 1.1111111111;
    white-space: nowrap;
}
@media (hover: hover) and (pointer: fine) {
    .c-cassette-contact__tel {
        transition: opacity var(--hover-duration);
    }
    .c-cassette-contact__tel:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__tel {
        font-size: calc(64 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact__tel.js-tel-disabled {
    pointer-events: none;
}
.c-cassette-contact__tel-txt {
    display: block;
    color: var(--color-red-1);
    font-size: 28px;
    font-weight: bold;
    line-height: 2.1428571429;
    white-space: nowrap;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__tel-txt {
        font-size: calc(32 / var(--design-width) * 100vw);
        line-height: 1.875;
    }
}
.c-cassette-contact__tel-txt-small {
    font-size: 20px;
    line-height: 3;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__tel-txt-small {
        font-size: calc(26 / var(--design-width) * 100vw);
        line-height: 2.3076923077;
    }
}
.c-cassette-contact__tel-note {
    display: block;
    font-size: 12px;
    line-height: 1.6666666667;
    margin-top: 9px;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__tel-note {
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
        text-align: left;
        margin-top: calc(29 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact__note {
    max-width: 406px;
    margin-inline: auto;
    margin-top: 13px;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__note {
        max-width: none;
        margin-top: calc(26 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact__illust {
    display: block;
    max-width: 524px;
    margin-inline: auto;
    margin-block: 0 30px;
}
.c-cassette-contact__illust img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__illust {
        max-width: none;
        width: calc(531 / 559 * 100%);
        margin-block: 0 calc(64 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact__illust--online {
    max-width: 412px;
    margin-block: 24px 17px;
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__illust--online {
        max-width: none;
        width: calc(412 / var(--design-width) * 100vw);
        margin-inline: auto;
        margin-block: calc(28 / var(--design-width) * 100vw) calc(40 / var(--design-width) * 100vw);
    }
}
.c-cassette-contact__online {
    padding: 29px 10px 47px;
    border: 2px solid var(--color-gray-2);
    margin-block: 0 26px;
    text-align: center;
    border-radius: 6px;
    background-color: var(--color-white-1);
}
@media screen and (max-width: 767px) {
    .c-cassette-contact__online {
        padding: calc(32 / var(--design-width) * 100vw) calc(26 / var(--design-width) * 100vw) calc(51 / var(--design-width) * 100vw);
        border-width: calc(2 / var(--design-width) * 100vw);
        border-radius: calc(6 / var(--design-width) * 100vw);
        margin-block: 0;
    }
}

/* ---------------------------------------------
*   c-cassette-1
--------------------------------------------- */
.c-cassette-1__head {
    padding: 11px 22px;
    border-radius: 4px;
    border: 2px solid var(--color-base-1);
    font-size: 18px;
    line-height: 1.8888888889;
    text-align: center;
    background-color: var(--color-base-1);
}
@media screen and (max-width: 767px) {
    .c-cassette-1__head {
        padding: calc(21 / var(--design-width) * 100vw) calc(19 / var(--design-width) * 100vw);
        border-width: calc(2 / var(--design-width) * 100vw);
        border-radius: calc(4 / var(--design-width) * 100vw);
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
    }
}
.c-cassette-1__head.js-acc-trigger {
    position: relative;
    width: 100%;
    color: var(--color-white-1);
    cursor: pointer;
}
@media (hover: hover) and (pointer: fine) {
    .c-cassette-1__head.js-acc-trigger {
        transition: opacity var(--hover-duration);
    }
    .c-cassette-1__head.js-acc-trigger:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
.c-cassette-1__head.js-acc-trigger::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 22px;
    display: block;
    width: 30px;
    aspect-ratio: 1/1;
    background: url(../img/icon_toggle.png) 0 0 no-repeat;
    background-size: 100% auto;
    transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
    .c-cassette-1__head.js-acc-trigger::before {
        right: calc(19 / var(--design-width) * 100vw);
        width: calc(36 / var(--design-width) * 100vw);
    }
}
.is-open .c-cassette-1__head.js-acc-trigger::before {
    background: url(../img/icon_toggle_close.png) 0 0 no-repeat;
    background-size: 100% auto;
}

.c-cassette-1__head.js-acc-trigger::after {
    content: "開く";
    position: absolute;
    top: 50%;
    right: calc(22px + 3em);
    display: block;
    font-size: 12px;
    font-weight: 300;
    transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
    .c-cassette-1__head.js-acc-trigger::after {
        right: calc(2.6388888889vw + 2.5em);
        font-size: calc(18 / var(--design-width) * 100vw);
    }
}
.is-open .c-cassette-1__head.js-acc-trigger::after {
    content: "閉じる";
}

.c-cassette-1__body {
    padding-block: 40px 60px;
    padding-inline: 20px;
    border: 2px solid var(--color-base-1);
    border-top: none;
    border-radius: 0 0 4px 4px;
}
@media screen and (max-width: 767px) {
    .c-cassette-1__body {
        padding: calc(20 / var(--design-width) * 100vw) calc(11 / var(--design-width) * 100vw) calc(21 / var(--design-width) * 100vw);
        border-radius: 0 0 calc(4 / var(--design-width) * 100vw) calc(4 / var(--design-width) * 100vw);
        border-width: calc(2 / var(--design-width) * 100vw);
    }
}
.c-cassette-1__body-inner {
    max-width: 642px;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-cassette-1__body-inner {
        max-width: none;
    }
}

/* ---------------------------------------------
*   c-cassette-discount
--------------------------------------------- */
.c-cassette-discount + .c-cassette-discount {
    position: relative;
    margin-top: 61px;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount + .c-cassette-discount {
        margin-top: calc(60 / var(--design-width) * 100vw);
    }
}
.c-cassette-discount + .c-cassette-discount::before, .c-cassette-discount + .c-cassette-discount::after {
    content: "";
    position: absolute;
    left: 50%;
    top: -33px;
    display: block;
    width: 30px;
    height: 4px;
    background-color: var(--color-white-1);
    transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
    .c-cassette-discount + .c-cassette-discount::before, .c-cassette-discount + .c-cassette-discount::after {
        top: calc(-33 / var(--design-width) * 100vw);
        width: calc(30 / var(--design-width) * 100vw);
        height: calc(4 / var(--design-width) * 100vw);
    }
}
.c-cassette-discount + .c-cassette-discount::after {
    transform: translateX(-50%) rotate(90deg);
}
.c-cassette-discount__head {
    padding: 12px 2.5em 14px;
    background-color: var(--color-white-2);
    border-radius: 4px 4px 0 0;
    text-align: center;
    display: block;
    color: var(--color-red-1);
    font-size: 22px;
    font-weight: bold;
    line-height: 1.5454545455;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__head {
        padding: calc(13 / var(--design-width) * 100vw);
        border-radius: calc(4 / var(--design-width) * 100vw) calc(4 / var(--design-width) * 100vw) 0 0;
        font-size: calc(28 / var(--design-width) * 100vw);
        line-height: 1.2142857143;
    }
}
.c-cassette-discount__ttl {
    position: relative;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
}
.c-cassette-discount__ttl sup {
    position: absolute;
    top: -0.5em;
    right: -2.1em;
    color: var(--color-base-1);
    font-size: 12px;
    font-weight: 300;
    line-height: 2.8333333333;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__ttl sup {
        top: 0em;
        right: -1.9em;
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
    }
}
.c-cassette-discount__body {
    border-radius: 0 0 4px 4px;
    background-color: var(--color-white-1);
    padding: 13px 30px 23px;
    color: var(--color-base-1);
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__body {
        border-radius: 0 0 calc(4 / var(--design-width) * 100vw) calc(4 / var(--design-width) * 100vw);
        padding: calc(14 / var(--design-width) * 100vw) calc(13 / var(--design-width) * 100vw) calc(19 / var(--design-width) * 100vw);
    }
}
.c-cassette-discount__body--dcard {
    padding: 26px 17px;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__body--dcard {
        padding: calc(26 / var(--design-width) * 100vw) 0;
    }
}
.c-cassette-discount__list-wrap {
    padding-left: calc(127 / 612 * 100%);
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__list-wrap {
        padding-inline: calc(24 / var(--design-width) * 100vw);
    }
}
.c-cassette-discount__list-wrap--wide {
    padding-left: calc(153 / 612 * 100%);
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__list-wrap--wide {
        padding-left: calc(105 / var(--design-width) * 100vw);
    }
}
.c-cassette-discount__list {
    max-width: 412px;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__list {
        max-width: none;
    }
}
.c-cassette-discount__list--dcard {
    max-width: none;
}
.c-cassette-discount__list--dcard .c-cassette-discount__item {
    justify-content: flex-start;
    gap: 24px;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__list--dcard .c-cassette-discount__item {
        gap: calc(4 / var(--design-width) * 100vw);
    }
}
.c-cassette-discount__list--dcard .c-cassette-discount__dt {
    width: calc(256 / 608 * 100%);
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__list--dcard .c-cassette-discount__dt {
        width: calc(256 / var(--design-width) * 100vw);
    }
    .edge .c-cassette-discount__list--dcard .c-cassette-discount__dt {
        width: calc(250 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 767px) {
    .edge .c-cassette-discount__list--dcard .c-cassette-discount__sst {
        width: 2.6em;
    }
}
.c-cassette-discount__list--dcard + .c-cassette-discount__list--dcard {
    padding-top: 18px;
    margin-top: 19px;
    background-image: repeating-linear-gradient(90deg, #707070, #707070 3px, transparent 3px, transparent 9px);
    background-position: left top;
    background-repeat: repeat-x;
    background-size: 100% 1px;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__list--dcard + .c-cassette-discount__list--dcard {
        padding-top: calc(16 / var(--design-width) * 100vw);
        margin-top: calc(17 / var(--design-width) * 100vw);
        background-image: repeating-linear-gradient(90deg, #707070, #707070 calc(3 / var(--design-width) * 100vw), transparent calc(3 / var(--design-width) * 100vw), transparent calc(9 / var(--design-width) * 100vw));
    }
}
.c-cassette-discount__item {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}
.c-cassette-discount__item + .c-cassette-discount__item {
    margin-top: 6px;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__item + .c-cassette-discount__item {
        margin-top: calc(5 / var(--design-width) * 100vw);
    }
}
.c-cassette-discount__dt {
    width: 5.3em;
    flex-shrink: 0;
    font-size: 20px;
    line-height: 1.7;
    white-space: nowrap;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__dt {
        font-size: calc(26 / var(--design-width) * 100vw);
        line-height: 1.3076923077;
        width: 5.6em;
    }
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__desc {
        transform: translateY(-6%);
    }
}
.c-cassette-discount__sst {
    display: inline-block;
    font-size: 30px;
    font-weight: bold;
    line-height: 1.1333333333;
    width: 3em;
    flex-shrink: 0;
    white-space: nowrap;
    text-align: right;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__sst {
        font-size: calc(34 / var(--design-width) * 100vw);
        line-height: 1;
    }
}
.c-cassette-discount__small {
    display: inline-block;
    font-size: 16px;
    font-weight: bold;
    line-height: 2.125;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__small {
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
    }
}
.c-cassette-discount__lv1-list {
    width: 100%;
}
.c-cassette-discount__lv1-list-item {
    border-radius: 4px;
    background-color: var(--color-white-2);
    width: 100%;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2px 5px 4px;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__lv1-list-item {
        border-radius: calc(4 / var(--design-width) * 100vw);
        padding: calc(7 / var(--design-width) * 100vw);
    }
}
.c-cassette-discount__lv1-list-item + .c-cassette-discount__lv1-list-item {
    margin-top: 4px;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__lv1-list-item + .c-cassette-discount__lv1-list-item {
        margin-top: calc(8 / var(--design-width) * 100vw);
    }
}
.c-cassette-discount__lead {
    position: relative;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
    font-size: 22px;
    line-height: 1.4545454545;
    text-align: center;
    margin-top: 16px;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__lead {
        font-size: calc(26 / var(--design-width) * 100vw);
        line-height: 1.3846153846;
        margin-top: calc(30 / var(--design-width) * 100vw);
    }
}
.c-cassette-discount__lead sup {
    position: absolute;
    top: 2.5em;
    right: -1.8em;
    color: var(--color-base-1);
    font-size: 12px;
    font-weight: 300;
    line-height: 2.8333333333;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__lead sup {
        top: 1.5em;
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
    }
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__lead ~ .c-btn-1 {
        width: calc(584 / var(--design-width) * 100vw);
        margin-inline: auto;
    }
}
.c-cassette-discount__bold {
    font-weight: bold;
}
.c-cassette-discount__x-small {
    display: inline-block;
    font-size: 16px;
    line-height: 2;
}
@media screen and (max-width: 767px) {
    .c-cassette-discount__x-small {
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
    }
}

/* ---------------------------------------------
*   c-figure
--------------------------------------------- */
/* ---------------------------------------------
*   c-form
--------------------------------------------- */
/* ---------------------------------------------
*   c-img
--------------------------------------------- */
/* ---------------------------------------------
*   c-kv
--------------------------------------------- */
/* ---------------------------------------------
*   c-link
--------------------------------------------- */
/* ---------------------------------------------
*   c-list-ast
--------------------------------------------- */
.c-list-ast__item {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.7rem;
    font-size: 12px;
    font-weight: 300;
    line-height: 1.6666666667;
}
@media screen and (max-width: 767px) {
    .c-list-ast__item {
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
    }
}
.c-list-ast__item--bold {
    font-weight: bold;
    gap: 0.4rem;
}
.c-list-ast__item--red {
    color: #cc0033;
}
.c-list-ast__item--center {
    justify-content: center;
}
.c-list-ast__item--center .c-list-ast__txt {
    text-align: left;
}
.c-list-ast__symble, .c-list-ast__lv1-list-symble {
    flex-shrink: 0;
}
.c-list-ast__symble--2em, .c-list-ast__lv1-list-symble--2em {
    width: 2em;
}
.c-list-ast__lv1-list-item {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.7rem;
}
.c-list-ast a {
    display: inline-block;
    color: var(--color-blue-1);
    text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
    .c-list-ast a:hover {
        text-decoration: none;
    }
}
.c-list-ast a[target=_blank] {
    position: relative;
    width: -moz-fit-content;
    width: fit-content;
    padding-right: 20px;
}
.c-list-ast a[target=_blank]::after {
    content: "";
    position: absolute;
    top: 53%;
    right: 3px;
    display: block;
    width: 13px;
    aspect-ratio: 18/12;
    -webkit-mask: url(../img/icon_outlink-3.svg) center center no-repeat;
            mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    -webkit-mask-size: 100% auto;
            mask-size: 100% auto;
    background-color: var(--color-blue-1);
    transform: translateY(-50%);
}
.c-list-ast--m3 {
    margin-top: 3px;
}
@media screen and (max-width: 767px) {
    .c-list-ast--m3 {
        margin-top: calc(9 / var(--design-width) * 100vw);
    }
}
.c-list-ast--m5 {
    margin-top: 5px;
}
@media screen and (max-width: 767px) {
    .c-list-ast--m5 {
        margin-top: calc(9 / var(--design-width) * 100vw);
    }
}

/*  c-list-ast-wrap
--------------------------------------------- */
.c-list-ast-wrap {
    position: relative;
    z-index: 1;
    padding: 5px 10px;
    border: 3px solid var(--color-gray-1);
    background-color: var(--color-white-1);
    margin-top: -12px;
    color: var(--color-base-1);
}
@media screen and (max-width: 767px) {
    .c-list-ast-wrap {
        padding: calc(5 / var(--design-width) * 100vw) calc(10 / var(--design-width) * 100vw);
        border-width: calc(6 / var(--design-width) * 100vw);
        margin-top: calc(-10 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-dl-howto
--------------------------------------------- */
.c-dl-howto {
    display: block;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-block: 0 50px;
}
@media screen and (max-width: 767px) {
    .c-dl-howto {
        grid-template-columns: repeat(1, 1fr);
        gap: calc(52 / var(--design-width) * 100vw);
        width: calc(559 / var(--design-width) * 100vw);
        margin-inline: auto;
        margin-block: 0 calc(60 / var(--design-width) * 100vw);
    }
}
.c-dl-howto__term {
    display: block;
    font-size: 24px;
    font-weight: bold;
    line-height: 1.4166666667;
    text-align: center;
    margin-bottom: 40px;
}
.c-dl-howto__term {
    display: block;
    font-size: 24px;
    font-weight: bold;
    line-height: 1.4166666667;
    text-align: center;
    margin-bottom: 40px;
}

.c-dl-howto__bottom-txt {
    padding-block: 0 37px;
    display: block;
    font-size: 34px;
    font-weight: bold;
    line-height: 1.5555555556;
    background: url(../img/img_intro_border.png) center bottom no-repeat;
    background-size: 100% 20px;
    text-align: center;
    margin-inline: auto;
    width: -moz-fit-content;
    width: fit-content;
}
@media screen and (max-width: 767px) {
    .c-dl-howto__term {
        font-size: calc(26 / var(--design-width) * 100vw);
    }
    .c-dl-howto__bottom-txt {
        padding-block: 0 calc(37 / var(--design-width) * 100vw);
        font-size: calc(46 / var(--design-width) * 100vw);
        background: url(../img/img_intro_border.png) 1vw bottom no-repeat;
        background-size: 97% calc(20 / var(--design-width) * 100vw);
    }
}
.c-dl-howto__desc {
    margin-top: 31px;
}
@media screen and (max-width: 767px) {
    .c-dl-howto__desc {
        margin-top: calc(27 / var(--design-width) * 100vw);
    }
}
.c-dl-howto__desc .c-btn-1 + .c-btn-1 {
    margin-top: 17px;
}
@media screen and (max-width: 767px) {
    .c-dl-howto__desc .c-btn-1 + .c-btn-1 {
        margin-top: calc(18 / var(--design-width) * 100vw);
    }
}
@media screen and (min-width: 768px) {
    .edge .c-dl-howto__desc .c-btn-1 {
        white-space: nowrap;
    }
}

/*  c-dl-howto-wrap
--------------------------------------------- */
.c-dl-howto-wrap {
    max-width: 860px;
    margin-inline: auto;
}

/* ---------------------------------------------
*   c-list-banner
--------------------------------------------- */
.c-list-banner {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
@media screen and (max-width: 767px) {
    .c-list-banner {
        display: block;
    }
}
.c-list-banner__item {
    flex-shrink: 0;
    display: block;
    width: calc((100% - 16px) / 2);
    aspect-ratio: 308/110;
    max-width: 400px;
}
@media screen and (max-width: 767px) {
    .c-list-banner__item {
        width: 100%;
        max-width: none;
        margin-top: calc(20 / var(--design-width) * 100vw);
    }
}
.c-list-banner__link {
    display: block;
    width: 100%;
    height: 100%;
}
.c-list-banner__link img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
@media (hover: hover) and (pointer: fine) {
    .c-list-banner__link {
        transition: opacity var(--hover-duration);
    }
    .c-list-banner__link:hover {
        opacity: var(--hover-opacity-ratio);
    }
}

/* ---------------------------------------------
*   c-dl-detail
--------------------------------------------- */
.c-dl-detail__item + .c-dl-detail__item {
    margin-top: 30px;
}
@media screen and (max-width: 767px) {
    .c-dl-detail__item + .c-dl-detail__item {
        margin-top: calc(40 / var(--design-width) * 100vw);
    }
}
.c-dl-detail__term {
    padding: 15px 15px 13px;
    display: block;
    font-size: 22px;
    font-weight: bold;
    line-height: 1.5454545455;
    text-align: center;
    border-radius: 4px;
    background-color: var(--color-yellow-3);
}
@media screen and (max-width: 767px) {
    .c-dl-detail__term {
        padding: calc(10 / var(--design-width) * 100vw);
        font-size: calc(28 / var(--design-width) * 100vw);
        border-radius: calc(4 / var(--design-width) * 100vw);
    }
}
.c-dl-detail__term-txt {
    position: relative;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
}
.c-dl-detail__term-txt sup {
    position: absolute;
    top: 0.3em;
    right: -2em;
    font-size: 12px;
    font-weight: 300;
}
@media screen and (max-width: 767px) {
    .c-dl-detail__term-txt sup {
        top: 0;
        font-size: calc(24 / var(--design-width) * 100vw);
    }
}
.c-dl-detail__desc {
    margin-top: 24px;
}
@media screen and (max-width: 767px) {
    .c-dl-detail__desc {
        margin-top: calc(22 / var(--design-width) * 100vw);
    }
}
.c-dl-detail__table {
    display: block;
    width: 100%;
}
.c-dl-detail__table img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.c-dl-detail__lead {
    display: block;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.7;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-dl-detail__lead {
        font-size: calc(24 / var(--design-width) * 100vw);
    }
}
.c-dl-detail__lead-note {
    position: relative;
    display: block;
    font-size: 16px;
    line-height: 2.125;
    text-align: center;
    margin-top: -3px;
}
@media screen and (max-width: 767px) {
    .c-dl-detail__lead-note {
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
        margin-top: calc(-4 / var(--design-width) * 100vw);
    }
}
.c-dl-detail__lead-note sup {
    font-size: 12px;
    font-weight: 300;
    display: inline-block;
    margin-inline: 4px;
}
@media screen and (max-width: 767px) {
    .c-dl-detail__lead-note sup {
        font-size: calc(24 / var(--design-width) * 100vw);
        margin-inline: 0px;
        transform: translateY(22%);
    }
}
.c-dl-detail__plus {
    position: relative;
    display: block;
    width: 30px;
    aspect-ratio: 1/1;
    margin: 36px auto -1px;
}
@media screen and (max-width: 767px) {
    .c-dl-detail__plus {
        width: calc(30 / var(--design-width) * 100vw);
        margin: calc(26 / var(--design-width) * 100vw) auto 0;
    }
}
.c-dl-detail__plus::before, .c-dl-detail__plus::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    display: block;
    width: 100%;
    height: 4px;
    background-color: var(--color-red-1);
    transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
    .c-dl-detail__plus::before, .c-dl-detail__plus::after {
        width: calc(30 / var(--design-width) * 100vw);
        height: calc(4 / var(--design-width) * 100vw);
    }
}
.c-dl-detail__plus::after {
    transform: translateX(-50%) rotate(90deg);
}
.c-dl-detail__kangen {
    display: block;
    width: 100%;
}
.c-dl-detail__kangen img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.c-dl-detail__btn {
    margin-top: 20px;
    margin-inline: auto;
    max-width: 598px;
}
@media screen and (max-width: 767px) {
    .c-dl-detail__btn {
        max-width: none;
        width: calc(585 / var(--design-width) * 100vw);
        margin-top: calc(27 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   .c-dl-howto__balloon
--------------------------------------------- */
.c-dl-howto__balloon {
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 7px 10px;
    min-width: 220px;
    max-width: 100%;
    color: #1078FF;
    background: #ffffff;
    border-radius: 8px;
    z-index: 90;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.2);
}

.c-dl-howto__balloon::before {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -12px;
    border: 12px solid transparent;
    border-top: 20px solid #fff;
    z-index: 1;
}

.c-dl-howto__balloon::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -10px;
    border: 10px solid transparent;
    border-top: 18px solid #ffffff;
    z-index: 2;
    margin-top: -2px;
}

.c-dl-howto__balloon p {
    margin: 0;
    padding: 0;
    font-weight: bold;
    font-size: 20px;
    line-height: 1.2;
    text-align: center;
}

@media screen and (max-width: 767px) {
    .c-dl-howto__balloon {
        top: calc(0 / var(--design-width) * 100vw);
        padding: calc(20 / var(--design-width) * 100vw) calc(25 / var(--design-width) * 100vw);
        min-width: 130px;
        transform: translateX(-50%);
    }

    .c-dl-howto__balloon::before {
        margin-left: calc(-15 / var(--design-width) * 100vw);
        border-width: calc(15 / var(--design-width) * 100vw) calc(15 / var(--design-width) * 100vw) 0;
        border-top: calc(25 / var(--design-width) * 100vw) solid #fff;
    }

    .c-dl-howto__balloon::after {
        margin-left: calc(-12 / var(--design-width) * 100vw);
        border-width: calc(12 / var(--design-width) * 100vw) calc(12 / var(--design-width) * 100vw) 0;
        border-top: calc(22 / var(--design-width) * 100vw) solid #fff;
        margin-top: calc(-2 / var(--design-width) * 100vw);
    }

    .c-dl-howto__balloon p {
        font-size: calc(30 / var(--design-width) * 100vw);
    }
}


/* ---------------------------------------------
*   .c-dl-1
--------------------------------------------- */
.c-dl-1 {
    font-size: 12px;
    font-weight: 300;
    line-height: 1.6666666667;
}
@media screen and (max-width: 767px) {
    .c-dl-1 {
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
    }
}
.c-dl-1 a {
    display: inline-block;
    color: var(--color-blue-1);
    text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
    .c-dl-1 a:hover {
        text-decoration: none;
    }
}
.c-dl-1 a[target=_blank] {
    position: relative;
    width: -moz-fit-content;
    width: fit-content;
    padding-right: 20px;
}
.c-dl-1 a[target=_blank]::after {
    content: "";
    position: absolute;
    top: 53%;
    right: 3px;
    display: block;
    width: 13px;
    aspect-ratio: 18/12;
    -webkit-mask: url(../img/icon_outlink-3.svg) center center no-repeat;
            mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    -webkit-mask-size: 100% auto;
            mask-size: 100% auto;
    background-color: var(--color-blue-1);
    transform: translateY(-50%);
}
.c-dl-1__term {
    font-weight: bold;
}
.c-dl-1__item + .c-dl-1__item {
    margin-top: 1rem;
}

/* ---------------------------------------------
*   c-section-plan
--------------------------------------------- */
.c-section-plan {
    padding-block: 0;
    display: block;
    background-image: url(../img/plan_bg.png);
    background-size: 100%;
}
@media screen and (max-width: 767px) {
    .c-section-plan {
        padding-block: 0 ;
    }
}
.c-section-plan__body {
    margin-top: 51px;
}
@media screen and (max-width: 767px) {
    .c-section-plan__body {
        margin-top: calc(48 / var(--design-width) * 100vw);
    }
}
.c-section-plan__foot {
    margin-top: 30px;
}
@media screen and (max-width: 767px) {
    .c-section-plan__foot {
        margin-top: calc(50 / var(--design-width) * 100vw);
    }
}
.intro_bg02 {
    padding-bottom: 37px;
}
@media screen and (max-width: 767px) {
    .intro_bg02 {
        padding-bottom: calc(60 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-section-feature
--------------------------------------------- */
.c-section-feature {
    padding-block: 0;
    display: block;
    background-color: #0A0909;
}
@media screen and (max-width: 767px) {
    .c-section-feature {
    }
}
@media screen and (max-width: 767px) {
    .c-section-feature__head {
        overflow: hidden;
        box-shadow: 0px -10px 15px 0px #dddddd
    }
}
.c-section-feature__body {
    margin-top: 62px;
}
@media screen and (max-width: 767px) {
    .c-section-feature__body {
        margin-top: calc(62 / var(--design-width) * 100vw);
    }
}
.c-section-feature__foot {
    margin-top: 60px;
}
@media screen and (max-width: 767px) {
    .c-section-feature__foot {
        margin-top: calc(43 / var(--design-width) * 100vw);
    }
}

.feature_font {
    background: top left / 1em .5em repeat-x radial-gradient(circle, #cc0033 .1em, rgba(0, 0, 0, 0) .1em);
    padding-top: 0.2em;
    color: #cc0033;
}

/* ---------------------------------------------
*   c-section-howto
--------------------------------------------- */
.c-section-howto {
    padding-block: 0 120px;
    display: block;
    color: #ffffff;
}
@media screen and (max-width: 767px) {
    .c-section-howto {
        padding-block: 0 calc(32 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 767px) {
    .c-section-howto__head {
        overflow: hidden;
    }
}
.c-section-howto__body {
    margin-top: 90px;
}
@media screen and (max-width: 767px) {
    .c-section-howto__body {
        margin-top: calc(40 / var(--design-width) * 100vw);
    }
}
.c-section-howto__foot {
    margin-top: 50px;
}
@media screen and (max-width: 767px) {
    .c-section-howto__foot {
        margin-top: calc(60 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-section-contact
--------------------------------------------- */
.c-section-contact {
    padding-block: 0 77px;
    display: block;
}
@media screen and (max-width: 767px) {
    .c-section-contact {
    }
}
@media screen and (max-width: 767px) {
}
.c-section-contact__body {
    padding-inline: calc(var(--contents-side-padding) * 1px);
    margin-top: 50px;
}
@media screen and (max-width: 767px) {
    .c-section-contact__body {
        padding-inline: calc(var(--contents-side-padding) / var(--design-width) * 100vw);
        margin-top: calc(60 / var(--design-width) * 100vw);
    }
}
.c-section-contact__bg-wh {
    /* background-color: var(--color-white-1); */
    border-radius: 10px;
    padding: 40px 20px 25px;
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-section-contact__bg-wh {
        border-radius: calc(10 / var(--design-width) * 100vw);
        padding: calc(40 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw) calc(39 / var(--design-width) * 100vw);
        max-width: none;
    }
}
.c-section-contact__foot {
    margin-top: 75px;
}
@media screen and (max-width: 767px) {
    .c-section-contact__foot {
        margin-top: calc(100 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-section-detail
--------------------------------------------- */
.c-section-detail {
    color: var(--color-base-1);
    border-radius: 4px;
    border: 2px solid var(--color-yellow-4);
}
@media screen and (max-width: 767px) {
    .c-section-detail {
        border-radius: calc(4 / var(--design-width) * 100vw);
        border-width: calc(2 / var(--design-width) * 100vw);
    }
}
.c-section-detail__top {
    padding: 18px;
    background-color: var(--color-black-3);
    border-radius: 4px 4px 0 0;
}
@media screen and (max-width: 767px) {
    .c-section-detail__top {
        padding: calc(27 / var(--design-width) * 100vw);
        border-radius: calc(4 / var(--design-width) * 100vw) calc(4 / var(--design-width) * 100vw) 0 0;
    }
}
.c-section-detail__point {
    padding: 2px 7px 3px;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    color: var(--color-white-1);
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    margin-inline: auto;
    background-color: var(--color-red-1);
}
@media screen and (max-width: 767px) {
    .c-section-detail__point {
        padding: calc(2 / var(--design-width) * 100vw) calc(7 / var(--design-width) * 100vw) calc(3 / var(--design-width) * 100vw);
        font-size: calc(26 / var(--design-width) * 100vw);
    }
}
.c-section-detail__top-ttl {
    margin-top: 4px;
    display: block;
    text-align: center;
    color: var(--color-white-1);
    font-size: 25px;
    font-weight: bold;
    line-height: 1.36;
}
@media screen and (max-width: 767px) {
    .c-section-detail__top-ttl {
        margin-top: calc(10 / var(--design-width) * 100vw);
        font-size: calc(28 / var(--design-width) * 100vw);
    }
}
.c-section-detail__head {
    padding: 15px 17px 24px;
    background-color: var(--color-yellow-3);
}
@media screen and (max-width: 767px) {
    .c-section-detail__head {
        padding: calc(10 / var(--design-width) * 100vw) calc(12 / var(--design-width) * 100vw) calc(22 / var(--design-width) * 100vw);
    }
}
.c-section-detail__ttl {
    display: block;
    text-align: center;
    font-size: 25px;
    font-weight: bold;
    line-height: 1.36;
    margin-top: 11px;
}
@media screen and (max-width: 767px) {
    .c-section-detail__ttl {
        font-size: calc(28 / var(--design-width) * 100vw);
        line-height: 1.2142857143;
        margin-top: calc(16 / var(--design-width) * 100vw);
    }
}
.c-section-detail__caption {
    display: block;
    max-width: 586px;
    width: 100%;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-section-detail__caption {
        max-width: none;
        width: calc(556 / var(--design-width) * 100vw);
    }
}
.c-section-detail__lead {
    display: block;
    width: 100%;
    margin-inline: auto;
    margin-top: 10px;
}
.c-section-detail__lead img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
@media screen and (max-width: 767px) {
    .c-section-detail__lead {
        position: relative;
        left: 50%;
        width: 106%;
        margin-top: calc(18 / var(--design-width) * 100vw);
        transform: translateX(-50%);
    }
}
.c-section-detail__wh-txt {
    padding: 3px 5px 5px;
    display: block;
    border-radius: 4px;
    max-width: 502px;
    margin-inline: auto;
    text-align: center;
    background-color: var(--color-white-1);
    font-size: 20px;
    font-weight: 600;
    margin-top: 9px;
}
@media screen and (max-width: 767px) {
    .c-section-detail__wh-txt {
        border-radius: calc(4 / var(--design-width) * 100vw);
        padding: calc(3 / var(--design-width) * 100vw) calc(3 / var(--design-width) * 100vw) calc(3 / var(--design-width) * 100vw);
        max-width: none;
        width: calc(502 / var(--design-width) * 100vw);
        font-size: calc(26 / var(--design-width) * 100vw);
        line-height: 1.3846153846;
        margin-top: calc(15 / var(--design-width) * 100vw);
    }
}
.c-section-detail__body {
    padding: 21px 17px 31px;
    border-radius: 0 0 2px 2px;
    background-color: var(--color-white-1);
}
@media screen and (max-width: 767px) {
    .c-section-detail__body {
        padding: calc(22 / var(--design-width) * 100vw) calc(12 / var(--design-width) * 100vw) calc(43 / var(--design-width) * 100vw);
        border-radius: 0 0 calc(2 / var(--design-width) * 100vw) calc(2 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-slider-mv
--------------------------------------------- */
.c-slider-mv {
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
    padding-block: 0;
}
section.c-slider-mv {
    background-color: #1d1d1d;
}
@media screen and (max-width: 767px) {
    .c-slider-mv {
        padding-block: 0 ;
    }
}
.c-slider-mv.is-single {
    visibility: visible;
    padding-block: 0;
}
.c-slider-mv.is-single .splide__list {
    display: block;
}
.c-slider-mv.is-single .splide__arrows {
    display: none;
}
.c-slider-mv__wrapper {
    position: relative;
}
.c-slider-mv .splide__arrow {
    --arrow-pos-x: 20px;
    position: absolute;
    top: 50%;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 36px;
    height: 56px;
    background: url(../img/icon_arrow.png) 0 0 no-repeat;
    background-size: 100% auto;
    touch-action: manipulation;
    cursor: pointer;
}
@media (hover: hover) and (pointer: fine) {
    .c-slider-mv .splide__arrow {
        transition: opacity var(--hover-duration);
    }
    .c-slider-mv .splide__arrow:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
.c-slider-mv .splide__arrow--prev {
    left: var(--arrow-pos-x);
    transform: translateY(-50%);
}
.c-slider-mv .splide__arrow--next {
    right: var(--arrow-pos-x);
    transform: translateY(-50%) rotate(180deg);
}
.c-slider-mv .splide__arrow::before {
    content: none;
}
.c-slider-mv .splide__pagination {
    bottom: auto;
    margin-top: 18px;
    gap: 26px;
}
.c-slider-mv .splide__pagination li {
    font-size: 0;
}
.c-slider-mv .splide__pagination__page {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    touch-action: manipulation;
    cursor: pointer;
    background-color: #ccc;
    margin: 0;
    transform: none;
}
@media (hover: hover) and (pointer: fine) {
    .c-slider-mv .splide__pagination__page {
        transition: opacity var(--hover-duration);
    }
    .c-slider-mv .splide__pagination__page:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
.c-slider-mv .splide__pagination__page.is-active {
    background-color: var(--color-white-1);

}
.c-slider-mv a {
    display: block;
    width: 100%;
    height: 100%;
}
@media (hover: hover) and (pointer: fine) {
    .c-slider-mv a {
        transition: opacity var(--hover-duration);
    }
    .c-slider-mv a:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
.c-slider-mv__img {
    display: block;
}
@media screen and (max-width: 767px) {
    .c-slider-mv__img {
    }
}
.c-slider-mv__img img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    vertical-align: bottom;
}

/*  .c-slider-sp
--------------------------------------------- */
.c-slider-sp {
    padding-inline: calc(var(--contents-side-padding) * 1px);
    max-width: calc(var(--contents-width) * 1px + var(--contents-side-padding) * 2px);
    margin-inline: auto;
    margin-top: 36px;
}
@media screen and (max-width: 767px) {
    .c-slider-sp {
        padding-inline: calc(calc(var(--contents-side-padding) * 2) / var(--design-width) * 100vw);
        max-width: none;
        margin-top: calc(27 / var(--design-width) * 100vw);
    }
}
.c-slider-sp.is-single {
    visibility: visible;
    padding-block: 0;
}
.c-slider-sp.is-single .splide__list {
    display: block;
}
.c-slider-sp.is-single .splide__arrows {
    display: none;
}
@media screen and (max-width: 767px) {
    .c-slider-sp--other .c-slider-sp__img {
        aspect-ratio: 622/431;
    }
}
@media screen and (min-width: 768px) {
    .c-slider-sp:not(.is-initialized.is-active) .splide__list {
        display: flex;
        justify-content: center;
        align-items: stretch;
        gap: 20px;
    }
    .c-slider-sp:not(.is-initialized.is-active) .splide__slide {
        /* width: calc((100% - 60px) / 4); */
        width: 72%;
    }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
    .c-slider-sp:not(.is-initialized.is-active) .splide__slide {
        width: calc((100% - 20px) / 2);
    }
}
.c-slider-sp__wrapper {
    position: relative;
}
.c-slider-sp .splide__arrow {
    --arrow-pos-x: -25;
    position: absolute;
    top: 50%;
    z-index: 1;
    display: grid;
    place-items: center;
    width: calc(48 / var(--design-width) * 100vw);
    height: calc(48 / var(--design-width) * 100vw);
    border: none;
    box-sizing: border-box;
    touch-action: manipulation;
    cursor: pointer;
    overflow: hidden;
    background: url(../img/btn_pager.png) center center no-repeat;
    background-size: contain;
    opacity: 1;
}
@media (hover: hover) and (pointer: fine) {
    .c-slider-sp .splide__arrow {
        transition: opacity var(--hover-duration);
    }
    .c-slider-sp .splide__arrow:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
.c-slider-sp .splide__arrow img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.c-slider-sp .splide__arrow--prev {
    left: calc(var(--arrow-pos-x) / var(--design-width) * 100vw);
    transform: translateY(-50%);
}
.c-slider-sp .splide__arrow--next {
    right: calc(var(--arrow-pos-x) / var(--design-width) * 100vw);
    transform: translateY(-50%) rotate(180deg);
}
.c-slider-sp .splide__arrow::before {
    content: none;
    width: 20px;
    height: 20px;
    margin-left: -9px;
    border-top: 3px solid #000;
    border-right: 3px solid #000;
    box-sizing: border-box;
    transform: rotate(45deg);
}
.c-slider-sp .splide__pagination {
    display: none;
}
.c-slider-sp a {
    display: block;
    width: 100%;
    height: 100%;
}
@media (hover: hover) and (pointer: fine) {
    .c-slider-sp a {
        transition: opacity var(--hover-duration);
    }
    .c-slider-sp a:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
.c-slider-sp__img img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
@media screen and (max-width: 767px) {
    .c-slider-sp__img {
        aspect-ratio: 621/395;
    }
}
.c-slider-sp__txt {
    color: var(--color-white-1);
    display: block;
    text-align: center;
    margin-top: 5px;
    font-size: 18px;
    font-weight: bold;
}
@media screen and (max-width: 767px) {
    .c-slider-sp__txt {
        font-size: calc(28 / var(--design-width) * 100vw);
        margin-top: calc(10 / var(--design-width) * 100vw);
    }
}

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

/* ---------------------------------------------
*   Sample HTML
--------------------------------------------- */
/*  c-tab-selector
--------------------------------------------- */
.c-tab-selector {
    position: relative;
    display: flex;
    justify-content: center;
    gap: 6px;
}
@media screen and (max-width: 767px) {
    .c-tab-selector {
        gap: calc(10 / var(--design-width) * 100vw);
    }
}
.c-tab-selector::before {
    content: "";
    position: absolute;
    bottom: -16px;
    left: 0;
    display: block;
    width: 100%;
    height: 14px;
    background: linear-gradient(1800deg, rgba(0, 0, 0, 0) 0%, #000 100%);
    opacity: 0.2;
    z-index: 1;
}
@media screen and (max-width: 767px) {
    .c-tab-selector::before {
        bottom: calc(-16 / var(--design-width) * 100vw);
        height: calc(14 / var(--design-width) * 100vw);
    }
}
.c-tab-selector__item {
    width: 100%;
}
.c-tab-selector__trigger {
    position: relative;
    width: 100%;
    padding: 18px 18px 16px;
    background-color: var(--color-base-1);
    color: var(--color-white-1);
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
    transition: 0.3s;
    border-radius: 4px 4px 0 0;
    border: 2px solid var(--color-white-1);
    border-bottom: none;
}
@media screen and (max-width: 767px) {
    .c-tab-selector__trigger {
        padding: calc(40 / var(--design-width) * 100vw) calc(5 / var(--design-width) * 100vw) calc(38 / var(--design-width) * 100vw);
        font-size: calc(28 / var(--design-width) * 100vw);
        border-radius: calc(4 / var(--design-width) * 100vw) calc(4 / var(--design-width) * 100vw) 0 0;
        border-width: calc(2 / var(--design-width) * 100vw);
    }
}
@media (hover: hover) and (pointer: fine) {
    .c-tab-selector__trigger:hover {
        opacity: 0.7;
    }
}
.c-tab-selector__trigger.is-current {
    background-color: var(--color-white-1);
    color: var(--color-base-1);
    pointer-events: none;
}

/*  c-tab-contents
--------------------------------------------- */
.c-tab-contents__inner {
    padding-inline: calc(var(--contents-side-padding) * 1px);
    background-color: #fff;
}
@media screen and (max-width: 767px) {
    .c-tab-contents__inner {
        padding-inline: calc(14 / var(--design-width) * 100vw);
    }
}

/*  c-tab-contents-wrapper
--------------------------------------------- */
.c-tab-contents-wrapper {
    border-radius: 0 0 4px 4px;
    border: 2px solid var(--color-base-1);
    padding-block: 0 60px;
    margin-block: 0 60px;
    background-color: #ffffff;
    border-top: none;
}
@media screen and (max-width: 767px) {
    .c-tab-contents-wrapper {
        border-radius: 0 0 calc(4 / var(--design-width) * 100vw) calc(4 / var(--design-width) * 100vw);
        border-width: calc(2 / var(--design-width) * 100vw);
        padding-block: 0 calc(60 / var(--design-width) * 100vw);
        margin-block: 0 calc(50 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-table-1
--------------------------------------------- */
.c-table-1 {
    width: 100%;
    table-layout: fixed;
    border-top: 1px solid var(--color-gray-2);
    margin-top: 14px;
}
@media screen and (max-width: 767px) {
    .c-table-1 {
        margin-top: calc(27 / var(--design-width) * 100vw);
    }
}
.c-table-1 th, .c-table-1 td {
    border-bottom: 1px solid var(--color-gray-2);
}
.c-table-1 th {
    padding: 9px 7px;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.375;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-table-1 th {
        padding: calc(6 / var(--design-width) * 100vw);
        font-size: calc(24 / var(--design-width) * 100vw);
        line-height: 1.3333333333;
    }
}
.c-table-1 td {
    padding: 15px 7px;
}
@media screen and (max-width: 767px) {
    .c-table-1 td {
        padding: calc(20 / var(--design-width) * 100vw) calc(3 / var(--design-width) * 100vw) calc(19 / var(--design-width) * 100vw);
    }
}
.c-table-1 tr th:first-of-type,
.c-table-1 tr td:first-of-type {
    border-right: 1px solid var(--color-gray-2);
    width: calc(354 / 608 * 100%);
}
@media screen and (max-width: 767px) {
    .c-table-1 tr th:first-of-type,
    .c-table-1 tr td:first-of-type {
        width: calc(338 / 576 * 100%);
    }
}
.c-table-1__st {
    display: block;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.3333333333;
}
@media screen and (max-width: 767px) {
    .c-table-1__st {
        font-size: calc(26 / var(--design-width) * 100vw);
    }
}
.c-table-1__txt {
    display: block;
    font-size: 16px;
    line-height: 1.5;
    margin-top: 9px;
}
@media screen and (max-width: 767px) {
    .c-table-1__txt {
        font-size: calc(24 / var(--design-width) * 100vw);
        margin-top: calc(5 / var(--design-width) * 100vw);
    }
}
.c-table-1__num {
    position: relative;
    display: block;
    color: var(--color-red-1);
    font-size: 34px;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    width: 3em;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-table-1__num {
        font-size: calc(34 / var(--design-width) * 100vw);
    }
}
.c-table-1__num sup {
    position: absolute;
    top: 0.15em;
    right: -1.25em;
    color: var(--color-base-1);
    font-size: 12px;
    font-weight: 300;
}
@media screen and (max-width: 767px) {
    .c-table-1__num sup {
        top: -0.15em;
        right: -1.65em;
        font-size: calc(24 / var(--design-width) * 100vw);
    }
}
.c-table-1__num-unit {
    position: relative;
    top: -2px;
    display: inline-block;
    font-size: 24px;
    line-height: 1.4166666667;
    margin-left: 4px;
}
@media screen and (max-width: 767px) {
    .c-table-1__num-unit {
        top: calc(-2 / var(--design-width) * 100vw);
        font-size: calc(24 / var(--design-width) * 100vw);
        margin-left: calc(4 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-heading
--------------------------------------------- */
.c-heading {
    position: relative;
    padding-block: 22px 12px;
    background-color: var(--color-white-1);
}
.c-section-plan__head .arrow {
    width: 0;
    height: 0;
    margin-top: -1px;
    border-style: solid;
    border-right: 320px solid transparent;
    border-left: 320px solid transparent;
    border-top: 60px solid #ffffff;
    border-bottom: 0;
}
@media screen and (max-width: 767px) {
    .c-heading {
        padding-block: calc(28 / var(--design-width) * 100vw) calc(16 / var(--design-width) * 100vw);
    }
    .c-section-plan__head .arrow {
        border-right: 50vw solid transparent;
        border-left: 50vw solid transparent;
        border-top: 7vw solid #ffffff;
    }
}
.c-heading--tab {
    padding-block: 64px 52px;
}
@media screen and (max-width: 767px) {
    .c-heading--tab {
        padding-block: calc(59 / var(--design-width) * 100vw) calc(52 / var(--design-width) * 100vw);
        height: calc(194 / var(--design-width) * 100vw);
    }
}
.c-heading--tab::before {
    border-right: 78.3333333333vw solid transparent;
}
@media screen and (max-width: 767px) {
    .c-heading--tab::before {
        border-bottom: 4.7222222222vw solid var(--color-yellow-2);
        border-right: 93.0555555556vw solid transparent;
    }
}
.c-heading--tab::after {
    border-left: 78.3333333333vw solid transparent;
    z-index: 1;
}
@media screen and (max-width: 767px) {
    .c-heading--tab::after {
        border-bottom: 4.7222222222vw solid var(--color-base-1);
        border-left: 93.0555555556vw solid transparent;
    }
}
.c-heading--docomo::before {
    border-bottom: 2.8333333333vw solid var(--color-brown-1);
}
@media screen and (max-width: 767px) {
    .c-heading--docomo::before {
        border-bottom: 4.7222222222vw solid var(--color-brown-1);
    }
}
.c-heading__ttl {
    display: block;
    text-align: center;
    font-size: 32px;
    font-weight: bold;
    color: var(--color-base-1);
}
@media screen and (max-width: 767px) {
    .c-heading__ttl {
        font-size: calc(46 / var(--design-width) * 100vw);
    }
}
.c-heading__ttl-st {
    color: var(--color-red-1);
}
.c-heading__logo-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 25px;
    margin-block: 0 14px;
}
@media screen and (max-width: 767px) {
    .c-heading__logo-wrap {
        justify-content: space-between;
        gap: calc(20 / var(--design-width) * 100vw);
        margin-block: 0;
    }
}
.c-heading__logo {
    display: block;
    flex-shrink: 0;
}
.c-heading__logo img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
@media screen and (max-width: 767px) {
    .c-heading__logo {
        margin-block: 0 calc(25 / var(--design-width) * 100vw);
    }
}
.c-heading__logo--docomo {
    width: 240px;
}
@media screen and (max-width: 767px) {
    .c-heading__logo--docomo {
        width: calc(264 / var(--design-width) * 100vw);
    }
}
.c-heading__logo--docomo-l {
    width: 291px;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-heading__logo--docomo-l {
        width: calc(291 / var(--design-width) * 100vw);
    }
}
.c-heading__logo--poikatsu {
    width: 344px;
}
@media screen and (max-width: 767px) {
    .c-heading__logo--poikatsu {
        width: calc(378 / var(--design-width) * 100vw);
    }
}
.c-heading__logo--poikatsu-l {
    width: 418px;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-heading__logo--poikatsu-l {
        width: calc(418 / var(--design-width) * 100vw);
    }
}
.c-heading--white {
    padding-top: 64px;
}
@media screen and (max-width: 767px) {
    .c-heading--white {
        padding-block: calc(54 / var(--design-width) * 100vw);
        height: calc(200 / var(--design-width) * 100vw);
    }
}
.c-heading--feature {
    padding-top: 47px;
    line-height: 1.3125;
}
@media screen and (max-width: 767px) {
    .c-heading--feature {
        padding-block: calc(64 / var(--design-width) * 100vw);
        line-height: 1.2173913043;
        height: calc(261 / var(--design-width) * 100vw);
    }
}


.c-cassette-1__body .c-list-ast a {
    color: var(--color-blue-1);
    text-decoration: underline;
}
.c-cassette-1__body .c-list-ast a:after {
    background-color: var(--color-blue-1);
}

/* 0901週 */
.img_plan_01_0829 {
    position: relative;
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
    padding-inline: calc(var(--contents-side-padding) * 1px);
    overflow: hidden;
    padding-bottom: calc(var(--contents-side-padding) * 1px);
}
.img_plan_01_0829 h2 {
    position: absolute;
    width: 91.455%;
    text-align: center;
    top: min(1.7vw,16px);
    color: var(--color-white-1);
    z-index: 2;
    font-size: min(5.176vw,49px);
}
.img_plan_01_0829 h2 span {
    font-size: 1.5em;
    font-weight: bold;
}
.img_plan_01_0829 img {
    width: 100%;
    filter: drop-shadow(0px 0px 5px rgba(160, 160, 160, 0.7));
}
@media screen and (max-width: 767px) {
    .img_plan_01_0829 {
        max-width: none;
        padding-inline: calc(var(--contents-side-padding) / var(--design-width) * 100vw);
    }
}
.c-block-intro__txt02 {
    display: block;
    font-size: 36px;
    font-weight: bold;
    line-height: 1.5555555556;
    text-align: center;
    margin-inline: auto;
    width: -moz-fit-content;
    width: fit-content;
}
.fc-Y {
    color: var(--color-yellow-1) !important;
}
a.fc-Y {
    text-decoration: underline !important;
}
.fc-W {
    color: var(--color-white) !important;
}
.fc-R {
    color: var(--color-red) !important;
}
.c-block-intro__txt02 .fs-S {
    font-size: 0.8em;
}

.c-block-intro__txt03 {
    position: relative;
    padding-block: 0 37px;
    display: block;
    font-size: 36px;
    font-weight: bold;
    line-height: 1.0;
    text-align: center;
    margin-inline: auto;
    width: -moz-fit-content;
    width: fit-content;
}

.c-block-intro__txt03::before, .c-block-intro__txt03::after {
    content: "";
    position: absolute;
    top: 14px;
    display: block;
    width: 2px;
    height: 50px;
    background-color: var(--color-white-1);
}
.c-block-intro__txt03::before {
    left: -15px;
    transform: rotate(-33deg);
    transform-origin: bottom left;
}
.c-block-intro__txt03::after {
    right: -10px;
    transform: rotate(33deg);
    transform-origin: bottom left;
}

.c-block-intro__txt03>span::before, .c-block-intro__txt03>span::after {
    content: "";
    position: absolute;
    top: 35px;
    display: block;
    width: 2px;
    height: 28px;
    background-color: var(--color-white-1);
}
.c-block-intro__txt03>span::before {
    left: -35px;
    transform: rotate(-52deg);
    transform-origin: bottom left;
}
.c-block-intro__txt03>span::after {
    right: -30px;
    transform: rotate(52deg);
    transform-origin: bottom left;
}
.c-block-intro__txt03>span .fs-L {
    font-size: 1.8em;
}

@media screen and (max-width: 767px) {
    .c-block-intro__txt02 {
        font-size: calc(46 / var(--design-width) * 100vw);
    }
    .c-block-intro__txt03 {
        padding-block: 0 calc(37 / var(--design-width) * 100vw);
        font-size: calc(46 / var(--design-width) * 100vw);
    }
    .c-block-intro__txt03::before, .c-block-intro__txt03::after {
        top: calc(10 / var(--design-width) * 100vw);
        width: calc(3 / var(--design-width) * 100vw);
        height: calc(70 / var(--design-width) * 100vw);
    }
    .c-block-intro__txt03>span::before, .c-block-intro__txt03>span::after {
        top: calc(46 / var(--design-width) * 100vw);
        width: calc(3 / var(--design-width) * 100vw);
        height: calc(32 / var(--design-width) * 100vw);
    }
}

    
.c-block-intro__ttl02 {
    display: flex;
    justify-content: space-between;
    position: relative;
    max-width: calc(var(--contents-width) * 1px + var(--contents-side-padding) * 2px);
    margin-inline: auto;
    padding-inline: calc(var(--contents-side-padding) * 1px);
    overflow: hidden;
    padding-bottom: 10px;
}
.c-block-intro__ttl02 li {
    width: 48%;
}
.c-block-intro__ttl02 li img {
    width: 100%;
}

    
.c-tab-selector {
    align-items: flex-end;
}
.c-tab-selector__trigger {
    position: relative;
    width: 100%;
    padding: 18px 18px 16px;
    background-color: #6b6b6b;
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
    transition: 0.3s;
    border-radius: 8px 8px 0 0;
    border: none;
}
.c-tab-selector::before {
    display: none;
}
.c-tab-selector__trigger.is-current {
    background-color: var(--color-white-1);
    padding: 27px 18px 24px;
    border: 2px solid #000000;
    border-bottom: none;
}
@media screen and (max-width: 767px) {
    .c-tab-selector__trigger.is-current {
        padding: calc(40 / var(--design-width) * 100vw) calc(5 / var(--design-width) * 100vw) calc(38 / var(--design-width) * 100vw);
        font-size: calc(28 / var(--design-width) * 100vw);
        border-radius: calc(8 / var(--design-width) * 100vw) calc(8 / var(--design-width) * 100vw) 0 0;
        border-width: calc(2 / var(--design-width) * 100vw);
    }
}

.c-tab-contents__inner02 {
    background-color: var(--color-white-1);
    padding-inline: calc(var(--contents-side-padding) * 1px);
    padding-bottom: calc(var(--contents-side-padding) * 1px);
    padding-top: calc(var(--contents-side-padding) * 1px);
    margin-bottom: 0;
}

.c-tab-contents__img01 {
    padding: 10px 0;
}
.c-tab-contents__img01 img {
    width: 100%;
}

.c-tab-contents__txt {
    color: var(--color-black-1);
    padding: 20px calc(var(--contents-side-padding) * 1px);
    font-size: 16px;
}

@media screen and (max-width: 767px) {
    .c-tab-contents__img01 {
        padding: calc(10 / var(--design-width) * 100vw) 0;
    }
    .c-tab-contents__txt {
        padding: calc(20 / var(--design-width) * 100vw) calc(var(--contents-side-padding) * 1px);
        font-size: calc(24 / var(--design-width) * 100vw);
    }

}


.c-cassette-1__head.js-acc-trigger03 {
    position: relative;
    width: 100%;
    color: var(--color-white-1);
    cursor: pointer;
}


@media (hover: hover) and (pointer: fine) {
    .c-cassette-1__head.js-acc-trigger03 {
        transition: opacity var(--hover-duration);
    }
    .c-cassette-1__head.js-acc-trigger03:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
.c-cassette-1__head.js-acc-trigger03::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 22px;
    display: block;
    width: 30px;
    aspect-ratio: 1/1;
    background: url(../img/icon_toggle.png) 0 0 no-repeat;
    background-size: 100% auto;
    transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
    .c-cassette-1__head.js-acc-trigger03::before {
        right: calc(19 / var(--design-width) * 100vw);
        width: calc(36 / var(--design-width) * 100vw);
    }
}
.is-open .c-cassette-1__head.js-acc-trigger03::before {
    background: url(../img/icon_toggle_close.png) 0 0 no-repeat;
    background-size: 100% auto;
}

.c-cassette-1__head.js-acc-trigger03::after {
    content: "開く";
    position: absolute;
    top: 50%;
    right: calc(22px + 3em);
    display: block;
    font-size: 12px;
    font-weight: 300;
    transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
    .c-cassette-1__head.js-acc-trigger03::after {
        right: calc(2.6388888889vw + 2.5em);
        font-size: calc(18 / var(--design-width) * 100vw);
    }
}
.is-open .c-cassette-1__head.js-acc-trigger03::after {
    content: "閉じる";
}

.qa-indent {
    padding-left: 1.0em;
    text-indent: -1.0em;
}
@media screen and (max-width: 767px) {
    .js-acc-trigger03 .c-cassette-1__ttl {
        padding-right: calc(95 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   .js-acc-target03
--------------------------------------------- */
.js-acc-target03 {
    --acc-body-height: 0px;
    height: 0;
    overflow: hidden;
}
.js-acc-scope03.is-close .js-acc-target03 {
    animation: closeAccAnim 0.5s forwards;
}

.js-acc-scope03.is-open .js-acc-target03 {
    animation: openAccAnim 0.5s forwards;
}

.js-acc-target03 .c-cassette-1__body  {
    color: var(--color-black-1);
    background-color: var(--color-white-1);
}

@keyframes openAccAnim {
    0% {
        height: 0px;
        visibility: hidden;
    }
    99% {
        height: var(--acc-body-height);
        visibility: visible;
    }
    100% {
        height: auto;
    }
}
@keyframes closeAccAnim {
    0% {
        height: var(--acc-body-height);
    }
    99% {
        visibility: visible;
    }
    100% {
        height: 0px;
        visibility: hidden;
    }
}

@media print and (min-width: 768px), screen and (min-width: 768px) {
    .pc-hide {
        display: none !important;
    }
}
@media print and (max-width: 767px), screen and (max-width: 767px) {
    .sp-hide {
        display: none !important;
    }
}



/* 250905 */
.txtRed{
    color: #cc0033;
}
.txtWhite{
    color: #ffffff;
}
.txtBlack{
    color: #000000;
}
.fsXS {
    font-size: 0.75em;
}
sup.fsXS{
    font-size: 0.35em;
}
@media screen and (max-width: 767px) {
    sup.fsXS{
        font-size: 0.45em;
    }
}
.no_boxshadow{
    box-shadow: none;
}

.c-section-qa .c-cassette-1__head {
    /* padding: 11px 22px;
    border-radius: 4px;
    border: 2px solid var(--color-base-1);
    font-size: 18px;
    line-height: 1.8888888889;
    text-align: center; */
    background-color: var(--color-white-1);
}


/* フローティングバナーのスタイル */
.floating-banner {
    display: none;
    position: fixed;
    bottom: 25%;
    right: 50px;
    width: 200px;
    height: 200px;
    z-index: 1000;
    visibility: visible;
    overflow: visible;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.25);
}

/* バナー画像 */
.banner-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

/* バナーリンク */
.cv_u29 {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    text-decoration: none;
}

.close-button {
    position: absolute;
    top: -45px;
    right: -10px;
    text-align: right;
    line-height: 0;
    margin-bottom: 2px;
    z-index: 9999;
}

.close-button>img {
    max-width: 40px;
    cursor: pointer;
    margin: 0 6px;
    transition: opacity 0.3s ease;
}

.close-button>img:hover {
    opacity: 0.8;
}

/* レスポンシブデザイン - スマートフォン表示 */
@media screen and (max-width: 768px) {
    .floating-banner {
        width: 130px;
        height: 130px;
        right: 25px;
        bottom: 25%;
    }

    .close-button {
        top: -35px;
        right: -8px;
    }

    .close-button>img {
        max-width: 30px;
    }
}

@media screen and (max-width: 480px) {
    .floating-banner {
        right: 20px;
        bottom: 23%;
    }
}

/* タブレット表示 */
@media screen and (min-width: 769px) and (max-width: 1024px) {
    .floating-banner {
        right: 30px;
    }
}

/* 大画面表示 */
@media screen and (min-width: 1400px) {
    .floating-banner {
        right: 30px;
    }
}

/* 非表示状態 */
.floating-banner.hidden {
    display: none !important;
}

.c-section-contact__bnr {
    margin-top: var(--spacing-xs);
}

.c-section-contact__bnr img {
    width: 100%;
}

.card-grid.grid2 {
    margin-top: var(--spacing-xs);
}

.c-list-ast.ast02 .c-list-ast__txt a {
    color: var(--color-yellow);
}
.c-list-ast.ast02 .c-list-ast__txt a::after {
    background-color: var(--color-yellow);
}

@media print and (min-width: 768px), screen and (min-width: 768px) {

    .card-grid.grid2 {
        margin-top: var(--spacing-md);
    }
    .c-section-contact__bnr {
        margin-top: var(--spacing-md);
    }

}

.c-dl-howto__desc {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    max-width: 415px;
    margin: 0 auto;
}
.c-dl-howto__symble {
    color: var(--color-black);
    font-size: 60%;
    vertical-align: top;
}

/* eSIMとは？リンクスタイル */
.esim-link {
    color: var(--color-blue);
    text-decoration: underline;
    cursor: pointer;
}

.esim-link:hover {
    color: var(--color-blue);
}


/* モーダルスタイル */
.modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
}

.modal-overlay.show {
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-content {
    background: white;
    border-radius: 8px;
    max-width: 600px;
    max-height: 80vh;
    width: 90%;
    overflow-y: auto;
    position: relative;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}

.modal-header {
    padding: 20px 20px 10px;
    border-bottom: 1px solid #e5e7eb;
}

.modal-title {
    font-size: 20px;
    font-weight: bold;
    margin: 0;
    color: #333;
}

.modal-close {
    position: absolute;
    top: 10px;
    right: 5px;
    background: none;
    border: none;
    cursor: pointer;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.modal-close img {
    max-width: 40px;
    transition: opacity 0.3s ease;
}

.modal-close:hover img {
    opacity: 0.8;
}

.modal-body {
    padding: 20px;
    color: #333;
}

.modal-body p {
    margin-bottom: 15px;
    line-height: 1.6;
}

/* レスポンシブ */
@media (max-width: 768px) {
    .modal-content {
        width: 95%;
        margin: 10px;
    }

    .modal-close {
        top: 10px;
        right: 5px;
    }

    .modal-close img {
        max-width: 30px;
    }
}

.c-btn-1.lemino {
    color: var(--color-black-1);
    background-color: var(--color-white-1);
    width: 40%;
    padding: 8px 20px;
    font-size: 14px;
    margin-left: auto;
    box-shadow: none;
}

.c-btn-1.lemino::after {
    top: 50%;
    right: 15px;
    width: 20px;
    background: url(../img/icon_outlink-3.svg) 0 0 no-repeat;
}
@media screen and (max-width: 767px) {
    .c-btn-1.lemino {
        color: var(--color-black-1);
        background-color: var(--color-white-1);
        width: 90%;
        padding: calc(24 / var(--design-width) * 100vw) calc(60 / var(--design-width) * 100vw);
        font-size: calc(24 / var(--design-width) * 100vw);
        margin: 0 auto;
    }
    .c-btn-1.lemino::after {
        top: 50%;
        right: calc(32 / var(--design-width) * 100vw);
        width: calc(40 / var(--design-width) * 100vw);
    }
}

.link_y {
    color: var(--color-yellow) !important;
}
.plan-card02{
    min-height: inherit;
}
.pad-5p{
    padding: 2% 5%;
    font-size: 14px;
}
.c-dl-1 a[target=_blank].link_y::after{
    background-color: var(--color-yellow) !important;

}
@media screen and (max-width: 767px) {
    .pad-5p{
        padding: 5% 5%;
        font-size: 12px;
    }
}

/* 20251121追加 */
.c-banner_new {
        position: fixed;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        z-index: 100;
        width: 100%;
        background-color: rgba(255, 255, 255, 0.8);
    } /* フローティングバナーのレイアウト調整 */
.c-banner_new
.c-banner__list {
        display: flex;
        flex-wrap: wrap;
        gap: 2px;
        padding: 0;
        margin: 0;
        list-style: none;
        max-width: 100%;
    } /* 上段の2つのボタン（新規/乗り換え、プラン変更） */
.c-banner_new
.c-banner__item:nth-child(1),
.c-banner_new
.c-banner__item:nth-child(2) {
        flex: 1;
        min-width: 0;
    } /* 下段の店舗ボタン */
.c-banner_new
.c-banner__item:nth-child(3) {
        flex: 0 0 100%;
        width: 100%;
    }
.c-banner_new
.c-banner__link {
        position: relative;
        padding: 14px 20px 14px;
        display: grid;
        place-items: center;
        font-size: 18px;
        font-weight: bold;
        line-height: 1.5555555556;
        border-radius: 0;
        background: linear-gradient(90deg, rgb(204, 0, 51) 0%, rgb(204, 0, 51) 100%);
        width: 100%;
        white-space: nowrap;
        text-align: center;
    }
.c-banner_new
.c-banner__link--blue {
        background: linear-gradient(90deg, rgb(25, 0, 255) 0%, rgb(26, 188, 156) 100%);
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
    } @media screen and (max-width: 767px) {

.c-banner_new
.c-banner__link {
        padding: calc(18 / var(--design-width) * 100vw) calc(5 / var(--design-width) * 100vw) calc(17 / var(--design-width) * 100vw);
        font-size: calc(22 / var(--design-width) * 100vw);
        line-height: 1.4;
        height: 100%;
        /*min-height: 90px;*/
    }
.c-banner_new
.c-submenu {
        left: 5%;
    }
    } /* ▼フローティングボタン吹き出し */
.c-banner__balloon_1,
.c-banner__balloon_2 {
        position: absolute;
        display: inline-block;
        margin: 0;
        padding: 3px 10px;
        min-width: 220px;
        max-width: 100%;
        color: #000000;
        font-size: 18px;
        background: #ffffff;
        border-radius: 35px;
        z-index: 1001;
        transform: translateX(-50%);
        white-space: nowrap;
        box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.2);
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }
.c-banner__balloon_1 {
        top: -40px;
        left: 50%;
        text-align: center;
    }
.c-banner__balloon_1 span{
        color: #1078FF;
        font-weight: bold;
        text-align: center;
    }
.c-banner__balloon_2 {
        top: -20px;
        left: 75%;
    } /* PC表示時：ホバー時にバルーンを非表示 */ @media (hover: hover) and (pointer: fine) {
    .c-banner__item:hover
    .c-banner__balloon_1 {
            opacity: 0;
            visibility: hidden;
        } /* バルーンにホバーした時は表示を維持 */
.c-banner__item
.c-banner__balloon_1:hover {
        opacity: 1 !important;
        visibility: visible !important;
    } /* リンクにホバーした時のみ非表示 */
.c-banner__item
.c-banner__link:hover~.c-banner__balloon_1 {
        opacity: 0;
        visibility: hidden;
    }
    } /* SP表示時：アクティブ時にバルーンを非表示 */ @media screen and (max-width: 767px) {
    .c-banner__item.is-active
    .c-banner__balloon_1 {
            opacity: 0;
            visibility: hidden;
        }
        } /* SP表示時：サブメニューがアクティブ時にバルーンを非表示 */ @media screen and (max-width: 767px) {
    .c-banner__item
    .c-submenu.is-active~.c-banner__balloon_1 {
            opacity: 0;
            visibility: hidden;
        }
        } /* SP表示時：サブメニューがアクティブ時にバルーンを非表示（詳細度を上げる） */ @media screen and (max-width: 767px) {
    .c-banner__item:has(.c-submenu.is-active)
    .c-banner__balloon_1 {
            opacity: 0 !important;
            visibility: hidden !important;
        }
        } /* SP表示時：サブメニューがアクティブ時にバルーンを非表示（フォールバック） */ @media screen and (max-width: 767px) {
    .c-banner__item
    .c-submenu.is-active {
            /* サブメニューがアクティブの時 */
        }
.c-banner__item
.c-submenu.is-active+.c-banner__balloon_1,
.c-banner__item:has(.c-submenu.is-active)
.c-banner__balloon_1 {
        opacity: 0 !important;
        visibility: hidden !important;
    }
    }
.c-banner__balloon_1 p,
.c-banner__balloon_2 p {
        margin: 0;
        padding: 0;
        font-weight: bold;
        font-size: 18px;
        line-height: 1.2;
        text-align: center;
    }
.c-banner__item:first-child {
        position: relative;
    }
.c-submenu__link.cv_sim {
        display: flex;
        align-items: center;
        gap: 20px;
    }
.c-submenu__link.cv_sim span {
        font-size: 0.85em;
        line-height: 1.3;
        color: #1078FF;
        font-weight: bold;
        text-align: center;
    } @media screen and (max-width: 767px) {
    .c-banner__balloon_1 {
            top: calc(-48 / var(--design-width) * 100vw);
            font-size: calc(16 / var(--design-width) * 100vw);
            padding: calc(3 / var(--design-width) * 100vw) calc(15 / var(--design-width) * 100vw);
            min-width: 150px;
        }
.c-banner__balloon_2 {
        top: calc(-24 / var(--design-width) * 100vw);
        font-size: calc(16 / var(--design-width) * 100vw);
        padding: calc(3 / var(--design-width) * 100vw) calc(15 / var(--design-width) * 100vw);
        min-width: 150px;
    }
.c-banner__balloon_1 p,
.c-banner__balloon_2 p {
    font-size: calc(21 / var(--design-width) * 100vw);
    }
}

.c-heading.c-heading--feature {
    height: auto;
}

body.open {
    overflow: hidden;
}


@media screen and (min-width: 1451px) {
    .c-banner_new {
        display: none;
    }
}
.nav_btn_subttl {
    font-size: 22px;
    text-align: center;
    padding-block: 0 26px;
    display: block;
    font-weight: bold;
    line-height: 1.5555555556;
    background: url(../img/img_intro_border.png) center bottom no-repeat;
    background-size: 100% 20px;
    text-align: center;
    margin-inline: auto;
    margin-inline-start: auto;
    margin-inline-end: auto;
    width: -moz-fit-content;
    width: fit-content;
    
}
.header_nav .c-btn-1--white::after {
    background: url(../img/icon_outlink-2.png) center center no-repeat;
    background-size: contain;
}
.header_nav .c-btn-1--white02 {
    background-color: #CC0033;
    border-color: var(--color-base-1);
    color: #ffffff;
    padding: 6px 60px;
    line-height: 1.55;
}
.header_nav .c-btn-1--white02::after {
    background: url(../img/icon_outlink-2.png) center center no-repeat;
    background-size: contain;
}
.nav_btn {
    padding: 20px 50px;
    max-width: 374px;
    margin: 0 auto;
}

.nav_btn_txt01 {
    font-size: 16px;
    padding: 10px;
    text-align: center;
}
.nav_btn_txt02 {
    font-size: 16px;
    padding: 10px;
    text-align: center;
}
.nav_btn_txt02::before {
    content: "＼";
    padding-right: 1em;
}
.nav_btn_txt02::after {
    content: "／";
    padding-left: 1em;
}

@media screen and (min-width: 768px) {
    .nav_btn_flex {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
    }
    .nav_btn_flex .nav_btn {
        padding: 20px 10px;
        margin: 0;
    }
    .nav_btn_flex .nav_btn a {
        font-size: 18px;
    }
    .nav_btn_flex .nav_btn a::after {
        right: 24px;
    }
    .header_nav .c-btn-1--white {
        font-size: 18px;
        padding: 18px 60px;
    }
}
@media screen and (max-width: 767px) {
    .nav_btn_ttl {
        display: flex;
        align-items: center;
        font-size: calc(22 / var(--design-width) * 100vw);
    }
    .nav_btn_subttl {
        font-size: calc(22 / var(--design-width) * 100vw);
        padding-block: 0 calc(26 / var(--design-width) * 100vw);
        background: url(../img/img_intro_border.png) 1vw bottom no-repeat;
        background-size: 93% calc(20 / var(--design-width) * 100vw);
        text-align: center
    }
    .nav_btn {
        max-width: 540px;
        padding: calc(5 / var(--design-width) * 100vw) calc(15 / var(--design-width) * 100vw);
    }
    .header_nav .c-btn-1--white {
      font-size: calc(26 / var(--design-width) * 100vw);
      padding-block: calc(21 / var(--design-width) * 100vw);
    }
    .header_nav .c-btn-1--white02 {
      padding: calc(3 / var(--design-width) * 100vw) calc(60 / var(--design-width) * 100vw) calc(3 / var(--design-width) * 100vw) calc(50 / var(--design-width) * 100vw);
      font-size: calc(26 / var(--design-width) * 100vw);
    }
    .nav_btn_txt01 {
        font-size: calc(16 / var(--design-width) * 100vw);
        padding: calc(10 / var(--design-width) * 100vw);
    }
    .nav_btn_txt02 {
        font-size: calc(16 / var(--design-width) * 100vw);
        padding: calc(10 / var(--design-width) * 100vw);
    }
}


/* 251210追加*/
.c-banner__shopbaloon {
    position: absolute;
    background-color: rgb(255, 255, 255);
    color: #160EE3;
    font-size: 18px;
    padding: calc(5 / var(--design-width) * 100vw) calc(15 / var(--design-width) * 100vw);
    border-radius: calc(10 / var(--design-width) * 100vw);
    left: 33%;
    transform: translateX(-100%);
    margin: 8px 0;
}

.c-banner__shopbaloon span {
    font-size: 18px;
}

@media print and (min-width: 768px) {

    .c-banner__shopbaloon {
        left: 33%;
        transform: translateX(-100%);
        margin: 10px 0;
    }
}

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

    .c-banner_new .c-banner__link {
        padding: calc(18 / var(--design-width) * 100vw) calc(5 / var(--design-width) * 100vw) calc(17 / var(--design-width) * 100vw);
        font-size: calc(22 / var(--design-width) * 100vw);
        line-height: 1.4;
        height: 100%;

    }

    .c-banner_new .c-banner__link--blue {
        font-size: calc(28 / var(--design-width) * 100vw);
    }

    .c-banner__shopbaloon {
        position: absolute;
        background-color: rgb(255, 255, 255);
        color: #160EE3;
        font-size: calc(22 / var(--design-width) * 100vw);
        padding: calc(5 / var(--design-width) * 100vw) calc(15 / var(--design-width) * 100vw);
        border-radius: calc(10 / var(--design-width) * 100vw);
        margin: calc(8 / var(--design-width) * 100vw) 0;
        line-height: 1.0;
        left: 30%;
    }

    .c-banner__shopbaloon span {
        font-size: calc(18 / var(--design-width) * 100vw);
    }

}


/* 251224追加*/
.c-banner__balloon_3 {
    position: absolute;
    display: inline-block;
    margin: 0;
    padding: 3px 10px;
    min-width: 220px;
    max-width: 100%;
    color: #000000;
    font-size: 18px;
    background: #ffffff;
    border-radius: 35px;
    z-index: 1001;
    transform: translateX(-50%);
    white-space: nowrap;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.2);
    transition: opacity 0.3s 
    ease, visibility 0.3s 
    ease;
    top: -40px;
    left: 50%;
    text-align: center;
}
.c-banner__balloon_3 p{
    margin: 0;
    padding: 0;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.2;
    text-align: center;
}
.c-banner__balloon_3 span {
    color: #1078FF;
    font-weight: bold;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-banner__balloon_3 {
        top: calc(-48 / var(--design-width) * 100vw);
        font-size: calc(16 / var(--design-width) * 100vw);
        padding: calc(3 / var(--design-width) * 100vw) calc(15 / var(--design-width) * 100vw);
        min-width: 150px;
    }
    .c-banner__balloon_3 p{
        font-size: calc(21 / var(--design-width) * 100vw);
    }

}
.c-submenu {
    display: none !important;
}
.mymodal{
    position:fixed;
    left:0;
    top:calc(45 / 16 * 1em);
    width:100%;
    height:calc(100dvh - calc(45 / 16 * 1em));
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:999;opacity:0;
    transition:.5s;
    pointer-events:none
}
.mymodal.is-open{opacity: 1;pointer-events:all;}
.mymodal .mymodal-bg{position:absolute;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,0.8)}
.mymodal .mymodal-inner{
    position:relative
}
.mymodal-inner li {
    text-align: center;
    margin-bottom: 5%;
}
.mymodal_img {
    width: 96%;
    margin: 0 auto;
    transform: translateY(10%);
    z-index: 2;
    position: relative;
}
.mymodal_btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 632px;
    padding: 20px 20px;
    margin: 0 auto;
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    border-radius: 18px;
    border: 2px solid #cc0033;
    height: 100%;
    background-color: #ffffff;
    color: #cc0033;
}
.mymodal_btn:after {
    content: "";
    display: block;
    position: absolute;
    right: .75em;
    top: calc(50% - .25em);
    width: .5em;
    height: .5em;
    border-style: solid;
    border-width: 1px 1px 0 0;
    border-color: #cc0033;
    transform: rotate(45deg);
    transition: .3s;
}
.mymodal .mymodal-close-btn{
    display: block;
    position: absolute;
    right: -2.5em;
    top: -0.5em;
    width: 2.5em;
    height: 2.5em;
}
.mymodal .mymodal-close-btn:before,.mymodal .mymodal-close-btn:after{content:"";display:block;position:absolute;left:25%;top:50%;width:50%;border-top:calc(3 / 16 * 1em) solid #fff}
.mymodal .mymodal-close-btn:before{transform:rotate(45deg)}
.mymodal .mymodal-close-btn:after{transform:rotate(-45deg)}
.mymodal.is-show{opacity:1;pointer-events:auto}
@media screen and (max-width: 767px){
    .mymodal .mymodal-inner{
        width:calc(540 / 750 * 100%);
    }
    .mymodal_btn {
        padding: 5% 3.125%;
        font-size: calc(26 / var(--design-width) * 100vw);;
        border-radius: 2vw;
        border: 2px solid #cc0033;
    }
}
@media screen and (max-width: 960px){
    .mymodal{
        top:calc(45 / 16 * 1em);
    }
}

.feature_bg {
    background-image: url(../img/bg_kv.png);
    background-position: top center;
    background-size: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    background-blend-mode: lighten;
}
.plan-ttl {
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
    padding-inline: calc(var(--contents-side-padding) * 1px);
    overflow: hidden;
}
.plan-txt-c {
    font-size: 12px;
    text-align: center;
}
.c-plan-img_01 {
    color: #ffffff;
    margin: 0 auto;
}
.c-plan-img_01 img {
    width: 100%;
}
.c-plan-new>span  {
    display: block;
    width: 50px;
    height: 24px;
    color: #ffffff;
    background-color: #CC0033;
    font-size: 16px;
    text-align: center;
}
.c-cassette-1__head.set02 {
    color: var(--color-base-1);
    background-color: #d7d7d7;
}
.c-cassette-1__body.set02 {
    background-color: var(--color-white);
}
.aco02 .c-cassette-1__head {
    color: #ffffff;
    background-color: #1D1D1D;
    border-color: #ffffff;
    font-weight: bold;
}
.aco02.bnr .c-cassette-1__head.js-acc-trigger::after {
    content: none;
}
.aco02 .c-cassette-1__head.js-acc-trigger::before {
    filter: invert(1);
}
.aco02 .c-cassette-1__body {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #1D1D1D;
}
.plan-bnr a {
    display: block;
    max-width: 620px;
    margin: 0 auto;
}
.fwN {
    font-weight: normal !important;
}
.plan-txt-c02 {
    font-size: 13px;
    text-align: center;
}

.plan-bnr-list li {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
}
.space1 {
    padding-left: 1.0em;
}
.c-choice-img_01 {
    width: 600px;
    margin: 0 auto;
}
.c-choice-img_01 img {
    width: 100%;
}
.c-choice-img_02 {
    width: 600px;
    margin: 0 auto;
}
.c-choice-img_02 img {
    width: 100%;
}
.c-choice-list_01 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 600px;
    margin: 0 auto;
}
.c-choice-list_01 li {
    width: 49%;
    margin-bottom: 2%;
}
.c-choice-list_01 li a {
    display: block;
}
.c-choice-list_01 li img {
    width: 100%;
}

.plan-bnr_txt  {
    text-align: center;
    font-size: 24px;
}
.plan-bnr_txt::before {
    content: "＼";
    padding-right: 1em;
}
.plan-bnr_txt::after {
    content: "／";
    padding-left: 1em;
}
.plan-txt02  {
    text-align: center;
    font-size: 24px;
}

.plan-bnr_txt.txt02 {
	font-size: 18px;
}

@media screen and (max-width: 767px) {
    .feature_bg {
        background-image: url(../img/sp/bg_kv.png);
    }
    .plan-txt-c {
        font-size: calc(24 / var(--design-width) * 100vw);
    }
    .c-plan-img_01 {
        width: 100%;
        margin: 0 auto;
    }
    .c-plan-new>span  {
        width: calc(80 / var(--design-width) * 100vw);
        height: calc(34 / var(--design-width) * 100vw);
        font-size: calc(22 / var(--design-width) * 100vw);
        text-align: center;
    }
    .plan-txt-c02 {
        font-size: calc(24 / var(--design-width) * 100vw);
    }
    .plan-bnr-list {
        display: block;
    }
    .plan-bnr-list li {
        width: 87.6045%;
        margin: 0 auto;
    }
    .c-choice-img_01 {
        width: 100%;
        margin: 0 auto;
        padding-inline: calc(var(--contents-side-padding) * 1px);
    }
    .c-choice-img_02 {
        width: 100%;
        margin: 0 auto;
        padding-inline: calc(var(--contents-side-padding) * 3px);
    }
    .c-choice-list_01 {
        width: 100%;
        margin: 0 auto;
        padding-inline: calc(var(--contents-side-padding) * 1px);
    }
    .aco02 .c-cassette-1__body {
        padding: calc(30 / var(--design-width) * 100vw) calc(31 / var(--design-width) * 100vw) calc(41 / var(--design-width) * 100vw);
    }

    .plan-bnr_txt  {
        font-size: calc(22 / var(--design-width) * 100vw);
    }
    .plan-txt02  {
        font-size: calc(24 / var(--design-width) * 100vw);
    }
    .plan-bnr_txt.txt02 {
      font-size: calc(20 / var(--design-width) * 100vw);
    }
}

/* よくある質問 */

.category-select {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.category-select li {
    width: 35%;
    margin: 0 20px;
}
.category-select button {
    color: var(--color-white-1);
    border: 2px solid var(--color-white-1);
    padding: 0.3em 1.0em;
    font-size: 18px;
    width: 100%;
    border-radius: 999px;
    background-color: #1D1D1D;
}
.category-select button.select {
    color: var(--color-white);
    background-color: var(--color-red-1);
}
@media screen and (max-width: 767px){
    .category-select li {
        margin: 0 calc(20 / var(--design-width) * 100vw);
    }
    .category-select button {
        border-width: calc(2 / var(--design-width) * 100vw);
        font-size: calc(24 / var(--design-width) * 100vw);
    }
}

.c-section-qa .show {
    display: block;
}
.c-section-qa .hide {
    display: none;
}

.invisibleTxt {
    display: none;
}


.float-widget {
    display: none;
}
.float-widget__overlay {
    width: 100% !important;
    height: 100% !important;
    background-color: #000 !important;
    opacity: 0.5;
}
.float-widget__wrapper {
    padding: 2px !important;
    max-height: 100% !important;
    overflow-y: auto !important;
    min-width: 0 !important;
    z-index: 21474836479 !important;
    width: 90%;
    max-width: 600px;
}
.st-bar__wrapper {
    position: fixed !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translate(-50%, 0) !important;
    z-index: 21474836479 !important;
}
.float-widget__position-center {
    transform: translate(-50%, -50%) !important;
    top: 50% !important;
    left: 50% !important;
}
.float-widget__position-left {
    left: 20px !important;
}
.float-widget__position-right {
    right: 20px !important;
}
.float-widget__position-bottom {
    bottom: 10px !important;
}
.st-bar__bar-position_bottom {
    bottom: 0px !important;
    left: 50% !important;
    transform: translate(-50%, 0) !important;
}
.float-widget__close {
    text-align: right !important;
    line-height: 0 !important;
    min-width: 0 !important;
    margin-bottom: 2px !important;
}
.float-widget__close img {
    display: inline !important;
    max-width: 40px !important;
    min-width: 0 !important;
    cursor: pointer !important;
    margin: 0 6px !important;
}
.float-widget__close img.float-widget__close-btn--hidden {
    display: none !important;
}
.float-widget__content-wrapper {
    box-sizing: border-box;
    overflow: hidden;
}
.float-widget__link {
    display: inline-block;
    width: 100% !important;
    cursor: pointer !important;
}
.float-widget__link:hover {
    opacity: 0.8 !important;
}
.float-widget__img {
    vertical-align: bottom;
    width: 100% !important;
}
.float-widget__title-content {
    font-size: 18px;
    font-weight: bold;
    margin: 10px 4.5px 5px 5.5px !important;
    word-break: break-all;
    white-space: pre-line;
}
.float-widget__text-content {
    white-space: pre-line;
    font-size: 18px;
    margin: 5px 4.5px 18px 5.5px !important;
    word-break: break-all;
}
.float-widget__button-wrapper {
    width: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    padding: 18px 46px 28px 46px !important;
}
.float-widget__button-wrapper > span {
    width: 50%;
    font-size: 14px;
    display: flex;
    justify-content: center;
    height: initial;
}
.float-widget__button {
    border: 1px solid transparent;
    padding: 6px 0.65em;
    width: 100%;
    height: 100%;
    min-height: 32px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #666;
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(84, 84, 84, 0.5);
    box-sizing: border-box;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    white-space: pre-line;
    cursor: pointer;
    font-size: 24px;
    word-break: break-all;
}
.float-widget__button:hover {
    opacity: 0.8;
}
.float-widget__button > span {
    font-weight: bold;
}
.st-bar__content-wrapper {
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: hidden;
}
.st-bar__content-wrapper .float-widget__title-content {
    word-break: break-all;
    white-space: pre-line;
}
.st-bar__content-wrapper .float-widget__text-content {
    word-break: break-all;
    white-space: pre-line;
}

.intro_bg {
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
    background: #1D1D1D;
}
.intro_bg>div {
    background-image: url(../img/intro_bg.png);
    background-repeat: no-repeat;
    background-position: top;
    background-size: 100%;
    padding-top: 0.1%;
}
.plan_bg {
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
    background: #1D1D1D;
}

.campaign_bg {
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
    background: #1D1D1D;
}
.campaign_bg .c-section-plan {
    background-image: none;
}
.application_bg {
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
    background: #1D1D1D;
}
.faq_bg {
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
    background: #1D1D1D;
}
.faq_bg section {
    background-image: url(../img/application_bg.png);
    background-repeat: no-repeat;
    background-position: top;
    background-size: 100%;
    padding-bottom: 3.125%;
}
.contact_bg {
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
    background: #1D1D1D;
}
.contact_bg .c-section-contact {
    background-image: url(../img/plan_bg.png);
    background-repeat: no-repeat;
    background-position: top;
    background-size: 100%;
    padding-bottom: 3.125%;
}





.plan_select_head {
    display: flex;
    width: 100%;
    align-items: flex-end;
    height: 120px;
}
.plan_select_head li {
    width: 25%;
}
.plan_select_head li:not(:last-child) {
    margin-right: 0.5%;
}
.plan_select_head li button {
    display: flex;
    background-color: #ffffff;
    width: 100%;
    border-radius: 12px 12px 0 0;
    transition: 0.5s;
    justify-content: center;
    align-items: center;
}
.plan_select_head li button img {
    width: 100%;
}
.plan_select_head li:nth-child(1) button {
    padding: 12.75% 10%;
}
.plan_select_head li:nth-child(2) button {
    padding: 13.5% 10%;
}
.plan_select_head li:nth-child(3) button {
    padding: 11.34% 10%;
}
.plan_select_head li:nth-child(4) button {
    padding: 10% 10%;
}
.plan_select_head li:nth-child(1) button.select_plan {
    padding: 20.75% 10%;
    border-bottom: 6px solid #FE694C;
}
.plan_select_head li:nth-child(2) button.select_plan {
    padding: 21.5% 10%;
    border-bottom: 6px solid #CC0033;
}
.plan_select_head li:nth-child(3) button.select_plan {
    padding: 19.34% 10%;
    border-bottom: 6px solid #000000;
}
.plan_select_head li:nth-child(4) button.select_plan {
    padding: 18% 10%;
    border-bottom: 6px solid #1D428A;
}
.plan_select_head li:nth-child(3) button img {
    width: 25%;
}
.plan_select_head li:nth-child(4) button img {
    width: 70%;
}


.plan_select_head li button.select {
    height: 120%;
}

.plan_select_body li {
    display: none;
    padding: 4.125%;
}
.plan_select_body li.select_body {
    display: block;
}
.lemino_body {
    background: linear-gradient(0, #000000, #FE694C);
}
.danime_body {
    background: linear-gradient(0, #000000, #CC0033);
}
.dazn_body {
    background: linear-gradient(0, #000000, #000000);
    padding-bottom: 5.435% !important;
}
.nba_body {
    background: linear-gradient(0, #000000, #1D428A);
    padding-bottom: 15.657% !important;
}
.lemino_body .img02 {
    width: 94%;
    margin: 0 auto;
}
.lemino_body .img03 {
    overflow-x: scroll;
}
.lemino_body .img03 img {
    max-width: none;
    width: 220%;
}
.lemino_body .img04 {
    text-align: center;
    width: 93%;
    margin: 0 auto;
}
.lemino_body .txt01 span {
    padding-right: 1.0em;
}
.lemino_body .txt02 {
    text-align: center;
    width: 75%;
    font-size: 28px;
    border-bottom: 4px solid #CA1855;
    padding-bottom: 10px;
    margin: 0 auto;
    font-weight: 500;
}
.danime_body p:nth-child(2) {
    text-align: center;
}
.dazn_body p:nth-child(2) {
    text-align: center;
}
.nba_body p:nth-child(2) {
    text-align: center;
}
.plan_select_body li a {
    position: relative;
    color: #ffffff;
    text-decoration: underline;
    padding-right: 40px;
    font-size: 24px;
}
.plan_select_body li a::after {
    content: "";
    position: absolute;
    top: 53%;
    right: 3px;
    display: block;
    width: 24px;
    aspect-ratio: 18 / 12;
    -webkit-mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    -webkit-mask-size: 100% auto;
    mask-size: 100% auto;
    background-color: var(--color-white);
    transform: translateY(-50%);
}

.special-bnr_txt {
    text-align: center;
    font-size: 24px;
    color: #ffffff;
}
.special-bnr_txt::before {
    content: "＼";
    padding-right: 1em;
}
.special-bnr_txt::after {
    content: "／";
    padding-left: 1em;
}
@media screen and (max-width: 767px){
    .plan_select_head {
        height: 15vw;
    }
    .plan_select_head li button {
        border-radius: 2vw 2vw 0 0;
    }
    .plan_select_head li:nth-child(1) button.select_plan {
        border-bottom: 1vw solid #FE694C;
    }
    .plan_select_head li:nth-child(2) button.select_plan {
        border-bottom: 1vw solid #CC0033;
    }
    .plan_select_head li:nth-child(3) button.select_plan {
        border-bottom: 1vw solid #000000;
    }
    .plan_select_head li:nth-child(4) button.select_plan {
        border-bottom: 1vw solid #1D428A;
    }
    .plan_select_body li a {
        padding-right: 6vw;
        font-size: 4vw;
    }
    .plan_select_body li a::after {
        right: 3px;
        width: 4vw;
    }

    .special-bnr_txt {
        font-size: calc(32 / var(--design-width) * 100vw);
    }
    .campaign_bg .c-section-plan {
        padding-bottom: calc(32 / var(--design-width) * 100vw);
    }
    .lemino_body .txt01 {
        font-size: 0.75em;
    }
    .lemino_body .txt02 {
        font-size: calc(28 / var(--design-width) * 100vw);
        border-bottom: calc(4 / var(--design-width) * 100vw) solid #CA1855;
        padding-bottom: calc(10 / var(--design-width) * 100vw);
    }
    .lemino_body .txt03 {
        font-size: calc(24 / var(--design-width) * 100vw);
    }

}



.c-tab-contents__img02 {
    padding: 20px 0;
}
@media screen and (max-width: 767px) {
    .c-tab-contents__img02 {
        padding: calc(20 / var(--design-width) * 100vw) 0;
    }
}
.c-cassette-2 {
    text-align: center;
}

.c-cassette-2__head {
    max-width: 600px;
    margin: 0 auto;
    padding: 11px 22px;
    border-radius: 4px;
    border: 3px solid var(--color-base-1);
    font-size: 18px;
    line-height: 1.8888888889;
    text-align: center;
    background-color: var(--color-yellow-3);
    border-radius: 9vw;
    font-size: 32px;
    font-weight: bold;
}
@media screen and (max-width: 767px) {
    .c-cassette-2__head {
        padding: calc(21 / var(--design-width) * 100vw) calc(19 / var(--design-width) * 100vw);
        border-width: calc(4 / var(--design-width) * 100vw);
        font-size: calc(32 / var(--design-width) * 100vw);
        line-height: 1.4166666667;
        border-radius: 9vw;
    }
}
.c-cassette-2__head.js-acc-trigger04 {
    position: relative;
    width: 100%;
    color: var(--color-base-1);
    cursor: pointer;
}
@media (hover: hover) and (pointer: fine) {
    .c-cassette-2__head.js-acc-trigger04 {
        transition: opacity var(--hover-duration);
    }
    .c-cassette-2__head.js-acc-trigger04:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
.c-cassette-2__head.js-acc-trigger04::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 22px;
    display: block;
    width: 30px;
    aspect-ratio: 1/1;
    background: url(../img/icon_toggle.png) 0 0 no-repeat;
    background-size: 100% auto;
    transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
    .c-cassette-2__head.js-acc-trigger04::before {
        right: calc(19 / var(--design-width) * 100vw);
        width: calc(36 / var(--design-width) * 100vw);
    }
}
.is-open .c-cassette-2__head.js-acc-trigger04::before {
    background: url(../img/icon_toggle_close.png) 0 0 no-repeat;
    background-size: 100% auto;
}

.c-cassette-2__head.js-acc-trigger04::after {
    position: absolute;
    top: 50%;
    right: calc(22px + 3em);
    display: block;
    font-size: 12px;
    font-weight: 300;
    transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
    .c-cassette-2__head.js-acc-trigger04::after {
        right: calc(2.6388888889vw + 2.5em);
        font-size: calc(18 / var(--design-width) * 100vw);
    }
}

.c-cassette-2__body {
    text-align: left;
}
/* ---------------------------------------------
*   .js-acc-target04
--------------------------------------------- */
.js-acc-target04 {
    --acc-body-height: 0px;
    height: 0;
    overflow: hidden;
}
.js-acc-scope04.is-close .js-acc-target04 {
    animation: closeAccAnim 0.5s forwards;
}

.js-acc-scope04.is-open .js-acc-target04 {
    animation: openAccAnim 0.5s forwards;
}

@keyframes openAccAnim {
    0% {
        height: 0px;
        visibility: hidden;
    }
    99% {
        height: var(--acc-body-height);
        visibility: visible;
    }
    100% {
        height: auto;
    }
}
@keyframes closeAccAnim {
    0% {
        height: var(--acc-body-height);
    }
    99% {
        visibility: visible;
    }
    100% {
        height: 0px;
        visibility: hidden;
    }
}




.c-section-qa .c-cassette-1__body .c-list-ast a {
    color: var(--color-yellow);
    text-decoration: underline;
}
.c-section-qa .c-cassette-1__body .c-list-ast a:after {
    background-color: var(--color-yellow);
}

.intro_bg02 .c-cassette-1__body .c-list-ast a {
    color: var(--color-yellow);
    text-decoration: underline;
}
.intro_bg02 .c-cassette-1__body .c-list-ast a:after {
    background-color: var(--color-yellow);
}

.pickup_bg {
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
    background: #1D1D1D;
}
.pickup_bg>div {
    background-image: url(../img/plan_bg.png);
    background-repeat: no-repeat;
    background-position: top;
    background-size: 100%;
}

.pickup_ttl {
    color: var(--color-white);
    font-size: 24px;
    border-bottom: 2px solid var(--color-yellow);
    padding-bottom: 0.3em;
    width: 42%;
    margin: 0 auto;
    text-align: center;
    font-weight: bold;
}
@media screen and (max-width: 767px) {
    .pickup_ttl {
        color: var(--color-white);
        text-align: center;
        font-size: calc(24 / var(--design-width) * 100vw);
        width: 36%;
    }
}


/* ---------------------------------------------
*   c-box-feature
--------------------------------------------- */
.c-box-feature {
    color: var(--color-white);
    margin-inline: auto;
    overflow: hidden;
}
@media screen and (max-width: 767px) {
    .c-box-feature {
        max-width: none;
        padding-inline: 0;
    }
}
.c-box-feature__inner-bg {
    padding: 24px 20px 44px;
    background: url(../img/bg_feature.png) center center no-repeat;
    background-size: cover;
}
@media screen and (max-width: 767px) {
    .c-box-feature__inner-bg {
        padding: calc(57 / var(--design-width) * 100vw) calc(61 / var(--design-width) * 100vw) calc(62 / var(--design-width) * 100vw);
        background: url(../img/sp/bg_feature.png) center center no-repeat;
        background-size: cover;
    }
}
.c-box-feature__inner {
    max-width: 598px;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-box-feature__inner {
        max-width: none;
    }
}
.c-box-feature__lead {
    display: block;
    font-size: 22px;
    font-weight: bold;
    line-height: 1.5454545455;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-box-feature__lead {
        font-size: calc(26 / var(--design-width) * 100vw);
        line-height: 1.3076923077;
    }
}
.c-box-feature__txt-bg {
    position: relative;
    padding: 6px 5px 7px;
    display: block;
    width: calc(100% - 60px);
    color: var(--color-base-1);
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    margin-inline: auto;
    background-color: var(--color-yellow-1);
    margin-top: 18px;
}
@media screen and (max-width: 767px) {
    .c-box-feature__txt-bg {
        padding: 0 calc(26 / var(--design-width) * 100vw);
        width: -moz-fit-content;
        width: fit-content;
        font-size: calc(38 / var(--design-width) * 100vw);
        margin-top: calc(24 / var(--design-width) * 100vw);
    }
}
.c-box-feature__txt-bg::before, .c-box-feature__txt-bg::after {
    content: "";
    position: absolute;
    top: 0;
    width: 31px;
    height: 100%;
    background-color: var(--color-yellow-1);
}
@media screen and (max-width: 767px) {
    .c-box-feature__txt-bg::before, .c-box-feature__txt-bg::after {
        width: calc(21 / var(--design-width) * 100vw);
    }
}
.c-box-feature__txt-bg--left {
    margin-left: 0;
    transform: translateX(6.6vw);
}
.c-box-feature__txt-bg--right {
    margin-right: 0;
    margin-top: calc(9 / var(--design-width) * 100vw);
}
.c-box-feature__txt-bg::before {
    left: -31px;
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}
@media screen and (max-width: 767px) {
    .c-box-feature__txt-bg::before {
        left: calc(-20 / var(--design-width) * 100vw);
    }
}
.c-box-feature__txt-bg::after {
    right: -31px;
    background-color: var(--color-yellow-1);
    clip-path: polygon(0 0, 0% 100%, 100% 0);
}
@media screen and (max-width: 767px) {
    .c-box-feature__txt-bg::after {
        right: calc(-20 / var(--design-width) * 100vw);
    }
}
.c-box-feature__txt-bg-img {
    display: block;
    margin-inline: auto;
    margin-top: 20px;
}
@media screen and (max-width: 767px) {
    .c-box-feature__txt-bg-img {
        width: calc(526 / var(--design-width) * 100vw);
        margin-top: calc(20 / var(--design-width) * 100vw);
    }
}
.c-box-feature__btns {
    margin-top: 26px;
}
@media screen and (max-width: 767px) {
    .c-box-feature__btns {
        margin-top: calc(46 / var(--design-width) * 100vw);
    }
}
.c-box-feature__btns .c-btn-1 {
    margin-top: 19px;
    box-shadow: none;
}
@media screen and (max-width: 767px) {
    .c-box-feature__btns .c-btn-1 {
        margin-top: calc(22 / var(--design-width) * 100vw);
    }
}


/* ---------------------------------------------
*   c-txt-4
--------------------------------------------- */
.c-txt-4 {
    border: 1px solid var(--color-yellow-1);
    max-width: 680px;
    margin-inline: auto;
    margin-top: 50px;
    box-shadow: 4px 4px 8px 0px var(--color-yellow-1);
}
.c-txt-4 p {
    max-width: calc(var(--contents-width) * 1px);
    margin-inline: auto;
    color: var(--color-yellow-1);
    display: block;
    font-size: 24px;
    font-weight: bold;
    line-height: 1.5454545455;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-txt-4 {
        margin-top: calc(40 / var(--contents-width) * 100vw);
        box-shadow: calc(4 / var(--contents-width) * 100vw) calc(4 / var(--contents-width) * 100vw) calc(8 / var(--contents-width) * 100vw) 0px var(--color-yellow-1);
    }
    .c-txt-4 p {
        font-size: calc(25 / var(--contents-width) * 100vw);
        line-height: 1.3076923077;
        padding: calc(5 / var(--contents-width) * 100vw);
    }
}


a.txt_blank {
    position: relative;
    padding-right: 20px;
}
a.txt_blank::before {
    content: "";
    position: absolute;
    top: 53%;
    right: 3px;
    display: block;
    width: 16px;
    aspect-ratio: 18 / 12;
    -webkit-mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    -webkit-mask-size: 100% auto;
    mask-size: 100% auto;
    background-color: var(--color-yellow);
    transform: translateY(-50%);
}

@media screen and (max-width: 767px) {
    a.txt_blank {
        padding-right: calc(30 / var(--design-width) * 100vw);
        display: inline-block;
    }
    a.txt_blank::before {
        width: calc(25 / var(--design-width) * 100vw);
    }
}

.cautionbox{
    border: 2px solid #cc0033;
    padding: 3%;
    color: #222;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.cautionbox a.txtLink{
    color: var(--color-blue-1);
    text-decoration: underline;
}
.cautionbox a[target=_blank] {
    position: relative;
    width: -moz-fit-content;
    width: fit-content;
    padding-right: 20px;
}
.cautionbox a[target=_blank]::after {
    content: "";
    position: absolute;
    top: 53%;
    right: 3px;
    display: block;
    width: 13px;
    aspect-ratio: 18 / 12;
    -webkit-mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    -webkit-mask-size: 100% auto;
    mask-size: 100% auto;
    background-color: var(--color-blue-1);
    transform: translateY(-50%);
}

@media screen and (max-width: 767px) {
    .cautionbox{
        font-size: 11px;
    }
}

.kvCaution{
    background-color: #1d1d1d;
    padding-top: 3%;
    padding-left: 7%;
}



    .mymodal-inner .nav_btn_subttl {
        width: 80%;
        color: var(--color-white-1);
        font-size: calc(46 / var(--design-width) * 100vw);
    }
    .modal_txt {
        font-size: calc(40 / var(--design-width) * 100vw);
        color: var(--color-white-1);
    }
    .mymodal-inner li {
        margin-bottom: 10%;
    }

@media screen and (max-width: 1450px) {
    .mymodal-inner .nav_btn_subttl {
        width: 80%;
        color: var(--color-white-1);
        font-size: calc(40 / var(--design-width) * 100vw);
    }
    .modal_txt {
        font-size: calc(30 / var(--design-width) * 100vw);
        color: var(--color-white-1);
    }
    .mymodal-inner li {
        margin-bottom: 10%;
    }
}
@media screen and (max-width: 1100spx) {
    .mymodal-inner .nav_btn_subttl {
        width: 80%;
        color: var(--color-white-1);
        font-size: calc(36 / var(--design-width) * 100vw);
    }
    .modal_txt {
        font-size: calc(26 / var(--design-width) * 100vw);
        color: var(--color-white-1);
    }
    .mymodal-inner li {
        margin-bottom: 10%;
    }
}

@media screen and (max-width: 820px) {
    .mymodal-inner .nav_btn_subttl {
        width: 80%;
        color: var(--color-white-1);
        font-size: calc(44 / var(--design-width) * 100vw);
    }
    .modal_txt {
        font-size: calc(36 / var(--design-width) * 100vw);
        color: var(--color-white-1);
    }
    .mymodal-inner li {
        margin-bottom: 10%;
    }
}
@media screen and (max-width:700px) {
    .mymodal-inner .nav_btn_subttl {
        width: 80%;
        color: var(--color-white-1);
        font-size: calc(30 / var(--design-width) * 100vw);
    }
    .modal_txt {
        font-size: calc(20 / var(--design-width) * 100vw);
        color: var(--color-white-1);
    }
    .mymodal-inner li {
        margin-bottom: 10%;
    }
}

@media screen and (max-height:560px) {
    .mymodal .mymodal-inner {
        height: 100%;
        width: 100%;
        overflow-y: scroll;
    }
    .mymodal-inner li:first-child {
        position: absolute;
        right: 2.5em;
    }
    .mymodal-inner .nav_btn_subttl {
        width: 80%;
        color: var(--color-white-1);
        font-size: calc(24 / var(--design-width) * 100vw);
    }
    .modal_txt {
        font-size: calc(16 / var(--design-width) * 100vw);
        color: var(--color-white-1);
    }
    .mymodal-inner li {
        margin-bottom: 4%;
        width: calc(540 / 750 * 100%);
        margin: 0 auto 4%;
    }
    .mymodal_btn {
        padding: 4% 3.125%;
        font-size: calc(16 / var(--design-width) * 100vw);
        border-radius: 2vw;
        border: 2px solid #cc0033;
    }
}

/* Nest Hub (第2世代) 向けの設定 */
@media screen and (min-width: 1024px) and (max-height: 600px) {
    .mymodal-inner li {
        margin-bottom: 5%;
    }
    .mymodal_btn{
        padding: 16px 20px;
        font-size: 18px;
    }
}
/* Nest Hub Max 用 */
@media screen and (min-width: 1280px) and (max-height: 800px) {
    .mymodal-inner li {
        margin-bottom: 5%;
    }
    .mymodal_btn{
        padding: 16px 20px;
        font-size: 18px;
    }
}

#flo_sim_01 {
    position: relative;
    display: block;
}

.modal_btn_balloon{
    display: block;
    position: absolute;
    top: -45%;
    left: 15%;
    width: 70%;
} 
.modal_btn_balloon img{
    width: 100%;
}
.modal_btn_balloon_260611 {
    width: 88%;
    margin: 0 auto;
}

.modal_txt_link{
    position: relative;
    text-decoration: underline;
    padding-right: 32px;
}
.modal_txt_link::after {
    content: "";
    position: absolute;
    top: 53%;
    right: 3px;
    display: block;
    width: 24px;
    aspect-ratio: 18 / 12;
    -webkit-mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    -webkit-mask-size: 100% auto;
    mask-size: 100% auto;
    background-color: var(--color-white);
    transform: translateY(-50%);
}
.howto_btn_balloon {
    position: absolute;
    top: -45%;
    width: 60%;
}
.howto_btn_balloon img{
    width: 100%;
}
.howto_txt_link {
    position: relative;
    font-size: 16px;
    text-decoration: underline; 
    color: var(--color-white);
    padding-right: 24px;
    margin: 0 auto;
}
.howto_txt_link::after {
    content: "";
    position: absolute;
    top: 53%;
    right: 3px;
    display: block;
    width: 16px;
    aspect-ratio: 18 / 12;
    -webkit-mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    -webkit-mask-size: 100% auto;
    mask-size: 100% auto;
    background-color: var(--color-white);
    transform: translateY(-50%);
}
.howto_txt_link02 {
    position: relative;
    font-size: 12px;
    text-decoration: underline; 
    color: var(--color-white);
    padding-right: 16px;
    margin: 0 auto;
}
.howto_txt_link02::after {
    content: "";
    position: absolute;
    top: 53%;
    right: 3px;
    display: block;
    width: 12px;
    aspect-ratio: 18 / 12;
    -webkit-mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    -webkit-mask-size: 100% auto;
    mask-size: 100% auto;
    background-color: var(--color-white);
    transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
    .howto_txt_link {
        font-size: calc(20 / var(--design-width) * 100vw);
    }
    .modal_txt_link{
        padding-right: 6vw;
    }
    .howto_txt_link {
        padding-right: 6vw;
    }
    .howto_txt_link::after {
        right: 3px;
        width: 4vw;
    }
    .modal_txt_link::after {
        right: 3px;
        width: 4vw;
    }
}
@media screen and (max-height: 560px) {
    .modal_btn_balloon{
        top: -62%;
        left: 29%;
        width: 40%;
    }
}
@media screen and (min-width: 1024px) and (max-height: 600px) {
    #flo_sim_01 {
        margin-top: 12%;
    }
    .modal_btn_balloon{
        top: -57%;
        left: 17%;
        width: 64%;
    }
}

@media screen and (min-width: 768px) {
    .modal_btn_balloon{
        top: -45%;
        left: 15%;
        width: 70%;
    }
} 

@media screen and (min-width: 1280px) {
    .mymodal-inner li {
        margin-bottom: 10%;
    }
    .modal_btn_balloon{
        top: -70%;
        left: 18%;
        width: 61%;
    }
} 


@media screen and (min-width: 768px) and (max-height: 560px) {
    .modal_btn_balloon{
        top: -77%;
        left: 27%;
        width: 44%;
    }
}

.fsL {
    font-size: 1.25em;
}

@media screen and (max-width: 767px) {
    .l-youtube__ttl {
        font-size: calc(30 / var(--design-width) * 100vw);
    }
}

.accordion__area .accordion__head {
    width: 65%;
    height: auto;
    cursor: pointer;
    position: relative;
    margin: 0 auto;
}
.accordion__area .accordion__head.head02 {
    width: 20%;
}

.accordion__area .accordion__head .head {
    color: #fff;
    padding-right: 40px;
    font-size: 24px;
    text-align: center;
    line-height: 1.5;
}
.accordion__area .accordion__head .head span {
    display: inline-block;
    width: 36px;
    height: 36px;
    margin-right: 1.0em;
}
.accordion__area .accordion__head .head::after {
    content: "";
    position: absolute;
    top: 53%;
    right: 3px;
    display: block;
    width: 28px;
    aspect-ratio: 18 / 12;
    -webkit-mask: url(https://storage.googleapis.com/sitest-media-assets/image/1168900/aco_arrow_260625.png) center center no-repeat;
    mask: url(https://storage.googleapis.com/sitest-media-assets/image/1168900/aco_arrow_260625.png) center center no-repeat;
    -webkit-mask-size: 100% auto;
    mask-size: 100% auto;
    background-color: var(--color-white);
    transform: translateY(-50%);
}
.accordion__area .accordion__head.head02 .head::after {
    transform: translateY(-50%) rotate(180deg);
}
.accordion__area .accordion__content {
    padding: 0;
    width: 100%;
    height: 0;
    overflow: hidden;
    transition: all 0.5s;
}

.accordion__area .accordion__content .text {
    font-size: 24px;
    text-align: center;
    color: #A66253;
    margin: 20px 0;
}
@media screen and (max-width: 767px){
    .accordion__area .accordion__head {
        width: 78%;
    }
    .accordion__area .accordion__head.head02 {
        width: 24%;
    }
    .accordion__area .accordion__head .head {
        padding-right: 6vw;
        font-size: 4vw;
    }
    .accordion__area .accordion__head .head span {
        width: 6vw;
        height: 6vw;
    }
    .accordion__area .accordion__head .head::after {
        right: 3px;
        width: 4vw;
    }
}


/* 260731 */
  .c-section-howto {
    padding-block: 0 0;
}
/*   .intro_bg>div {
    background-image: none;
    padding-top: 0.1%;

} */
.l-container02 {
    background-image: linear-gradient(180deg, rgba(35, 19, 18, 0)0%, rgba(56, 32, 31, 0.62)20%, rgba(56, 32, 31, 0.3)37.98%,rgba(100, 79, 23,0.8)100%), url(../img/tabBg01.png), url(../img/tabBg02.png);
    background-repeat: no-repeat, no-repeat,no-repeat;
    background-size: contain, contain,contain;
    background-position: left top, left top, left bottom;
    padding-bottom: 12%;
}
.tab {
  margin-left: auto;
  margin-right: auto;
  margin-top: 5%;
  width: 100%;
}
.tab-list {
  display: flex;
  width:90%;
  margin:0 auto;
}
  @media screen and (max-width: 767px) {
    .tab-list {
      padding-top:0
    }
}
.tab-menu {
  align-items: center;
  color: #fff;
  cursor: pointer;
  display: flex;
  flex-grow: 1;
  justify-content: center;
}
.tab-menu.current {
}
.content-box {
  display: none;
  width: 100%;
  position: relative;
  margin-top: 5%;
}

.content-box img {
  display: block;
  height: auto;
  width: 100%;
}
.content-box_inner{
    background-color: #fff;
    padding: 0 5%;
    margin: -1px 0;
}
.content-box_inner ul.tabLabel {
    display: flex;
    padding-left: 26.564px;
    align-items: center;
    gap: 10.626px;
    align-self: stretch;
}
.label01{
    display: flex;
    padding: 5.313px 10px 7.31px 10px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /*gap: 13.282px;*/
    position: relative;


    color: #cc0033;
    border-radius: 6.641px;
    border: 1.328px solid #C03;
    background: #EFEFEF;
}
.label02{
    display: flex;
    padding: 5.313px 10px 7.31px 10px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 13.282px;

    color: #fff;
    border-radius: 6.641px;
    border: 1.328px solid #C03;
    background: linear-gradient(0deg, #C03 0%, #C03 100%), #EFEFEF;
}
.content-box_inner p{
    color: #000;
    text-align: center;
    position: relative;
}
.content-box_inner p.fsL{
    font-size: 1.25em;
}
.content-box_inner p.fsS{
    font-size: 0.9em;
}
.content-box_inner p .sup02{
    font-size: 0.6em;
    position: absolute;
    top: 0%;
}
.c-block-intro__body .txt02 {
    text-align: center;
    width: 75%;
    font-size: 40px;
    padding-bottom: 10px;
    margin: 0 auto;
    font-weight: 500;
  	line-height:1.3;
}
.tab01_img{
    width: 80%;
    margin: 0 auto;
}
.tab02_img{
    width: 40%;
    margin: 0 auto;
}
.tab03_img{
    width: 70%;
    margin: 0 auto;
}
@media screen and (max-width: 767px) {
    .c-block-intro__body .txt02 {
        font-size: calc(42 / var(--design-width) * 100vw);
        padding-bottom: calc(10 / var(--design-width) * 100vw);
    }
}
.fsXXS {
    font-size: 0.57em;
}
.sup01{
    font-size: 0.6em;
    position: absolute;
    top: 0%;
    right: 7%;
}
.content-box ul li a{
    color: var(--color-base-1);
    text-decoration: underline;
}
.content-box .c-list-ast a[target=_blank]::after {
    content: "";
    position: absolute;
    top: 53%;
    right: 3px;
    display: block;
    width: 13px;
    aspect-ratio: 18 / 12;
    -webkit-mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    mask: url(../img/icon_outlink-3.svg) center center no-repeat;
    -webkit-mask-size: 100% auto;
    mask-size: 100% auto;
    background-color: var(--color-base-1);
    transform: translateY(-50%);
}
.content-box ul li a:hover {
    text-decoration: underline;
}
  
/* パネル */
.panel_list {
  background-color: #fff;
}
.panel_item {
  display: none;
  width: 100%;
  padding: 40px 30px;
  background-color: #fff;
  box-sizing: border-box;
}
.panel_item.is-active {
  display: block;
  animation: panel-show .8s ease-in-out forwards;
}

/* パネル切り替えのアニメーション */
@keyframes panel-show {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}