@media screen and (max-width: 768px) {
    /* ------------------------------------------------------------------------- */
    /* 基本設定 */
    /* ------------------------------------------------------------------------- */
    :root{
        /* レイアウト */
        --layout-artbord: 375;
        --layout-container: calc((375 - (18 * 2)) * 100vw);
        --layout-outer-padding: calc(18 / var(--layout-artbord) * 100vw);
    }

    /* ------------------------------------------------------------------------- */
    /* パーツ */
    /* ------------------------------------------------------------------------- */
    br.--only-pc {
        display: none;
    }

    br.--only-sp {
        display: inline;
    }

    /* ボタン */
    .button{
        padding: .8rem .8rem .8rem 2rem;
    }

    /* フローティングコンタクト */
    .floating{

    }

    .floating__item{
        padding: calc(12 / var(--layout-artbord) * 100vw) calc(6 / var(--layout-artbord) * 100vw);
    }

    .floating__text{
        font-size: calc(16 / var(--layout-artbord) * 100vw);
    }

    .floationg__icon{
        width: calc(32 / var(--layout-artbord) * 100vw);
        height: calc(32 / var(--layout-artbord) * 100vw);
    }

    .wantedFloating{
        bottom: 0;
        left: 0;
        right: 0;
        width: 100vw;
        z-index: 5;
    }

    /* セクションタイトル */
    .topsectionTitle__large{
        font-size: calc(86 / var(--layout-artbord) * 100vw);
    }

    .topsectionTitle__small{
        font-size: calc(27 / var(--layout-artbord) * 100vw);
    }
    /* ------------------------------------------------------------------------- */
    /* レイアウト */
    /* ------------------------------------------------------------------------- */
    :is(.hello, .what, .column__inner, .topics, .related, .pageContent){
        padding: 0 0;
    }

    :is(.inpageLink, .wantedAbout, .wantedConsult, .wantedBenefits, .conditionsSec__container){
        padding: 0 calc(18 / var(--layout-artbord) * 100vw);
    }

    /* .container{
    } */

    .container.is--container-l{
        max-width: 100%;
    }

    .container--white{
        max-width: 100vw;
    }

    .whiteBox{
        padding-top: calc(72 / var(--layout-artbord) * 100vw);
        padding-bottom: calc(72 / var(--layout-artbord) * 100vw);
    }

    .whiteBox__inner{
        padding-left:  calc(18 / var(--layout-artbord) * 100vw);
        padding-right: calc(18 / var(--layout-artbord) * 100vw);
    }

    /* ------------------------------------------------------------------------- */
    /* 共通部分 */

    /* 
    header
    humberger menu
    footer
    */
    /* ------------------------------------------------------------------------- */
    /* ハンバーガーメニュー */
    .humberger{
        height: calc(12 / var(--layout-artbord) * 100vw);
        margin-left: calc(12 / var(--layout-artbord) * 100vw);
    }

    .humberger__line{
        width: calc(46 / var(--layout-artbord) * 100vw);
        height: calc(4 / var(--layout-artbord) * 100vw);
        border-radius: calc(3 / var(--layout-artbord) * 100vw);
    }

    /* サイドメニュー */
    .side-menu{
        left: -100vw;
        width: 100vw;
        padding: calc(24 / var(--layout-artbord) * 100vw);
    }



    /* ヘッダー */
    .header__ttl{
        font-size: calc(22 / var(--layout-artbord) * 100vw);
    }


    /* フッター */
    .footer{
        margin-top: calc(88 / var(--layout-artbord) * 100vw);
        padding-top: calc(120 / var(--layout-artbord) * 100vw);
    }

    .footer__container{
        width: calc(340 / var(--layout-artbord) * 100vw)
    }

    .footer__ttl_main {
        font-size: calc(30 / var(--layout-artbord) * 100vw);
    }

    .footer__ttl_sub{
        font-size: calc(86 / var(--layout-artbord) * 100vw);
    }

    .wanted__message-l{
        font-size: calc(18 / var(--layout-artbord) * 100vw);
    }

    .wanted__message-s{
        font-size: calc(15 / var(--layout-artbord) * 100vw);
        margin-top: calc(24 / var(--layout-artbord) * 100vw);
        text-align: left;
        line-height: 170%;
        font-weight: 400;
    }

    .pinkButton{
        margin-top: calc(32 / var(--layout-artbord) * 100vw);
        box-shadow: 0 calc(6 / var(--layout-artbord) * 100vw) 0 0 rgba(0, 0, 0, 0.90);
    }

    .pinkButton__link{
        padding: calc(38 / var(--layout-artbord) * 100vw);
    }
    .pinkButton__text{
        font-size: calc(20 / var(--layout-artbord) * 100vw);
    }
    .footerMenuWrapper{
        margin-top: calc(100 / var(--layout-artbord) * 100vw);
    }
    .footerMenu{
        padding: calc(14 / var(--layout-artbord) * 100vw) 0;
    }

    .footerMenu__link{
        font-size: calc(14 / var(--layout-artbord) * 100vw);
    }

    .copyrights{
        font-size: calc(14 / var(--layout-artbord) * 100vw);
        margin-top: calc(20 / var(--layout-artbord) * 100vw);
        padding-bottom: calc(20 / var(--layout-artbord) * 100vw);
    }


    /* ------------------------------------------------------------------------- */
    /* page共通 */
    /* ------------------------------------------------------------------------- */
    .pageHeader__title_main{
        font-size: calc(29 / var(--layout-artbord) * 100vw);
        font-weight: 900;
    }

    .pageHeader__title_en{
        font-size: calc(17 / var(--layout-artbord) * 100vw);
    }

    .pageHeader__forwho{
        font-size: calc(17 / var(--layout-artbord) * 100vw);
        font-weight: 500;
    }

    .pageHeader__time{
        font-size: calc(14 / var(--layout-artbord) * 100vw);
    }

    .pageContent{
        margin-top: calc(36 / var(--layout-artbord) * 100vw);
    }

    .pageContent.is--privacy{
        margin-top: calc(25 / var(--layout-artbord) * 100vw);
    }

    /* ------------------------------------------------------------------------- */
    /* post */
    /* ------------------------------------------------------------------------- */
    .myContent h2{
        margin-top: calc(56 / var(--layout-artbord) * 100vw);
        font-size: calc(20 / var(--layout-artbord) * 100vw);
    }

    .myContent p {
        font-size: calc(15 / var(--layout-artbord) * 100vw);
        margin-top: calc(16 / var(--layout-artbord) * 100vw);
    }

    .myContent ul {
        font-size: calc(15 / var(--layout-artbord) * 100vw);
        padding-left: 2rem;
        padding-left: calc(20 / var(--layout-artbord) * 100vw);
    }
}

