@media (max-width: 600px) {
    .pc {
        display: none;
    }

    .sp {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    body {
        margin: 0px;
    }
    .sp-header-background{
        position: fixed;
        z-index: 11;
        top: 0;
        background: white;
        box-shadow: 0 1px 3px 1px #afafaf;
        width:100%;
    }
    .sp-header {
        width: 375px;
        height: 64px;
        overflow: hidden;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .rectangle-160 {
        background: rgba(255, 255, 255, 0.85);
        width: 100%;
        height: 64px;
        position: absolute;
        left: 0;
        top: 0;
    }

    .logo {
        width: 144px;
        height: 36px;
        position: absolute;
        left: 5px;
        top: 14px;
        overflow: hidden;
    }

    .group-167 {
        width: 99.19%;
        height: 100%;
        position: absolute;
        right: 0.44%;
        left: 0.38%;
        bottom: 0%;
        top: 0%;
        overflow: visible;
    }

    .menu-btn {
        width: 24px;
        height: 24px;
        position: absolute;
        right: 20px;
    }

    /*menu*/


    .navigation-menu {
        display: none;
        max-width: 100%;
        font-family:
            Noto Sans JP,
            -apple-system,
            Roboto,
            Helvetica,
            sans-serif;
        font-size: 18px;
        color: #000000;
        font-weight: 700;
        white-space: nowrap;
        text-align: center;
        line-height: 2;
        z-index: 11;
        position: fixed;
        top: 64px;
    }

    .navigation-container {
        background-color: rgba(255, 255, 255, 0.85);
        display: flex;
        width: 100vw;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background-color: rgb(255 255 255 / 94%);
        /* 背景色に透過を適用 */
        padding: 20px;
        position: relative;
        /* 配置のため */
        z-index: 5;
        /* 前面に表示 */
        border-bottom: 1px solid #d5c8c8;
    }

    .navigation-links {
        display: flex;
        width: 50%;
        max-width: 388px;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
        margin-top: 20px;
    }

    .nav-item {
        font-size: 18px;
        margin: 0;
        font-weight: bold;
        color: #000;
    }

    .success-record {
        margin-top: 32px;
    }

    .usage-flow {
        align-self: stretch;
        margin-top: 32px;
    }


    /*
    fv
    */

    .sp-fv {
        flex-shrink: 0;
        width: 375px;
        height: 624px;
        position: relative;
        margin-top: 65px;
    }

    .sp-fv-bg {
        width: 100%;
        height: 624px;
        position: absolute;
        top: 64px;
        overflow: hidden;
        background-image: url(../img/sp/bg.png);
        background-size: cover;
        background-position: center;
    }

    .group-164 {
        position: absolute;
        inset: 0;
    }

    .black-back-5 {
        width: 100%;
        height: 60.1%;
        position: absolute;
        right: -100%;
        left: 100%;
        bottom: 39.9%;
        top: 0%;
        transform-origin: 0 0;
        transform: rotate(90deg) scale(1, 1);
        object-fit: cover;
    }

    .black-back-52 {
        width: 100%;
        height: 60.1%;
        position: absolute;
        right: -100%;
        left: 100%;
        bottom: -20.19%;
        top: 60.1%;
        transform-origin: 0 0;
        transform: rotate(90deg) scale(1, 1);
        object-fit: cover;
    }


    .div {
        background: linear-gradient(180deg,
                rgba(97, 177, 210, 0) 0%,
                rgba(0, 25, 40, 0.35) 100%);
        width: 375px;
        height: 562px;
        position: absolute;
        left: 0px;
        bottom: 0px;
    }

    .fv-text {
        color: var(--white, #ffffff);
        text-align: center;
        font-family: var(--md-text-xs-font-family, "NotoSansJp-Medium", sans-serif);
        font-size: var(--md-text-xs-font-size, 10px);
        line-height: var(--md-text-xs-line-height, 12px);
        font-weight: var(--md-text-xs-font-weight, 500);
        position: absolute;
        left: calc(50% - 163.5px);
        top: 340px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .catch {
        position: absolute;
        inset: 0;
    }

    .circle3 {
        border-radius: 50%;
        border-style: solid;
        border-color: rgba(255, 255, 255, 0.45);
        border-width: 1.5px;
        width: 104px;
        height: 104px;
        position: absolute;
        left: 247px;
        top: 224px;
    }

    .circle3-highlight {
        color: var(--gold1, #d7be5a);
        text-align: center;
        font-family: var(--bold-text-xl-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-xl-font-size, 20px);
        line-height: var(--bold-text-xl-line-height, 28px);
        font-weight: var(--bold-text-xl-font-weight, 700);
        position: absolute;
        left: 258px;
        top: 280px;
        display: flex;
        align-items: flex-end;
        justify-content: center;
    }

    .circle3-text {
        color: #ffffff;
        text-align: center;
        font-family: var(--bold-text-2sm-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-2sm-font-size, 12px);
        line-height: var(--bold-text-2sm-line-height, 18px);
        font-weight: var(--bold-text-2sm-font-weight, 700);
        position: absolute;
        left: calc(49% - -74.5px);
        top: 252px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .border {
        background: rgba(255, 255, 255, 0.5);
        width: 7.5px;
        height: 1px;
        position: absolute;
        left: 128px;
        top: 275px;
    }

    .circle2 {
        border-radius: 50%;
        border-style: solid;
        border-color: rgba(255, 255, 255, 0.45);
        border-width: 1.5px;
        width: 104px;
        height: 104px;
        position: absolute;
        left: 135.5px;
        top: 224px;
    }

    .circle2-highlight {
        color: var(--gold1, #d7be5a);
        text-align: justified;
        font-family: var(--bold-text-xl-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-xl-font-size, 20px);
        line-height: var(--bold-text-xl-line-height, 28px);
        font-weight: var(--bold-text-xl-font-weight, 700);
        position: absolute;
        left: 150.5px;
        top: 280px;
        display: flex;
        align-items: flex-end;
    }

    .circle2-text {
        color: #ffffff;
        text-align: center;
        font-family: var(--bold-text-2sm-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-2sm-font-size, 12px);
        line-height: var(--bold-text-2sm-line-height, 18px);
        font-weight: var(--bold-text-2sm-font-weight, 700);
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 253px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .border2 {
        background: rgba(255, 255, 255, 0.5);
        width: 7.5px;
        height: 1px;
        position: absolute;
        left: 239.5px;
        top: 275px;
    }

    .circle-text {
        color: #ffffff;
        text-align: center;
        font-family: var(--bold-text-2sm-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-2sm-font-size, 12px);
        line-height: var(--bold-text-2sm-line-height, 18px);
        font-weight: var(--bold-text-2sm-font-weight, 700);
        position: absolute;
        left: calc(49% - 143.5px);
        top: 253px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .circle-highlight {
        color: var(--gold1, #d7be5a);
        text-align: justified;
        font-family: var(--bold-text-xl-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-xl-font-size, 20px);
        line-height: var(--bold-text-xl-line-height, 28px);
        font-weight: var(--bold-text-xl-font-weight, 700);
        position: absolute;
        left: 50px;
        top: 280px;
        display: flex;
        align-items: center;
    }

    .circle {
        border-radius: 50%;
        border-style: solid;
        border-color: rgba(255, 255, 255, 0.45);
        border-width: 1.5px;
        width: 104px;
        height: 104px;
        position: absolute;
        left: 24px;
        top: 224px;
    }

    .human {
        width: 280px;
        height: 306px;
        position: absolute;
        left: 71px;
        bottom: 0px;
    }

    .human-1 {
        width: 280px;
        height: 306px;
        position: absolute;
        left: 0px;
        top: 0px;
        object-fit: cover;
    }

    .fv-text2 {
        color: var(--white, #ffffff);
        text-align: left;
        font-family: var(--bold-text-sm-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-sm-font-size, 14px);
        line-height: var(--bold-text-sm-line-height, 22px);
        font-weight: var(--bold-text-sm-font-weight, 700);
        position: absolute;
        left: 24px;
        top: 164px;
        width: 255px;
    }

    .h1 {
        color: var(--white, #ffffff);
        text-align: justified;
        font-family: var(--bold-3xl-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-3xl-font-size, 30px);
        line-height: var(--bold-3xl-line-height, 36px);
        font-weight: var(--bold-3xl-font-weight, 700);
        position: absolute;
        left: 24px;
        top: 40px;
        width: 327px;
    }

    .button {
        background: var(--cv, #fa3c3c);
        border-radius: 40px;
        padding: 12px 40px 12px 40px;
        display: flex;
        flex-direction: row;
        gap: 0px;
        align-items: center;
        justify-content: center;
        width: 230px;
        height: 30px;
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 531px;
    }

    .btn-text {
        color: #ffffff;
        text-align: center;
        font-family: var(--bold-text-base-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-base-font-size, 16px);
        line-height: var(--bold-text-base-line-height, 24px);
        font-weight: var(--bold-text-base-font-weight, 700);
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /*
  about
  */

    .sp-about {
        background: #ffffff;
        width: 375px;
        flex-shrink: 0;
        height: 308px;
        position: relative;
    }

    .about-text {
        text-align: center;
        font-family: "-", serif;
        font-size: 24px;
        line-height: 40px;
        font-weight: 400;
        position: absolute;
        left: 34px;
        top: 108px;
        width: 327px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .text1 {
        color: var(--black, #1d1d1d);
        font-family: "NotoSerifJp-SemiBold", serif;
        font-size: 24px;
        line-height: 40px;
        font-weight: 600;
    }

    .text-highlight {
        color: #cdb964;
        font-family: "NotoSerifJp-Bold", serif;
        font-size: 24px;
        line-height: 40px;
        font-weight: 700;
    }

    .text2 {
        color: var(--black, #1d1d1d);
        font-family: "NotoSerifJp-SemiBold", serif;
        font-size: 24px;
        line-height: 40px;
        font-weight: 600;
    }

    .text3 {
        color: #1d1d1d;
        font-family: "NotoSerifJp-SemiBold", serif;
        font-size: 24px;
        line-height: 40px;
        font-weight: 600;
    }

    .sp-leaf {
        width: 296px;
        height: 28px;
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 56px;
        overflow: hidden;
    }

    .leaf-img {
        width: 100%;
        height: 96.93%;
        position: absolute;
        right: 0%;
        left: 0%;
        bottom: 3.07%;
        top: 0%;
        overflow: visible;
    }

    /*characteristics*/
    .sp-characteristics-bg2 {
        width: 100%;
        height: 679px;
        position: absolute;
        top: 1984px;
        background-image: url(../img/sp/cyaan-back-60.png);
    }

    .sp-characteristics-bg {
        width: 100%;
        height: 651px;
        position: absolute;
        top: 1261px;
        background-image: url(../img/sp/cyaan-back-60.png);
    }

    .sp-characteristics {
        width: 375px;
        flex-shrink: 0;
        height: 1667px;
        position: relative;
        overflow: hidden;
    }

    .characteristics-back {
        background: #ffffff;
        width: 388px;
        height: 679px;
        position: absolute;
        right: 0px;
        bottom: 0px;
        overflow: hidden;
    }

    .bg1 {
        width: 100%;
        height: 60.23%;
        position: absolute;
        right: -100%;
        left: 100%;
        bottom: 44.77%;
        top: 0%;
        transform-origin: 0 0;
        transform: rotate(90deg) scale(1, 1);
        object-fit: cover;
    }

    .bg2 {
        width: 100%;
        height: 60.23%;
        position: absolute;
        right: -100%;
        left: 100%;
        bottom: -10.46%;
        top: 55.23%;
        transform-origin: 0 0;
        transform: rotate(90deg) scale(1, 1);
        object-fit: cover;
    }

    .rectangle-154 {
        background: #ffffff;
        border-radius: 4px;
        width: 335px;
        height: 446px;
        position: absolute;
        left: 28px;
        top: 1197px;
    }

    .characteristics-text2 {
        color: #000000;
        text-align: justified;
        font-family: var(--md-test-base2-font-family,
                "NotoSansJp-Medium",
                sans-serif);
        font-size: var(--md-test-base2-font-size, 16px);
        line-height: var(--md-test-base2-line-height, 28px);
        font-weight: var(--md-test-base2-font-weight, 500);
        position: absolute;
        left: 53px;
        top: 1311px;
        width: 303px;
        height: 308px;
        display: flex;
        align-items: center;
    }

    .characteristics-line {
        background: var(--gold2, #cdb964);
        width: 240px;
        height: 2px;
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 1289px;
    }

    .characteristics-h-text2 {
        color: var(--black, #191919);
        text-align: center;
        font-family: var(--bold-text-xl-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-xl-font-size, 20px);
        line-height: var(--bold-text-xl-line-height, 28px);
        font-weight: var(--bold-text-xl-font-weight, 700);
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 1221px;
        width: 295px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .characteristics-human {
        background: #ffffff;
        width: 335px;
        height: 212.54px;
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 964px;
        overflow: hidden;
    }

    .human-img {
        width: 110.5%;
        height: 127.98%;
        position: absolute;
        right: -7.56%;
        left: -2.94%;
        bottom: -17.4%;
        top: -10.58%;
        object-fit: cover;
    }

    .characteristics-back2 {
        background: #ffffff;
        width: 388px;
        height: 651px;
        position: absolute;
        left: 0px;
        top: 265px;
        overflow: hidden;
    }

    .bg3 {
        width: 100%;
        height: 60%;
        position: absolute;
        right: -100%;
        left: 100%;
        bottom: 42.4%;
        top: 0%;
        transform-origin: 0 0;
        transform: rotate(90deg) scale(1, 1);
        object-fit: cover;
    }

    .bg4 {
        width: 100%;
        height: 60%;
        position: absolute;
        right: -100%;
        left: 100%;
        bottom: -15.21%;
        top: 57.6%;
        transform-origin: 0 0;
        transform: rotate(90deg) scale(1, 1);
        object-fit: cover;
    }

    .characteristics-human2 {
        background: #ffffff;
        width: 335px;
        height: 212.54px;
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 241px;
        overflow: hidden;
    }

    .human-img2 {
        width: 117.65%;
        height: 105.96%;
        position: absolute;
        right: -12.82%;
        left: -4.83%;
        bottom: -0.99%;
        top: -4.97%;
        object-fit: cover;
    }

    .rectangle-138 {
        background: #ffffff;
        border-radius: 4px;
        width: 335px;
        height: 418px;
        position: absolute;
        left: 28px;
        top: 474px;
    }

    .characteristics-h-text {
        color: var(--black, #191919);
        text-align: center;
        font-family: var(--bold-text-xl-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-xl-font-size, 20px);
        line-height: var(--bold-text-xl-line-height, 28px);
        font-weight: var(--bold-text-xl-font-weight, 700);
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 498px;
        width: 303px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .characteristics-line2 {
        background: var(--gold2, #cdb964);
        width: 240px;
        height: 2px;
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 566px;
    }

    .characteristics-text {
        color: #000000;
        text-align: justified;
        font-family: var(--md-test-base2-font-family,
                "NotoSansJp-Medium",
                sans-serif);
        font-size: var(--md-test-base2-font-size, 16px);
        line-height: var(--md-test-base2-line-height, 28px);
        font-weight: var(--md-test-base2-font-weight, 500);
        position: absolute;
        left: 50px;
        top: 588px;
        width: 303px;
        height: 280px;
        display: flex;
        align-items: center;
    }

    .characteristics-sub-top {
        width: 164px;
        height: 29px;
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 64px;
    }

    .characteristics-sub {
        color: var(--gray, #c8c8c8);
        text-align: justified;
        font-family: var(--bold-text-lg-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-lg-font-size, 18px);
        line-height: var(--bold-text-lg-line-height, 28px);
        font-weight: var(--bold-text-lg-font-weight, 700);
        position: absolute;
        right: 0%;
        left: 0%;
        width: 100%;
        bottom: 3.45%;
        top: 0%;
        height: 96.55%;
        display: flex;
        align-items: center;
    }

    .characteristics-sub-line {
        background: var(--gray, #c8c8c8);
        width: 183px;
        height: 3.45%;
        position: absolute;
        right: 0%;
        left: 0%;
        bottom: 0%;
        top: 96.55%;
    }

    .characteristics-sub-text {
        color: var(--black, #191919);
        text-align: center;
        font-family: var(--sp-h2-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--sp-h2-font-size, 28px);
        line-height: var(--sp-h2-line-height, 40px);
        font-weight: var(--sp-h2-font-weight, 700);
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 113px;
        width: 320px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /*success*/

    .success-section-bg {
        width: 100%;
        height: 3703px;
        position: absolute;
        top: 2663px;
        z-index: -1;
        background-image: url(../img/bg.png);
        background-size: cover;
    }

    .success-section {
        display: flex;
        max-width: 480px;
        width: 100%;
        padding-top: 72px;
        flex-direction: column;
        overflow: hidden;
        align-items: center;
        font-family:
            NotoSansJp-Bold,
            -apple-system,
            Roboto,
            Helvetica,
            sans-serif;
        font-size: 16px;
    }

    .success-header,
    .advantage-header {

        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .section-title {
        color: var(--gray, #c8c8c8);
        font-size: 18px;
        font-weight: 700;
        line-height: 2;
        margin: 0;

    }

    .divider {
        background-color: #c8c8c8;
        width: 80px;
        height: 1px;
        margin-top: -6px;
    }

    .divider2 {
        background-color: #c8c8c8;
        width: 112px;
        height: 1px;
        margin-top: -6px;
    }

    .main-heading {
        color: #000;
        text-align: center;
        font-size: 30px;
        font-weight: 700;
        line-height: 40px;
        margin: 20px 0px;
    }

    .follow-cards {
        margin-top: 48px;
        width: 100%;
        max-width: 319px;
        display: flex;
        flex-direction: column;
        gap: 20px;
        position: relative;
        z-index: 10;
    }

    .follow-card {
        width: 100%;
    }

    .card-content {
        border-radius: 4px;
        border: 2px solid #61b1d2;
        background-color: #fff;
        padding: 14px 20px;
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .card-number {
        color: #61b1d2;
        font-weight: 700;
        text-align: center;
    }

    .card-body {
        display: flex;
        align-items: center;
        gap: 20px;
        color: #000;
        font-weight: 500;
        line-height: 24px;
    }

    .card-icon,
    .info-icon {
        width: 72px;
        height: 72px;
        object-fit: contain;
    }

    .card-text {
        margin: auto 0;
        flex: 1;
        text-align: center;
    }

    .timeline-line {
        background-color: #61b1d2;
        width: 2px;
        height: 1180px;
        margin-top: -1213px;
    }

    .advantage-section {
        margin-top: 105px;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .advantage-heading {
        color: #000;
        text-align: center;
        font-size: 32px;
        font-weight: 700;
        line-height: 48px;
        margin: 20px 0 0;
    }

    .highlight {
        color: #fa3c3c;
    }

    .advantages {
        width: 100%;
        padding: 0 20px;
        display: flex;
        flex-direction: column;
        gap: 48px;
    }

    .advantage-card {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .advantage-title {
        color: #000;
        text-align: center;
        font-size: 20px;
        font-weight: 700;
        line-height: 1.4;
        margin: 29px 0 0;
    }

    .advantage-description {
        color: #000;
        text-align: justify;
        font-weight: 500;
        line-height: 28px;
        margin: 26px 0 0;
        width: 87%;
    }

    .feature-list {
        list-style: none;
        padding: 0;
        margin: 23px 0 0;
        width: 85%;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .feature-item {
        background-color: #cdf2ff;
        border-radius: 2px;
        padding: 8px;
        color: #000;
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 4px;
    }

    .feature-item::before {
        content: "";
        width: 24px;
        height: 24px;
        background-image: url("../img/sp/check0.svg");
        background-size: contain;
        background-repeat: no-repeat;
    }

    .gradient-bg {
        background: linear-gradient(to bottom, transparent, rgba(255, 255, 255, 0.8));
        padding-bottom: 72px;
    }

    .advantage-icon {
        width: 160px;
        height: 160px;
        position: relative;
        overflow: hidden;
        left: 80px;
        margin-top: 30px;
    }

    .icon-bg {
        width: 100%;
        height: 100%;
        position: absolute;
        right: 0%;
        left: 0%;
        bottom: 0%;
        top: 0%;
        object-fit: cover;
    }

    .company {
        width: 56.52%;
        height: 56.52%;
        position: absolute;
        right: 21.74%;
        left: 21.74%;
        bottom: 21.74%;
        top: 21.74%;
        overflow: hidden;
    }

    .group-171 {
        width: 74.17%;
        height: 90.38%;
        position: absolute;
        right: 12.95%;
        left: 12.88%;
        bottom: 4.81%;
        top: 4.81%;
        overflow: visible;
    }

    .pro {
        width: 56.52%;
        height: 56.52%;
        position: absolute;
        right: 21.74%;
        left: 21.74%;
        bottom: 21.74%;
        top: 21.74%;
        overflow: hidden;
    }

    .pro-2 {
        width: 56.52%;
        height: 56.52%;
        position: absolute;
        right: 21.74%;
        left: 21.74%;
        bottom: 21.74%;
        top: 21.74%;
        overflow: hidden;
    }

    .group-156 {
        width: 92.31%;
        height: 57.75%;
        position: absolute;
        right: 3.85%;
        left: 3.85%;
        bottom: 21.09%;
        top: 21.15%;
        overflow: visible;
    }

    /*success2*/

    .sp-success-bg {
        width: 100%;
        height: 2360px;
        position: absolute;
        top: 6170px;
        background-image: url(../img/sp/sp-bg-success0.svg);
        background-position: top;
        background-repeat: no-repeat;
        background-size: contain;
    }

    .sp-success {
        flex-shrink: 0;
        width: 375px;
        height: 2365px;
        position: relative;
        overflow: hidden;
    }

    .sp-bg-success {
        width: 100%;
        height: 300px;
        position: absolute;
        left: 0px;
        top: 0px;
        overflow: visible;
        object-fit: cover;
    }

    .sp-human {
        width: 335px;
        height: 509px;
        position: absolute;
        left: 20px;
        top: 209px;
    }

    .bg {
        background: var(--eba, #61b1d2);
        border-radius: 4px;
        width: 100%;
        height: 100%;
        position: absolute;
        right: 0%;
        left: 0%;
        bottom: 0%;
        top: 0%;
    }

    .white {
        background: var(--white, #ffffff);
        border-radius: 4px;
        width: 91.34%;
        height: 36.15%;
        position: absolute;
        right: 3.88%;
        left: 4.78%;
        bottom: 4.72%;
        top: 59.14%;
    }

    .frame-3 {
        display: flex;
        flex-direction: row;
        gap: 0px;
        align-items: center;
        justify-content: flex-start;
        width: 61.49%;
        height: 4.72%;
        position: absolute;
        right: 28.96%;
        left: 9.55%;
        bottom: 7.86%;
        top: 87.43%;
        width: 100%;
    }

    ._85 {
        color: var(--black, #191919);
        text-align: left;
        font-family: var(--bold-text-base-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-base-font-size, 16px);
        line-height: var(--bold-text-base-line-height, 24px);
        font-weight: var(--bold-text-base-font-weight, 700);
        position: relative;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .arrow {
        flex-shrink: 0;
        width: 24px;
        height: 24px;
        position: relative;
        overflow: visible;
    }

    ._120-up {
        color: var(--cv, #fa3c3c);
        text-align: left;
        font-family: var(--bold-text-base-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-base-font-size, 16px);
        line-height: var(--bold-text-base-line-height, 24px);
        font-weight: var(--bold-text-base-font-weight, 700);
        position: relative;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .react-node-js-aws {
        color: var(--black, #191919);
        text-align: justified;
        font-family: var(--md-text-base-font-family, "NotoSansJp-Medium", sans-serif);
        font-size: var(--md-text-base-font-size, 16px);
        line-height: var(--md-text-base-line-height, 24px);
        font-weight: var(--md-text-base-font-weight, 500);
        position: absolute;
        right: 8.66%;
        left: 9.55%;
        width: 81.79%;
        bottom: 14.15%;
        top: 62.28%;
        height: 23.58%;
        display: flex;
        align-items: center;
    }

    .frame-10 {
        display: flex;
        flex-direction: row;
        gap: 8px;
        align-items: center;
        justify-content: center;
        height: 3.54%;
        position: absolute;
        left: 50%;
        translate: -50%;
        bottom: 44.01%;
        top: 52.46%;
        width: 100%;
    }

    .title {
        color: var(--white, #ffffff);
        text-align: center;
        font-family: var(--md-text-2sm-font-family, "NotoSansJp-Medium", sans-serif);
        font-size: var(--md-text-2sm-font-size, 12px);
        line-height: var(--md-text-2sm-line-height, 18px);
        font-weight: var(--md-text-2sm-font-weight, 500);
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .title2 {
        color: var(--white, #ffffff);
        text-align: center;
        font-family: var(--bold-text-2xl-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-2xl-font-size, 24px);
        line-height: var(--bold-text-2xl-line-height, 32px);
        font-weight: var(--bold-text-2xl-font-weight, 700);
        position: absolute;
        right: 4.78%;
        left: 4.78%;
        width: 90.45%;
        bottom: 49.12%;
        top: 44.6%;
        height: 6.29%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    ._5 {
        width: 90.45%;
        height: 36.75%;
        position: absolute;
        right: 4.78%;
        left: 4.78%;
        bottom: 58.54%;
        top: 4.72%;
        overflow: visible;
    }

    .sp-human2 {
        width: 335px;
        height: 509px;
        position: absolute;
        left: 20px;
        top: 750px;
    }

    .arrow2 {
        flex-shrink: 0;
        width: 24px;
        height: 24px;
        position: relative;
        overflow: visible;
    }

    ._2 {
        width: 90.45%;
        height: 36.75%;
        position: absolute;
        right: 4.78%;
        left: 4.78%;
        bottom: 58.54%;
        top: 4.72%;
        overflow: visible;
    }

    .sp-human3 {
        width: 335px;
        height: 509px;
        position: absolute;
        left: 20px;
        top: 1291px;
    }

    .arrow3 {
        flex-shrink: 0;
        width: 24px;
        height: 24px;
        position: relative;
        overflow: visible;
    }

    ._3 {
        width: 90.45%;
        height: 36.75%;
        position: absolute;
        right: 4.78%;
        left: 4.78%;
        bottom: 58.54%;
        top: 4.72%;
        overflow: visible;
    }

    .sp-human4 {
        width: 335px;
        height: 509px;
        position: absolute;
        left: 20px;
        top: 1832px;
    }

    .arrow4 {
        flex-shrink: 0;
        width: 24px;
        height: 24px;
        position: relative;
        overflow: visible;
    }

    ._4 {
        width: 90.45%;
        height: 36.75%;
        position: absolute;
        right: 4.78%;
        left: 4.78%;
        bottom: 58.54%;
        top: 4.72%;
        overflow: visible;
    }

    .suc-h {
        color: var(--black, #191919);
        text-align: justified;
        font-family: var(--sp-h2-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--sp-h2-font-size, 28px);
        line-height: var(--sp-h2-line-height, 40px);
        font-weight: var(--sp-h2-font-weight, 700);
        position: absolute;
        left: 30px;
        top: 121px;
        display: flex;
        align-items: center;
    }

    .h-2-sub {
        width: 81px;
        height: 29px;
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 72px;
    }

    .contact {
        color: var(--eba, #61b1d2);
        text-align: justified;
        font-family: var(--bold-text-lg-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-lg-font-size, 18px);
        line-height: var(--bold-text-lg-line-height, 28px);
        font-weight: var(--bold-text-lg-font-weight, 700);
        position: absolute;
        right: 0%;
        left: 0%;
        width: 100%;
        bottom: 3.45%;
        top: 0%;
        height: 96.55%;
        display: flex;
        align-items: center;
    }

    .rectangle-77 {
        background: var(--eba, #61b1d2);
        width: 100%;
        height: 3.45%;
        position: absolute;
        right: 0%;
        left: 0%;
        bottom: 0%;
        top: 96.55%;
    }

    /*step*/

    .sp-step-bg {
        width: 100vw;
        height: 100%;
        position: absolute;
        top: 9370px;
        background-image: url(../img/sp/sp-step-bg-10.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: 100% 100%;
    }

    .sp-step-bg2 {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0%;
        background: linear-gradient(170deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 93.999999%);
    }

    .sp-step {
        width: 375px;
        flex-shrink: 0;
        height: 1309px;
        position: relative;
        overflow: hidden;
    }

    .sp-bg-step {
        width: 388px;
        height: 300px;
        position: absolute;
        left: 0px;
        bottom: 0px;
    }

    .sp-step-bg-1 {
        width: 100%;
        height: 100%;
        position: absolute;
        right: 0%;
        left: 0%;
        bottom: 0%;
        top: 0%;
        object-fit: cover;
    }

    .step-div {
        background: linear-gradient(180deg,
                rgba(255, 255, 255, 1) 0%,
                rgba(255, 255, 255, 0) 94.9999988079071%);
        width: 100%;
        height: 100%;
        position: absolute;
        right: 0%;
        left: 0%;
        bottom: 0%;
        top: 0%;
    }

    .div2 {
        color: var(--black, #191919);
        text-align: justified;
        font-family: var(--sp-h2-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--sp-h2-font-size, 28px);
        line-height: var(--sp-h2-line-height, 40px);
        font-weight: var(--sp-h2-font-weight, 700);
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 121px;
        display: flex;
        align-items: center;
    }

    .h-2-sub {
        width: 51px;
        height: 29px;
        position: absolute;
        left: 50%;
        translate: -50%;
        top: 72px;
    }

    .contact-success {
        color: var(--gray, #c8c8c8);
        text-align: justified;
        font-family: var(--bold-text-lg-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-lg-font-size, 18px);
        line-height: var(--bold-text-lg-line-height, 28px);
        font-weight: var(--bold-text-lg-font-weight, 700);
        position: absolute;
        right: 0%;
        left: -39%;
        width: 100%;
        bottom: 3.45%;
        top: 0%;
        height: 96.55%;
        display: flex;
        align-items: center;
    }

    .rectangle-76 {
        background: var(--gray, #c8c8c8);
        width: 92px;
        height: 3.45%;
        position: absolute;
        right: 0%;
        left: -38%;
        bottom: 0%;
        top: 96.55%;
    }

    .sp-rectangle-140 {
        background: var(--eba, #61b1d2);
        width: 1px;
        height: 825px;
        position: absolute;
        left: calc(50% - 120px);
        top: 262px;
    }

    .frame-8 {
        display: flex;
        flex-direction: row;
        gap: 12px;
        align-items: center;
        justify-content: flex-start;
        position: absolute;
        left: 136px;
        top: 1020px;
    }

    .sp-step-5 {
        color: var(--eba, #61b1d2);
        text-align: justified;
        font-family: "NotoSansJp-Bold", sans-serif;
        font-size: 20px;
        line-height: 28px;
        font-weight: 700;
        position: relative;
        display: flex;
        align-items: center;
    }

    .sp-step-title {
        color: var(--eba, #61b1d2);
        text-align: justified;
        font-family: "NotoSansJp-Bold", sans-serif;
        font-size: 20px;
        line-height: 28px;
        font-weight: 700;
        position: relative;
        display: flex;
        align-items: center;
        width: 130px;
    }

    .sp-step2 {
        width: 25.6%;
        height: 7.33%;
        position: absolute;
        right: 69.07%;
        left: 5.33%;
        bottom: 14.74%;
        top: 77.92%;
    }

    .ellipse-8 {
        background: var(--secondary, #cdf2ff);
        border-radius: 50%;
        width: 100%;
        height: 100%;
        position: absolute;
        right: 0%;
        left: 0%;
        bottom: 0%;
        top: 0%;
    }

    .div3 {
        width: 64px;
        height: 64px;
        position: absolute;
        left: 50%;
        translate: -50% -50%;
        top: 50%;
        overflow: hidden;
    }

    .group-149 {
        width: 95%;
        height: 59.07%;
        position: absolute;
        right: 2.5%;
        left: 2.5%;
        bottom: 19.68%;
        top: 21.25%;
        overflow: visible;
    }

    .sp-div4 {
        color: var(--black, #191919);
        text-align: left;
        font-family: var(--md-test-sm-font-family, "NotoSansJp-Medium", sans-serif);
        font-size: var(--md-test-sm-font-size, 14px);
        line-height: var(--md-test-sm-line-height, 22px);
        font-weight: var(--md-test-sm-font-weight, 500);
        position: absolute;
        left: 136px;
        bottom: 5.5%;
        top: 81.05%;
        height: 13.45%;
        width: 219px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .frame-9 {
        display: flex;
        flex-direction: row;
        gap: 12px;
        align-items: center;
        justify-content: flex-start;
        position: absolute;
        left: 136px;
        top: 773px;
    }

    .step-4 {
        color: var(--eba, #61b1d2);
        text-align: justified;
        font-family: "NotoSansJp-Bold", sans-serif;
        font-size: 20px;
        line-height: 28px;
        font-weight: 700;
        position: relative;
        display: flex;
        align-items: center;
    }

    .sp-step3 {
        width: 25.6%;
        height: 7.33%;
        position: absolute;
        right: 69.07%;
        left: 5.33%;
        bottom: 33.61%;
        top: 59.05%;
    }

    .group-157 {
        width: 57.98%;
        height: 82.5%;
        position: absolute;
        right: 21.02%;
        left: 21%;
        bottom: 10%;
        top: 7.5%;
        overflow: visible;
    }

    .sp-div5 {
        color: var(--black, #191919);
        text-align: justified;
        font-family: var(--md-test-sm-font-family, "NotoSansJp-Medium", sans-serif);
        font-size: var(--md-test-sm-font-size, 14px);
        line-height: var(--md-test-sm-line-height, 22px);
        font-weight: var(--md-test-sm-font-weight, 500);
        position: absolute;
        left: 136px;
        bottom: 31.47%;
        top: 61.8%;
        height: 6.72%;
        width: 219px;
        display: flex;
        align-items: center;
    }

    .frame-2 {
        background: var(--secondary, #cdf2ff);
        border-radius: 2px;
        padding: 4px 8px 4px 8px;
        display: flex;
        flex-direction: row;
        gap: 4px;
        align-items: flex-start;
        justify-content: flex-start;
        width: 219px;
        position: absolute;
        left: 136px;
        top: 908px;
    }

    .sp-div6 {
        color: var(--black, #191919);
        text-align: left;
        font-family: "NotoSansJp-Regular", sans-serif;
        font-size: 12px;
        line-height: 18px;
        font-weight: 400;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .sp-div7 {
        color: var(--black, #191919);
        text-align: justified;
        font-family: "NotoSansJp-Regular", sans-serif;
        font-size: 12px;
        line-height: 18px;
        font-weight: 400;
        position: relative;
        width: 187px;
        display: flex;
        align-items: center;
        left: 0px;
        top: 0px;
    }


    .frame-7 {
        display: flex;
        flex-direction: row;
        gap: 12px;
        align-items: center;
        justify-content: flex-start;
        position: absolute;
        left: 136px;
        top: 595px;
    }

    .step-3 {
        color: var(--eba, #61b1d2);
        text-align: justified;
        font-family: "NotoSansJp-Bold", sans-serif;
        font-size: 20px;
        line-height: 28px;
        font-weight: 700;
        position: relative;
        display: flex;
        align-items: center;
    }

    .sp-step4 {
        width: 25.6%;
        height: 7.33%;
        position: absolute;
        right: 69.07%;
        left: 5.33%;
        bottom: 47.21%;
        top: 45.45%;
    }

    .group-151 {
        width: 77.5%;
        height: 78.75%;
        position: absolute;
        right: 11.25%;
        left: 11.25%;
        bottom: 11.25%;
        top: 10%;
        overflow: visible;
    }

    .div8 {
        color: var(--black, #191919);
        text-align: center;
        font-family: var(--bold-text-xl-font-family, "NotoSansJp-Bold", sans-serif);
        font-size: var(--bold-text-xl-font-size, 20px);
        line-height: var(--bold-text-xl-line-height, 28px);
        font-weight: var(--bold-text-xl-font-weight, 700);
        position: absolute;
        left: 248px;
        top: 727px;
        display: flex;
        align-items: center;
        justify-content: center;
    }


    .frame-22 {
        background: var(--secondary, #cdf2ff);
        border-radius: 2px;
        padding: 4px 8px 4px 8px;
        display: flex;
        flex-direction: row;
        gap: 4px;
        align-items: flex-start;
        justify-content: flex-start;
        width: 219px;
        position: absolute;
        left: 136px;
        top: 519px;
    }

    ._60-skype {
        color: var(--black, #191919);
        text-align: justified;
        font-family: "NotoSansJp-Regular", sans-serif;
        font-size: 12px;
        line-height: 18px;
        font-weight: 400;
        position: relative;
        width: 187px;
        display: flex;
        align-items: center;
    }

    .sp-step5 {
        width: 25.6%;
        height: 7.33%;
        position: absolute;
        right: 69.07%;
        left: 5.33%;
        bottom: 64.78%;
        top: 27.88%;
    }

    ._1 {
        width: 79.37%;
        height: 65.75%;
        position: absolute;
        right: 10.38%;
        left: 10.25%;
        bottom: 16.75%;
        top: 17.5%;
        overflow: visible;
    }

    .frame-6 {
        display: flex;
        flex-direction: row;
        gap: 12px;
        align-items: center;
        justify-content: flex-start;
        position: absolute;
        left: 136px;
        top: 365px;
    }

    .sp-step-2 {
        color: var(--eba, #61b1d2);
        text-align: justified;
        font-family: "NotoSansJp-Bold", sans-serif;
        font-size: 20px;
        line-height: 28px;
        font-weight: 700;
        position: relative;
        display: flex;
        align-items: center;
    }

    .sp-div9 {
        color: var(--black, #191919);
        text-align: justified;
        font-family: var(--md-test-sm-font-family, "NotoSansJp-Medium", sans-serif);
        font-size: var(--md-test-sm-font-size, 14px);
        line-height: var(--md-test-sm-line-height, 22px);
        font-weight: var(--md-test-sm-font-weight, 500);
        position: absolute;
        left: 136px;
        bottom: 60.96%;
        top: 30.63%;
        height: 8.4%;
        width: 219px;
        display: flex;
        align-items: center;
    }

    ._12 {
        position: absolute;
        inset: 0;
    }

    .frame-5 {
        display: flex;
        flex-direction: row;
        gap: 12px;
        align-items: center;
        justify-content: flex-start;
        position: absolute;
        left: 136px;
        top: 209px;
    }

    .sp-step-1 {
        color: var(--eba, #61b1d2);
        text-align: justified;
        font-family: "NotoSansJp-Bold", sans-serif;
        font-size: 20px;
        line-height: 28px;
        font-weight: 700;
        position: relative;
        display: flex;
        align-items: center;
    }

    .sp-step6 {
        width: 25.6%;
        height: 7.33%;
        position: absolute;
        right: 69.07%;
        left: 5.33%;
        bottom: 76.7%;
        top: 15.97%;
    }

    .group-148 {
        width: 72.5%;
        height: 72.5%;
        position: absolute;
        right: 13.75%;
        left: 13.75%;
        bottom: 13.75%;
        top: 13.75%;
        overflow: visible;
    }

    .sp-div10 {
        color: var(--black, #191919);
        text-align: justified;
        font-family: var(--md-test-sm-font-family, "NotoSansJp-Medium", sans-serif);
        font-size: var(--md-test-sm-font-size, 14px);
        line-height: var(--md-test-sm-line-height, 22px);
        font-weight: var(--md-test-sm-font-weight, 500);
        position: absolute;
        left: 136px;
        bottom: 74.56%;
        top: 18.72%;
        height: 6.72%;
        width: 219px;
        display: flex;
        align-items: center;
    }

    /*form*/

    .contact-background {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
    }

    .sp-contact {
        background: var(--white, #ffffff);
        align-self: stretch;
        flex-shrink: 0;
        height: 1383px;
        position: relative;
        overflow: hidden;
    }

    .sp-bg-contact {
        width: 100%;
        height: 218px;
        position: absolute;
        left: 0px;
        bottom: 0px;
        z-index: 0;
    }


    .bg-contact-1 {
        width: 100%;
        height: 100%;
        position: absolute;
        right: 0%;
        left: 0%;
        bottom: 0%;
        top: 0%;
        object-fit: cover;
    }

    .f-div {
        background: linear-gradient(180deg,
                rgba(255, 255, 255, 1) 0%,
                rgba(255, 255, 255, 0) 94.9999988079071%);
        width: 200%;
        height: 100%;
        position: absolute;
        left: 0px;
        bottom: 0%;
        top: 0%;
    }

    .contact-section {
        align-self: stretch;
        background-color: #fff;
        display: flex;
        margin-left: auto;
        margin-right: auto;
        max-width: 480px;
        width: 100%;
        padding: 76px 20px;
        flex-direction: column;
        overflow: hidden;
        align-items: center;
        font-family:
            Noto Sans JP,
            -apple-system,
            Roboto,
            Helvetica,
            sans-serif;
    }

    .header-container {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        margin-bottom: 20px;
        margin-top: 60px;
    }

    .contact-title {
        color: gray;
        text-align: center;
        font-size: 18px;
        font-weight: 700;
        line-height: 2;
        margin-bottom: 8px;
    }

    .c-divider {
        background-color: #c8c8c8;
        width: 84px;
        height: 1px;
        margin-top: -14px;
        margin-bottom: 30px;
    }


    .registration-title {
        color: #000;
        text-align: center;
        font-size: 28px;
        font-weight: 700;
        line-height: 1;
        margin-top: 20px;
    }

    .registration-description {
        color: #000;
        text-align: justify;
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
        padding: 11px 23px;
        width: 295px;
    }

    .contact-form {
        margin-top: 48px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .form-group {
        max-width: 335px;
        width: 100%;
        margin-bottom: 32px;
    }

    .input-wrapper {
        width: 100%;
    }

    .label-group {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-bottom: 12px;
        margin-left: 20px;
    }

    .required-badge {
        background-color: #61b1d2;
        color: #010101;
        font-size: 12px;
        font-weight: 700;
        padding: 1px 8px;
        border-radius: 2px;
        text-align: center;
        z-index: 1;
    }

    .form-label {
        color: #000;
        font-size: 16px;
        font-weight: 700;
        z-index: 1;
    }

    .form-input {
        width: 80%;
        border-radius: 4px;
        background-color: rgb(240, 240, 245);
        padding: 16px;
        font-size: 16px;
        color: #010101;
        border: none;
        margin-bottom: 20px;
        margin-left: 20px;
    }

    .helper-text {
        color: #010000;
        font-size: 14px;
        line-height: 2;
        margin-top: 12px;
        margin-left: 20px;
    }

    .select-wrapper {
        position: relative;
        margin-bottom: 20px;
    }

    .form-select {
        width: 90%;
        margin-left: 20px;
        border-radius: 4px;
        background-color: rgb(240, 240, 245);
        padding: 16px;
        font-size: 16px;
        color: #000;
        border: none;
        appearance: none;
    }

    .select-arrow {
        position: absolute;
        right: 25px;
        top: 50%;
        transform: translateY(-50%);
        width: 24px;
        height: 24px;
        pointer-events: none;
    }

    .privacy-section {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-top: 24px;
        position: relative;
        left: 10px;
        bottom: 50px;
        width: 303px;
    }

    .privacy-text {
        color: #000;
        font-size: 14px;
        font-weight: 500;
        line-height: 22px;
        margin: 0;
    }

    .privacy-link {
        color: #61b1d2;
        text-decoration: none;
    }

    .submit-button {
        background-color: #fa3c3c;
        color: white;
        font-size: 18px;
        font-weight: 700;
        line-height: 2;
        padding: 5px 40px;
        border-radius: 40px;
        border: none;
        width: 275px;
        position: absolute;
        bottom: 65px;
        right: 0;
        left: 0;
        margin: 0 auto;
    }


    .sp-check-box input {
        display: none;
    }

    .sp-check-box input+p:before {
        content: "";
        display: inline-block;
        position: relative;
        top: 6px;
        margin: 0px 4px -4px -34px;
        background-image: url("../img/check-box-outline-blank-rounded0.svg");
        width: 24px;
        height: 24px;
    }

    .sp-check-box input:checked+p::before {
        background-image: url("../img/check-box-rounded.svg");
    }

    /*footer*/

    .sp-footer {
        background: var(--white, #ffffff);
        align-self: stretch;
        flex-shrink: 0;
        height: 322px;
        position: relative;
        overflow: hidden;
    }

    .f-mask-group {
        width: 100%;
        height: auto;
        position: absolute;
        left: 0px;
        top: 0px;
        overflow: visible;
    }

    .eba-freelance-inc {
        color: var(--white, #ffffff);
        text-align: center;
        font-family: var(--md-text-2sm-font-family, "NotoSansJp-Medium", sans-serif);
        font-size: var(--md-text-2sm-font-size, 12px);
        line-height: var(--md-text-2sm-line-height, 18px);
        font-weight: var(--md-text-2sm-font-weight, 500);
        opacity: 0.8;
        width: 100%;
        bottom: 9.94%;
        top: 84.47%;
        height: 5.59%;
        display: block;
        text-align: center;
    }

    .footer-div {
        color: var(--white, #ffffff);
        text-align: left;
        font-family: var(--md-text-base-font-family, "NotoSansJp-Medium", sans-serif);
        font-size: var(--md-text-base-font-size, 16px);
        line-height: var(--md-text-base-line-height, 24px);
        font-weight: var(--md-text-base-font-weight, 500);
        position: absolute;
        left: 50%;
        translate: -50%;
        bottom: 25.47%;
        top: 67.08%;
        height: 7.45%;
    }

    .logo-white {
        width: 286px;
        height: 72px;
        position: absolute;
        left: 50%;
        translate: -50%;
        top: calc(50% - 73px);
        overflow: hidden;
    }

    .group-173 {
        width: 99.89%;
        height: 100%;
        position: absolute;
        right: 0.11%;
        left: 0%;
        bottom: 0%;
        top: 0%;
        overflow: visible;
    }

}