@charset 'UTF-8';

/* タブレット */

@media (max-width: 1024px) {
    .showPC {
        display: block !important;
    }
    .showSP {
        display: none !important;
    }
    html {
        font-size: calc(100vw * 10 / 600);
    }
}


/* SP */

@media (max-width: 599px) {
    /* 共通設定（サイト全体幅、フォントサイズ等） */
    .showPC {
        display: none !important;
    }
    .showSP {
        display: block !important;
    }
    html {
        font-size: calc(100vw * 9 / 320);
    }
    main {
        margin: 0 auto;
        max-width: 100%;
    }
    .cta_btn {
        right: 3%;
        top: 15%;
        width: 25%;
    }
    .is-fixed {
        top: 80%;
    }
    .title {
        margin-bottom: 3rem;
    }
    .subtitle p {
        width: 80vw;
        font-size: 1.4rem;
    }
    .subtitle p::before {
        width: 4rem;
    }
    /* 個別設定 */
    /* header */
    .header_left {
        width: 30%;
    }
    .header_right p {
        padding: 0.5rem 1rem;
        font-size: 1rem;
        margin-right: 1rem;
        letter-spacing: .1rem;
    }
    .header_right a {
        padding: .5rem 1rem;
        font-size: 1.1rem;
    }
    .header_right a::after {
        width: 1.5rem;
        right: -22%;
    }
    /* fv */
    .fv_btn {
        width: 85%;
        bottom: 5%;
    }
    /* about */
    .about {
        padding: 5rem 2rem;
    }
    .about__header {
        position: relative;
        width: 50%;
    }
    .about__main {
        margin: 3rem auto;
        width: 95%;
        line-height: 2;
    }
    .about__footer {
        margin: 0;
        flex-wrap: wrap;
        justify-content: center;
    }
    .about__footer img {
        width: 30%;
        margin: 0 1rem 2rem;
    }
    .about__main h2 span {
        background-position: top left -4px;
        background-size: 1.1em 1.1em;
    }
    .about__main h2 {
        margin-bottom: 2rem;
    }
    .about__main p {
        font-size: 1.3rem;
        text-align: left;
    }
    /* support */
    .support {
        padding: 4rem 2rem;
        overflow: hidden;
    }
    .support__header {
        width: 58%;
    }
    .supports {
        display: block;
        margin-bottom: 4rem;
    }
    .supports .supports_txt {
        width: 100%;
        font-size: 1.5rem;
        margin-bottom: 4rem;
    }
    .supports_txt img {
        margin-bottom: 2rem;
    }
    .supports_img {
        width: 95%;
        margin: auto;
    }
    .supports_r .supports_txt {
        margin-left: 0;
    }
    .supports_r {
        position: unset;
    }
    .supports_bg01 img:first-child {
        top: -6%;
        right: -26%;
    }
    .supports_bg02 img {
        bottom: -10%;
    }
    .supports_bg03 img:first-child {
        top: -7%;
        right: -34%;
        bottom: unset;
        left: unset;
    }
    .supports_bg03 img:last-child {
        bottom: -15%;
        left: -53%;
    }
    .support__footer img {
        width: 2px;
    }
    .support__footer {
        white-space: unset;
        font-size: 1.6rem;
    }
    /* flow */
    .flow {
        padding: 5rem 2rem;
    }
    .flow__header {
        position: relative;
        width: 37.5%;
    }
    .flow_child {
        display: block;
    }
    .flow_left {
        width: 60%;
        margin: 0 auto 1rem;
    }
    .flow_right {
        width: 100%;
        font-size: 1.5rem;
    }
    .flow__main {
        margin: 3rem 0;
    }
    .flow_right h2 {
        font-size: 2.6rem;
    }
    /* qa */
    .qa {
        padding: 4rem 2rem 1rem;
    }
    .qa__header {
        width: 30.5%;
    }
    .qa__main {
        font-size: 1.2rem;
    }
}