@media screen and (max-width:768px) {
    body {
        font-size: 14px;
    }

    .pc {
        display: none;
    }

    .sp {
        display: block;
    }

    section {
        padding: 30px 0;
    }

    h2 {
        font-size: 20px;
        margin-bottom: 20px;
    }

    h2.border {
        padding-bottom: 15px;
    }

    h2.border::after {
        height: 3px;
    }

    .fixed-download-btn-sp {
        z-index: 9999;
        position: fixed;
        bottom: 0;
        left: 0;
        translate: 0 100%;
        width: 100vw;
        display: block;
        background: #fff;
        transition: all .3s;
        opacity: 0;
    }

    .fixed-download-btn-sp.is-show {
        opacity: 1;
        translate: 0;
    }

    .fixed-download-btn-inner {
        display: flex;
        justify-content: space-evenly;
        padding: 10px 0;
        max-width: 550px;
        margin: 0 auto;
    }

    .fixed-download-btn-inner a {
        width: 45%;
        max-width: 230px;
    }

    /**********************************************
Header
**********************************************/

    .header-logo {
        width: 200px;
    }

    /**********************************************
key-visual
**********************************************/
    .kv-section {
        height: auto;
        max-height: fit-content;
    }

    .kv-top {
        height: auto;
        margin-bottom: 30px;
    }

    .kv-bg-cloud {
        position: absolute;
    }

    .kv-section h2 {
        position: relative;
        left: auto;
        top: auto;
        width: 80%;
        margin: auto;
        max-width: 500px;
        font-size: min(4vw, 25px);
        padding-top: 10%;
    }

    .kv-section h2 img {
        width: 100%;
        margin-top: 20px;
    }

    .kv-screen-wrap.sp {
        position: relative;
        display: flex;
        bottom: auto;
        right: auto;
        translate: 0;
        width: 55%;
        left: 50%;
        translate: -30% 0;
        margin: 30px 0;
    }

    .kv-app-wrap {
        position: relative;
        width: 80%;
        margin: auto;
        top: 10%;
        bottom: auto;
        left: auto;
        text-align: center;
        align-items: center;
        padding-bottom: 30%;
        gap: 20px;
    }

    .kv-app-icon {
        width: 64%;
    }

    .kv-app-wrap .open_button img {
        width: 100%;
    }

    .kv-screen-img {
        width: 64%;
    }

    .kv-chara {
        width: 36%;
    }

    .modal {
        padding: 25px 20px;
    }

    .modal_content {
        align-self: center;
        width: 75vw;
        max-height: 80svh;
    }

    .modal-inner {
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }

    .modal-screen {
        overflow: hidden;
        width: 60%;
    }

    .modal-screen img {
        width: 100%;
        margin-bottom: -64%;
        position: relative;
    }

    .modal-download-wrap {
        width: 100%;
    }

    .close_button {
        width: 50px;
        height: 50px;
    }

    .close_button span::before,
    .close_button span::after {
        width: 26px;
    }

    /**********************************************
worries-section
**********************************************/
    .worries-item-wrap {
        max-width: 650px;
        margin: 0 auto 15%;
    }

    .worries-chara {
        bottom: -16%;
    }

    /**********************************************
point-section
**********************************************/
    .point-content {
        flex-direction: column;
        align-items: center;
        padding-right: 0;
    }

    .point-wrap {
        padding: 20px 0;
    }

    .point-wrap:nth-of-type(n+2) {
        margin-top: 25px;
    }

    .point-wrap .section-inner {
        max-width: 90%;
    }

    .text-point-img {
        display: block;
        margin: 0 auto;
    }

    .point-section h3 {
        font-size: 18px;
        line-height: 1.5;
        text-align: center;
    }

    .point-img-wrap {
        width: 100%;
        margin-bottom: 0;
        justify-content: center;
        gap: 10px;

    }

    .point-text {
        width: 100%;
    }

    .text-strong {
        font-size: 15px;
    }

    .point-img {
        width: auto;
    }

    .point_01 .point-img.beside-img {
        width: 60%;
        max-width: 320px;
    }

    .point-img img {
        height: 66vw;
        max-height: 385px;
    }

    /**********************************************
red-section
**********************************************/
    .red-section h3 {
        font-size: 16px;
    }

    /**********************************************
method-section
**********************************************/
    .method-chara {
        bottom: 10px;
        left: 50%;
        width: 70px;
        translate: -48vw 0;
    }

    .method-section .text-red {
        bottom: 78px;
        font-size: 14px;
        width: 95vw;
        translate: calc(50% - 10px) 0;
    }

    .slide {
        width: 95vw;
        padding: 0 10px;
        height: 600px;
    }

    .slide-content-inner {
        gap: 15px;
        flex-direction: column;
        align-items: center;
        padding: 40px 0;
    }

    .step-screen {
        width: 50%;
        max-width: 150px;
        margin-top: 0;
    }

    .step-text {
        padding-top: 0;
        width: 85%;
    }

    .step-text h3 {
        font-size: 16px;
        margin-bottom: 15px;
    }

    .dots-wrap {
        margin-top: 35px;
    }

    .dots-wrap li {
        width: 10px;
        height: 10px;
    }

    /**********************************************
qa-section
**********************************************/
    .accordion-wrap {
        padding: 0;

    }

    .qestion {
        padding: 10px 30px 10px 10px;
        gap: 10px;
    }

    .qestion h3 {
        font-size: 14px;
    }

    .qestion img {
        width: 36px;
    }

    .qestion .arrow-wrap {
        translate: 8px 0;
    }

    .answer {
        padding: 0px 45px 15px 56px;
    }

    /**********************************************
table
**********************************************/
    .table-wrap {
        padding: 30px 20px;
    }

    table th {
        width: 100%;
        display: block;
        margin-bottom: 10px;
    }

    table td {
        width: 100%;
        display: block;
    }

    /**********************************************
download-section
**********************************************/
    .download-section-inner {
        flex-direction: column-reverse;
        align-items: center;
        width: 100%;
        max-width: 360px;
        gap: 0;
    }

    .download-screen-img {
        width: 100%;
        height: 100%;
    }

    .download-screen-img img {
        translate: 0;
        transform: scale(1);
        margin-bottom: -20%;
        margin-top: -20px;
    }

    .download-sec-content {
        width: 100%;
        padding-bottom: 0;
    }

    .download-section h2 {
        font-size: 18px;
        margin-bottom: 15px;
    }

    .download-sec-wrap {
        gap: 15px;
        width: 75%;
        margin: 0 auto;
    }

    .download-sec-item {
        border-radius: 10px;
        padding: 10px 10px;
    }

    .qr-img {
        margin-top: 10px;
    }

    .download-sec-chara {
        width: 100px;
        translate: -8% 96%;
    }

    /**********************************************
contact-section
**********************************************/
    .contact-wrap {
        padding: 20px;
        letter-spacing: 0.1em;
    }

    .contact-tel {
        font-size: min(6.8vw, 55px);
    }

    .contact-wrap p {
        margin-top: 10px;
        font-size: min(3.73vw, 22px);
    }



    /**********************************************
footer
**********************************************/
    .footer-content {
        flex-direction: column;
        padding: 30px 0;
    }

    .footer-logo {
        width: 200px;
    }

    .copyright {
        font-size: 10px;
    }


}