@charset "utf-8";

/* 共通パーツ
---------------------------------*/
.page .mv{
    padding: 220px 0 140px;
    max-height: 480px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
#request .mv{
    background-image: url(../img/page/request-mv.jpg);
}
#contact .mv{
    background-image: url(../img/page/contact-mv.jpg);
}
#privacy .mv{
    background-image: url(../img/page/privacy-mv.jpg);
}
#sdgs .mv{
    background-image: url(../img/page/sdgs-mv.jpg);
}
#about .mv{
    background-image: url(../img/page/about-mv.jpg);
}
#company .mv{
    position: relative;
    background-image: url(../img/page/company-mv.jpg);
}
#process .mv{
    background-image: url(../img/page/process-mv.jpg);
}
#guarantee .mv{
    background-image: url(../img/page/guarantee-mv.jpg);
}
#price .mv{
    background-image: url(../img/page/price-mv.jpg);
}
@media only screen and (max-width: 768px) {
    .page .mv{
        padding: 26.66666666666667vw 0;
        max-height: 74.66666666666667vw;
    }
    #request .mv{
        background-image: url(../img/page/request-mv_sp.jpg);
    }
    #contact .mv{
        background-image: url(../img/page/contact-mv_sp.jpg);
    }
    #sdgs .mv{
        background-image: url(../img/page/sdgs-mv_sp.jpg);
    }
    #about .mv{
        background-image: url(../img/page/about-mv_sp.jpg);
    }
    #company .mv{
        background-image: url(../img/page/company-mv_sp.jpg);
    }
    #process .mv{
        background-image: url(../img/page/process-mv_sp.jpg);
    }
}


/* mv */
.page .mv .mv-inner{
    position: relative;
    display: block;
    max-width: 1470px;
    width: 100%;
    padding: 0 10px;
    margin: 0 auto;
    z-index: 2;
}
.page .mv h1{
    font-size: 80px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 0.75;
    margin: 0 0 40px;
    color: #fff;
}
.page .mv .flex{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.page .mv .flex p{
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 2px;
    line-height: 0.8;
    color: #fff;
}
.page .mv .flex #bcn .breadcrumbs{
    display: flex;
    align-items: center;
    gap: 10px;
    color: #Fff;
}
.page .mv .flex #bcn .breadcrumbs a,
.page .mv .flex #bcn .breadcrumbs p,
.page .mv .flex #bcn .breadcrumbs span{
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 1px;
}
.page .mv .flex #bcn .breadcrumbs a{
    position: relative;
    text-decoration: underline;
}
#company .mv::before{
    content: "";
    width: 100%;
    height: 100%;
    background-color: #000000;
    opacity: 0.3;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

@media only screen and (max-width: 1600px) {
    .page .mv .mv-inner{
        padding: 0 40px;
    }
}
@media only screen and (max-width: 768px) {
    .page .mv .mv-inner{
        max-width: none;
        padding: 0 5.3333333333333334vw;
    }
    .page .mv h1{
        font-size: 10.66666666668vw;
        line-height: 1.5;
        margin: 0;
    }
    .page .mv .flex{
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .page .mv .flex p{
        font-size: 4vw;
        line-height: 1.33;
    }
    .page .mv .flex #bcn .breadcrumbs{
        display: none;
    }
}

/* REQUEST　資料請求 
--------------------------------------*/
#request .catlog{
    padding: 130px 0 120px;
    background-color: #F7F7F7;
}
#request .catlog .txt{
    margin: 0 auto 130px;
}
#request .catlog .txt .bold{
    display: block;
    font-size: 28px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 2px;
    margin: 0 0 50px;
    color: #222222;
}
#request .catlog .txt .note{
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    letter-spacing: 2px;
    line-height: 1.81;
    color: #222222;
}
#request .catlog .document-area{
    margin: 0 0 115px;
}
#request .catlog .document-area .document-kind{
    margin: 0 0 80px;
}
#request .catlog .document-area .document-kind:last-of-type{
    margin: 0;
}
#request .catlog .document-area .document-kind .name{
    display: flex;
    align-items: center;
    gap: 18px;
    font-size: 26px;
    font-weight: 600;
    letter-spacing: 1px;
    padding: 0 0 35px;
    margin: 0 0 50px;
    color: #2D2D2D;
    border-bottom: 1px dashed #222222;
}
#request .catlog .document-area .document-kind .name::before{
    content: "";
    width: 14px;
    height: 14px;
    background-color: #DF5B4C;
    border-radius: 50%;
}
#request .catlog .document-area .document-kind .document-list{
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 40px 35px;
}
#request .catlog .document-area .document-kind .document-list .document-item{
    display: block;
    max-width: 410px;
    width: 100%;
}
#request .catlog .document-area .document-kind .document-list .document-item .img{
    display: block;
    width: 410px;
    height: 310px;
    padding: 30px 0;
    margin: 0 0 35px;
    overflow: hidden;
    background-color: #fff;
}
#request .catlog .document-area .document-kind .document-list .document-item .img img{
    display: block;
    width: auto;
    height: 100%;
    margin: 0 auto;
}
#request .catlog .document-area .document-kind .document-list .document-item .ttl{
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 1px;
    line-height: 1.21;
    margin: 0 0 20px;
}
#request .catlog .document-area .document-kind .document-list .document-item .note{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 2px;
    line-height: 1.67;
    margin: 0 0 38px;
}
#request .catlog .document-area .document-kind .document-list .document-item .document-select{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 240px;
    width: 100%;
    margin: 0 auto;
}
#request .catlog .document-area .document-kind .document-list .document-item .document-select button{
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 240px;
    width: 100%;
    padding: 20px 0;
    margin: 0 auto;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0;
    color: #222222;
    background-color: #fff;
    border: 1px solid #222222;
    border-radius: 100vw;
    cursor: pointer;
    transition: all .3s;
}
#request .catlog .document-area .document-kind .document-list .document-item .document-select.is-selected button{
    color: #fff;
    background-color: #DF5B4C;
}
#request .catlog .document-area .document-kind .document-list .document-item .document-select span{
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    content: "";
    width: 20px;
    height: 20px;
    background-image: url(../img/top/btn_in-black_arrow.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 1;
    transition: all .3s;
}
#request .catlog .document-area .document-kind .document-list .document-item .document-select span.is-selected{
    background-image: url(../img/top/btn_red_arrow.png);
}
#request .catlog .choice-item{
    display: none;
    width: 100%;
}
#request .catlog .choice-item p{
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 1px;
    line-height: 1.22;
    padding: 23px 0;
    color: #fff;
    background-color: #222222;
    border-radius: 5px 5px 0 0;
}
#request .catlog .choice-item .choice-list{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
    padding: 60px 0;
    border:1px solid #222222;
    border-top: none;
    background-color: #F1F1F1;
}
#request .catlog .choice-item .choice-list .item{
    position: relative;
    display: block;
    width: 250px;
    height: 190px;
    padding: 15px 0;
    background-color: #fff;
    border: 1px dashed #222222;
}
#request .catlog .choice-item .choice-list .item .img{
    display: block;
    width: auto;
    height: 100%;
    margin: 0 auto;
}
#request .catlog .choice-item .choice-list .item .img img{
    display: block;
    width: auto;
    height: 100%;
    margin: 0 auto;
}
#request .catlog .choice-item .choice-list .item .cancel{
    position: absolute;
    top: -13px;
    right: -13px;
    width: 26px;
    height: 26px;
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    background-color: #2D2D2D;
    border-radius: 50%;
    cursor: pointer;
}
@media only screen and (max-width: 768px) {
    #request .catlog{
        padding: 13.333333333335vw 0 18.66666666666666668vw;
    }
    #request .catlog .txt{
        margin: 0 auto 16vw;
    }
    #request .catlog .txt .bold{
        font-size: 4.8vw;
        line-height: 1.39;
        letter-spacing: 2px;
        margin: 0 0 6.666666666667vw;
    }
    #request .catlog .txt .note{
        font-size: 3.733333333333333334vw;
        letter-spacing: 2px;
        line-height: 1.64;
    }
    #request .catlog .document-area{
        margin: 0 0 16vw;
    }
    #request .catlog .document-area .document-kind{
        margin: 0 0 13.33333333333335vw;
    }
    #request .catlog .document-area .document-kind:last-of-type{
        margin: 0;
    }
    #request .catlog .document-area .document-kind .name{
        gap: 3.2vw;
        font-size: 4.533333333333333dvw;
        padding: 0 0 5.33333333333334vw;
        margin: 0 0 6.66666666666666667vw;
    }
    #request .catlog .document-area .document-kind .name::before{
        width: 2.133333333333333336vw;
        height: 2.133333333333333336vw;
    }
    #request .catlog .document-area .document-kind .document-list{
        gap: 10.666666666666668vw 3.2vw;
    }
    #request .catlog .document-area .document-kind .document-list .document-item{
        max-width: 42.666666666666667vw;
    }
    #request .catlog .document-area .document-kind .document-list .document-item .img{
        width: 42.6666666666666666666667vw;
        height: 32vw;
        padding: 2.9999999999999993vw 0;
        margin: 0 0 5.33333333333333333334vw;
    }
    #request .catlog .document-area .document-kind .document-list .document-item .ttl{
        font-size: 3.466666666666666663vw;
        margin: 0 0 3.733333333333334vw;
    }
    #request .catlog .document-area .document-kind .document-list .document-item .note{
        font-size: 2.66666666666666667vw;
        margin: 0 0 4.8vw;
    }
    #request .catlog .document-area .document-kind .document-list .document-item .document-select{
        max-width: 40vw;
    }
    #request .catlog .document-area .document-kind .document-list .document-item .document-select button{
        max-width: 40vw;
        padding: 2.6666666666666667vw 0;
        font-size: 2.666666666666666667vw;
    }
    #request .catlog .document-area .document-kind .document-list .document-item .document-select span{
        right: 2.66666666666666666667vw;
        width: 2.66666666666666666667vw;
        height: 2.66666666666666666667vw;
    }
    #request .catlog .choice-item p{
        font-size: 3.73333333333333334vw;
        padding: 3.2vw 0;
    }
    #request .catlog .choice-item .choice-list{
        gap: 2.6666666666666667vw;
        padding: 4vw 0 5.3333333333333333334vw;
    }
    #request .catlog .choice-item .choice-list .item{
        width: 18.13333333333333vw;
        height: 18.1333333333333333vw;
        padding: 1.333333333333333335vw 0;
    }
    #request .catlog .choice-item .choice-list .item .cancel{
        top: -2.133333333333336vw;
        right: -2.133333333333336vw;
        width: 4.26666666666666666666667vw;
        height: 4.26666666666666666666667vw;
        font-size: 2.6666666666666667vw;
    }
}


/* CONTACT　お問い合わせ
--------------------------------------*/
#contact .add-txt{
    padding: 105px 0 140px;
    background-color: #F6F6F6;
    border-top: 1px dashed #222222;
    border-bottom: 1px dashed #222222;
}
#contact .add-txt .flex{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#contact .add-txt .flex h3{
    font-size: 36px;
    font-weight: 600;
    letter-spacing: 2px;
    line-height: 1.56;
    color: #222222;
}
#contact .add-txt .flex .note{
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 2;
    color: #222222;
}
@media only screen and (max-width: 768px) {
    #contact .add-txt{
        padding: 13.33333333333335vw 0 16vw;
    }
    #contact .add-txt .flex{
        display: block;
    }
    #contact .add-txt .flex h3{
        font-size: 4.8vw;
        letter-spacing: 2px;
        line-height: 1.59;
        margin: 0 0 6.4vw;
    }
    #contact .add-txt .flex .note{
        font-size: 3.73333333333333334vw;
        line-height: 1.67;
    }
}


/* form */
.page.form .form_area{
    padding: 115px 0 130px;
    background-color: #F0F0F0;
}
.page.form .form_area .ttl_area{
    margin: 0 auto 100px;
}
.page.form .form_area .ttl_area h2{
    font-size: 50px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0;
    line-height: 1.2;
    margin: 0 0 20px;
    color: #222222;
}
.page.form .form_area .ttl_area .sub{
    font-size: 20px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 2px;
    margin: 0 auto 90px;
    color: #222222;
}
.page.form .form_area .ttl_area .note{
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    letter-spacing: 2px;
    line-height: 1.56;
    color: #222222;
}
.page.form .form_area .ttl_area .note span{
    color: #DF5B4C;
}
.page.form .form_area #form{
    margin: 0 auto 85px;
}
.page.form .form_area #form .form_item{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 0 30px;
    margin: 0 0 30px;
    border-bottom: 1px solid #E1E1E1;
}
.page.form .form_area #form .address_item{
    align-items: flex-start;
}
.page.form .form_area #form .last_item{
    align-items: flex-start;
    padding: 0;
    margin: 15px 0 0;
    border: none;
}
.page.form .form_area #form .form_item .label{
    display: flex;
    align-items: center;
    gap: 20px;
    max-width: 290px;
    width: 100%;
    font-size: 17px;
    font-weight: 500;
    letter-spacing: 0;
    color: #2D2D2D;
    flex-shrink: 0;
}
.page.form .form_area #form .form_item .label span{
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
    padding: 5px 10px 6px;
    color: #fff;
    background-color: #DF5B4C;
    border-radius: 5px;
}
.page.form .form_area #form .form_item .label span.any{
    background-color: #959595;
}
.page.form .form_area #form .form_item .label-area{
    flex-shrink: 0;
    max-width: 290px;
    width: 100%;
}
.page.form .form_area #form .form_item .label-area .add-p{
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.47;
    margin: 8px 0 0 65px;
    color: #2D2D2D;
    max-width: 195px;
}
.page.form .form_area #form .address_item .label,
.page.form .form_area #form .last_item .label{
    margin-top: 15px;
}
.page.form .form_area #form .form_item .w-input{
    display: block;
    max-width: 1000px;
    width: 100%;
    flex: 1;
}
.page.form .form_area #form .form_item .w-input input,
.page.form .form_area #form .form_item .w-input select,
.page.form .form_area #form .form_item .w-input textarea{
    display: block;
    width: 100%;
    padding: 20px;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0;
    color: #222;
    background-color: #FFFFFF;
    border: none;
    border-radius: 5px;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
}
.page.form .form_area #form .form_item .w-input input::placeholder,
.page.form .form_area #form .form_item .w-input select::placeholder,
.page.form .form_area #form .form_item .w-input textarea::placeholder{
    color: #B0B0B0;
}
.page.form .form_area #form .form_item .w-input .wpcf7-not-valid-tip,
.page.form .form_area #form .form_item .w-input .your-kana-error{
    display: block;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1;
    margin: 8px 0 0 0;
    color: #dc3232;
}
.page.form .form_area #form .form_item .w-input .item{
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0 0 20px;
}
.page.form .form_area #form .form_item .w-input .item:last-of-type{
    margin: 0;
}
.page.form .form_area #form .form_item .w-input .item .ctt-label{
    display: block;
    font-size: 15px;
    font-weight: 500;
    text-align: right;
    letter-spacing: 0;
    max-width: 100px;
    width: 100%;
    color: #222222;
    flex-shrink: 0;
}
.page.form .form_area #form .form_item .w-input .item .half,
.page.form .form_area #form .form_item .w-input .item .address {
    display: block;
    width: 100%;
    flex: 1;
}
.page.form .form_area #form .form_item .w-input .item .half input,
.page.form .form_area #form .form_item .w-input .item .half select{
    display: block;
    max-width: 300px;
    width: 100%;
}
.page.form .form_area #form .form_item .w-input .select{
    position: relative;
    max-width: 300px;
    width: 100%;
}
.page.form .form_area #form .form_item .w-input .select::before{
    position: absolute;
    top: 50%;
    right: 20px;
    content: "";
    display: inline-block;
    width:8px;
    height:8px;
    transform: translateY(-50%) rotate(45deg);
    border-right: 2px solid;
    border-bottom: 2px solid;
    transition: 0.3s;
    z-index: 1;
}
.page.form .form_area #form .form_item .w-input .select .p-region option:first-of-type{
    color: #B0B0B0;
}
.page.form .form_area #form .form_item .w-input .select .p-region.is-placeholder option{
    color: #222;
}
.page.form .check{
    margin: 0 auto 120px;
}
.page.form .check > p{
    font-size: 15px;
    font-weight: 400;
    text-align: center;
    letter-spacing: 2px;
    line-height: 1.67;
    margin: 0 0 45px;
    color: #222222;
}
.page.form .check > p a{
    color: #DF5B4C;
    text-decoration: underline;
}
.page.form .check .check-flex,
.page.form .check .check-flex p{
    display: block;
    max-width: 300px;
    width: 100%;
    margin: 0 auto;
}
.page.form .check .check-flex p .wpcf7-not-valid-tip{
    margin-top: 10px;
    font-size: 13px;
    text-align: center;
}
.page.form .check .check-flex .wpcf7-list-item{
    display: block;
    margin: 0;
}
.page.form .check .check-flex label{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
}
.page.form .check .check-flex label input{
    margin: 0;
    width: 25px;
    height: 25px;
    background-color: #fff;
    border: 1px solid #222222;
    cursor: pointer;
}
.page.form .check .check-flex label .wpcf7-list-item-label{
    display: block;
    font-size: 17px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1;
    cursor: pointer;
}
.page.form .btn_area,
.page.form .btn_area .btn{
    position: relative;
    display: block;
    max-width: 540px;
    width: 100%;
    margin: 0 auto;
}
.page.form .btn_area .btn::before{
    content: "";
    width: 30px;
    height: 30px;
    background-image: url(../img/top/btn_white_arrow.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: 50%;
    right: 25px;
    transform: translateY(-50%);
    z-index: 10;
}
.page.form .btn_area .btn input{
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 1px;
    line-height: 1.17;
    padding: 26px 0 28px;
    color: #fff;
    background-color: #222222;
    border-radius: 100vw;
    transition: all .3s;
}
.page.form .btn_area .btn input:hover{
    opacity: 0.7;
}
.page.form .btn_area .btn .wpcf7-spinner{
    display: none;
}
.page.form .btn_area .btn .cf7-cf-turnstile{
    position: absolute;
    top: -85px;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
}

.page.form .form_area .tell-area{
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 800px;
    width: 100%;
    padding: 52px 0 48px;
    margin: 70px auto 0;
    background-color: #fff;
    border: 1px solid #D9D9D9;
    border-radius: 10px;
}
.page.form .form_area .tell-area .note{
    position: relative;
    flex: 1;
    font-size: 19px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 2px;
    line-height: 1.77;
    color: #222222;
}
.page.form .form_area .tell-area .note::before{
    content: "";
    width: 1px;
    height: 100px;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    background-image: repeating-linear-gradient(to bottom, #222222 0px, #222222 1px, transparent 1px, transparent 5px);
}
.page.form .form_area .tell-area .tell{
    flex: 1;
}
.page.form .form_area .tell-area .tell a.number{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 3px;
    font-size: 39px;
    font-family: "Albert Sans", sans-serif;
    font-weight: bold;
    text-align: center;
    letter-spacing: 0;
    line-height: 1;
    margin: 0 auto 10px;
    color: #222222;
}
.page.form .form_area .tell-area .tell a.number::before{
    content: "";
    width: 26px;
    height: 37px;
    background-image: url(../img/page/tell-icon.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.page.form .form_area .tell-area .tell p{
    font-size: 17px;
    font-family: "Inter", sans-serif;
    font-weight: 500;
    text-align: center;
    line-height: 1;
    letter-spacing: 1px;
    color: #222222;
}


@media only screen and (max-width: 768px) {
    .page.form .form_area{
        padding: 16vw 0;
    }
    .page.form .form_area .ttl_area{
        margin: 0 auto 13.3333333333333335vw;
    }
    .page.form .form_area .ttl_area h2{
        font-size: 8vw;
        line-height: 1;
        margin: 0 0 5.333333333334vw;
    }
    .page.form .form_area .ttl_area .sub{
        font-size: 4.2666666666666667vw;
        margin: 0 auto 9.3333333333334vw;
    }
    .page.form .form_area .ttl_area .note{
        font-size: 3.733333333333334vw;
        line-height: 1.64;
    }
    .page.form .form_area #form{
        margin: 0 auto 10.66666666666668vw;
    }
    .page.form .form_area #form .form_item{
        display: block;
        padding: 0;
        margin: 0 0 8vw;
        border-bottom: none;
    }
    .page.form .form_area #form .last_item{
        margin: 0;
    }
    .page.form .form_area #form .form_item .label{
        gap: 3.73333333333333334vw;
        max-width: none;
        width: 100%;
        font-size: 4.2666666666667vw;
        margin: 0 0 4vw;
    }
    .page.form .form_area #form .form_item .label span{
        font-size: 3.2vw;
        padding: 1.066666666666666667vw 2.13333333333333333336vw;
    }
    .page.form .form_area #form .address_item .label,
    .page.form .form_area #form .last_item .label{
        margin-top: 0;
    }
    .page.form .form_area #form .form_item .label-area{
        max-width: none;
    }
    .page.form .form_area #form .form_item .label-area .add-p{
        font-size: 3.73333333333333334vw;
        margin: -1.66666668vw 0 4.8vw 14.66666666666666666vw;
        max-width: none;
    }
    .page.form .form_area #form .form_item .w-input input,
    .page.form .form_area #form .form_item .w-input select,
    .page.form .form_area #form .form_item .w-input textarea{
        padding: 4vw 2.6666666666666667vw;
        font-size: 16px;
    }
    .page.form .form_area #form .form_item .w-input .item{
        display: block;
        margin: 0 0 5.33333333333334vw;
    }
    .page.form .form_area #form .form_item .w-input .item:last-of-type{
        margin: 0;
    }
    .page.form .form_area #form .form_item .w-input .item .ctt-label{
        font-size: 3.46666666666663vw;
        text-align: left;
        margin: 0 0 2.6666666666666667vw;
    }
    .page.form .form_area #form .form_item .w-input .item .half input,
    .page.form .form_area #form .form_item .w-input .item .half select{
        max-width: 70.66666666666667vw;
    }
    .page.form .form_area #form .form_item .w-input .select{
        max-width: 70.66666666666667vw;
    }
    .page.form .form_area #form .form_item .w-input .select::before{
        right: 2.66666666666667vw;
        width: 1.66666666666666667vw;
        height: 1.66666666666666667vw;
        border-right: 1px solid;
        border-bottom: 1px solid;
    }
    .page.form .check{
        margin: 0 auto 26.66666666666668vw;
    }
    .page.form .check > p{
        font-size: 3.4666666666666663vw;
        margin: 0 0 8vw;
    }
    .page.form .check .check-flex,
    .page.form .check .check-flex p{
        max-width: 58.666666666666664vw;
    }
    .page.form .check .check-flex p .wpcf7-not-valid-tip{
        margin-top: 2.666666666666667vw;
        font-size: 3.7333333333333334vw;
    }
    .page.form .check .check-flex label{
        gap: 2.6666666666667vw;
    }
    .page.form .check .check-flex label input{
        width: 5.3333333333333333334vw;
        height: 5.3333333333333333334vw;
    }
    .page.form .check .check-flex label .wpcf7-list-item-label{
        font-size: 3.733333333333333334vw;
    }
    .page.form .btn_area,
    .page.form .btn_area .btn{
        max-width: 69.33333333333334vw;
    }
    .page.form .btn_area .btn::before{
        width: 5.333333333333333334vw;
        height: 5.333333333333333334vw;
        right: 4vw;
    }
    .page.form .btn_area .btn input{
        font-size: 4vw;
        padding: 4.2666666666666667vw 0 4.8vw;
    }
    .page.form .btn_area .btn .cf7-cf-turnstile{
        top: -20vw;
    }

    .page.form .form_area .tell-area{
        display: block;
        max-width: 86.66666666666667vw;
        padding: 6.66666666667vw 0 8vw;
        margin: 12vw auto 0;
        border-radius: 5px;
    }
    .page.form .form_area .tell-area .note{
        font-size: 4vw;
        text-align: center;
        line-height: 1.53;
        margin: 0 auto 4.8vw;
    }
    .page.form .form_area .tell-area .note::before{
        display: none;
    }
    .page.form .form_area .tell-area .tell a.number{
        gap: 0.8vw;
        font-size: 8.533333333333333vw;
        margin: 0 auto 2.666666666666667vw;
    }
    .page.form .form_area .tell-area .tell a.number::before{
        width: 5.6000000000000005vw;
        height: 8vw;
    }
    .page.form .form_area .tell-area .tell p{
        font-size: 3.46666666666666663vw;
    }
}

/* thanks */
.page.thanks .thanks{
    margin: 120px auto;
}
.page.thanks .thanks .thanks-content {
    margin: 60px auto;
    text-align: center;
}
.page.thanks .thanks .thanks-icon {
    position: relative;
    width: 140px;
    height: 140px;
    margin: 0 auto 30px;
    background: #FFE037;
    border-radius: 50%;
}
.page.thanks .thanks .thanks-icon .check-mark {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 60px;
    transform: translate(-50%, -60%) rotate(45deg);
    border-right: 8px solid #222;
    border-bottom: 8px solid #222;
}
.page.thanks .thanks h2 {
    font-size: 32px;
    font-weight: bold;
    letter-spacing: 0.1em;
    margin: 0 auto 25px;
    color: #222;
}
.page.thanks .thanks .thanks-message {
    margin-bottom: 40px;
}
.page.thanks .thanks .thanks-message p {
    font-size: 16px;
    line-height: 2;
    letter-spacing: 0.05em;
    margin: 0;
}
.page.thanks .thanks .btn a{
    position: relative;
    display: block;
    max-width: 540px;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 1px;
    line-height: 1.17;
    padding: 26px 0 28px;
    margin: 0 auto;
    color: #fff;
    background-color: #222222;
    border-radius: 100vw;
    transition: all .3s;
}
.page.thanks .thanks .btn a::before{
    content: "";
    width: 30px;
    height: 30px;
    background-image: url(../img/top/btn_white_arrow.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: 50%;
    right: 25px;
    transform: translateY(-50%);
    z-index: 10;
}
@media only screen and (max-width: 1024px) {
    .page.thanks .thanks{
        margin: 8vw auto 12vw;
    }
    .page.thanks .thanks .thanks-content {
        margin: 8vw auto 0;
    }
    .page.thanks .thanks .thanks-icon {
        width: 25vw;
        height: 25vw;
        margin: 0 auto 6vw;
    }
    .page.thanks .thanks .thanks-icon .check-mark {
        width: 8vw;
        height: 12vw;
        border-right: 1.5vw solid #222;
        border-bottom: 1.5vw solid #222;
    }
    .page.thanks .thanks h2 {
        font-size: 6vw;
        margin: 0 auto 4vw;
    }
    .page.thanks .thanks .thanks-message {
        margin-bottom: 6vw;
    }
    .page.thanks .thanks .thanks-message p {
        font-size: 3.5vw;
    }
    .page.thanks .thanks .btn a{
        font-size: 4vw;
        padding: 4.2666666666666667vw 0 4.8vw;
        max-width: 69.33333333333334vw;
    }
    .page.thanks .thanks .btn a::before{
        width: 5.333333333333333334vw;
        height: 5.333333333333333334vw;
        right: 4vw;
    }
}


/* SDGa　SDGsへの取り組み
--------------------------------------*/
#sdgs .about{
    padding: 130px 0;
    background-color: #F7F7F7;
}
#sdgs .about .inner{
    max-width: 1020px;
    width: 100%;
    margin: 0 auto;
}
#sdgs .about .top-ttl{
    margin: 0 0 80px;
}
#sdgs .about .top-ttl .ttl{
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 2px;
    line-height: 1.25;
    padding: 0 0 20px;
    margin: 0 0 30px;
    border-bottom: 1px solid #D9D9D9;
}
#sdgs .about .top-ttl .note{
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 2px;
    line-height: 1.67;
    margin: 0;
    color: #222222;
}
#sdgs .about .img img{
    display: block;
    width: 100%;
    margin: 0 0 70px;
}
#sdgs .about .sub_note{
    display: block;
    font-size: 20px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 2px;
    line-height: 1.75;
    color: #222222;
}
@media only screen and (max-width: 768px) {
    #sdgs .about{
        padding: 13.3333333333335vw 0 16vw;
    }
    #sdgs .about .inner{
        max-width: none;
    }
    #sdgs .about .top-ttl{
        margin: 0 0 16vw;
    }
    #sdgs .about .top-ttl .ttl{
        font-size: 4.8vw;
        text-align: center;
        padding: 0;
        margin: 0 0 5.3333333333333334vw;
    }
    #sdgs .about .top-ttl .note{
        font-size: 3.7333333333333334vw;
        line-height: 1.67;
    }
    #sdgs .about .img img{
        margin: 0 0 8vw;
    }
    #sdgs .about .sub_note{
        font-size: 3.73333333333333333334vw;
        text-align: left;
        letter-spacing: 2px;
        line-height: 1.64;
    }
}

#sdgs .approach{
    border-top: 1px dashed #222222;
    border-bottom: 1px dashed #222222;
    padding: 130px 0 125px;
    background-color: #F0F0F0;
}
#sdgs .approach .inner{
    max-width: 1020px;
}
#sdgs .approach .approach-ttl{
    display: block;
    font-size: 32px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 2px;
    line-height: 1.27;
    margin: 0 0 50px;
    color: #222222;
}
#sdgs .approach .list{
    display: block;
    width: 100%;
}
#sdgs .approach .list .item{
    padding: 40px;
    margin: 0 0 30px;
    background-color: #fff;
    border-radius: 10px;
}
#sdgs .approach .list .item:last-of-type{
    margin: 0;
}
#sdgs .approach .list .item .item-ttl{
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 2px;
    line-height: 1.4;
    padding: 0 0 20px;
    margin: 0 0 30px;
    color: #222222;
    border-bottom: 1px dashed #A3A3A3;
}
#sdgs .approach .list .item .item-ttl span{
    font-size: 30px;
    font-family: "Albert Sans", sans-serif;
    line-height: 1;
}
#sdgs .approach .list .item .note{
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 2px;
    line-height: 1.63;
    margin: 0 0 30px;
    color: #222222;
}
#sdgs .approach .list .item .icon_area{
    display: flex;
    align-items: stretch;
    gap: 20px;
}
#sdgs .approach .list .item .icon_area img{
    display: block;
    max-width: 140px;
    width: 100%;
}
#sdgs .approach .list .item .kind-list .kind-item{
    display: flex;
    align-items: center;
    gap: 40px;
    padding: 0 0 30px;
    margin: 0 0 30px;
    border-bottom: 1px solid #D9D9D9;
    width: 100%;
}
#sdgs .approach .list .item .kind-list .kind-item:last-of-type{
    padding: 0;
    margin: 0;
    border: none;
}
#sdgs .approach .list .item .kind-list .kind-item .img{
    flex-shrink: 0;
}
#sdgs .approach .list .item .kind-list .kind-item .img img{
    display: block;
    max-width: 140px;
    width: 100%;
}
#sdgs .approach .list .item .kind-list .kind-item .txt{
    flex: 1;
}
#sdgs .approach .list .item .kind-list .kind-item .txt .txt_ttl{
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 2px;
    line-height: 1.67;
    margin: 0 0 14px;
}
#sdgs .approach .list .item .kind-list .kind-item:nth-of-type(1) .txt .txt_ttl{
    color: #1B973A;
}
#sdgs .approach .list .item .kind-list .kind-item:nth-of-type(2) .txt .txt_ttl{
    color: #34A5C8;
}
#sdgs .approach .list .item .kind-list .kind-item:nth-of-type(3) .txt .txt_ttl{
    color: #DFB01E;
}
#sdgs .approach .list .item .kind-list .kind-item:nth-of-type(4) .txt .txt_ttl{
    color: #EC771D;
}
#sdgs .approach .list .item .kind-list .kind-item:nth-of-type(5) .txt .txt_ttl{
    color: #E6990C;
}
#sdgs .approach .list .item .kind-list .kind-item:nth-of-type(6) .txt .txt_ttl{
    color: #DB9808;
}
#sdgs .approach .list .item .kind-list .kind-item:nth-of-type(7) .txt .txt_ttl{
    color: #407936;
}
#sdgs .approach .list .item .kind-list .kind-item .txt .txt_note{
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 2px;
    line-height: 1.63;
}
@media only screen and (max-width: 768px) {
    #sdgs .approach{
        padding: 16vw 0 18.666666666668vw;
    }
    #sdgs .approach .inner{
        max-width: none;
    }
    #sdgs .approach .approach-ttl{
        font-size: 4.8vw;
        line-height: 1.44;
        margin: 0 0 9.33333333333333334vw;
    }
    #sdgs .approach .list .item{
        padding: 5.333333333334vw 5.3333333333334vw 8vw;
        margin: 0 0 5.33333333333333334vw;
        border-radius: 5px;
    }
    #sdgs .approach .list .item .item-ttl{
        gap: 2.4vw;
        font-size: 4.26666666666666666667vw;
        line-height: 1;
        padding: 0 0 5.333333333333333333334vw;
        margin: 0 0 5.333333333333333333334vw;
    }
    #sdgs .approach .list .item .item-ttl span{
        font-size: 5.33333333333333334vw;
    }
    #sdgs .approach .list .item .note{
        font-size: 3.73333333333333333334vw;
        line-height: 1.57;
        margin: 0 0 5.333333333333334vw;
    }
    #sdgs .approach .list .item .icon_area{
        gap: 2.6666666666666666667vw;
    }
    #sdgs .approach .list .item .icon_area img{
        max-width: 24vw;
    }
    #sdgs .approach .list .item .kind-list .kind-item{
        flex-wrap: wrap;
        gap: 4vw 5.333333333333334vw;
        flex-wrap: wrap;
        padding: 0 0 30px;
        margin: 0 0 30px;
        border-bottom: 1px solid #D9D9D9;
        width: 100%;
    }
    #sdgs .approach .list .item .kind-list .kind-item .img img{
        max-width: 24vw;
    }
    #sdgs .approach .list .item .kind-list .kind-item .txt{
        max-width: 48vw;
        width: 100%;
    }
    #sdgs .approach .list .item .kind-list .kind-item .txt .txt_ttl{
        font-size: 4vw;
        line-height: 1.334;
        margin: 0;
    }
    #sdgs .approach .list .item .kind-list .kind-item .txt .txt_note{
        display: none;
    }
    #sdgs .approach .list .item .kind-list .kind-item .sp.txt_note{
        font-size: 3.733333333333334vw;
        font-weight: 400;
        letter-spacing: 2px;
        line-height: 1.57;
    }
}


/* PRIVACY　プライバシーポリシー
--------------------------------------*/
#privacy .main_area{
    padding: 120px 0 115px;
    background-color: #F7F7F7;
}
#privacy .main_area .add-ttl{
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 2px;
    line-height: 1.5;
    margin: 0 0 130px;
    color: #222222;
}
#privacy .main_area .ctt{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
#privacy .main_area .ctt .flex-ttl{
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 2px;
    line-height: 1;
    color: #222222;
}
#privacy .main_area .ctt .flex-ttl::before{
    content: "";
    width: 15px;
    height: 15px;
    background-color: #529370;
    border-radius: 50%;
}
#privacy .main_area .ctt .list{
    display: block;
    max-width: 800px;
    width: 100%;
    flex-shrink: 0;
}
#privacy .main_area .ctt .list .item{
    display: block;
    width: 100%;
    padding: 0 0 50px;
    margin: 0 0 50px;
    border-bottom: 1px solid #D9D9D9;
}
#privacy .main_area .ctt .list .item:last-of-type{
    padding: 0;
    margin: 0;
    border: none;
}
#privacy .main_area .ctt .list .item .list-ttl{
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 2px;
    margin: 0 0 30px;
    color: #222222;
}
#privacy .main_area .ctt .list .item .note{
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 2px;
    line-height: 1.67;
    margin: 0;
    color: #222222;
}
@media only screen and (max-width: 768px) {
    #privacy .main_area{
        padding: 13.333333333333335vw 0 16vw;
    }
    #privacy .main_area .add-ttl{
        font-size: 3.73333333333333334vw;
        margin: 0 0 16vw;
    }
    #privacy .main_area .ctt{
        display: block;
    }
    #privacy .main_area .ctt .flex-ttl{
        gap: 3.466666666666666663vw;
        font-size: 4.8vw;
        margin: 0 0 13.33333333333335vw;
    }
    #privacy .main_area .ctt .flex-ttl::before{
        width: 3.4666666666666666663vw;
        height: 3.4666666666666666663vw;
    }
    #privacy .main_area .ctt .list{
        max-width: none;
    }
    #privacy .main_area .ctt .list .item{
        padding: 0 0 6.66666666666667vw;
        margin: 0 0 8vw;
    }
    #privacy .main_area .ctt .list .item .list-ttl{
        font-size: 3.733333333333333333334vw;
        margin: 0 0 5.3333333333333334vw;
    }
    #privacy .main_area .ctt .list .item .note{
        font-size: 3.2vw;
        line-height: 1.67;
    }
}


/* ABOUT　ドッグラボとは？
--------------------------------------*/
#about .consept{
    position: relative;
    overflow: hidden;
    padding: 140px 0 156px;
    background-color: #F7F7F7;
}
#about .consept .inner{
    position: relative;
    z-index: 2;
}
#about .consept .info_txt{
    position: relative;
    margin: 0 auto 115px;
}
#about .consept .info_txt .in-txt{
    display: block;
    max-width: 745px;
    width: 100%;
    margin: 0 auto;
}
#about .consept .info_txt .in-txt .label{
    display: block;
    font-size: 20px;
    font-family: "Inter", sans-serif;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0;
    line-height: 1.5;
    margin: 0 auto 45px;
    color: #222222;
}
#about .consept .info_txt .in-txt .ttl{
    font-size: 35px;
    font-weight: 600;
    line-height: 1.43;
    letter-spacing: 2px;
    text-align: center;
    margin: 0 auto 65px;
    color: #000000;
}
#about .consept .info_txt .in-txt .note{
    font-size: 15px;
    font-weight: 400;
    text-align: center;
    letter-spacing: 1px;
    line-height: 2;
    color: #000000;
}
#about .consept .left-img{
    position: absolute;
    top: 55%;
    left: -30px;
    transform: translateY(-50%);
    display: block;
    max-width: 238px;
    width: 100%;
}
#about .consept .right-img{
    position: absolute;
    top: 55%;
    right: -136px;
    transform: translateY(-50%);
    display: block;
    max-width: 390px;
    width: 100%;
}
#about .consept .left-img img,
#about .consept .right-img img{
    display: block;
    width: 100%;
    height: auto;
}
#about .consept .info_flex{
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: 70px;
    margin: 0 auto;
}
#about .consept .info_flex .item{
    display: block;
}
#about .consept .info_flex .item:nth-of-type(2){
    padding: 0 70px;
    border-left: 1px dashed #222222;
    border-right: 1px dashed #222222;
}
#about .consept .info_flex .item .label{
    display: block;
    font-size: 14px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0;
    line-height: 1.71;
    margin: 0 auto 13px;
    color: #222222;
}
#about .consept .info_flex .item .name{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 26px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 1px;
    line-height: 1.47;
    min-height: 76px;
    margin: 0 auto 25px;
    color: #222222;
}
#about .consept .info_flex .item .results{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    font-size: 70px;
    font-family: "Inter", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1;
    color: #CF6541;
}
#about .consept .info_flex .item .results span{
    font-size: 24px;
    font-family: "Noto Sans JP", sans-serif;
    letter-spacing: 0;
    line-height: 1.07;
    padding-top: 20px;
}
#about .consept .info_flex .item .results span.small{
    font-size: 20px;
    padding-top: 3px;
}
#about .consept .text-slider {
    position: absolute;
    bottom: -62px;
    left: 0;
    right: 0;
    overflow: hidden;
    z-index: 1;
    white-space: nowrap;
    width: 100%;
}
#about .consept .text-slider .slide-track {
    display: inline-block;
    animation: slide 20s linear infinite;
}
#about .consept .text-slider .slide-track span {
    display: inline-block;
    padding: 0 10px;
}
@keyframes slide {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}
@media only screen and (max-width: 1600px) {
    #about .consept .left-img{
        left: -2vw;
        max-width: 15vw;
    }
    #about .consept .right-img{
        right: -6.5vw;
        max-width: 22vw;
    }
}
@media only screen and (max-width: 768px) {
    #about .consept{
        padding: 16vw 0 21.33333333333336vw;
    }
    #about .consept .info_txt{
        display: flex;
        align-items: flex-end;
        justify-content: center;
        flex-wrap: wrap;
        gap: 7vw 4vw;
        margin: 0 auto 13.3333333333333335vw;
    }
    #about .consept .info_txt .in-txt{
        max-width: none;
        width: 100%;
        order: 1;
    }
    #about .consept .info_txt .in-txt .label{
        font-size: 3.733333333333333334vw;
        line-height: 2.14;
        margin: 0 auto 3.733333333333333334vw;
    }
    #about .consept .info_txt .in-txt .ttl{
        font-size: 5.3333333333333334vw;
        line-height: 1.6;
        margin: 0 auto 8vw;
    }
    #about .consept .info_txt .in-txt .note{
        font-size: 4vw;
        line-height: 1.73;
    }
    #about .consept .left-img{
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        max-width: 29.333333333333332vw;
        order: 2;
    }
    #about .consept .right-img{
        position: relative;
        top: auto;
        right: auto;
        transform: none;
        max-width: 50.66666666666667vw;
        order: 3;
    }
    #about .consept .info_flex{
        gap: 2.66666666666666667vw;
    }
    #about .consept .info_flex .item{
        display: block;
    }
    #about .consept .info_flex .item:nth-of-type(2){
        padding: 0 3.2vw;
    }
    #about .consept .info_flex .item .label{
        font-size: 2.133333333333333vw;
        line-height: 1.67;
        margin: 0 auto 1.3333333333333335vw;
    }
    #about .consept .info_flex .item .name{
        font-size: 2.933333333333333333333vw;
        min-height: 8vw;
        margin: 0 auto 2.4vw;
    }
    #about .consept .info_flex .item .name{
        font-size: 2.666666666666667vw;
    }
    #about .consept .info_flex .item .results{
        gap: 0.5666666666666666666666vw;
        font-size: 8vw;
    }
    #about .consept .info_flex .item .results span{
        font-size: 3.2vw;
        padding-top: 2.133333333333333333333336vw;
    }
    #about .consept .info_flex .item .results span.small{
        font-size: 2.66666666666666667vw;
        padding-top: 1.3333333333333333335vw;
    }
    #about .consept .text-slider {
        bottom: 0;
        width: 150%;
    }
    #about .consept .text-slider .slide-track span {
        padding: 0 2.66666666666666666666667vw;
    }
}

#about .mission{
    position: relative;
    padding: 130px 0 210px;
    background-color: #3C754F;
}
#about .mission .ctt{
    display: flex;
    align-items: center;
    gap: 80px;
}
#about .mission .ctt .about-slider{
    position: relative;
    flex-shrink: 0;
    max-width: 51.1111111111111vw;
    width: 100%;
    height: 32.22222222222222vw;
    border-radius: 0 10px 10px 0;
    margin: 0;
    overflow: hidden;
}
#about .mission .ctt .about-slider .swiper-slide{
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
#about .mission .ctt .about-slider .swiper-slide img{
    width: 100%;
    height: auto;
}
#about .mission .ctt .about-slider .swiper-pagination{
    position: absolute;
    bottom: 30px;
    right: 0;
    display: flex;
    justify-content: right;
    align-items: center;
    padding-right: 30px;
}
#about .mission .ctt .about-slider .swiper-pagination .swiper-pagination-bullet{
    background: #ECECEC;
    opacity: 1;
}
#about .mission .ctt .about-slider .swiper-pagination .swiper-pagination-bullet-active{
    background: #EC6859;
}
#about .mission .ctt .txt{
    display: block;
    max-width: 560px;
    width: 100%;
    color: #fff;
}
#about .mission .ctt .txt .label{
    display: block;
    font-size: 20px;
    font-family: "Inter", sans-serif;
    font-weight: 600;
    line-height: 1.5;
    margin: 0 0 13px;
}
#about .mission .ctt .txt h2{
    font-size: 37px;
    font-weight: 600;
    letter-spacing: 2px;
    line-height: 1.46;
    margin: 0 0 35px;
}
#about .mission .ctt .txt .sub-ttl{
    font-size: 22px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1.14;
    margin: 0 0 30px;
}
#about .mission .ctt .txt .note{
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 1.81;
}
#about .mission .text-slider {
    position: absolute;
    bottom: 45px;
    left: 0;
    right: 0;
    overflow: hidden;
    z-index: 1;
    white-space: nowrap;
    width: 100%;
}
#about .mission .text-slider .slide-track {
    display: flex;
    align-items: center;
    gap: 25px;
    width: max-content;
    animation: slide 35s linear infinite;
}
@keyframes slide {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}
#about .mission .text-slider .slide-track .slide-item {
    display: flex;
    align-items: center;
    gap: 25px;
    white-space: nowrap;
}
#about .mission .text-slider .slide-track .slide-item span{
    display: block;
    font-size: 75px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.07;
    color: #fff;
}
#about .mission .text-slider .slide-track .slide-item img{
    display: block;
    max-width: 120px;
    width: 100%;
    border-radius: 5px;
}
@media only screen and (max-width: 768px) {
    #about .mission{
        padding: 16vw 0 37.3333333333334vw;
    }
    #about .mission .ctt{
        width: 100%;
        flex-wrap: wrap;
        gap: 13.333333333333333335vw;
    }
    #about .mission .ctt .about-slider{
        max-width: 93.33333333333333vw;
        height: 58.666666666666664vw;
        border-radius: 0 5px 5px 0;
    }
    #about .mission .ctt .about-slider .swiper-pagination{
        bottom: 4vw;
        padding-right: 2.666666666666666666667vw;
    }
    #about .mission .ctt .txt{
        max-width: none;
        padding: 0 8vw;
    }
    #about .mission .ctt .txt .label{
        font-size: 4vw;
        line-height: 1.2;
        margin: 0 0 4vw;
    }
    #about .mission .ctt .txt h2{
        font-size: 6.1333333333333333333vw;
        line-height: 1.43;
        margin: 0 0 5.333333333333334vw;
    }
    #about .mission .ctt .txt .sub-ttl{
        font-size: 4.8vw;
        line-height: 1.83;
        margin: 0 0 5.33333333333333333334vw;
    }
    #about .mission .ctt .txt .note{
        font-size: 3.73333333333333334vw;
        line-height: 1.81;
    }
    #about .mission .text-slider {
        bottom: 10.6666666666666668vw;
    }
    #about .mission .text-slider .slide-track {
        gap: 3.46666666666666666663vw;
    }
    #about .mission .text-slider .slide-track .slide-item {
        gap: 3.46666666666666666663vw;
    }
    #about .mission .text-slider .slide-track .slide-item span{
        font-size: 10.6666666666666666668vw;
    }
    #about .mission .text-slider .slide-track .slide-item img{
        max-width: 16.888888888888888888888vw;
    }
}

#about .reazon{
    padding: 135px 0 130px;
}
#about .reazon .ttl_area{
    margin: 0 auto 135px;
    color: #222222;
}
#about .reazon .ttl_area .label{
    display: block;
    font-size: 20px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 2px;
    margin: 0 0 30px;
}
#about .reazon .ttl_area h2{
    font-size: 62px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0;
    line-height: 1;
    margin: 0 0 32px;
}
#about .reazon .ttl_area .note{
    font-size: 17px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 1px;
    line-height: 1.76;
}
#about .reazon .ctt{
    display: block;
    width: 100%;
    margin: 0 auto;
}
#about .reazon .ctt .item{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 50px;
    padding: 0 0 100px;
    margin: 0 0 100px;
}
#about .reazon .ctt .item::before{
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: 0;
    background-image: repeating-linear-gradient(to right, #222222 0px, #222222 1px, transparent 1px, transparent 5px);
}
#about .reazon .ctt .item:nth-of-type(even){
    flex-direction: row-reverse;
}
#about .reazon .ctt .item:last-of-type{
    padding: 0;
    margin: 0;
}
#about .reazon .ctt .item:last-of-type::before{
    display: none;
}
#about .reazon .ctt .item .img{
    position: relative;
    width: 600px;
    height: 380px;
    border-radius: 5px;
    flex-shrink: 0;
    overflow: hidden;
}
#about .reazon .ctt .item .img img{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: auto;
}
#about .reazon .ctt .item .txt{
    position: relative;
    max-width: 580px;
    width: 100%;
    flex: 1;
    color: #222222;
}
#about .reazon .ctt .item .txt .number{
    position: absolute;
    top: -30px;
    right: 0;
    width: 105px;
    height: auto;
    overflow: hidden;
}
#about .reazon .ctt .item .txt .number img{
    display: block;
    width: auto;
    height: 100%;
    margin: 0 auto;
}
#about .reazon .ctt .item .txt .label{
    display: block;
    font-size: 15px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.33;
    margin: 0 0 40px;
}
#about .reazon .ctt .item .txt .item-ttl{
    display: block;
    font-size: 28px;
    font-weight: 600;
    letter-spacing: 1px;
    line-height: 1.5;
    margin: 0 0 30px;
}
#about .reazon .ctt .item .txt .note{
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 1.73;
}
@media only screen and (max-width: 768px) {
    #about .reazon{
        padding: 21.333333333333336vw 0 18.666666666666668vw;
    }
    #about .reazon .ttl_area{
        margin: 0 auto 9.33333333333333333334vw;
    }
    #about .reazon .ttl_area .label{
        font-size: 4.8vw;
        margin: 0 0 4vw;
    }
    #about .reazon .ttl_area h2{
        font-size: 12.8vw;
        margin: 0 0 3.4666666666666666663vw;
    }
    #about .reazon .ttl_area .note{
        font-size: 4vw;
    }
    #about .reazon .ctt .item{
        display: block;
        padding: 0 0 10.6666666666666666668vw;
        margin: 0 0 10.6666666666666666668vw;
    }
    #about .reazon .ctt .item .img{
        width: 89.333333333333vw;
        height: 56.53333333333334vw;
        margin: 0 0 5.3333333333333334vw;
    }
    #about .reazon .ctt .item .txt{
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 5.33333333333333333334vw;
        max-width: none;
    }
    #about .reazon .ctt .item .txt .number{
        position: relative;
        top: auto;
        right: auto;
        width: 20vw;
        height: auto;
        overflow: hidden;
        order: 2;
    }
    #about .reazon .ctt .item .txt .label{
        font-size: 4vw;
        margin: 0;
        order: 1;
    }
    #about .reazon .ctt .item .txt .item-ttl{
        font-size: 5.3333333333333334vw;
        margin: 0;
        order: 3;
    }
    #about .reazon .ctt .item .txt .note{
        font-size: 3.7333333333333334vw;
        order: 4;
    }
}

#about .another-link{
    padding: 105px 0 125px;
    background-color: #F0F0F0;
    border-top: 1px dashed #222222;
    border-bottom: 1px dashed #222222;
}
#about .another-link .link-list{
    display: flex;
    justify-content: center;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 20px 40px;
}
#about .another-link .item{
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 630px;
    width: 100%;
    padding: 20px 20px 20px 50px;
    background-color: #fff;
    border-radius: 5px;
}
#about .another-link .item:hover{
    opacity: 1;
}
#about .another-link .item .txt .label{
    display: block;
    font-size: 15px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.3;
    margin: 0 0 10px;
    color: #222222;
    opacity: 0.5;
}
#about .another-link .item .txt .name{
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 1px;
    color: #222222;
}
#about .another-link .item .txt .name::after{
    content: "";
    width: 20px;
    height: 20px;
    background-image: url(../img/top/btn_black_arrow.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    transition: all .3s;
}
#about .another-link .item:hover .txt .name::after{
    background-image: url(../img/top/btn_in-black_arrow.png);
}
#about .another-link .item .img{
    position: relative;
    width: 160px;
    height: 100px;
    border-radius: 5px;
    overflow: hidden;
}
#about .another-link .item .img img{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: auto;
    transition: all .3s;
}
#about .another-link .item:hover .img img{
    transform: scale(1.1);
}
@media only screen and (max-width: 768px) {
    #about .another-link{
        padding: 16vw 0;
    }
    #about .another-link .link-list{
        gap: 2.6666666666666667vw;
    }
    #about .another-link .item{
        max-width: none;
        padding: 3.2vw 3.2vw 3.2vw 8vw;
    }
    #about .another-link .item .txt .label{
        font-size: 2.666666666666667vw;
        margin: 0 0 1.6666666666666667vw;
    }
    #about .another-link .item .txt .name{
        gap: 2.66666666666667vw;
        font-size: 3.2vw;
    }
    #about .another-link .item .txt .name::after{
        width: 3.2vw;
        height: 3.2vw;
    }
    #about .another-link .item .img{
        width: 27.7333333333333vw;
        height: 17.06666666666vw;
    }
}


/* COMPANY　会社案内
--------------------------------------*/
#company .message{
    position: relative;
    padding: 130px 0 240px;
    background-color: #F7F7F7;
}
#company .message .ctt{
    display: flex;
    justify-content: center;
    gap: 90px;
}
#company .message .ctt .img{
    flex-shrink: 0;
}
#company .message .ctt .img img{
    display: block;
    max-width: 520px;
    width: 100%;
    height: auto;
    border-radius: 10px;
}
#company .message .ctt .txt{
    display: block;
    max-width: 690px;
    width: 100%;
    color: #222222;
}
#company .message .ctt .txt .label{
    display: block;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1.44;
    margin: 0 0 20px;
}
#company .message .ctt .txt h2{
    font-size: 55px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.1;
    margin: 0 0 40px;
}
#company .message .ctt .txt .note{
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 2;
    margin: 0 0 55px;
}
#company .message .ctt .txt .note span{
    font-weight: 600;
}
#company .message .ctt .txt .name{
    text-align: right;
}
#company .message .ctt .txt .name span{
    display: block;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.82;
    text-align: right;
    color: #222222;
}
#company .message .ctt .txt .name p{
    display: block;
    font-size: 28px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1.61;
    text-align: right;
    color: #222222;
}
#company .message .text-slider {
    position: absolute;
    bottom: 60px;
    left: 0;
    right: 0;
    overflow: hidden;
    z-index: 1;
    white-space: nowrap;
    width: 100%;
}
#company .message .text-slider .slide-track {
    display: flex;
    align-items: center;
    gap: 25px;
    width: max-content;
    animation: slide 35s linear infinite;
}
@keyframes slide {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}
#company .message .text-slider .slide-track .slide-item {
    display: flex;
    align-items: center;
    gap: 25px;
    white-space: nowrap;
}
#company .message .text-slider .slide-track .slide-item span{
    display: block;
    font-size: 75px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.07;
    color: #222222;
}
#company .message .text-slider .slide-track .slide-item img{
    display: block;
    max-width: 120px;
    width: 100%;
    border-radius: 5px;
}
@media only screen and (max-width: 768px) {
    #company .message{
        padding: 21.333333333333336vw 0 42.66666666666667vw;
    }
    #company .message .ctt{
        flex-direction: column;
        gap: 12vw;
    }
    #company .message .ctt .img{
        display: block;
        width: 100%;
    }
    #company .message .ctt .img img{
        max-width: none;
        width: 100%;
        border-radius: 5px;
        margin: 0;
    }
    #company .message .ctt .txt{
        max-width: none;
        width: 100%;
        margin: 0 auto;
    }
    #company .message .ctt .txt .label{
        font-size: 4vw;
        line-height: 1.73;
        text-align: center;
        margin: 0 0 1.333333333333333335vw;
    }
    #company .message .ctt .txt h2{
        font-size: 10.666666666666666668vw;
        text-align: center;
        line-height: 1.5;
        margin: 0 0 6.666666666666666667vw;
    }
    #company .message .ctt .txt .note{
        font-size: 4vw;
        line-height: 2.14;
        margin: 0 0 8vw;
    }
    #company .message .ctt .txt .name span{
        font-size: 3.46666666666666666663vw;
        line-height: 1.82;
    }
    #company .message .ctt .txt .name p{
        font-size: 5.333333333333334vw;
        line-height: 1.61;
    }
    #company .message .text-slider {
        bottom: 12vw;
    }
    #company .message .text-slider .slide-track {
        gap: 3.733333333334vw;
    }
    #company .message .text-slider .slide-track .slide-item {
        gap: 3.733333333334vw;
    }
    #company .message .text-slider .slide-track .slide-item span{
        font-size: 16vw;
        line-height: 1.07;
    }
    #company .message .text-slider .slide-track .slide-item img{
        max-width: 26.13333333333333vw;
        border-radius: 5px;
    }
}

#company .outline{
    padding: 120px 0 105px;
    background-color: #F0F0F0;
}
#company .outline .ctt{
    display: flex;
    justify-content: space-between;
    gap: 50px;
}
#company .outline .ctt .ttl_area .label{
    display: block;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1.44;
    margin: 0 0 20px;
    color: #2D2D2D;
}
#company .outline .ctt .ttl_area h2{
    font-size: 55px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.1;
    color: #222222;
}
#company .outline .ctt .info_list{
    display: block;
    max-width: 940px;
    width: 100%;
    flex-shrink: 0;
}
#company .outline .ctt .info_list dl{
    position: relative;
    display: flex;
    padding: 30px 0;
}
#company .outline .ctt .info_list dl:last-of-type{
    padding: 30px 0 0;
}
#company .outline .ctt .info_list dl::before{
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    top: 0;
    left: 0;
    background-image: repeating-linear-gradient(to right, #222222 0px, #222222 1px, transparent 1px, transparent 4px);
}
#company .outline .ctt .info_list dl dt{
    display: block;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1.63;
    color: #222222;
    max-width: 245px;
    width: 100%;
    flex-shrink: 0;
}
#company .outline .ctt .info_list dl dt span{
    font-size: 12px;
    font-weight: 400;
    line-height: 2.08;
}
#company .outline .ctt .info_list dl dd{
    flex: 1;
    padding-right: 15px;
    font-size: 15px;
    font-weight: 400;
    line-height: 2;
    letter-spacing: 1px;
    color: #222222;
}
#company .outline .ctt .info_list dl dd p{
    margin: 0 0 40px;
}
#company .outline .ctt .info_list dl dd p:last-of-type{
    margin: 0;
}
#company .outline .ctt .info_list dl dd span,
#company .outline .ctt .info_list dl dd p span{
    font-weight: 600;
}
#company .outline .ctt .info_list dl dd img{
    display: block;
    max-width: 200px;
    width: 100%;
    margin: 0 0 16px;
}
@media only screen and (max-width: 768px) {
    #company .outline{
        padding: 16vw 0;
    }
    #company .outline .ctt{
        display: block;
    }
    #company .outline .ctt .ttl_area{
        margin: 0 auto 13.333333333333333335vw;
    }
    #company .outline .ctt .ttl_area .label{
        font-size: 4.266666666666666667vw;
        text-align: center;
        line-height: 1.63;
        margin: 0 0 1.3333333333335vw;
    }
    #company .outline .ctt .ttl_area h2{
        font-size: 10.6666666666666668vw;
        text-align: center;
        line-height: 1.5;
    }
    #company .outline .ctt .info_list{
        max-width: none;
        width: 100%;
    }
    #company .outline .ctt .info_list dl{
        display: block;
        padding: 5.33333333333333334vw 0;
    }
    #company .outline .ctt .info_list dl:last-of-type{
        padding: 5.33333333333333334vw 0 0;
    }
    #company .outline .ctt .info_list dl dt{
        font-size: 3.46666666666666663vw;
        max-width: none;
        margin: 0 0 2.66666666666667vw;
    }
    #company .outline .ctt .info_list dl dt span{
        font-size: 2.666666666666667vw;
        line-height: 1.5;
        padding-left: 1.3333333333335vw;
    }
    #company .outline .ctt .info_list dl dd{
        padding-right: 0;
        font-size: 3.4666666666666666663vw;
        line-height: 1.87;
        letter-spacing: 0;
    }
    #company .outline .ctt .info_list dl dd p{
        margin: 0 0 2.66666666666666667vw;
    }
    #company .outline .ctt .info_list dl dd img{
        max-width: 37.3333333333333333334vw;
        margin: 0 0 3.2vw;
    }
}

#company .history{
    position: relative;
    isolation: isolate;
    background-color: #3B3B3B;
    overflow: visible;
}
#company .history .history-bg-wrap{
    display: grid;
}
#company .history .history-bg-wrap > .history-bg,
#company .history .history-bg-wrap > .inner{
    grid-column: 1;
    grid-row: 1;
}
#company .history .history-bg{
    position: sticky;
    top: 0;
    height: 100vh;
    overflow: hidden;
    z-index: 0;
    pointer-events: none;
}
#company .history .history-bg::after{
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
}
#company .history .history-bg-item {
    position: absolute;
    inset: 0;
    opacity: 0;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    transition: opacity 1.1s ease;
}
#company .history .history-bg-item.is-active {
    opacity: 1;
}
#company .history .inner{
    position: relative;
    padding: 115px 0 120px;
    z-index: 2;
}
#company .history .ttl_area{
    display: block;
    margin: 0 auto 115px;
    color: #fff;
}
#company .history .ttl_area .label{
    display: block;
    font-size: 18px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 1px;
    line-height: 1.47;
    margin: 0 0 20px;
}
#company .history .ttl_area h2{
    font-size: 55px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0;
    line-height: 1.09;
    margin: 0 0 45px;
}
#company .history .ttl_area .sub-p{
    font-size: 30px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 2px;
    line-height: 1.5;
    margin: 0 0 20px;
}
#company .history .ttl_area .note{
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 1px;
    line-height: 2;
}
#company .history .timeline{
    position: relative;
}
#company .history .timeline .history-line {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.3);
    transform: translateX(-50%);
}
#company .history .timeline .history-line-progress {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 0;
    background: #fff;
    will-change: height;
}
#company .history .timeline .history-item{
    display: flex;
    justify-content: space-between;
    margin: 0 0 110px;
    opacity: 0;
    transform: translateY(60px);
    transition:
        opacity 1.2s ease,
        transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}
#company .history .timeline .history-item.is-show {
    opacity: 1;
    transform: translateY(0);
}
#company .history .timeline .history-item:last-of-type{
    margin: 0;
}
#company .history .timeline .history-item--right{
    flex-direction: row-reverse;
}
#company .history .timeline .history-item .history-txt{
    display: block;
    max-width: 460px;
    width: 100%;
    color: #fff;
}
#company .history .timeline .history-item .history-txt .history-year{
    display: block;
    font-size: 45px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.33;
    text-decoration: none;
    margin: 0 0 10px;
}
#company .history .timeline .history-item .history-txt .history-text{
    color: #fff;
}
#company .history .timeline .history-item .history-txt .history-text .sub-ttl{
    font-size: 22px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1.36;
    margin: 0 0 28px;
}
#company .history .timeline .history-item .history-txt .history-text .note{
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 1.71;
}
#company .history .timeline .history-item .history-image{
    display: flex;
    gap: 100px;
}
#company .history .timeline .history-item--right .history-image{
    flex-direction: row-reverse;
}
#company .history .timeline .history-item .history-image .history-era{
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 2;
    color: #fff;
    margin: 0;
}
#company .history .timeline .history-item--right .history-image .first-image{
    display: block;
    margin: 0 0 20px;
}
#company .history .timeline .history-item .history-image .image{
    position: relative;
    width: 360px;
    height: 240px;
    overflow: hidden;
    border-radius: 5px;
}
#company .history .timeline .history-item .history-image .image img{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: auto;
    border-radius: 5px;
}
#company .history .history-add-sec{
    margin: 110px auto 0;
    opacity: 0;
    transform: translateY(60px);
    transition:
        opacity 1.2s ease,
        transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}
#company .history .history-add-sec.is-show{
    opacity: 1;
    transform: translateY(0);
}
#company .history .history-add-sec h3{
    font-size: 40px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 2px;
    line-height: 1.6;
    margin: 0 auto 35px;
    color: #fff;
}
#company .history .history-add-sec p{
    display: block;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 1px;
    line-height: 2;
    margin: 0 auto 60px;
    color: #fff;
}
#company .history .history-add-sec img{
    display: block;
    max-width: 1300px;
    width: 100%;
    height: auto;
    margin: 0 auto;
    border-radius: 10px;
}
@media only screen and (max-width: 768px) {
    #company .history .inner{
        padding: 24vw 0 21.33333333333333336vw;
    }
    #company .history .history-bg{
        height: 100vh;
    }
    #company .history .ttl_area{
        margin: 0 auto 12vw;
    }
    #company .history .ttl_area .label{
        font-size: 4.8vw;
        letter-spacing: 2px;
        line-height: 1.12;
        margin: 0 0 3.7333333333333333334vw;
    }
    #company .history .ttl_area h2{
        font-size: 10.66666666666666668vw;
        letter-spacing: 0;
        line-height: 1.5;
        margin: 0 0 5.33333333333333334vw;
    }
    #company .history .ttl_area .sub-p{
        font-size: 4.8vw;
        letter-spacing: 1px;
        margin: 0 0 8vw;
    }
    #company .history .ttl_area .note{
        font-size: 3.466666666666666663vw;
        line-height: 1.77;
    }
    #company .history .timeline .history-line {
        left: 28vw;
        transform: translateX(-50%);
    }
    #company .history .timeline .history-item{
        align-items: flex-start;
        flex-direction: row-reverse;
        padding: 0 2.6666666666667vw;
        margin: 0 0 16vw;
        opacity: 0;
        transform: translateY(30px);
    }
    #company .history .timeline .history-item--right{
        flex-direction: row-reverse;
    }
    #company .history .timeline .history-item .history-txt{
        max-width: 64vw;
    }
    #company .history .timeline .history-item .history-txt .history-year{
        font-size: 8vw;
        line-height: 2;
        margin: 0 0 0.53333333333333333vw;
    }
    #company .history .timeline .history-item .history-txt .history-text{
        margin: 0 0 8vw;
    }
    #company .history .timeline .history-item .history-txt .history-text .sub-ttl{
        font-size: 5.33333333333334vw;
        margin: 0 0 4vw;
    }
    #company .history .timeline .history-item .history-txt .history-text .note{
        font-size: 3.733333333333334vw;
    }
    #company .history .timeline .history-item .history-txt .image{
        position: relative;
        width: 59.199999999999996vw;
        height: 39.46666666666667vw;
        overflow: hidden;
        border-radius: 5px;
    }
    #company .history .timeline .history-item .history-txt .first-image{
        margin: 0 0 2.66666666667vw;   
    }
    #company .history .timeline .history-item .history-txt .image img{
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: auto;
        border-radius: 5px;
    }
    #company .history .timeline .history-item .history-image{
        display: block;
    }
    #company .history .timeline .history-item .history-image .history-era{
        font-size: 3.466666666666666663vw;
        line-height: 2;
        margin: 4vw 0 0;
    }
    #company .history .timeline .history-item .history-image .image{
        display: none;
    }
    #company .history .history-add-sec{
        margin: 18.66666666666668vw 0 0;
        padding: 0 2.666666666666667vw;
    }
    #company .history .history-add-sec h3{
        font-size: 6.6666666666666667vw;
        margin: 0 auto 5.333333333333333334vw;
    }
    #company .history .history-add-sec p{
        font-size: 3.733333333333333334vw;
        margin: 0 auto 10.666666666666666666668vw;
    }
    #company .history .history-add-sec img{
        max-width: none;
        border-radius: 5px;
    }
}

#company .access{
    padding: 110px 0 120px;
    background-color: #F7F7F7;
}
#company .access .ttl_area{
    margin: 0 auto 80px;
    color: #222222;
}
#company .access .ttl_area .label{
    display: block;
    font-size: 18px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 1px;
    line-height: 1.47;
    margin: 0 0 20px;
}
#company .access .ttl_area h2{
    font-size: 55px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0;
    line-height: 1.14;
}
#company .access .ctt{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 65px;
}
#company .access .ctt .map{
    flex-shrink: 0;
}
#company .access .ctt .map iframe{
    display: block;
    width: 560px;
    height: 400px;
    border: 1px solid #000000;
    border-radius: 10px;
}
#company .access .ctt .txt{
    flex: 1;
    color: #222222;
}
#company .access .ctt .txt .name{
    font-size: 22px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1.07;
    margin: 0 0 20px;
}
#company .access .ctt .txt .note{
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 2;
    margin: 0 0 50px;
}
#company .access .ctt .txt .add-note{
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 1.87;
}
@media only screen and (max-width: 768px) {
    #company .access{
        padding: 16vw 0 17.3333333333335vw;
    }
    #company .access .ttl_area{
        margin: 0 auto 8vw;
    }
    #company .access .ttl_area .label{
        font-size: 4.2666666666666667vw;
        line-height: 1.47;
        margin: 0 0 1.3333333333333335vw;
    }
    #company .access .ttl_area h2{
        font-size: 10.66666666666666668vw;
    }
    #company .access .ctt{
        display: block;
    }
    #company .access .ctt .map iframe{
        width: 89.33333333333333vw;
        height: 65.33333333333vw;
        border-radius: 5px;
        margin: 0 auto 9.333333333333334vw;
    }
    #company .access .ctt .txt{
        display: block;
        width: 100%;
    }
    #company .access .ctt .txt .name{
        font-size: 4.2666666666666666667vw;
        line-height: 1.47;
        margin: 0 0 5.333333333334vw;
    }
    #company .access .ctt .txt .note{
        font-size: 3.466666666666666663vw;
        line-height: 1.67;
        margin: 0 0 5.333333333333334vw;
    }
    #company .access .ctt .txt .add-note{
        font-size: 3.466666666666666663vw;
        line-height: 1.69;
    }
}


/* PROCESS　商談・施工の流れ
--------------------------------------*/
#process .step{
    padding: 120px 0;
    background-color: #F7F7F7;
}
#process .step .intro{
    margin: 0 auto 110px;
}
#process .step .intro .txt{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 30px;
    margin: 0 0 75px;
    color: #222222;
}
#process .step .intro .txt h2{
    font-size: 35px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.31;
    flex-shrink: 0;
}
#process .step .intro .txt .note{
    display: block;
    max-width: 645px;
    width: 100%;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.61;
}
#process .step .intro .info-area{
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 32px;
}
#process .step .intro .info-area .item{
    position: relative;
    display: block;
    flex: 1;
    padding: 30px 0 35px;
    max-width: 300px;
    width: 100%;
    color: #fff;
    border-radius: 5px;
}
#process .step .intro .info-area .item:nth-of-type(1){
    background-color: #3F467D;
}
#process .step .intro .info-area .item:nth-of-type(2){
    background-color: #4085A0;
}
#process .step .intro .info-area .item:nth-of-type(3){
    background-color: #2D805E;
}
#process .step .intro .info-area .item:nth-of-type(4){
    background-color: #CF6541;
}
#process .step .intro .info-area .item::before{
    position: absolute;
    top: 50%;
    right: -22px;
    transform: translateY(-50%) rotate(-90deg);
    content: "";
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
}
#process .step .intro .info-area .item:nth-of-type(1)::before{
    border-top: 9px solid #3F467D;
}
#process .step .intro .info-area .item:nth-of-type(2)::before{
    border-top: 9px solid #4085A0;
}
#process .step .intro .info-area .item:nth-of-type(3)::before{
    border-top: 9px solid #2D805E;
}
#process .step .intro .info-area .item:last-of-type::before{
    display: none;
}
#process .step .intro .info-area .item .label{
    display: block;
    font-size: 14px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    text-align: center;
    line-height: 1.43;
    letter-spacing: 1px;
    margin: 0 0 15px;
}
#process .step .intro .info-area .item p{
    font-size: 20px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0;
    line-height: 1;
}
@media only screen and (max-width: 768px) {
    #process .step{
        padding: 10.66666666666668vw 0 18.6666666666668vw;
    }
    #process .step .intro{
        margin: 0 auto 13.333333333333335vw;
    }
    #process .step .intro .txt{
        display: block;
        margin: 0 0 12vw;
    }
    #process .step .intro .txt h2{
        font-size: 4.533333333333333333333vw;
        letter-spacing: 2px;
        line-height: 1.59;
        margin: 0 0 6.4vw;
    }
    #process .step .intro .txt .note{
        max-width: none;
        font-size: 3.733333333333333334vw;
        letter-spacing: 2px;
    }
    #process .step .intro .info-area{
        gap: 2.6666666666666666667vw;
    }
    #process .step .intro .info-area .item{
        padding: 3.466666666666666663vw 0;
        max-width: 20.533333333333335vw;
    }
    #process .step .intro .info-area .item::before{
        right: -2.9333333333333333vw;
        border-left: 1.6vw solid transparent;
        border-right: 1.6vw solid transparent;
    }
    #process .step .intro .info-area .item:nth-of-type(1)::before{
        border-top: 2.13333333333333336vw solid #3F467D;
    }
    #process .step .intro .info-area .item:nth-of-type(2)::before{
        border-top: 2.13333333333333336vw solid #4085A0;
    }
    #process .step .intro .info-area .item:nth-of-type(3)::before{
        border-top: 2.13333333333333336vw solid #2D805E;
    }
    #process .step .intro .info-area .item .label{
        font-size: 2.66666666666666666667vw;
        margin: 0 0 2.66666666666666667vw;
    }
    #process .step .intro .info-area .item p{
        font-size: 2.9333333333333333vw;
        line-height: 1.44;
    }
    #process .step .intro .info-area .item:nth-of-type(1) p{
        font-size: 2.66666666666666667vw;
    }
}

#process .step .ctt{
    display: block;
    width: 100%;
}
#process .step .ctt .step-item{
    margin: 0 0 95px;
}
#process .step .ctt .step-item:last-of-type{
    margin: 0;
}
#process .step .ctt .step-item .step-ttl{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 5px;
    padding: 30px 40px;
    margin: 0 0 30px;
}
#process .step .ctt .step-item:nth-of-type(1) .step-ttl{
    background-color: #3F467D;
}
#process .step .ctt .step-item:nth-of-type(2) .step-ttl{
    background-color: #4085A0;
}
#process .step .ctt .step-item:nth-of-type(3) .step-ttl{
    background-color: #2D805E;
}
#process .step .ctt .step-item:nth-of-type(4) .step-ttl{
    background-color: #CF6541;
}
#process .step .ctt .step-item .step-ttl .flex{
    display: flex;
    align-items: center;
    gap: 65px;
    font-family: "Albert Sans", sans-serif;
    color: #fff;
}
#process .step .ctt .step-item .step-ttl .flex .number{
    position: relative;
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1;
}
#process .step .ctt .step-item .step-ttl .flex .number::before{
    position: absolute;
    top: 50%;
    right: -35px;
    transform: translateY(-50%);
    background-image: repeating-linear-gradient(to bottom, #fff 0px, #fff 2px, transparent 2px, transparent 5px);
    background-repeat: repeat-y;
    background-size: 1px 100%;
    content: "";
    width: 1px;
    height: 40px;
}
#process .step .ctt .step-item .step-ttl .flex .ttl{
    font-size: 25px;
    font-family: 'Noto Sans JP';
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1;
}
#process .step .ctt .step-item .step-ttl .period{
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0;
    line-height: 1.21;
    padding: 6px 15px;
    background-color: #fff;
    border-radius: 100vw;
}
#process .step .ctt .step-item:nth-of-type(1) .step-ttl .period{
    color: #3F467D;
}
#process .step .ctt .step-item:nth-of-type(2) .step-ttl .period{
    color: #4085A0;
}
#process .step .ctt .step-item:nth-of-type(3) .step-ttl .period{
    color: #2D805E;
}
#process .step .ctt .step-item:nth-of-type(4) .step-ttl .period{
    color: #CF6541;
}
#process .step .ctt .step-item .item-list .item{
    display: flex;
    justify-content: space-between;
    gap: 40px;
    padding: 50px 75px 55px 65px;
    margin: 0 0 25px;
    background-color: #fff;
    border-radius: 5px;
}
#process .step .ctt .step-item .item-list .item:last-of-type{
    margin: 0;
}
#process .step .ctt .step-item:first-of-type .item-list .item:first-of-type{
    align-items: center;
}
#process .step .ctt .step-item .item-list .item .left-ctt{
    display: block;
}
#process .step .ctt .step-item .item-list .item .left-ctt .label{
    display: block;
    font-size: 14px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1;
    margin: 0 0 20px;
}
#process .step .ctt .step-item:nth-of-type(1) .item-list .item .left-ctt .label{
    color: #3F467D;
}
#process .step .ctt .step-item:nth-of-type(2) .item-list .item .left-ctt .label{
    color: #4085A0;
}
#process .step .ctt .step-item:nth-of-type(3) .item-list .item .left-ctt .label{
    color: #2D805E;
}
#process .step .ctt .step-item:nth-of-type(4) .item-list .item .left-ctt .label{
    color: #CF6541;
}
#process .step .ctt .step-item .item-list .item .left-ctt h4{
    font-size: 27px;
    font-family: 'Noto Sans JP';
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.44;
    margin: 0 0 20px;
    color: #222222;
}
#process .step .ctt .step-item .item-list .item .left-ctt .note{
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.61;
    color: #222222;
}
#process .step .ctt .step-item .item-list .item .left-ctt .btn a{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 250px;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0;
    line-height: 1.43;
    padding: 15px 0;
    margin: 30px 0 0;
    background-color: #fff;
    border: 1px solid #222222;
    border-radius: 100vw;
    transition: all .3s;
}
#process .step .ctt .step-item .item-list .item .left-ctt .btn a::before{
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%) rotate(-45deg);
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    border-right: 1px solid #222222;
    border-bottom: 1px solid #222222;
    transition: all .3s;
}
#process .step .ctt .step-item .item-list .item .left-ctt .btn a:hover{
    opacity: 1;
    color: #fff;
    background-color: #DF5B4C;
}
#process .step .ctt .step-item .item-list .item .left-ctt .btn a:hover::before{
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
#process .step .ctt .step-item .item-list .item .right-ctt{
    display: block;
    max-width: 650px;
    width: 100%;
    flex-shrink: 0;
}
#process .step .ctt .step-item .item-list .item .right-ctt .note{
    position: relative;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.61;
    padding: 0 0 20px;
    margin: 0 0 30px;
}
#process .step .ctt .step-item .item-list .item .right-ctt .note::before{
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    background-image: repeating-linear-gradient(to right, #222222 0px, #222222 1px, transparent 1px, transparent 4px);
}
#process .step .ctt .step-item:first-of-type .item-list .item:first-of-type .right-ctt .note{
    padding: 0;
    margin: 0;
}
#process .step .ctt .step-item:first-of-type .item-list .item:first-of-type .right-ctt .note::before{
    display: none;
}
#process .step .ctt .step-item .item-list .item .right-ctt .bottom-area .contents{
    display: inline-block;
    font-size: 13px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1.54;
    padding: 5px 14px;
    color: #fff;
    border-radius: 100vw;
}
#process .step .ctt .step-item:nth-of-type(1) .item-list .item .right-ctt .bottom-area .contents{
    background-color: #3F467D;
}
#process .step .ctt .step-item:nth-of-type(2) .item-list .item .right-ctt .bottom-area .contents{
    background-color: #4085A0;
}
#process .step .ctt .step-item:nth-of-type(3) .item-list .item .right-ctt .bottom-area .contents{
    background-color: #2D805E;
}
#process .step .ctt .step-item:nth-of-type(4) .item-list .item .right-ctt .bottom-area .contents{
    background-color: #CF6541;
}
#process .step .ctt .step-item .item-list .item .right-ctt .bottom-area ul{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 20px;
    margin: 25px 0 0;
    padding: 0;
}
#process .step .ctt .step-item .item-list .item .right-ctt .bottom-area ul li{
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0;
    color: #222;
}
#process .step .ctt .step-item .item-list .item .right-ctt .bottom-area ul li::before{
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
}
#process .step .ctt .step-item:nth-of-type(1) .item-list .item .right-ctt .bottom-area ul li::before{
    background-color: #3F467D;
}
#process .step .ctt .step-item:nth-of-type(2) .item-list .item .right-ctt .bottom-area ul li::before{
    background-color: #4085A0;
}
#process .step .ctt .step-item:nth-of-type(3) .item-list .item .right-ctt .bottom-area ul li::before{
    background-color: #2D805E;
}
#process .step .ctt .step-item:nth-of-type(4) .item-list .item .right-ctt .bottom-area ul li::before{
    background-color: #CF6541;
}
@media only screen and (max-width: 768px) {
    #process .step .ctt .step-item{
        margin: 0 0 16vw;
    }
    #process .step .ctt .step-item .step-ttl{
        padding: 4vw 2.66666666666667vw;
        margin: 0 0 4vw;
    }
    #process .step .ctt .step-item .step-ttl .flex{
        gap: 4.8vw;
    }
    #process .step .ctt .step-item .step-ttl .flex .number{
        font-size: 3.4666666666666663vw;
        line-height: 1.54;
    }
    #process .step .ctt .step-item .step-ttl .flex .number::before{
        right: -2.4vw;
        height: 5.3333333333333334vw;
    }
    #process .step .ctt .step-item .step-ttl .flex .ttl{
        font-size: 3.4666666666666663vw;
        line-height: 1.54;
    }
    #process .step .ctt .step-item .step-ttl .period{
        font-size: 2.66666666666666667vw;
        line-height: 1.5;
        padding: 0.2666666666666666vw 1.333333333333335vw;
    }
    #process .step .ctt .step-item .item-list .item{
        display: block;
        padding: 8vw 5.3333333333333334vw 9.3333333333333334vw;
        margin: 0 0 5.33333333333333334vw;
    }
    #process .step .ctt .step-item .item-list .item .left-ctt{
        margin: 0 0 5.333333333333333334vw;
    }
    #process .step .ctt .step-item .item-list .item .left-ctt .label{
        font-size: 3.2vw;
        line-height: 1.04;
        margin: 0 0 2.6666666666667vw;
    }
    #process .step .ctt .step-item .item-list .item .left-ctt h4{
        font-size: 4.8vw;
        line-height: 1.44;
        margin: 0 0 2.66666666666666667vw;
    }
    #process .step .ctt .step-item .item-list .item .left-ctt .note{
        font-size: 3.2vw;
        line-height: 1.47;
    }
    #process .step .ctt .step-item .item-list .item .left-ctt .btn a{
        max-width: 53.333333333334vw;
        font-size: 3.2vw;
        line-height: 1.43;
        padding: 2.6666666666667vw 0;
        margin: 9.333333333333334vw 0 0;
    }
    #process .step .ctt .step-item .item-list .item .left-ctt .btn a::before{
        right: 3.2vw;
        width: 1.33333333333335vw;
        height: 1.33333333333335vw;
    }
    #process .step .ctt .step-item .item-list .item .right-ctt{
        max-width: none;
    }
    #process .step .ctt .step-item .item-list .item .right-ctt .note{
        font-size: 3.466666666666666663vw;
        line-height: 2;
        padding: 0 0 5.33333333333333334vw;
        margin: 0 0 8vw;
    }
    #process .step .ctt .step-item .item-list .item .right-ctt .bottom-area .contents{
        font-size: 3.2vw;
        line-height: 1.67;
        padding: 1.33333333333335vw 4vw 1.0666666666666666668vw;
    }
    #process .step .ctt .step-item .item-list .item .right-ctt .bottom-area ul{
        display: block;
        margin: 5.3333333333333333334vw 0 0;
    }
    #process .step .ctt .step-item .item-list .item .right-ctt .bottom-area ul li{
        gap: 3.2vw;
        font-size: 3.4666666666666663vw;
        margin: 0 0 4vw;
    }
    #process .step .ctt .step-item .item-list .item .right-ctt .bottom-area ul li:last-child{
        margin: 0;
    }
    #process .step .ctt .step-item .item-list .item .right-ctt .bottom-area ul li::before{
        width: 1.66666666666668vw;
        height: 1.66666666666668vw;
    }
}

#process .faq{
    padding: 100px 0;
    background-color: #F0F0F0;
    border-top: 1px dashed #222222;
}
#process .faq .ctt{
    display: flex;
    justify-content: space-between;
    gap: 30px;
}
#process .faq .ctt .ttl_area{
    flex-shrink: 0;
}
#process .faq .ctt .ttl_area .label{
    display: block;
    font-size: 18px;
    font-style: 500;
    letter-spacing: 1px;
    line-height: 1.44;
    margin: 0 0 20px;
    color: #2D2D2D;
}
#process .faq .ctt .ttl_area h2{
    font-size: 50px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.2;
    margin: 0 0 35px;
    color: #222222;
}
#process .faq .ctt .ttl_area .note{
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.61;
    margin: 0 0 55px;
    color: #171717;
}
#process .faq .ctt .ttl_area .btn a{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
    max-width: 240px;
    width: 100%;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0;
    color: #222;
    background-color: #fff;
    border: 1px solid #222222;
    border-radius: 100vw;
    transition: all .3s;
}
#process .faq .ctt .ttl_area .btn a::before{
    content: "";
    width: 20px;
    height: 20px;
    background-image: url(../img/top/btn_in-black_arrow.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    transition: alls .3s;
}
#process .faq .ctt .ttl_area .btn a:hover{
    opacity: 1;
    color: #fff;
    background-color: #DF5B4C;
}
#process .faq .ctt .ttl_area .btn a:hover::before{
    background-image: url(../img/top/btn_red_arrow.png);
}
#process .faq .ctt .cat-article{
    display: block;
    max-width: 940px;
    width: 100%;
    flex: 1;
}
#process .faq .ctt .cat-article dl{
    display: block;
    width: 100%;
    padding: 30px 25px;
    margin: 0 0 15px;
    background-color: #fff;
    border-radius: 10px;
}
#process .faq .ctt .cat-article dl:last-of-type{
    margin: 0;
}
#process .faq .ctt .cat-article dl dt{
    cursor: pointer;
}
#process .faq .ctt .cat-article dl dt,
#process .faq .ctt .cat-article dl dd{
    position: relative;
    display: flex;
    align-items: center;
    gap: 25px;
}
#process .faq .ctt .cat-article dl dt p{
    flex: 1;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 2px;
    line-height: 1.5;
    padding-right: 35px;
    color: #222;
}
#process .faq .ctt .cat-article dl dt .plus{
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    background-color: #639B76;
    border-radius: 50%;
}
#process .faq .ctt .cat-article dl dt .plus::before,
#process .faq .ctt .cat-article dl dt .plus::after{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 12px;
    height: 2px;
    margin: auto;
    background: #fff;
    transition: 0.3s;
}
#process .faq .ctt .cat-article dl dt .plus::after{
    transform: rotate(90deg);
}
#process .faq .ctt .cat-article dl dt.is-open .plus::after{
    transform: rotate(0deg);
}
#process .faq .ctt .cat-article dl dd{
    display: none;
    padding: 30px 0 10px;
}
#process .faq .ctt .cat-article dl dd .flex{
    display: flex;
    align-items: flex-start;
    gap: 25px;
}
#process .faq .ctt .cat-article dl dd p{
    flex: 1;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 2px;
    line-height: 1.87;
    color: #222222;
}
#process .faq .ctt .cat-article dl dt .q,
#process .faq .ctt .cat-article dl dd .a{
    font-size: 27px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 500;
    letter-spacing: 0;
}
#process .faq .ctt .cat-article dl dt .q{
    color: #529370;
}
#process .faq .ctt .cat-article dl dd .a{
    color: #CF6541;
}
@media only screen and (max-width: 768px) {
    #process .faq{
        padding: 13.33333333333335vw 0 16vw;
    }
    #process .faq .ctt{
        display: block;
    }
    #process .faq .ctt .ttl_area{
        display: block;
        width: 100%;
        margin: 0 0 10.66666666666666668vw;
    }
    #process .faq .ctt .ttl_area .label{
        font-size: 4.8vw;
        font-weight: 600;
        letter-spacing: 2px;
        text-align: center;
        line-height: 1.07;
        margin: 0 0 5.33333333333334vw;
    }
    #process .faq .ctt .ttl_area h2{
        font-size: 12.8vw;
        font-weight: 600;
        text-align: center;
        margin: 0 0 3.466666666666663vw;
    }
    #process .faq .ctt .ttl_area .note{
        font-size: 4vw;
        font-weight: 600;
        text-align: center;
        line-height: 2;
        margin: 0;
    }
    #process .faq .ctt .ttl_area .btn{
        display: none;
    }
    #process .faq .ctt .cat-article {
        margin: 0 auto 10.66666666666668vw;
    }
    #process .faq .ctt .cat-article dl{
        padding: 4vw;
        margin: 0 0 3.2vw;
        border-radius: 5px;
    }
    #process .faq .ctt .cat-article dl dt,
    #process .faq .ctt .cat-article dl dd{
        gap: 2.133333333333336vw;
    }
    #process .faq .ctt .cat-article dl dd{
        padding: 5.3333333333333334vw 0 0;
    }
    #process .faq .ctt .cat-article dl dd .flex{
        gap: 2.133333333333336vw;
    }
    #process .faq .ctt .cat-article dl dt p{
        font-size: 3.466666666666666663vw;
        padding-right: 4.8vw;
    }
    #process .faq .ctt .cat-article dl dd p{
        font-size: 3.466666666666663vw;
        line-height: 1.62;
    }
    #process .faq .ctt .cat-article dl dt .plus{
        width: 4.26666666666666667vw;
        height: 4.26666666666666667vw;
    }
    #process .faq .ctt .cat-article dl dt .plus::before,
    #process .faq .ctt .cat-article dl dt .plus::after{
        width: 2vw;
        height: 0.5333333333333334vw;
    }
    #process .faq .ctt .cat-article dl dt .q,
    #process .faq .ctt .cat-article dl dd .a{
        font-size: 4vw;
    }
    #process .faq .ctt .sp.btn a{
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 4vw 0;
        margin: 0 auto;
        max-width: 69.33333333333334vw;
        width: 100%;
        font-size: 3.733333333333334vw;
        font-weight: 500;
        text-align: center;
        letter-spacing: 0;
        color: #222;
        background-color: #fff;
        border: 1px solid #222222;
        border-radius: 100vw;
    }
    #process .faq .ctt .sp.btn a::before{
        content: "";
        width: 4.8vw;
        height: 4.8vw;
        background-image: url(../img/top/btn_in-black_arrow.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        position: absolute;
        top: 50%;
        right: 4vw;
        transform: translateY(-50%);
    }
    #process .faq .ctt .sp.btn a:hover{
        opacity: 1;
        color: #fff;
        background-color: #DF5B4C;
    }
    #process .faq .ctt .sp.btn a:hover::before{
        background-image: url(../img/top/btn_white_arrow.png);
    }
}


/* GUARANTEE　保証について
--------------------------------------*/
#guarantee .after-care{
    padding: 110px 0 160px;
    background-color: #F7F7F7;
}
#guarantee .after-care .ttl_area{
    display: block;
    margin: 0 auto 60px;
    color: #222222;
}
#guarantee .after-care .ttl_area .label{
    display: block;
    font-size: 18px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1;
    text-align: center;
    margin: 0 auto 24px;
}
#guarantee .after-care .ttl_area h2{
    font-size: 55px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    text-align: center;
    letter-spacing: 1px;
    line-height: 1;
    margin: 0 auto 45px;
}
#guarantee .after-care .ttl_area .note{
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    letter-spacing: 0;
    line-height: 1.67;
}
#guarantee .after-care .ctt .main-txt{
    display: block;
    max-width: 620px;
    width: 100%;
    padding: 40px 0 35px;
    margin: 0 auto 35px;
    color: #2D4A80;
    background-color: #FfF;
    border-radius: 10px;
}
#guarantee .after-care .ctt .main-txt span{
    display: block;
    font-size: 25px;
    font-family: 'Noto Sans JP';
    font-weight: 500;
    text-align: center;
    letter-spacing: 3%;
    line-height: 1;
}
#guarantee .after-care .ctt .main-txt p{
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 18px;
    font-size: 80px;
    font-weight: 600;
    font-family: "Albert Sans", sans-serif;
    letter-spacing: 0;
    line-height: 1;
}
#guarantee .after-care .ctt .main-txt p span{
    font-size: 46px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1;
    padding-bottom: 8px;
}
#guarantee .after-care .ctt .note{
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    letter-spacing: 0;
    line-height: 1.67;
    color: #171717;
}
@media only screen and (max-width: 768px) {
    #guarantee .after-care{
        padding: 13.3333333333335vw 0 16vw;
    }
    #guarantee .after-care .ttl_area{
        margin: 0 auto 13.333333333333335vw;
    }
    #guarantee .after-care .ttl_area .label{
        font-size: 4vw;
        margin: 0 auto 4vw;
    }
    #guarantee .after-care .ttl_area h2{
        font-size: 8vw;
        margin: 0 auto 8vw;
    }
    #guarantee .after-care .ttl_area .note{
        font-size: 3.7333333333333333334vw;
    }
    #guarantee .after-care .ctt .main-txt{
        max-width: none;
        padding: 8vw 0;
        margin: 0 auto 8vw;
        border-radius: 5px;
    }
    #guarantee .after-care .ctt .main-txt span{
        font-size: 5.333333333333333334vw;
    }
    #guarantee .after-care .ctt .main-txt p{
        gap: 2.6666666666666667vw;
        font-size: 16vw;
    }
    #guarantee .after-care .ctt .main-txt p span{
        font-size: 9.33333333333333334vw;
        padding-bottom: 1.33333333333333335vw;
    }
    #guarantee .after-care .ctt .note{
        font-size: 3.2vw;
    }
}


/* PRICE　料金・価格の目安
--------------------------------------*/
#price .info-area{
    padding: 115px 0 65px;
    background-color: #F7F7F7;
}
#price .info-area .flex-txt{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 85px;
}
#price .info-area .flex-txt h2{
    font-size: 35px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.31;
    flex-shrink: 0;
}
#price .info-area .flex-txt .note{
    display: block;
    max-width: 645px;
    width: 100%;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.61;
}
#price .info-area .plan-area{
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 25px;
    margin: 0 0 100px;
}
#price .info-area .plan-area .item{
    flex: 1;
    display: block;
    text-align: center;
    padding: 35px 0 40px;
    border-radius: 5px;
    color: #fff;
}
#price .info-area .plan-area .item:nth-of-type(1){
    background-color: #3F467D;
}
#price .info-area .plan-area .item:nth-of-type(2){
    background-color: #CF6541;
}
#price .info-area .plan-area .item:nth-of-type(3){
    background-color: #AF9D64;
}
#price .info-area .plan-area .item .label{
    display: inline-block;
    font-size: 16px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 500;
    text-align: center;
    line-height: 1.75;
    letter-spacing: 1px;
    padding: 0 25px;
    border: 1px solid #fff;
}
#price .info-area .plan-area .item p{
    font-size: 24px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0;
    margin: 20px auto 0;
}
#price .info-area .text-slider{
    position: relative;
    width: 100%;
    overflow: hidden;
    z-index: 1;
    white-space: nowrap;
}
#price .info-area .text-slider .slide-track {
    display: flex;
    align-items: center;
    gap: 25px;
    width: max-content;
    animation: slide 35s linear infinite;
}
@keyframes slide {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}
#price .info-area .text-slider .slide-track .slide-item {
    display: flex;
    align-items: center;
    gap: 25px;
    white-space: nowrap;
}
#price .info-area .text-slider .slide-track .slide-item span{
    display: block;
    font-size: 75px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.07;
    color: #222222;
}
#price .info-area .text-slider .slide-track .slide-item img{
    display: block;
    max-width: 120px;
    width: 100%;
    border-radius: 5px;
}
@media only screen and (max-width: 768px) {
    #price .info-area{
        padding: 16vw 0 13.333333333335vw;
    }
    #price .info-area .flex-txt{
        display: block;
        margin: 0 0 9.33333333333334vw;
    }
    #price .info-area .flex-txt h2{
        font-size: 5.8vw;
        margin: 0 0 5.3333333334vw;
    }
    #price .info-area .flex-txt .note{
        max-width: none;
        width: 100%;
        font-size: 4vw;
    }
    #price .info-area .plan-area{
        display: block;
        margin: 0 0 12vw;
    }
    #price .info-area .plan-area .item{
        display: block;
        width: 100%;
        padding: 5.333333334vw 0;
        margin: 0 0 4vw;
    }
    #price .info-area .plan-area .item .label{
        font-size: 3.7333333333334vw;
        padding: 0 4vw;
    }
    #price .info-area .plan-area .item p{
        font-size: 4.8vw;
        margin: 2.66666666666667vw auto 0;
    }
    #price .info-area .text-slider .slide-track {
        gap: 3.733333333334vw;
    }
    #price .info-area .text-slider .slide-track .slide-item {
        gap: 3.7333333333333334vw;
        white-space: nowrap;
    }
    #price .info-area .text-slider .slide-track .slide-item span{
        font-size: 10.666666666668vw;
    }
    #price .info-area .text-slider .slide-track .slide-item img{
        max-width: 16.8vw;
    }
}

#price .plan-list .plan-item{
    padding: 120px 0;
    scroll-margin-top: 140px;
}
#price .plan-list .plan-item:nth-of-type(1){
    background-color: #3F467D;
}
#price .plan-list .plan-item:nth-of-type(2){
    background-color: #CF6541;
}
#price .plan-list .plan-item:nth-of-type(3){
    background-color: #AF9D64;
}
#price .plan-list .plan-item .ttl_area{
    display: flex;
    align-items: center;
    gap: 35px;
    margin: 0 0 50px;
    color: #fff;
}
#price .plan-list .plan-item .ttl_area h3{
    font-size: 62px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1;
}
#price .plan-list .plan-item .ttl_area p{
    font-size: 24px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1;
}
#price .plan-list .plan-item .plan-ctt{
    padding: 60px 50px;
    background-color: #fff;
    border-radius: 10px;
}
#price .plan-list .plan-item .plan-ctt .top-info{
    display: flex;
    align-items: center;
    gap: 40px;
    margin: 0 0 30px;
}
#price .plan-list .plan-item .plan-ctt .top-info .img{
    flex-shrink: 0;
    border-radius: 5px;
}
#price .plan-list .plan-item .plan-ctt .top-info .img img{
    display: block;
    max-width: 580px;
    width: 100%;
    border-radius: 5px;
}
#price .plan-list .plan-item .plan-ctt .top-info .txt{
    flex: 1;
}
#price .plan-list .plan-item .plan-ctt .top-info .txt .price{
    display: flex;
    align-items: flex-end;
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 1%;
    line-height: 2.2;
    margin: 0 0 24px;
}
#price .plan-list .plan-item:nth-of-type(1) .plan-ctt .top-info .txt .price{
    color: #3F467D;
}
#price .plan-list .plan-item:nth-of-type(2) .plan-ctt .top-info .txt .price{
    color: #CF6541;
}
#price .plan-list .plan-item:nth-of-type(3) .plan-ctt .top-info .txt .price{
    color: #AF9D64;
}
#price .plan-list .plan-item .plan-ctt .top-info .txt .price span{
    font-size: 60px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.2;
    padding: 0 3px 0 25px;
}
#price .plan-list .plan-item .plan-ctt .top-info .txt .label{
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.25;
    padding: 5px 15px;
    border-radius: 100vw;
}
#price .plan-list .plan-item:nth-of-type(1) .plan-ctt .top-info .txt .label{
    color: #3F467D;
    border: 1px solid #3F467D;
}
#price .plan-list .plan-item:nth-of-type(2) .plan-ctt .top-info .txt .label{
    color: #CF6541;
    border: 1px solid #CF6541;
}
#price .plan-list .plan-item:nth-of-type(3) .plan-ctt .top-info .txt .label{
    color: #AF9D64;
    border: 1px solid #AF9D64;
}
#price .plan-list .plan-item .plan-ctt .top-info .txt .note{
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.75;
    margin: 35px 0 0;
    color: #222222;
}
#price .plan-list .plan-item .plan-ctt .under-info{
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 40px;
}
#price .plan-list .plan-item .plan-ctt .under-info .detail{
    flex: 1;
    display: block;
    max-width: 580px;
    width: 100%;
    padding: 35px 45px;
    background-color: #F7F7F7;
    border-radius: 5px;
}
#price .plan-list .plan-item .plan-ctt .under-info .detail .detail-ttl{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 0 30px;
    margin: 0 0 30px;
    border-bottom: 1px dashed #222;
}
#price .plan-list .plan-item:nth-of-type(1) .plan-ctt .under-info .detail .detail-ttl{
    color: #3F467D;
}
#price .plan-list .plan-item:nth-of-type(2) .plan-ctt .under-info .detail .detail-ttl{
    color: #CF6541;
}
#price .plan-list .plan-item:nth-of-type(3) .plan-ctt .under-info .detail .detail-ttl{
    color: #AF9D64;
}
#price .plan-list .plan-item .plan-ctt .under-info .detail .detail-ttl .e-name{
    font-size: 30px;
    font-family: "Albert Sans", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1;
}
#price .plan-list .plan-item .plan-ctt .under-info .detail .detail-ttl .j-name{
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 1px;
    line-height: 1.67;
}
#price .plan-list .plan-item .plan-ctt .under-info .detail .list{
    display: block;
}
#price .plan-list .plan-item .plan-ctt .under-info .detail .list li{
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 2;
    color: #222222;
    flex: 1;
}
#price .plan-list .plan-item .plan-ctt .under-info .detail .list li::before{
    content: "";
    width: 15px;
    height: 12px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    flex-shrink: 0;
}
#price .plan-list .plan-item:nth-of-type(1) .plan-ctt .under-info .detail .list li::before{
    background-image: url(../img/page/compact-arrow.svg);
}
#price .plan-list .plan-item:nth-of-type(2) .plan-ctt .under-info .detail .list li::before{
    background-image: url(../img/page/standard-arrow.svg);
}
#price .plan-list .plan-item:nth-of-type(3) .plan-ctt .under-info .detail .list li::before{
    background-image: url(../img/page/premium-arrow.svg);
}
@media only screen and (max-width: 768px) {
    #price .plan-list .plan-item{
        padding: 10.6666666668vw 0 8vw;
        scroll-margin-top: 13.3333333335vw;
    }
    #price .plan-list .plan-item .ttl_area{
        display: block;
        margin: 0 0 8vw;
    }
    #price .plan-list .plan-item .ttl_area h3{
        font-size: 9.33333333333333334vw;
        margin: 0 0 4vw;
    }
    #price .plan-list .plan-item .ttl_area p{
        font-size: 4vw;
    }
    #price .plan-list .plan-item .plan-ctt{
        padding: 5.333333333333333333334vw 5.333333333333333333334vw 8vw;
        border-radius: 5px;
    }
    #price .plan-list .plan-item .plan-ctt .top-info{
        display: block;
        margin: 0 0 5.3333333333333333334vw;
    }
    #price .plan-list .plan-item .plan-ctt .top-info .img{
        margin: 0 0 4vw;
    }
    #price .plan-list .plan-item .plan-ctt .top-info .img img{
        max-width: none;
    }
    #price .plan-list .plan-item .plan-ctt .top-info .txt{
        flex: 1;
    }
    #price .plan-list .plan-item .plan-ctt .top-info .txt .price{
        flex-wrap: wrap;
        font-size: 4.8vw;
        margin: 0 0 5.333333333334vw;
    }
    #price .plan-list .plan-item .plan-ctt .top-info .txt .price span{
        font-size: 10vw;
        padding: 0 0.9vw 0 2.13333333333333336vw;
    }
    #price .plan-list .plan-item .plan-ctt .top-info .txt .label{
        font-size: 3.466666666666666663vw;
        padding: 1.06666666666666666668vw 3.2vw;
    }
    #price .plan-list .plan-item .plan-ctt .top-info .txt .note{
        font-size: 4vw;
        line-height: 1.75;
        margin: 6.666666666667vw 0 0;
    }
    #price .plan-list .plan-item .plan-ctt .under-info{
        display: block;
    }
    #price .plan-list .plan-item .plan-ctt .under-info .detail{
        max-width: none;
        padding: 5.33333333333333334vw;
    }
    #price .plan-list .plan-item .plan-ctt .under-info .detail:first-of-type{
        margin: 0 0 8vw;
    }
    #price .plan-list .plan-item .plan-ctt .under-info .detail .detail-ttl{
        padding: 0 0 5.3333333333333334vw;
        margin: 0 0 5.3333333333333334vw;
    }
    #price .plan-list .plan-item .plan-ctt .under-info .detail .detail-ttl .e-name{
        font-size: 6.66666666666667vw;
        letter-spacing: 0.03em;
    }
    #price .plan-list .plan-item .plan-ctt .under-info .detail .detail-ttl .j-name{
        font-size: 3.2vw;
    }
    #price .plan-list .plan-item .plan-ctt .under-info .detail .list li{
        align-items: flex-start;
        gap: 2.4vw;
        font-size: 3.733333333333333334vw;
        line-height: 1.67;
        margin: 0 0 1.333333333335vw;
    }
    #price .plan-list .plan-item .plan-ctt .under-info .detail .list li:last-child{
        margin: 0;
    }
    #price .plan-list .plan-item .plan-ctt .under-info .detail .list li::before{
        width: 3.2vw;
        height: 2.4vw;
        margin-top: 2.4vw;
    }
}
