@media (max-width: 1340px) {
    *{
        font-size: 12px;
    }
    
    .sp_none{
        display: none;
    }
    
    .pc_none{
        display: block;
    }
    
    .loading > div {
        padding: 40px;
        padding-left: 190px;
    }
    .loading .loading_right{
        width: 210px;
    }
    .loading .load_a{
        width: 41px;
        left: -24px;
        top: 2px;
    }
    .loading .load_t{
        width: 76px;
        left: -26px;
        top: 8px;
    }
    .loading .logo_name{
        width: 54px;
        left: -24px;
        bottom: -44px;
    }
    @keyframes a{
        0% {transform:translate(0,0);}
        50% {transform:translate(-80px,0);}
        60% {opacity: 1;}
        100%{
            transform:translate(-80px,0);
            opacity: 0;
        }
    }
    @keyframes t{
        0% {transform:translate(0,0);}
        50% {transform:translate(28px,0);}
        60% {opacity: 1;}
        100%{
            transform:translate(28px,0);
            opacity: 0;
        }
    }
    
    header{
        padding-left: 40px;
    }
    
    header h1 a .logo.sp_none{
        display: block;
    }
    
    .slide,
    .section05 .slide,
    footer{
        margin-left: 150px;
        max-width: 1290px;
        width: calc(100% - 150px);
        padding: 40px;
    }
    
    .index .slide .left h3{
        font-size: 26px;
    }
    
    .slide .left h3 span{
        font-size: 17px;
    }
    
    .index .slide .left h5{
        font-size: 12px;
    }
    
    .slide .center div{
        top: 70px;
    }
    
    .slide .center .img{
        width: 12px;
        margin: 26px 20px 0;
    }
    
    .index .slide .right{
        width: 210px;
    }
    
    .index .slide .right div{
        margin-top: -170px;
    }
    
    .index .slide .right h4{
        font-size: 14px;
        margin-bottom: 30px;
        letter-spacing: 0.2em;
        white-space: normal;
    }
    
    .section05 h2 span.sub{
        font-size: 10px;
    }
    
    .section05 .scroll{
        margin-top: 20px;
        margin-right: -40px;
    }
    
    .section05 .slick{
        width: 1680px;
    }
    
    .section05 .slick .slickslide{
        width: 190px;
        margin-right: 50px;
    }
    
    .section05 .slick h3{
        font-size: 20px;
    }
    
    .section05 .slick h4{
        font-size: 14px;
    }
    
    .section05 .slick .badge span{
        font-size: 10px;
    }
    
    .section05 .scroll_nav{
        margin-top: 0;
        margin-right: -40px;
    }
    
    .section05 .name .pc_none{
        display: none;
    }
    
    
    /*共通*/
    
    .slide .center .art,
    .slide .center .trust,
    .section05 h2,
    .contact h2,
    .service h2,
    .company h2{
        font-size: 54px;
    }
    
    .contact h3,
    .service h3{
        font-size: 40px;
    }
    
    .contact section,
    .contact footer,
    .service section,
    .service footer,{
        padding: 40px;
    }
    
    
    /*company*/
    
    .company .slide_wrap{
        justify-content: flex-start;
    }
    
    .company h2{
        margin-bottom: 40px;
    }
    
    .company h3{
        font-size: 26px;
        line-height: 1.8em;
        margin-bottom: 30px;
    }
    
    .company .left{
        width: 620px;
    }
    
    .company .left .flex{
        min-height: 316px;
        align-items: flex-end;
    }
    
    .company .left .heading{
        margin-right: 50px;
    }
    
    .company .left h4{
        font-size: 16px;
    }
    
    .company .left h5{
        font-size: 20px;
    }
    
    .company .left h5 span{
        font-size: 14px;
        padding-bottom: 10px;
    }
    
    .company .left span.line{
        margin: 16px 0;
    }
    
    .company .right{
        margin-right: 0;
        margin-left: 70px;
    }
    
    .company .sp_none{
        display: block;
    }
    .company .pc_none{
        display: none;
    }
    
    
    /*service*/
    
    .service h2{
        padding-top: 70px;
    }
    
    .service h2 span{
        font-size: 21px;
    }
    
    .service h4{
        font-size: 17px;
        left: 140px;
    }
    
    .service section.about{
        padding-bottom: 70px;
    }
    .service section.menu{
        padding-top: 70px;
        padding-bottom: 70px;
    }
    
    .service section.menu .circle{
        width: 280px;
        height: 280px;
    }
    .service section.menu .circle:nth-of-type(odd){
        margin-right: 70px;
    }
    .service section.menu .circle:not(:nth-last-of-type(-n+2)){
        margin-bottom: 40px;
    }
    
    .service section.menu .flex{
        padding-top: 26px;
    }
    
    .service section.menu h5{
        font-size: 26px;
    }
    
    .service section.menu span{
        font-size: 38px;
        padding-right: 18px;
        margin-top: -2px;
    }
    
    .service section.menu p{
        font-size: 12px;
    }
    
    .service .sp_none{
        display: none;
    }
    .service .pc_none{
        display: block;
    }
    

    /*contact*/
    
    .contact .tel .n01{
        font-size: 20px;
    }
    .contact .tel .n02,
    .contact.send h2{
        font-size: 26px;
    }
    .contact .tel .t01{
        font-size: 14px;
    }
    .contact .tel .t02{
        font-size: 10px;
    }
    .contact .progress p{
        font-size: 12px;
        width: 70px;
        height: 70px;
    }
    
    .contact dt label,
    .contact dd label,
    .contact dd,
    ::placeholder,
    input, textarea{
        font-size: 13px;
    }
    
    .contact button{
        font-size: 14px;
        padding: 14px;
    }
    
    input, textarea{
        padding: 14px 20px;
    }
    .contact dt,
    .contact dd,
    .contact .recaptcha{
        margin-bottom: 20px;
    }
    
    .contact dt{
        height: 52px;
    }
    
    .contact.check dd{
        padding-top: 14px;
    }
    
    .contact.check .button_block{
        margin-top: 20px;
    }
}


@media (max-width: 1024px) {
    
    .loading > div {
        padding: 40px;
    }
    
    header{
        display: none;
    }
    
    .slide,
    .section05 .slide,
    footer,
    .contact .wrap,
    .service .wrap,
    .contact .wrap,
    .access_wrap{
        margin-left: 0;
        max-width: none;
        width: 100%;
    }
    
    .spmenu_button{
        position: fixed;
        top: 20px;
        right: 20px;
        width: 50px;
        height: 100px;
        border-radius: 25px;
        z-index: 999;
        box-shadow: 0 0 10px rgba(0, 0, 0, .2);
        background: #fff;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor: pointer;
    }
    
    .spmenu_button .logo_sp{
        width: 34px;
        height: 17px;
        margin-bottom: 20px;
        margin-right: -4px;
    }
    
    .spmenu_button .icon{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        position: relative;
        height: 10.5px;
    }
    
    .spmenu_button span{
        display: block;
        width: 14px;
        height: .5px;
        background: #666;
        position: absolute;
    }
    .spmenu_button span:first-of-type{
        top: 0;
    }
    .spmenu_button span:nth-of-type(2){
        top: 5px;
    }
    .spmenu_button span:last-of-type{
        top: 10px;
    }
    
    .spmenu_button.active span:first-of-type{
        transform: rotate(45deg);
        top: 5px;
    }
    .spmenu_button.active span:last-of-type{
        top: 5px;
        transform: rotate(-45deg);
    }
    .spmenu_button.active span:nth-of-type(2){
        opacity: 0;
    }
    
    body header{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        position: fixed;
        z-index: 99;
        right: -200px;
        background: #fff;
        border-left: .5px solid #000;
        height: 100vh;
        padding: 40px;
        transition: .4s ease-in-out;
    }
    
    body.active header{
        right: 0;
    }
    
    body header .menu{
        flex-shrink: 0;
    }
    
    body .menu_bg{
        position: fixed;
        height: 100vh;
        content: "";
        top: 0;
        right: 0;
        background: rgb(0 0 0 / .5);
        z-index: 0;
        opacity: 0;
        transition: .4s ease-in-out;
    }
    body.active .menu_bg{
        display: block;
        width: 100vw;
        height: 100vh;
        z-index: 90;
        opacity: 1;
    }
    
    header h1 a .logo.sp_none{
        display: none;
    }
    
    .section05 .name p{
        line-height: 2em;
        padding-top: 30px;
    }
    
    .section05 .name .pc_none{
        display: block;
    }
    
    .company .access_wrap{
        margin-left: 0;
        width: 100%;
    }
    
}

@media (max-width: 900px) {
    
    .loading > div {
        padding: 30px;
        justify-content: flex-start;
        position: static;
        transform: none;
        padding-top: 310px;
    }
    .loading .load_a{
        width: 29px;
        left: 60px;
        top: 14px;
    }
    .loading .load_t{
        width: 54px;
        left: 60px;
        top: 18px;
    }
    .loading .logo_name{
        width: 40px;
        left: 60px;
        bottom:auto;
        top: 40px;
    }
    @keyframes a{
        0% {transform:translate(0,0);}
        50% {transform:translate(-60px,0);}
        60% {opacity: 1;}
        100%{
            transform:translate(-60px,0);
            opacity: 0;
        }
    }
    @keyframes t{
        0% {transform:translate(0,0);}
        50% {transform:translate(20px,0);}
        60% {opacity: 1;}
        100%{
            transform:translate(20px,0);
            opacity: 0;
        }
    }

    
    .slide, .section05 .slide, footer,
    .contact section,.contact footer,
    .service section,.service footer{
        padding: 30px;
    }
    
    .slide{
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        overflow: hidden;
    }
    
    .slide .left h5,
    .slide .left h3{
        position: static;
    }
    
    .index .slide .left h3{
        font-size: 20px;
    }
    
    .index .slide .left h3 span {
        font-size: 13px;
        padding-bottom: 10px;
    }
    
    .index .slide .left h5 span.line{
        margin: 14px 0;
        height: 10px;
    }
    
    .index .slide .left{
        margin-bottom: 0;
        height: 230px;
    }
    
    .index .slide .center{
        position: static;
        padding-top: 50px;
    }
    
    .index .slide .center h2{
        margin-left: 0;
        position: static;
        transform: none;
        -webkit-transform: none;
        -ms-transform: none;
    }
    
    .slide .center .img{
        width: 10px;
        margin: 20px 15px 0;
    }
    
    .slide .center div{
        right: 30px;
        top: 130px;
    }
    
    .slide .center div li a,
    .company .slide .right div li a{
        line-height: 2.2em;
        font-size: 11px;
    }
    
    .slide .center div p,
    .company .slide .right div p{
        margin-top: 8px;
        margin-right: 12px;
    }
    
    .slide .center div p span,
    .company .slide .right div p span{
        margin-top: 10px;
    }
    
    .slide .center .art,
    .slide .center .trust{
        width: auto;
        line-height: 1em;
        font-size: 40px;
    }
    
    .index .slide .right{
        width: 100%;
        margin-top: 30px;
    }
    
    .index .slide .right div{
        position: static;
        margin-top: 0;
    }
    
    .slide .right h4{
        margin-bottom: 20px;
    }
    
    .index .slide .right h4 span{
       display: none;
    }
    
    .section05 .slide{
        padding-bottom: 0;
    }
    
    .section05 h2{
        font-size: 40px;
        margin-top: 0;
    }
    
    .section05 .scroll{
        margin-top: 40px;
    }
    
    .section05 .name{
        padding-top: 50px;
    }
    
    .section05 .name h3{
        margin-bottom: 0;
    }
    
    
    /*共通*/
    
    .contact h2,
    .service h2,
    .company h2{
        font-size: 40px;
    }
    
    .contact h3,
    .service h3{
        font-size: 34px;
    }
    
    .company h2{
        margin-bottom: 30px;
    }
    
    .company .left .heading{
        margin-right: 20px;
        margin-left: -10px;
        margin-top: 12px;
    }
    
    .company .slide_wrap{
        flex-direction: column-reverse;
        justify-content: flex-end;

        height: 100%;
    }
    
    .company .left{
        width: auto;
    }
    
    .company .left .flex{
        align-items: flex-start;
    }
    
    .company .left .flex p{
        text-align: justify;
    }
    
    .company .right{
        margin-left: 0;
        margin-right: auto;
        margin-bottom: 60px;
    }
    
    .company h3{
        font-size: 18px;
    }
    
    .company .left h4,
    .company .slide .left h5{
        font-size: 12px;
    }
    
    .company .slide .left h5 span{
        font-size: 10px;
    }
    
    .company .slide .left h5 span.line {
        margin: 14px 0;
        height: 10px;
    }
    
    .company dl{
        flex-direction: column;
    }
    .company dt,
    .company dd{
        width: 100%;
    }
    .company dt{
        margin-bottom: 0;
        border-bottom: 0;
        padding-bottom: 0;
    }
    
    .company dd{
        padding-bottom: 8px;
        margin-bottom: 8px;
    }
    
    .company .sp_none{
        display: none;
    }
    .company .pc_none{
        display: block;
    }
    
    .company .section04{
        margin-top: 0;
    }
    
    .company .access_wrap{
        width: 100%;
        padding: 30px;
    }
    
    .company .access{
        flex-direction: column;
    }
    
    .company .access div{
        margin-right: 0;
    }
    
    .company .access h2{
        margin-bottom: 20px;
    }
    
    .company .access p{
        text-align: left;
        margin-bottom: 20px;
    }
    
    
    /*service*/
    
    .service .service_title{
        margin-bottom: 0;
    }
    
    .service h4{
        left: 110px;
        font-size: 15px;
    }
    
    .service section.menu h5{
        font-size: 22px;
    }
    
    .service section.menu .circle_container{
        flex-direction: column;
        align-items: center;
        margin-top: 20px;
    }
    
    .service section.menu .circle{
        width: 250px;
        height: 250px;
    }
    .service section.menu .circle:not(:nth-last-of-type(-n+2)){
        margin-bottom: 0;
    }
    .service section.menu .circle:nth-of-type(odd){
        margin-right: 0;
    }
    .service section.menu .circle:not(:last-of-type){
        margin-bottom: 30px;
    }
    
    .service section.menu .flex{
        padding-top: 20px;
    }
    
    .service section.menu span{
        padding-right: 14px;
    }
    
    .service .sp_none{
        display: none;
    }
    
    .service .pc_none{
        display: block;
    }
    
    
    /*contact*/
    
    .contact h2{
        padding-top: 10px;
    }
    
    .contact h2 + p{
        padding: 30px 0;
    }
    
    .contact .number{
        margin-bottom: -10px;
    }
    
    .contact .time{
        margin-bottom: 10px;
    }
    
    .contact .tel{
        display: flex;
        flex-direction: column;
        align-items: center;
        width: fit-content;
        margin: 0 auto;
    }
    
    .contact .tel .t01{
        padding-left: 0;
    }
    
    .contact .form_title{
        flex-direction: column;
        align-items: center;
        padding-bottom: 20px;
    }
    
    .contact .progress{
        margin-top: 30px;
    }
    
    .contact .progress p {
        font-size: 11px;
        width: 50px;
        height: 50px;
    }
    
    .contact .progress .line {
        width: 10px;
        height: .5px;
        margin: 0 10px;
    }

    .contact dt,
    .contact dd{
        width: 100%;
    }
    
    .contact dt{
        height: auto;
        border-bottom: 0;
        margin-bottom: 6px;
        margin-right: 0;
        justify-content: flex-start;
    }
    
    .contact.check dt{
        margin-bottom: 0;
    }
    
    .contact.check dd{
        padding-top: 0;
    }
    
    .contact .button_block{
        margin-left: 0;
    }
    
    .contact .recaptcha{
        margin: 0 auto 20px;
    }
    
    .contact button{
        font-size: 13px;
    }
    
    .contact .returnBtn{
        margin-top: 10px;
    }
    
    .contact.send h2{
        font-size: 20px;
        padding-top: 10px;
    }
    
    .contact.send .img{
        max-width: 200px;
        margin: 20px auto 0;
    }
}
    
    
    
    
    /* header */