@charset "UTF-8";
/* ---------------------------------------------
*   l-wrapper
--------------------------------------------- */
/* ---------------------------------------------
*   l-header
--------------------------------------------- */
/*  l-header-menu
--------------------------------------------- */
.l-header-menu {
    /* ===============================
     * Layout
     * =============================== */
    position: fixed;
    top: 0;
    right: 0;
    z-index: 1000;
    /* Custom Properties（header menu 専用） */
    --hm-btn-size-w: 100px;
    --hm-btn-size-h: 80px;
    --hm-panel-width: 225px;
    --hm-radius: 20px;
    --hm-bg: #00AE4A;
    width: var(--hm-btn-size-w);
    height: var(--hm-btn-size-h);
    /* ===============================
     * Button
     * =============================== */
    /* ===============================
     * Panel
     * =============================== */
    /* ===============================
     * Open State
     * =============================== */
    /* ===============================
     * SP
     * =============================== */
}
.l-header-menu__btn {
    position: absolute;
    top: 0;
    right: 0;
    width: var(--hm-btn-size-w);
    height: var(--hm-btn-size-h);
    border: 0;
    padding: 0;
    cursor: pointer;
    background-color: var(--hm-bg);
    border-radius: 0 0 0 var(--hm-radius);
    display: grid;
    place-items: center;
    transform: translateX(0);
    transition: transform 0.28s ease;
    will-change: transform;
    z-index: 2;
}
.l-header-menu__icon {
    position: relative;
    width: 40px;
    height: 14px;
}
.l-header-menu__icon::before, .l-header-menu__icon::after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    border-radius: 9999px;
    background-color: #fff;
    transition: transform 0.22s ease, top 0.22s ease;
}
.l-header-menu__icon::before {
    top: 0;
}
.l-header-menu__icon::after {
    top: 12px;
}
.l-header-menu__panel {
    position: absolute;
    top: 0;
    right: 0;
    width: var(--hm-panel-width);
    padding: 32px;
    background-color: var(--hm-bg);
    border-radius: 0 0 0 var(--hm-radius);
    transform: translateX(100%);
    transition: transform 0.28s ease;
    will-change: transform;
    pointer-events: none;
    z-index: 1;
}
.l-header-menu__item {
    margin-top: 12px;
}
.l-header-menu__item:first-of-type {
    margin-top: 0;
}
.l-header-menu__link {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--color-white-1);
    font-weight: 700;
    font-size: 16px;
    line-height: 175%;
    letter-spacing: 0.8px;
    transition: opacity var(--hover-duration);
}
.l-header-menu__link::before {
    flex-shrink: 0;
    content: "";
    width: 16px;
    height: 16px;
    background: url("../img/icon_arrow-menu.svg") center center no-repeat;
    background-size: contain;
}
@media (hover: hover) and (pointer: fine) {
    .l-header-menu__link:hover {
        opacity: var(--hover-opacity-ratio);
    }
}
.l-header-menu.is-open .l-header-menu__panel {
    transform: translateX(0);
    pointer-events: auto;
}
.l-header-menu.is-open .l-header-menu__btn {
    transform: translateX(calc(-1 * var(--hm-panel-width)));
}
.l-header-menu.is-open .l-header-menu__icon {
    background-size: 0 2px;
}
.l-header-menu.is-open .l-header-menu__icon::before {
    top: 8px;
    transform: rotate(45deg);
}
.l-header-menu.is-open .l-header-menu__icon::after {
    top: 8px;
    transform: rotate(-45deg);
}

/* ---------------------------------------------
*   l-container
--------------------------------------------- */
.l-container {
    max-width: calc((var(--contents-width) + var(--contents-side-padding) * 2) * 1px);
    margin-inline: auto;
    padding-inline: calc(var(--contents-side-padding) * 1px);
}
@media screen and (max-width: 767px) {
    .l-container {
        max-width: none;
    }
}
@media screen and (min-width: 768px) {
    .l-container--full {
        max-width: none;
        padding-inline: 0;
    }
}

/* ---------------------------------------------
*   l-contents
--------------------------------------------- */
.l-contents {
    overflow: clip;
}

/* ---------------------------------------------
*   l-footer
--------------------------------------------- */
.l-footer {
    padding-block: 64px 20px;
    background-color: #EDF2ED;
}
@media screen and (max-width: 767px) {
    .l-footer {
        padding-block: 48px 20px;
    }
}
.l-footer__container {
    max-width: 1240px;
    margin-inline: auto;
    padding-inline: 20px;
}
.l-footer__inner {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
@media screen and (max-width: 767px) {
    .l-footer__inner {
        flex-direction: column;
        gap: 20px;
    }
}
.l-footer__inner-left {
    flex-grow: 1;
}
.l-footer__inner-right {
    flex-shrink: 0;
}
.l-footer__logo-wrap {
    display: flex;
    align-items: center;
    gap: 16px 32px;
}
@media screen and (max-width: 767px) {
    .l-footer__logo-wrap {
        gap: 16px 24px;
    }
}
.l-footer__logo {
    flex-shrink: 0;
    width: 100px;
}
.l-footer__lead {
    font-weight: 500;
    font-size: 20px;
    line-height: 150%;
    letter-spacing: 1px;
}
@media screen and (max-width: 767px) {
    .l-footer__lead {
        font-size: 16px;
        letter-spacing: 0.8px;
    }
}
.l-footer__copyright {
    margin-top: 32px;
    font-weight: 500;
    font-size: 10px;
    line-height: 150%;
    letter-spacing: 0.5px;
    text-align: right;
}
@media screen and (max-width: 767px) {
    .l-footer__copyright {
        margin-top: 20px;
    }
}

/*  l-footer-nav
--------------------------------------------- */
.l-footer-nav {
    margin-top: 20px;
}
.l-footer-nav__list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 32px;
}
.l-footer-nav__link {
    position: relative;
    display: block;
    font-weight: 500;
    font-size: 14px;
    line-height: 175%;
    letter-spacing: 0.7px;
}
.l-footer-nav__link::after {
    content: "";
    position: relative;
    top: 2px;
    display: inline-block;
    width: 14px;
    aspect-ratio: 1/1;
    margin-left: 4px;
    -webkit-mask: url("../img/icon_external.svg") center center no-repeat;
            mask: url("../img/icon_external.svg") center center no-repeat;
    -webkit-mask-size: contain;
            mask-size: contain;
    background-color: var(--color-green-1);
}

/*  l-footer-img
--------------------------------------------- */
.l-footer-img__list {
    display: flex;
    gap: 12px;
}
.l-footer-img__item {
    width: 74px;
}
.l-footer-img__item img {
    display: block;
    width: 100%;
    height: auto;
}
.l-footer-img__link {
    display: block;
}
@media (hover: hover) and (pointer: fine) {
    .l-footer-img__link {
        transition: opacity var(--hover-duration);
    }
    .l-footer-img__link:hover {
        opacity: var(--hover-opacity-ratio);
    }
}

/* ---------------------------------------------
*   c-acc
--------------------------------------------- */
.c-acc__item {
    margin-top: 32px;
    padding: 1px;
    border-radius: 32px;
    box-shadow: 0 0 24px 0 rgba(0, 77, 32, 0.2);
    background-color: var(--color-white-1);
    overflow: hidden;
}
@media screen and (max-width: 767px) {
    .c-acc__item {
        margin-top: calc(16 / var(--design-width) * 100vw);
        border-radius: calc(32 / var(--design-width) * 100vw);
        box-shadow: 0 0 calc(24 / var(--design-width) * 100vw) 0 rgba(0, 77, 32, 0.2);
    }
}
.c-acc__item:first-of-type {
    margin-top: 0;
}
.c-acc__head {
    display: block;
    width: 100%;
    padding: 32px;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    cursor: pointer;
}
@media screen and (max-width: 767px) {
    .c-acc__head {
        padding: calc(24 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw);
    }
}
@media (hover: hover) and (pointer: fine) {
    .c-acc__head:hover .c-acc__ttl {
        color: var(--color-green-1);
    }
}
.c-acc__head:focus {
    border-radius: 32px;
}
@media screen and (max-width: 767px) {
    .c-acc__head:focus {
        border-radius: calc(32 / var(--design-width) * 100vw);
    }
}
.c-acc__ttl {
    position: relative;
    display: block;
    padding-inline: 40px 52px;
    color: var(--color-black-1);
    font-weight: 700;
    font-size: 20px;
    line-height: 150%;
    letter-spacing: 1px;
    text-align: left;
    transition: color 0.3s;
}
@media screen and (max-width: 767px) {
    .c-acc__ttl {
        padding-inline: calc(40 / var(--design-width) * 100vw) calc(28 / var(--design-width) * 100vw);
        font-size: calc(16 / var(--design-width) * 100vw);
        letter-spacing: 0.8px;
    }
}
.c-acc__ttl::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 0;
    width: 32px;
    height: 32px;
    background: url("../img/icon_q.svg") center center no-repeat;
    background-size: 100% auto;
}
@media screen and (max-width: 767px) {
    .c-acc__ttl::before {
        top: calc(-4 / var(--design-width) * 100vw);
        width: calc(32 / var(--design-width) * 100vw);
        height: calc(32 / var(--design-width) * 100vw);
    }
}
.c-acc__ttl::after {
    content: "";
    position: absolute;
    top: 5px;
    right: 0;
    width: 20px;
    height: 20px;
    background: url("../img/icon_plus.svg") center center no-repeat;
    background-size: 100% auto;
}
@media screen and (max-width: 767px) {
    .c-acc__ttl::after {
        top: calc(2 / var(--design-width) * 100vw);
        width: calc(20 / var(--design-width) * 100vw);
        height: calc(20 / var(--design-width) * 100vw);
    }
}
.js-acc-scope.is-open .c-acc__ttl::after {
    background-image: url("../img/icon_minus.svg");
}

.c-acc__body {
    padding: 0 32px 32px;
}
@media screen and (max-width: 767px) {
    .c-acc__body {
        padding: 0 calc(20 / var(--design-width) * 100vw) calc(24 / var(--design-width) * 100vw);
    }
}
.c-acc__txt {
    position: relative;
    padding-inline: 40px 52px;
    font-weight: 500;
    font-size: 16px;
    line-height: 175%;
    letter-spacing: 0.8px;
}
@media screen and (max-width: 767px) {
    .c-acc__txt {
        padding-inline: calc(40 / var(--design-width) * 100vw) calc(28 / var(--design-width) * 100vw);
        font-size: calc(16 / var(--design-width) * 100vw);
    }
}
.c-acc__txt::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 32px;
    height: 32px;
    background: url("../img/icon_a.svg") center center no-repeat;
    background-size: 100% auto;
}
@media screen and (max-width: 767px) {
    .c-acc__txt::before {
        width: calc(32 / var(--design-width) * 100vw);
        height: calc(32 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-block
--------------------------------------------- */
/*  c-block-cta
--------------------------------------------- */
.c-block-cta {
    background: linear-gradient(90deg, #009D43 0%, #00D65B 100%);
    padding-block: 64px;
}
@media screen and (max-width: 767px) {
    .c-block-cta {
        padding-block: calc(20 / var(--design-width) * 100vw);
    }
}
.c-block-cta__inner {
    padding-inline: 20px;
}
@media screen and (max-width: 767px) {
    .c-block-cta__inner {
        padding-inline: calc(20 / var(--design-width) * 100vw);
    }
}
.c-block-cta__list {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 32px;
}
@media screen and (max-width: 767px) {
    .c-block-cta__list {
        gap: calc(16 / var(--design-width) * 100vw);
    }
}

/*  c-block-tool
--------------------------------------------- */
.c-block-tool {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    width: 100%;
    margin-top: -160px;
}
@media screen and (max-width: 767px) {
    .c-block-tool {
        display: block;
        margin-top: calc(-136 / var(--design-width) * 100vw);
    }
}
.c-block-tool__item {
    width: 100%;
    padding: 64px 10px;
}
@media screen and (max-width: 767px) {
    .c-block-tool__item {
        display: block;
        padding: calc(48 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw);
    }
}
.c-block-tool__item:nth-of-type(1) {
    padding-top: 224px;
    background: linear-gradient(139deg, #ABCD03 0%, rgba(171, 205, 3, 0.5) 100%);
}
@media screen and (max-width: 767px) {
    .c-block-tool__item:nth-of-type(1) {
        padding-top: calc(184 / var(--design-width) * 100vw);
    }
}
.c-block-tool__item:nth-of-type(2) {
    padding-top: 224px;
    background: linear-gradient(128deg, #F19DAE 0%, rgba(241, 157, 174, 0.5) 100%);
}
@media screen and (max-width: 767px) {
    .c-block-tool__item:nth-of-type(2) {
        padding-top: calc(48 / var(--design-width) * 100vw);
    }
}
.c-block-tool__item:nth-of-type(3) {
    background: linear-gradient(128deg, #5DC2D0 -0.47%, rgba(93, 194, 208, 0.5) 100%);
}
.c-block-tool__item:nth-of-type(4) {
    background: linear-gradient(139deg, #F5A200 0%, rgba(245, 162, 0, 0.5) 100%);
}
.c-block-tool__ttl {
    width: 238px;
    margin-inline: auto;
    margin-bottom: 16px;
}
@media screen and (max-width: 767px) {
    .c-block-tool__ttl {
        width: calc(238 / var(--design-width) * 100vw);
        margin-bottom: calc(16 / var(--design-width) * 100vw);
    }
}
.c-block-tool__ttl img {
    display: block;
    width: 100%;
    height: auto;
}
.c-block-tool__txt {
    font-weight: 700;
    font-size: 16px;
    line-height: 175%;
    letter-spacing: 0.8px;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-block-tool__txt {
        font-size: calc(16 / var(--design-width) * 100vw);
    }
}
.c-block-tool__img {
    width: 100%;
    max-width: 288px;
    margin-top: 24px;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-block-tool__img {
        width: calc(230 / var(--design-width) * 100vw);
        margin-top: calc(16 / var(--design-width) * 100vw);
    }
}
.c-block-tool__btn {
    margin-top: 24px;
}
@media screen and (max-width: 767px) {
    .c-block-tool__btn {
        margin-top: calc(16 / var(--design-width) * 100vw);
    }
}

/*  c-block-system
--------------------------------------------- */
.c-block-system__inner {
    position: relative;
}
.c-block-system__heading {
    position: absolute;
    top: 0;
    left: 0;
    width: 26.8333333333%;
}
@media screen and (max-width: 767px) {
    .c-block-system__heading {
        position: static;
        width: calc(248 / var(--design-width) * 100vw);
        margin-inline: auto;
    }
}
.c-block-system__heading img {
    display: block;
    width: 100%;
    height: auto;
}
@media screen and (max-width: 767px) {
    .c-block-system__map {
        width: 100vw;
        margin-inline: calc((100vw - 100%) / -2);
        margin-top: calc(16 / var(--design-width) * 100vw);
    }
}
.c-block-system__map img {
    display: block;
    width: 100%;
    height: auto;
}
.c-block-system__btn-wrap {
    position: absolute;
    inset: 0;
}
@media screen and (max-width: 767px) {
    .c-block-system__btn-wrap {
        position: static;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: calc(16 / var(--design-width) * 100vw);
        margin-top: calc(8 / var(--design-width) * 100vw);
    }
}
.c-block-system__btn {
    position: absolute;
    z-index: 1;
    width: 17.5%;
    transition: transform 0.5s;
}
@media screen and (max-width: 767px) {
    .c-block-system__btn {
        position: static;
        width: 100%;
    }
}
.c-block-system__btn::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: center center no-repeat;
    background-size: 100% auto;
    transition: opacity 0.3s, transform 0.3s;
    animation: scale-up 1.5s infinite;
}
@media screen and (max-width: 767px) {
    .c-block-system__btn::before {
        content: normal;
    }
}
.c-block-system__btn:nth-of-type(1) {
    bottom: 26.4207377866%;
    left: 0;
}
.c-block-system__btn:nth-of-type(1)::before {
    background-image: url("../img/btn_system_bg_01.png");
}
.c-block-system__btn:nth-of-type(2) {
    bottom: 1.4955134596%;
    left: 26.6666666667%;
}
.c-block-system__btn:nth-of-type(2)::before {
    background-image: url("../img/btn_system_bg_02.png");
}
.c-block-system__btn:nth-of-type(3) {
    bottom: 32.9012961117%;
    right: 0;
}
.c-block-system__btn:nth-of-type(3)::before {
    background-image: url("../img/btn_system_bg_03.png");
}
.c-block-system__btn:nth-of-type(4) {
    top: 13.1605184447%;
    right: 22.9166666667%;
}
.c-block-system__btn:nth-of-type(4)::before {
    background-image: url("../img/btn_system_bg_04.png");
}
@media (hover: hover) and (pointer: fine) {
    .c-block-system__btn:hover {
        transform: scale(1.1);
    }
}
.c-block-system__btn img {
    display: block;
    width: 100%;
    height: auto;
}
@keyframes scale-up {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    100% {
        opacity: 0;
        transform: scale(1.5);
    }
}

/* ---------------------------------------------
*   c-box
--------------------------------------------- */
/* ---------------------------------------------
*   c-btn
--------------------------------------------- */
.c-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: -moz-fit-content;
    width: fit-content;
    min-width: 340px;
    min-height: 60px;
    margin-inline: auto;
    padding: 12px 24px;
    border-radius: 9999px;
    border: 1px solid var(--color-black-1);
    box-shadow: 0 3px 6px 0 rgba(0, 77, 32, 0.2);
    background-color: var(--color-white-1);
    transition: background-color 0.3s;
}
@media screen and (max-width: 767px) {
    .c-btn {
        min-width: calc(340 / var(--design-width) * 100vw);
        min-height: calc(60 / var(--design-width) * 100vw);
        padding: calc(12 / var(--design-width) * 100vw) calc(24 / var(--design-width) * 100vw);
        box-shadow: 0 calc(3 / var(--design-width) * 100vw) calc(6 / var(--design-width) * 100vw) 0 rgba(0, 77, 32, 0.2);
    }
}
@media (hover: hover) and (pointer: fine) {
    .c-btn:hover {
        background-color: var(--color-black-1);
    }
    .c-btn:hover .c-btn__txt {
        color: var(--color-white-1);
    }
    .c-btn:hover .c-btn__txt::after {
        background-color: var(--color-white-1);
    }
}
.c-btn__txt {
    position: relative;
    display: block;
    width: 100%;
    padding-right: 15px;
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.8px;
    text-align: center;
    transition: color 0.3s;
}
@media screen and (max-width: 767px) {
    .c-btn__txt {
        padding-right: calc(15 / var(--design-width) * 100vw);
        font-size: calc(16 / var(--design-width) * 100vw);
    }
}
.c-btn__txt::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 7px;
    aspect-ratio: 7/12;
    -webkit-mask: url("../img/icon_arrow.svg") center center no-repeat;
            mask: url("../img/icon_arrow.svg") center center no-repeat;
    -webkit-mask-size: contain;
            mask-size: contain;
    background-color: var(--color-black-1);
    transition: background-color 0.3s;
}
@media screen and (max-width: 767px) {
    .c-btn__txt::after {
        width: calc(7 / var(--design-width) * 100vw);
    }
}

/*  c-btn-dl
--------------------------------------------- */
.c-btn-dl {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: 50px;
    margin-inline: auto;
    padding: 12px 24px;
    border-radius: 9999px;
    background: linear-gradient(90deg, #000 0%, #4A4A4A 100%);
    overflow: hidden;
}
@media screen and (max-width: 767px) {
    .c-btn-dl {
        min-height: calc(50 / var(--design-width) * 100vw);
        padding: calc(12 / var(--design-width) * 100vw) calc(24 / var(--design-width) * 100vw);
    }
}
@media (hover: hover) and (pointer: fine) {
    .c-btn-dl:hover::before {
        opacity: 1;
    }
}
.c-btn-dl::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-gray-1);
    opacity: 0;
    transition: opacity 0.3s;
}
.c-btn-dl__txt {
    position: relative;
    display: block;
    width: 100%;
    padding-right: 15px;
    color: var(--color-white-1);
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.8px;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-btn-dl__txt {
        padding-right: calc(15 / var(--design-width) * 100vw);
        font-size: calc(16 / var(--design-width) * 100vw);
    }
}
.c-btn-dl__txt::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 7px;
    aspect-ratio: 7/12;
    -webkit-mask: url("../img/icon_arrow.svg") center center no-repeat;
            mask: url("../img/icon_arrow.svg") center center no-repeat;
    -webkit-mask-size: contain;
            mask-size: contain;
    background-color: var(--color-white-1);
}
@media screen and (max-width: 767px) {
    .c-btn-dl__txt::after {
        width: calc(7 / var(--design-width) * 100vw);
    }
}

/*  c-btn-cta
--------------------------------------------- */
.c-btn-cta {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 480px;
    height: 100px;
    padding: 10px 24px;
    border-radius: 20px;
    box-shadow: 0 3px 6px 0 rgba(0, 77, 32, 0.2);
    background-color: var(--color-white-1);
}
@media screen and (max-width: 767px) {
    .c-btn-cta {
        width: calc(350 / var(--design-width) * 100vw);
        height: calc(80 / var(--design-width) * 100vw);
        padding: calc(8 / var(--design-width) * 100vw) calc(24 / var(--design-width) * 100vw);
        border-radius: calc(20 / var(--design-width) * 100vw);
        box-shadow: 0 calc(3 / var(--design-width) * 100vw) calc(6 / var(--design-width) * 100vw) 0 rgba(0, 77, 32, 0.2);
    }
}
@media (hover: hover) and (pointer: fine) {
    .c-btn-cta:hover .c-btn-cta__txt {
        color: var(--color-green-1);
    }
    .c-btn-cta:hover .c-btn-cta__txt::after {
        background-color: var(--color-green-1);
    }
}
.c-btn-cta__txt {
    position: relative;
    display: block;
    width: 100%;
    padding-inline: 88px 15px;
    font-weight: 500;
    font-size: 20px;
    line-height: 150%;
    letter-spacing: 1px;
    text-align: center;
    transition: color 0.3s;
}
@media screen and (max-width: 767px) {
    .c-btn-cta__txt {
        padding-inline: calc(72 / var(--design-width) * 100vw) calc(15 / var(--design-width) * 100vw);
        font-size: calc(16 / var(--design-width) * 100vw);
    }
}
.c-btn-cta__txt::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 80px;
    aspect-ratio: 1/1;
    background: center center no-repeat;
    background-size: contain;
}
@media screen and (max-width: 767px) {
    .c-btn-cta__txt::before {
        width: calc(64 / var(--design-width) * 100vw);
    }
}
.c-btn-cta--demo .c-btn-cta__txt::before {
    background-image: url("../img/icon_demo.svg");
}
.c-btn-cta--download .c-btn-cta__txt::before {
    background-image: url("../img/icon_download.svg");
}
.c-btn-cta--contact .c-btn-cta__txt::before {
    background-image: url("../img/icon_contact.svg");
}
.c-btn-cta--event-seminar .c-btn-cta__txt::before {
    background-image: url("../img/icon_event-seminar.svg");
}
.c-btn-cta__txt::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 7px;
    aspect-ratio: 7/12;
    -webkit-mask: url("../img/icon_arrow.svg") center center no-repeat;
            mask: url("../img/icon_arrow.svg") center center no-repeat;
    -webkit-mask-size: contain;
            mask-size: contain;
    background-color: var(--color-black-1);
    transition: background-color 0.3s;
}
@media screen and (max-width: 767px) {
    .c-btn-cta__txt::after {
        width: calc(7 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-card
--------------------------------------------- */
/*  c-card-case
--------------------------------------------- */
.c-card-case-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
}
@media screen and (max-width: 767px) {
    .c-card-case-wrap {
        flex-wrap: nowrap;
        gap: calc(16 / var(--design-width) * 100vw);
        width: 100vw;
        margin: 0 calc(50% - 50vw);
        padding: calc(24 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw);
        overflow-x: auto;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .c-card-case-wrap::-webkit-scrollbar {
        display: none;
    }
}

.c-card-case {
    display: block;
    width: calc((100% - 64px) / 3);
    border-radius: 32px;
    box-shadow: 0 0 24px 0 rgba(0, 77, 32, 0.2);
    background-color: var(--color-white-1);
    overflow: hidden;
}
@media screen and (max-width: 767px) {
    .c-card-case {
        flex-shrink: 0;
        width: calc(300 / var(--design-width) * 100vw);
        border-radius: calc(32 / var(--design-width) * 100vw);
        box-shadow: 0 0 calc(24 / var(--design-width) * 100vw) 0 rgba(0, 77, 32, 0.2);
    }
}
@media (hover: hover) and (pointer: fine) {
    .c-card-case:hover .c-card-case__img img {
        transform: scale(1.1);
    }
    .c-card-case:hover .c-card-case__ttl {
        color: var(--color-green-1);
    }
    .c-card-case:hover .c-card-case__txt {
        color: var(--color-green-1);
    }
    .c-card-case:hover .c-card-case__date {
        color: var(--color-green-1);
    }
}
@media screen and (max-width: 767px) {
    .c-card-case.js-fadein-up {
        transform: translateY(0) !important;
        opacity: 1 !important;
    }
}
.c-card-case__img {
    width: 100%;
    aspect-ratio: 380/214;
    overflow: hidden;
}
.c-card-case__img img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    transition: transform 0.3s;
}
.c-card-case__content {
    padding: 16px 24px 24px;
}
@media screen and (max-width: 767px) {
    .c-card-case__content {
        padding: calc(16 / var(--design-width) * 100vw) calc(24 / var(--design-width) * 100vw) calc(24 / var(--design-width) * 100vw);
    }
}
.c-card-case__label {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 2px 12px;
    border-radius: 8px;
    color: var(--color-white-1);
    font-weight: 700;
    font-size: 14px;
    line-height: 175%;
    letter-spacing: 0.7px;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-card-case__label {
        padding: calc(2 / var(--design-width) * 100vw) calc(12 / var(--design-width) * 100vw);
        border-radius: calc(8 / var(--design-width) * 100vw);
        font-size: calc(14 / var(--design-width) * 100vw);
    }
}
.c-card-case__label--green {
    background-color: #00AEBB;
}
.c-card-case__label--purple {
    background-color: #915DA3;
}
.c-card-case__label--blue {
    background-color: #00AFEC;
}
.c-card-case__ttl {
    margin-top: 8px;
    font-weight: 700;
    font-size: 20px;
    line-height: 150%;
    letter-spacing: 1px;
    transition: color 0.3s;
}
@media screen and (max-width: 767px) {
    .c-card-case__ttl {
        margin-top: calc(8 / var(--design-width) * 100vw);
        font-size: calc(18 / var(--design-width) * 100vw);
        letter-spacing: 0.9px;
    }
}
.c-card-case__txt {
    margin-top: 8px;
    font-weight: 500;
    font-size: 14px;
    line-height: 175%;
    letter-spacing: 0.7px;
    transition: color 0.3s;
}
@media screen and (max-width: 767px) {
    .c-card-case__txt {
        margin-top: calc(8 / var(--design-width) * 100vw);
        font-size: calc(14 / var(--design-width) * 100vw);
    }
}
.c-card-case__date {
    display: block;
    margin-top: 8px;
    color: var(--color-gray-1);
    font-weight: 500;
    font-size: 14px;
    line-height: 175%;
    letter-spacing: 0.7px;
    transition: color 0.3s;
}
@media screen and (max-width: 767px) {
    .c-card-case__date {
        margin-top: calc(8 / var(--design-width) * 100vw);
        font-size: calc(14 / var(--design-width) * 100vw);
    }
}

/*  c-card-dl
--------------------------------------------- */
.c-card-dl-wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    gap: 32px;
}
@media screen and (max-width: 767px) {
    .c-card-dl-wrap {
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: calc(16 / var(--design-width) * 100vw);
        width: 100vw;
        margin: 0 calc(50% - 50vw);
        padding: calc(24 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw);
        overflow-x: auto;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .c-card-dl-wrap::-webkit-scrollbar {
        display: none;
    }
}

.c-card-dl {
    display: block;
    width: calc((100% - 96px) / 4);
    max-width: 276px;
    border-radius: 32px;
    box-shadow: 0 0 24px 0 rgba(0, 77, 32, 0.2);
    background-color: var(--color-white-1);
    overflow: hidden;
}
@media screen and (max-width: 1024px) {
    .c-card-dl {
        width: calc((100% - 32px) / 2);
    }
}
@media screen and (max-width: 767px) {
    .c-card-dl {
        flex-shrink: 0;
        width: calc(300 / var(--design-width) * 100vw);
        max-width: none;
        border-radius: calc(32 / var(--design-width) * 100vw);
        box-shadow: 0 0 calc(24 / var(--design-width) * 100vw) 0 rgba(0, 77, 32, 0.2);
    }
}
@media screen and (max-width: 767px) {
    .c-card-dl.js-fadein-up {
        transform: translateY(0) !important;
        opacity: 1 !important;
    }
}
.c-card-dl__img {
    width: 100%;
    aspect-ratio: 276/155;
}
.c-card-dl__img img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.c-card-dl__content {
    padding: 16px 24px;
}
@media screen and (max-width: 767px) {
    .c-card-dl__content {
        padding: calc(16 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw);
    }
}
.c-card-dl__ttl {
    font-weight: 500;
    font-size: 16px;
    line-height: 175%;
    letter-spacing: 0.8px;
}
@media screen and (max-width: 767px) {
    .c-card-dl__ttl {
        font-size: calc(16 / var(--design-width) * 100vw);
    }
}
.c-card-dl__btn {
    margin-top: 16px;
}
@media screen and (max-width: 767px) {
    .c-card-dl__btn {
        margin-top: calc(16 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-cassette
--------------------------------------------- */
/*  c-cassette-change
--------------------------------------------- */
.c-cassette-change-wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: flex-start;
    gap: 32px;
}
@media screen and (max-width: 767px) {
    .c-cassette-change-wrap {
        grid-template-columns: repeat(1, 1fr);
        gap: calc(16 / var(--design-width) * 100vw);
    }
}

.c-cassette-change {
    --change-color-01: #73A500;
    --change-color-02: #E46177;
    --change-color-03: #2294AA;
    --change-color-04: #EB6700;
    border-radius: 32px;
    overflow: hidden;
}
@media screen and (max-width: 767px) {
    .c-cassette-change {
        border-radius: calc(32 / var(--design-width) * 100vw);
    }
}
.c-cassette-change__head {
    padding: 16px 24px;
    color: var(--color-white-1);
}
@media screen and (max-width: 767px) {
    .c-cassette-change__head {
        padding: calc(16 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw);
    }
}
.c-cassette-change--01 .c-cassette-change__head {
    background-color: var(--change-color-01);
}
.c-cassette-change--02 .c-cassette-change__head {
    background-color: var(--change-color-02);
}
.c-cassette-change--03 .c-cassette-change__head {
    background-color: var(--change-color-03);
}
.c-cassette-change--04 .c-cassette-change__head {
    background-color: var(--change-color-04);
}
.c-cassette-change__lead {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.8px;
}
@media screen and (max-width: 767px) {
    .c-cassette-change__lead {
        flex-direction: column;
        gap: calc(4 / var(--design-width) * 100vw);
        margin-bottom: calc(8 / var(--design-width) * 100vw);
        font-size: calc(14 / var(--design-width) * 100vw);
        letter-spacing: 0.7px;
    }
}
.c-cassette-change__label {
    flex-shrink: 0;
    align-self: flex-start;
    padding: 2px 8px;
    border-radius: 4px;
    background-color: var(--color-white-1);
}
@media screen and (max-width: 767px) {
    .c-cassette-change__label {
        align-self: center;
        padding: calc(2 / var(--design-width) * 100vw) calc(8 / var(--design-width) * 100vw);
        border-radius: calc(4 / var(--design-width) * 100vw);
    }
}
.c-cassette-change--01 .c-cassette-change__label {
    color: var(--change-color-01);
}
.c-cassette-change--02 .c-cassette-change__label {
    color: var(--change-color-02);
}
.c-cassette-change--03 .c-cassette-change__label {
    color: var(--change-color-03);
}
.c-cassette-change--04 .c-cassette-change__label {
    color: var(--change-color-04);
}
.c-cassette-change__ttl {
    font-weight: 700;
    font-size: 20px;
    line-height: 150%;
    letter-spacing: 1px;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-cassette-change__ttl {
        font-size: calc(18 / var(--design-width) * 100vw);
        letter-spacing: 0.9px;
    }
}
.c-cassette-change__body {
    padding: 24px;
}
@media screen and (max-width: 767px) {
    .c-cassette-change__body {
        padding: calc(16 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw) calc(24 / var(--design-width) * 100vw);
    }
}
.c-cassette-change--01 .c-cassette-change__body {
    background-color: rgba(171, 205, 3, 0.1);
}
.c-cassette-change--02 .c-cassette-change__body {
    background-color: rgba(241, 157, 174, 0.1);
}
.c-cassette-change--03 .c-cassette-change__body {
    background-color: rgba(93, 194, 208, 0.1);
}
.c-cassette-change--04 .c-cassette-change__body {
    background-color: rgba(245, 162, 0, 0.1);
}
.c-cassette-change__img img {
    display: block;
    width: 100%;
    height: auto;
}
.c-cassette-change__txt {
    margin-top: 24px;
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.8px;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-cassette-change__txt {
        margin-top: calc(16 / var(--design-width) * 100vw);
        font-size: calc(14 / var(--design-width) * 100vw);
        letter-spacing: 0.7px;
    }
}
.c-cassette-change__txt em {
    font-size: 20px;
    letter-spacing: 1px;
}
@media screen and (max-width: 767px) {
    .c-cassette-change__txt em {
        font-size: calc(18 / var(--design-width) * 100vw);
        letter-spacing: 0.9px;
    }
}
.c-cassette-change--01 .c-cassette-change__txt {
    color: var(--change-color-01);
}
.c-cassette-change--02 .c-cassette-change__txt {
    color: var(--change-color-02);
}
.c-cassette-change--03 .c-cassette-change__txt {
    color: var(--change-color-03);
}
.c-cassette-change--04 .c-cassette-change__txt {
    color: var(--change-color-04);
}
.c-cassette-change__note-list {
    margin-top: 4px;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-cassette-change__note-list {
        margin-top: calc(4 / var(--design-width) * 100vw);
    }
}
.c-cassette-change__note-item {
    position: relative;
    padding-left: 16px;
    font-weight: 500;
    font-size: 12px;
    line-height: 175%;
    letter-spacing: 0.6px;
}
@media screen and (max-width: 767px) {
    .c-cassette-change__note-item {
        padding-left: calc(16 / var(--design-width) * 100vw);
        font-size: calc(12 / var(--design-width) * 100vw);
        letter-spacing: 0.6px;
    }
}
.c-cassette-change__note-item::before {
    content: "※";
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    margin-right: 4px;
}
@media screen and (max-width: 767px) {
    .c-cassette-change__note-item::before {
        margin-right: calc(4 / var(--design-width) * 100vw);
    }
}

/*  c-cassette-point
--------------------------------------------- */
.c-cassette-point-wrap {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 0 5.3333333333%;
}
@media screen and (max-width: 767px) {
    .c-cassette-point-wrap {
        display: block;
    }
}

.c-cassette-point {
    max-width: 29.7777777778%;
}
@media screen and (max-width: 767px) {
    .c-cassette-point {
        max-width: none;
        margin-top: calc(48 / var(--design-width) * 100vw);
    }
    .c-cassette-point:first-of-type {
        margin-top: 0;
    }
}
.c-cassette-point__icon {
    width: auto;
    height: 80px;
    margin-top: 28px;
    margin-inline: auto;
}
@media screen and (max-width: 767px) {
    .c-cassette-point__icon {
        height: calc(80 / var(--design-width) * 100vw);
        margin-top: calc(28 / var(--design-width) * 100vw);
    }
}
.c-cassette-point__icon img {
    display: block;
    width: auto;
    height: 100%;
    margin-inline: auto;
}
.c-cassette-point__list {
    margin-top: 16px;
}
@media screen and (max-width: 767px) {
    .c-cassette-point__list {
        margin-top: calc(16 / var(--design-width) * 100vw);
    }
}

.c-cassette-point-foot__inner {
    padding-block: 64px;
}
@media screen and (max-width: 767px) {
    .c-cassette-point-foot__inner {
        padding-block: calc(48 / var(--design-width) * 100vw) calc(88 / var(--design-width) * 100vw);
    }
}
.c-cassette-point-foot__txt-outer {
    position: relative;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
}
.c-cassette-point-foot__txt {
    position: relative;
    z-index: 2;
    color: var(--color-green-1);
    font-weight: 700;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 1.2px;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-cassette-point-foot__txt {
        font-size: calc(20 / var(--design-width) * 100vw);
        letter-spacing: 1px;
    }
}
.c-cassette-point-foot__img-outer {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    width: 100%;
}
@media screen and (max-width: 767px) {
    .c-cassette-point-foot__img-outer {
        top: auto;
        bottom: calc(-8 / var(--design-width) * 100vw);
        left: 50%;
        transform: translate(-50%, 100%);
        gap: calc(40 / var(--design-width) * 100vw);
        width: auto;
    }
}
.c-cassette-point-foot__img--left {
    transform: translateX(calc(-100% - 50px));
    width: 115px;
}
@media screen and (max-width: 767px) {
    .c-cassette-point-foot__img--left {
        transform: none;
        width: calc(58 / var(--design-width) * 100vw);
    }
}
.c-cassette-point-foot__img--right {
    transform: translateX(calc(100% + 50px));
    width: 147px;
}
@media screen and (max-width: 767px) {
    .c-cassette-point-foot__img--right {
        transform: none;
        width: calc(74 / var(--design-width) * 100vw);
    }
}
.c-cassette-point-foot__img img {
    display: block;
    width: 100%;
    height: auto;
}

/* ---------------------------------------------
*   c-figure
--------------------------------------------- */
/* ---------------------------------------------
*   c-form
--------------------------------------------- */
/* ---------------------------------------------
*   c-img
--------------------------------------------- */
/* ---------------------------------------------
*   c-kv
--------------------------------------------- */
.c-kv {
    padding-block: 40px 100px;
    background-color: #EFEFEF;
}
@media screen and (max-width: 767px) {
    .c-kv {
        padding-block: calc(80 / var(--design-width) * 100vw) calc(64 / var(--design-width) * 100vw);
    }
}
.c-kv__inner {
    position: relative;
}
.c-kv__head {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
@media screen and (max-width: 767px) {
    .c-kv__head {
        position: relative;
        top: auto;
        left: auto;
        height: auto;
        padding-top: calc(220 / var(--design-width) * 100vw);
        padding-bottom: calc(62 / var(--design-width) * 100vw);
    }
}
@media screen and (max-width: 767px) {
    .c-kv__body {
        position: absolute;
        top: 0;
        left: calc(6 / var(--design-width) * 100vw);
        width: 100%;
    }
}
.c-kv__logo {
    position: absolute;
    bottom: 6.5573770492%;
    left: 0;
    z-index: 3;
    width: 31.3333333333%;
}
@media screen and (max-width: 767px) {
    .c-kv__logo {
        bottom: 0;
        left: calc(20 / var(--design-width) * 100vw);
        width: calc(188 / var(--design-width) * 100vw);
    }
}
.c-kv__logo img {
    display: block;
    width: 100%;
    height: auto;
}
.c-kv__txt {
    position: absolute;
    top: 16.393442623%;
    left: 4.5833333333%;
    z-index: 1;
    width: 66.6666666667%;
}
@media screen and (max-width: 767px) {
    .c-kv__txt {
        position: static;
        top: 0;
        left: 0;
        width: 100%;
    }
}
.c-kv__txt img {
    display: block;
    width: 100%;
    height: auto;
}
.c-kv__img {
    position: relative;
    z-index: 2;
    width: 53.3333333333%;
    margin-inline: auto 0;
}
@media screen and (max-width: 767px) {
    .c-kv__img {
        width: 100vw;
        margin: 0 calc(50% - 50vw);
    }
}
.c-kv__img img {
    display: block;
    width: 100%;
    height: auto;
}

/* ---------------------------------------------
*   c-link
--------------------------------------------- */
/* ---------------------------------------------
*   c-list
--------------------------------------------- */
/*  c-list-num
--------------------------------------------- */
.c-list-num {
    counter-reset: listnum;
}
.c-list-num__item {
    position: relative;
    margin-top: 12px;
    padding-left: 32px;
    font-weight: 500;
    font-size: 16px;
    line-height: 175%;
    letter-spacing: 0.8px;
}
@media screen and (max-width: 767px) {
    .c-list-num__item {
        margin-top: calc(12 / var(--design-width) * 100vw);
        padding-left: calc(32 / var(--design-width) * 100vw);
        font-size: calc(16 / var(--design-width) * 100vw);
    }
}
.c-list-num__item:first-of-type {
    margin-top: 0;
}
.c-list-num__item::before {
    counter-increment: listnum;
    content: counter(listnum);
    position: absolute;
    top: 2px;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    padding-bottom: 2px;
    border-radius: 50%;
    background-color: var(--color-green-1);
    color: var(--color-white-1);
}
@media screen and (max-width: 767px) {
    .c-list-num__item::before {
        top: calc(2 / var(--design-width) * 100vw);
        width: calc(24 / var(--design-width) * 100vw);
        height: calc(24 / var(--design-width) * 100vw);
        padding-bottom: calc(2 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-modal
--------------------------------------------- */
.c-modal {
    position: relative;
    z-index: 9;
    display: none;
}
.c-modal.is-open {
    display: block;
}
.c-modal__overlay {
    position: fixed;
    inset: 0;
}
.c-modal__inner {
    display: grid;
    place-items: center;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
}
.c-modal__container {
    position: relative;
    width: min(100%, 836px);
    max-height: 100vh;
    box-sizing: border-box;
    padding: 48px;
    border-radius: 32px;
    background-color: #fff;
}
@media screen and (max-width: 767px) {
    .c-modal__container {
        width: calc(350 / var(--design-width) * 100vw);
        padding: calc(20 / var(--design-width) * 100vw);
        border-radius: calc(32 / var(--design-width) * 100vw);
    }
}
.c-modal__close-btn {
    position: absolute;
    top: -8px;
    right: 0;
    transform: translateY(-100%);
    cursor: pointer;
}
@media screen and (max-width: 767px) {
    .c-modal__close-btn {
        top: calc(-8 / var(--design-width) * 100vw);
    }
}
.c-modal__close-btn::before {
    content: "";
    display: block;
    width: 48px;
    aspect-ratio: 1/1;
    background: url("../img/icon_close.svg") center center no-repeat;
    background-size: 100% auto;
}
@media screen and (max-width: 767px) {
    .c-modal__close-btn::before {
        width: calc(48 / var(--design-width) * 100vw);
    }
}
.c-modal__img img {
    display: block;
    width: 100%;
    height: auto;
}

/* Modal Animation Style (アニメーション不要の場合は削除)
--------------------------------------------- */
.c-modal[aria-hidden=false] .c-modal__overlay {
    animation: mmfadeIn 0.5s cubic-bezier(0, 0, 0.2, 1);
}
.c-modal[aria-hidden=false] .c-modal__container {
    animation: mmfadeIn 0.5s cubic-bezier(0, 0, 0.2, 1);
}
.c-modal[aria-hidden=true] .c-modal__overlay {
    animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}
.c-modal[aria-hidden=true] .c-modal__container {
    animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}
.c-modal__overlay, .c-modal__container {
    will-change: transform;
}

@keyframes mmfadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes mmfadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}
/* ---------------------------------------------
*   c-section
--------------------------------------------- */
.c-section {
    padding-block: 100px;
}
@media screen and (max-width: 767px) {
    .c-section {
        padding-block: calc(64 / var(--design-width) * 100vw);
    }
}
.c-section--bg-green {
    background-color: var(--color-lightgreen-1);
}
.c-section--bg-gray {
    background-color: var(--color-lightgray-1);
}
.c-section--point {
    position: relative;
    padding-bottom: 0;
    border-radius: 0 0 100px 100px;
}
@media screen and (max-width: 767px) {
    .c-section--point {
        border-radius: 0 0 calc(64 / var(--design-width) * 100vw) calc(64 / var(--design-width) * 100vw);
    }
}
.c-section--point::before {
    content: "";
    position: absolute;
    bottom: 2px;
    left: 50%;
    transform: translate(-50%, 100%);
    width: 139px;
    height: 42px;
    background: var(--color-lightgreen-1);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
}
@media screen and (max-width: 767px) {
    .c-section--point::before {
        bottom: calc(18 / var(--design-width) * 100vw);
        width: calc(139 / var(--design-width) * 100vw);
        height: calc(42 / var(--design-width) * 100vw);
    }
}
.c-section--faq {
    background: url("../img/illust_faq_01.svg") calc(50% + 285px) 0% no-repeat, url("../img/illust_faq_02.svg") calc(50% - 190px) 100% no-repeat;
    background-size: 369px auto, 226px auto;
    background-color: var(--color-lightgray-1);
}
@media screen and (max-width: 767px) {
    .c-section--faq {
        background-image: url("../img/sp/illust_faq_01.svg"), url("../img/sp/illust_faq_02.svg");
        background-position: calc(100% + 0 / var(--design-width) * 100vw) 0%, calc(0% - 0 / var(--design-width) * 100vw) 100%;
        background-size: calc(185 / var(--design-width) * 100vw) auto, calc(192 / var(--design-width) * 100vw) auto;
    }
}
.c-section--case {
    padding-bottom: 13.8888888889vw;
    background: url("../img/bg_case_illust.svg") center 100% no-repeat, url("../img/bg_case_object.svg") center 100% no-repeat;
    background-size: 100% auto, 100% auto;
    background-color: var(--color-lightgreen-1);
}
@media screen and (max-width: 1440px) {
    .c-section--case {
        padding-bottom: 200px;
        background-size: 1440px auto, 1440px auto;
    }
}
@media screen and (max-width: 767px) {
    .c-section--case {
        padding-bottom: calc(180 / var(--design-width) * 100vw);
        background-image: url("../img/sp/bg_case_illust.svg"), url("../img/sp/bg_case_object.svg");
        background-size: 100% auto, 100% auto;
    }
}
.c-section--dl {
    position: relative;
    background: url("../img/illust_download_left.svg") calc(50% - 420px) calc(100% - 24px) no-repeat, url("../img/illust_download_right.svg") calc(50% + 420px) calc(100% - 24px) no-repeat;
    background-size: 197px auto, 186px auto;
}
@media screen and (max-width: 1120px) {
    .c-section--dl {
        background-position: calc(50% - 37.5vw) calc(100% - 24px), calc(50% + 37.5vw) calc(100% - 24px);
    }
}
@media screen and (max-width: 767px) {
    .c-section--dl {
        padding-bottom: calc(100 / var(--design-width) * 100vw);
        background-position: calc(50% - 75 / var(--design-width) * 100vw) calc(100% - 10 / var(--design-width) * 100vw), calc(50% + 65 / var(--design-width) * 100vw) calc(100% - 10 / var(--design-width) * 100vw);
        background-size: calc(99 / var(--design-width) * 100vw) auto, calc(93 / var(--design-width) * 100vw) auto;
    }
}
.c-section__head {
    margin-bottom: 64px;
}
@media screen and (max-width: 767px) {
    .c-section__head {
        margin-bottom: calc(32 / var(--design-width) * 100vw);
    }
}
.c-section__foot {
    margin-top: 48px;
}
@media screen and (max-width: 767px) {
    .c-section__foot {
        margin-top: calc(32 / var(--design-width) * 100vw);
    }
}

/* ---------------------------------------------
*   c-slider
--------------------------------------------- */
/* ---------------------------------------------
*   c-table
--------------------------------------------- */
/* ---------------------------------------------
*   c-tile
--------------------------------------------- */
/* ---------------------------------------------
*   c-ttl
--------------------------------------------- */
.c-ttl {
    position: relative;
    padding-bottom: 35px;
}
@media screen and (max-width: 767px) {
    .c-ttl {
        padding-bottom: calc(23 / var(--design-width) * 100vw);
    }
}
.c-ttl::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100px;
    height: 3px;
    background: linear-gradient(90deg, var(--color-green-1) 0%, var(--color-green-1) 50%, var(--color-black-1) 50%, var(--color-black-1) 100%);
}
@media screen and (max-width: 767px) {
    .c-ttl::before {
        width: calc(100 / var(--design-width) * 100vw);
        height: calc(3 / var(--design-width) * 100vw);
    }
}
.c-ttl__txt {
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 1.6px;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-ttl__txt {
        font-size: calc(24 / var(--design-width) * 100vw);
        letter-spacing: 1.2px;
    }
}

/*  c-ttl-balloon
--------------------------------------------- */
.c-ttl-balloon {
    position: relative;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
    padding: 16px 32px;
    border-radius: 20px;
    background-color: var(--color-green-1);
}
@media screen and (max-width: 767px) {
    .c-ttl-balloon {
        padding: calc(16 / var(--design-width) * 100vw) calc(20 / var(--design-width) * 100vw);
        border-radius: calc(20 / var(--design-width) * 100vw);
    }
}
.c-ttl-balloon::before {
    content: "";
    position: absolute;
    bottom: 4px;
    left: 50%;
    transform: translate(-50%, 100%);
    width: 52px;
    height: 21px;
    background: var(--color-green-1);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
}
@media screen and (max-width: 767px) {
    .c-ttl-balloon::before {
        bottom: calc(4 / var(--design-width) * 100vw);
        width: calc(52 / var(--design-width) * 100vw);
        height: calc(21 / var(--design-width) * 100vw);
    }
}
.c-ttl-balloon--s {
    padding: 12px 24px;
}
@media screen and (max-width: 767px) {
    .c-ttl-balloon--s {
        padding: calc(12 / var(--design-width) * 100vw) calc(24 / var(--design-width) * 100vw);
    }
}
.c-ttl-balloon--s::before {
    width: 35px;
    height: 14px;
    bottom: 2px;
}
@media screen and (max-width: 767px) {
    .c-ttl-balloon--s::before {
        width: calc(35 / var(--design-width) * 100vw);
        height: calc(14 / var(--design-width) * 100vw);
        bottom: calc(2 / var(--design-width) * 100vw);
    }
}
.c-ttl-balloon__txt {
    color: var(--color-white-1);
    font-weight: 700;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 1.2px;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .c-ttl-balloon__txt {
        font-size: calc(18 / var(--design-width) * 100vw);
        letter-spacing: 0.9px;
    }
}
.c-ttl-balloon--s .c-ttl-balloon__txt {
    font-size: 18px;
    letter-spacing: 1.2px;
}
@media screen and (max-width: 767px) {
    .c-ttl-balloon--s .c-ttl-balloon__txt {
        font-size: calc(16 / var(--design-width) * 100vw);
        letter-spacing: 0.8px;
    }
}
.c-ttl-balloon--s .c-ttl-balloon__txt em {
    display: inline-block;
    font-size: 24px;
    letter-spacing: 1.2px;
}
@media screen and (max-width: 767px) {
    .c-ttl-balloon--s .c-ttl-balloon__txt em {
        font-size: calc(20 / var(--design-width) * 100vw);
        letter-spacing: 1px;
    }
}

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

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

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

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

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

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

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

.js-acc-scope.is-open .js-acc-target {
    animation: openAccAnim 0.5s forwards;
}

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

/* フェードイン */
.js-fadein {
    opacity: 0;
}
.js-fadein.is-active {
    opacity: 1;
    transition: opacity 1s;
}

/* フェードインアップ */
.js-fadein-up {
    opacity: 0;
    transform: translateY(50px);
}
.js-fadein-up.is-active {
    transform: translateY(0);
    opacity: 1;
    transition: transform 0.8s, opacity 1s;
}

/* 左にスライド */
.js-slidein-to-left {
    opacity: 0;
    transform: translateX(50px);
}
.js-slidein-to-left.is-active {
    transform: translateX(0);
    opacity: 1;
    transition: transform 0.8s, opacity 1s;
}

/* 右にスライド */
.js-slidein-to-right {
    opacity: 0;
    transform: translateX(-50px);
}
.js-slidein-to-right.is-active {
    transform: translateX(0);
    opacity: 1;
    transition: transform 0.8s, opacity 1s;
}

@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;
    }
}
/* ---------------------------------------------
*   margin-top
--------------------------------------------- */
.mgt-pc--0 {
    margin-top: 0 !important;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@media screen and (max-width: 767px) {
    .mgt-sp--0 {
        margin-top: 0 !important;
    }
    .mgt-sp--8 {
        margin-top: calc(8 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--16 {
        margin-top: calc(16 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--24 {
        margin-top: calc(24 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--32 {
        margin-top: calc(32 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--40 {
        margin-top: calc(40 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--48 {
        margin-top: calc(48 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--56 {
        margin-top: calc(56 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--64 {
        margin-top: calc(64 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--72 {
        margin-top: calc(72 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--80 {
        margin-top: calc(80 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--88 {
        margin-top: calc(88 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--96 {
        margin-top: calc(96 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--104 {
        margin-top: calc(104 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--112 {
        margin-top: calc(112 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--120 {
        margin-top: calc(120 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--128 {
        margin-top: calc(128 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--136 {
        margin-top: calc(136 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--144 {
        margin-top: calc(144 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--152 {
        margin-top: calc(152 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--160 {
        margin-top: calc(160 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--168 {
        margin-top: calc(168 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--176 {
        margin-top: calc(176 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--184 {
        margin-top: calc(184 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--192 {
        margin-top: calc(192 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--200 {
        margin-top: calc(200 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--208 {
        margin-top: calc(208 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--216 {
        margin-top: calc(216 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--224 {
        margin-top: calc(224 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--232 {
        margin-top: calc(232 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--240 {
        margin-top: calc(240 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--248 {
        margin-top: calc(248 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--256 {
        margin-top: calc(256 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--264 {
        margin-top: calc(264 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--272 {
        margin-top: calc(272 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--280 {
        margin-top: calc(280 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--288 {
        margin-top: calc(288 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--296 {
        margin-top: calc(296 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--304 {
        margin-top: calc(304 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--312 {
        margin-top: calc(312 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--320 {
        margin-top: calc(320 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--328 {
        margin-top: calc(328 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--336 {
        margin-top: calc(336 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--344 {
        margin-top: calc(344 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--352 {
        margin-top: calc(352 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--360 {
        margin-top: calc(360 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--368 {
        margin-top: calc(368 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--376 {
        margin-top: calc(376 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--384 {
        margin-top: calc(384 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--392 {
        margin-top: calc(392 / var(--design-width) * 100vw) !important;
    }
    .mgt-sp--400 {
        margin-top: calc(400 / var(--design-width) * 100vw) !important;
    }
}
/* ---------------------------------------------
*   margin-bottom
--------------------------------------------- */
.mgb-pc--0 {
    margin-bottom: 0 !important;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@media screen and (max-width: 767px) {
    .mgb-sp--0 {
        margin-bottom: 0 !important;
    }
    .mgb-sp--8 {
        margin-bottom: calc(8 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--16 {
        margin-bottom: calc(16 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--24 {
        margin-bottom: calc(24 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--32 {
        margin-bottom: calc(32 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--40 {
        margin-bottom: calc(40 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--48 {
        margin-bottom: calc(48 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--56 {
        margin-bottom: calc(56 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--64 {
        margin-bottom: calc(64 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--72 {
        margin-bottom: calc(72 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--80 {
        margin-bottom: calc(80 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--88 {
        margin-bottom: calc(88 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--96 {
        margin-bottom: calc(96 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--104 {
        margin-bottom: calc(104 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--112 {
        margin-bottom: calc(112 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--120 {
        margin-bottom: calc(120 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--128 {
        margin-bottom: calc(128 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--136 {
        margin-bottom: calc(136 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--144 {
        margin-bottom: calc(144 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--152 {
        margin-bottom: calc(152 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--160 {
        margin-bottom: calc(160 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--168 {
        margin-bottom: calc(168 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--176 {
        margin-bottom: calc(176 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--184 {
        margin-bottom: calc(184 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--192 {
        margin-bottom: calc(192 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--200 {
        margin-bottom: calc(200 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--208 {
        margin-bottom: calc(208 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--216 {
        margin-bottom: calc(216 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--224 {
        margin-bottom: calc(224 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--232 {
        margin-bottom: calc(232 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--240 {
        margin-bottom: calc(240 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--248 {
        margin-bottom: calc(248 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--256 {
        margin-bottom: calc(256 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--264 {
        margin-bottom: calc(264 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--272 {
        margin-bottom: calc(272 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--280 {
        margin-bottom: calc(280 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--288 {
        margin-bottom: calc(288 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--296 {
        margin-bottom: calc(296 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--304 {
        margin-bottom: calc(304 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--312 {
        margin-bottom: calc(312 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--320 {
        margin-bottom: calc(320 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--328 {
        margin-bottom: calc(328 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--336 {
        margin-bottom: calc(336 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--344 {
        margin-bottom: calc(344 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--352 {
        margin-bottom: calc(352 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--360 {
        margin-bottom: calc(360 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--368 {
        margin-bottom: calc(368 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--376 {
        margin-bottom: calc(376 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--384 {
        margin-bottom: calc(384 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--392 {
        margin-bottom: calc(392 / var(--design-width) * 100vw) !important;
    }
    .mgb-sp--400 {
        margin-bottom: calc(400 / var(--design-width) * 100vw) !important;
    }
}
/* ---------------------------------------------
*   padding-top
--------------------------------------------- */
.pdt-pc--0 {
    padding-top: 0 !important;
}

.pdt-pc--8 {
    padding-top: 8px !important;
}

.pdt-pc--16 {
    padding-top: 16px !important;
}

.pdt-pc--24 {
    padding-top: 24px !important;
}

.pdt-pc--32 {
    padding-top: 32px !important;
}

.pdt-pc--40 {
    padding-top: 40px !important;
}

.pdt-pc--48 {
    padding-top: 48px !important;
}

.pdt-pc--56 {
    padding-top: 56px !important;
}

.pdt-pc--64 {
    padding-top: 64px !important;
}

.pdt-pc--72 {
    padding-top: 72px !important;
}

.pdt-pc--80 {
    padding-top: 80px !important;
}

.pdt-pc--88 {
    padding-top: 88px !important;
}

.pdt-pc--96 {
    padding-top: 96px !important;
}

.pdt-pc--104 {
    padding-top: 104px !important;
}

.pdt-pc--112 {
    padding-top: 112px !important;
}

.pdt-pc--120 {
    padding-top: 120px !important;
}

.pdt-pc--128 {
    padding-top: 128px !important;
}

.pdt-pc--136 {
    padding-top: 136px !important;
}

.pdt-pc--144 {
    padding-top: 144px !important;
}

.pdt-pc--152 {
    padding-top: 152px !important;
}

.pdt-pc--160 {
    padding-top: 160px !important;
}

.pdt-pc--168 {
    padding-top: 168px !important;
}

.pdt-pc--176 {
    padding-top: 176px !important;
}

.pdt-pc--184 {
    padding-top: 184px !important;
}

.pdt-pc--192 {
    padding-top: 192px !important;
}

.pdt-pc--200 {
    padding-top: 200px !important;
}

.pdt-pc--208 {
    padding-top: 208px !important;
}

.pdt-pc--216 {
    padding-top: 216px !important;
}

.pdt-pc--224 {
    padding-top: 224px !important;
}

.pdt-pc--232 {
    padding-top: 232px !important;
}

.pdt-pc--240 {
    padding-top: 240px !important;
}

.pdt-pc--248 {
    padding-top: 248px !important;
}

.pdt-pc--256 {
    padding-top: 256px !important;
}

.pdt-pc--264 {
    padding-top: 264px !important;
}

.pdt-pc--272 {
    padding-top: 272px !important;
}

.pdt-pc--280 {
    padding-top: 280px !important;
}

.pdt-pc--288 {
    padding-top: 288px !important;
}

.pdt-pc--296 {
    padding-top: 296px !important;
}

.pdt-pc--304 {
    padding-top: 304px !important;
}

.pdt-pc--312 {
    padding-top: 312px !important;
}

.pdt-pc--320 {
    padding-top: 320px !important;
}

.pdt-pc--328 {
    padding-top: 328px !important;
}

.pdt-pc--336 {
    padding-top: 336px !important;
}

.pdt-pc--344 {
    padding-top: 344px !important;
}

.pdt-pc--352 {
    padding-top: 352px !important;
}

.pdt-pc--360 {
    padding-top: 360px !important;
}

.pdt-pc--368 {
    padding-top: 368px !important;
}

.pdt-pc--376 {
    padding-top: 376px !important;
}

.pdt-pc--384 {
    padding-top: 384px !important;
}

.pdt-pc--392 {
    padding-top: 392px !important;
}

.pdt-pc--400 {
    padding-top: 400px !important;
}

@media screen and (max-width: 767px) {
    .pdt-sp--0 {
        padding-top: 0 !important;
    }
    .pdt-sp--8 {
        padding-top: calc(8 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--16 {
        padding-top: calc(16 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--24 {
        padding-top: calc(24 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--32 {
        padding-top: calc(32 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--40 {
        padding-top: calc(40 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--48 {
        padding-top: calc(48 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--56 {
        padding-top: calc(56 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--64 {
        padding-top: calc(64 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--72 {
        padding-top: calc(72 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--80 {
        padding-top: calc(80 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--88 {
        padding-top: calc(88 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--96 {
        padding-top: calc(96 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--104 {
        padding-top: calc(104 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--112 {
        padding-top: calc(112 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--120 {
        padding-top: calc(120 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--128 {
        padding-top: calc(128 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--136 {
        padding-top: calc(136 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--144 {
        padding-top: calc(144 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--152 {
        padding-top: calc(152 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--160 {
        padding-top: calc(160 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--168 {
        padding-top: calc(168 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--176 {
        padding-top: calc(176 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--184 {
        padding-top: calc(184 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--192 {
        padding-top: calc(192 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--200 {
        padding-top: calc(200 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--208 {
        padding-top: calc(208 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--216 {
        padding-top: calc(216 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--224 {
        padding-top: calc(224 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--232 {
        padding-top: calc(232 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--240 {
        padding-top: calc(240 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--248 {
        padding-top: calc(248 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--256 {
        padding-top: calc(256 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--264 {
        padding-top: calc(264 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--272 {
        padding-top: calc(272 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--280 {
        padding-top: calc(280 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--288 {
        padding-top: calc(288 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--296 {
        padding-top: calc(296 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--304 {
        padding-top: calc(304 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--312 {
        padding-top: calc(312 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--320 {
        padding-top: calc(320 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--328 {
        padding-top: calc(328 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--336 {
        padding-top: calc(336 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--344 {
        padding-top: calc(344 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--352 {
        padding-top: calc(352 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--360 {
        padding-top: calc(360 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--368 {
        padding-top: calc(368 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--376 {
        padding-top: calc(376 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--384 {
        padding-top: calc(384 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--392 {
        padding-top: calc(392 / var(--design-width) * 100vw) !important;
    }
    .pdt-sp--400 {
        padding-top: calc(400 / var(--design-width) * 100vw) !important;
    }
}
/* ---------------------------------------------
*   padding-bottom
--------------------------------------------- */
.pdb-pc--0 {
    padding-bottom: 0 !important;
}

.pdb-pc--8 {
    padding-bottom: 8px !important;
}

.pdb-pc--16 {
    padding-bottom: 16px !important;
}

.pdb-pc--24 {
    padding-bottom: 24px !important;
}

.pdb-pc--32 {
    padding-bottom: 32px !important;
}

.pdb-pc--40 {
    padding-bottom: 40px !important;
}

.pdb-pc--48 {
    padding-bottom: 48px !important;
}

.pdb-pc--56 {
    padding-bottom: 56px !important;
}

.pdb-pc--64 {
    padding-bottom: 64px !important;
}

.pdb-pc--72 {
    padding-bottom: 72px !important;
}

.pdb-pc--80 {
    padding-bottom: 80px !important;
}

.pdb-pc--88 {
    padding-bottom: 88px !important;
}

.pdb-pc--96 {
    padding-bottom: 96px !important;
}

.pdb-pc--104 {
    padding-bottom: 104px !important;
}

.pdb-pc--112 {
    padding-bottom: 112px !important;
}

.pdb-pc--120 {
    padding-bottom: 120px !important;
}

.pdb-pc--128 {
    padding-bottom: 128px !important;
}

.pdb-pc--136 {
    padding-bottom: 136px !important;
}

.pdb-pc--144 {
    padding-bottom: 144px !important;
}

.pdb-pc--152 {
    padding-bottom: 152px !important;
}

.pdb-pc--160 {
    padding-bottom: 160px !important;
}

.pdb-pc--168 {
    padding-bottom: 168px !important;
}

.pdb-pc--176 {
    padding-bottom: 176px !important;
}

.pdb-pc--184 {
    padding-bottom: 184px !important;
}

.pdb-pc--192 {
    padding-bottom: 192px !important;
}

.pdb-pc--200 {
    padding-bottom: 200px !important;
}

.pdb-pc--208 {
    padding-bottom: 208px !important;
}

.pdb-pc--216 {
    padding-bottom: 216px !important;
}

.pdb-pc--224 {
    padding-bottom: 224px !important;
}

.pdb-pc--232 {
    padding-bottom: 232px !important;
}

.pdb-pc--240 {
    padding-bottom: 240px !important;
}

.pdb-pc--248 {
    padding-bottom: 248px !important;
}

.pdb-pc--256 {
    padding-bottom: 256px !important;
}

.pdb-pc--264 {
    padding-bottom: 264px !important;
}

.pdb-pc--272 {
    padding-bottom: 272px !important;
}

.pdb-pc--280 {
    padding-bottom: 280px !important;
}

.pdb-pc--288 {
    padding-bottom: 288px !important;
}

.pdb-pc--296 {
    padding-bottom: 296px !important;
}

.pdb-pc--304 {
    padding-bottom: 304px !important;
}

.pdb-pc--312 {
    padding-bottom: 312px !important;
}

.pdb-pc--320 {
    padding-bottom: 320px !important;
}

.pdb-pc--328 {
    padding-bottom: 328px !important;
}

.pdb-pc--336 {
    padding-bottom: 336px !important;
}

.pdb-pc--344 {
    padding-bottom: 344px !important;
}

.pdb-pc--352 {
    padding-bottom: 352px !important;
}

.pdb-pc--360 {
    padding-bottom: 360px !important;
}

.pdb-pc--368 {
    padding-bottom: 368px !important;
}

.pdb-pc--376 {
    padding-bottom: 376px !important;
}

.pdb-pc--384 {
    padding-bottom: 384px !important;
}

.pdb-pc--392 {
    padding-bottom: 392px !important;
}

.pdb-pc--400 {
    padding-bottom: 400px !important;
}

@media screen and (max-width: 767px) {
    .pdb-sp--0 {
        padding-bottom: 0 !important;
    }
    .pdb-sp--8 {
        padding-bottom: calc(8 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--16 {
        padding-bottom: calc(16 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--24 {
        padding-bottom: calc(24 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--32 {
        padding-bottom: calc(32 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--40 {
        padding-bottom: calc(40 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--48 {
        padding-bottom: calc(48 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--56 {
        padding-bottom: calc(56 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--64 {
        padding-bottom: calc(64 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--72 {
        padding-bottom: calc(72 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--80 {
        padding-bottom: calc(80 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--88 {
        padding-bottom: calc(88 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--96 {
        padding-bottom: calc(96 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--104 {
        padding-bottom: calc(104 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--112 {
        padding-bottom: calc(112 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--120 {
        padding-bottom: calc(120 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--128 {
        padding-bottom: calc(128 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--136 {
        padding-bottom: calc(136 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--144 {
        padding-bottom: calc(144 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--152 {
        padding-bottom: calc(152 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--160 {
        padding-bottom: calc(160 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--168 {
        padding-bottom: calc(168 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--176 {
        padding-bottom: calc(176 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--184 {
        padding-bottom: calc(184 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--192 {
        padding-bottom: calc(192 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--200 {
        padding-bottom: calc(200 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--208 {
        padding-bottom: calc(208 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--216 {
        padding-bottom: calc(216 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--224 {
        padding-bottom: calc(224 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--232 {
        padding-bottom: calc(232 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--240 {
        padding-bottom: calc(240 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--248 {
        padding-bottom: calc(248 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--256 {
        padding-bottom: calc(256 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--264 {
        padding-bottom: calc(264 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--272 {
        padding-bottom: calc(272 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--280 {
        padding-bottom: calc(280 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--288 {
        padding-bottom: calc(288 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--296 {
        padding-bottom: calc(296 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--304 {
        padding-bottom: calc(304 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--312 {
        padding-bottom: calc(312 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--320 {
        padding-bottom: calc(320 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--328 {
        padding-bottom: calc(328 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--336 {
        padding-bottom: calc(336 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--344 {
        padding-bottom: calc(344 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--352 {
        padding-bottom: calc(352 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--360 {
        padding-bottom: calc(360 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--368 {
        padding-bottom: calc(368 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--376 {
        padding-bottom: calc(376 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--384 {
        padding-bottom: calc(384 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--392 {
        padding-bottom: calc(392 / var(--design-width) * 100vw) !important;
    }
    .pdb-sp--400 {
        padding-bottom: calc(400 / var(--design-width) * 100vw) !important;
    }
}