@charset "utf-8";

@media screen and (max-width: 767px) {
    body{
        min-width: 100%;
    }
 

    .pc{
        display: none;
    }
    .sp{
        display: block;
    }
  
  
    /*header------------------------------------*/
    .l-header{
        padding: 20px 30px;
    }
    .l-nav{
        position: fixed;
        top: 0;
        margin-top: 0;
        left: 0;
        width: 100%;
        overflow: hidden;
        transform: translateY(-100%);
        height: 100%;
        padding-top: 60px;
        text-align: center;
        color: #222;
        background: #fff;
        transition: all 0.8s;
        display: block;
        float: none;
        margin-right: 0;
        z-index: 100;
    }
    .l-nav.active{
        transform: translateY(0%)!important;
        overflow-y: auto;
    }

    .toggle{
        position: fixed;
        right: 10px;
        top: 15px;
        width: 45px;
        height: 50px;
        text-align: center;
        cursor: pointer;
        z-index: 9999;
        background: transparent;
    }
    .toggle span:nth-child(1){
        top: 17px;
    }
    .toggle span:nth-child(2){
        top: 22px;
    }
  
    .toggle span{
        display: block;
        position: absolute;
        width: 70%;
        border-bottom: solid 1px #000;
        -webkit-transition: .35s ease-in-out;
        -moz-transition: .35s ease-in-out;
        transition: .35s ease-in-out;
        padding-top: 5px;
        right: 7px;
    }
    .toggle.active span:nth-child(1){
        top: 15px;
/*        border-color: #064082;*/
        left: 4px;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    .toggle.active span:nth-child(2), .toggle.active span:nth-child(3){
        top: 15px;
/*        border-color: #064082;*/
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    .header__navItem:not(:last-of-type){
        margin-right: 0;
    }
    .headder__contact{
        margin-top: 25px;
    }
   
    /*-----------------------------------------
    font
    ------------------------------------------*/
    .service__policy_txt,.p-service__item{
        font-size: 1.4rem;
    }
    .c-h4{
        font-size: 1.5rem;
    }
    .p-concept__txt{
        font-size: 1.6rem;
    }
    .service__policyTtl,.service__ttl,.c-h3{
        font-size: 2.0rem;
    }
    .p-concept__h2,.c-h2{
        font-size: 2.5rem;
    }
    /*main------------------------------------*/
    .l-mv{
        padding: 130px 0 124px;
    }
    .l-header,.company__table,.servive__txt,.p-service__item2, .p-service__item3,.service__policyTtl_wrap,.form__inner,.form__inputWrap,.form__name,.greeting__txt{
        width: 100%;
        max-width: 100%;
        min-width: 100%;
    }
    .mv__txt svg{
        width: 80%;
    }
    .l-container{
        width: 84%;
        max-width: 84%;
    }
    .p-concept__h2{
        margin-left: 30px;
    }
    .p-concept__txt{
        line-height: 1.7;
    }
    .concept{
        padding-bottom: 80px;
    }
    .c-h2{
        margin-bottom: 30px;
    }
    .p-service__item,.service__2column,.service__policy,.company__tableTh,.company__tableTd,.recruit__th,.recruit__td,.form__column,.form__btnWrap,.company__greeting{
        display: block;
    }
    .service{
        padding-bottom: 50px;
    }
    .p-service__item{
        padding: 30px;
    }
    .p-service__item1{
        margin-bottom: 20px;
    }
    .p-service__item{
        background-size: 60%;
    }
    .service__policy{
        padding: 40px 30px; 
    }
    .service__policyTtl_wrap{
        text-align: left;
        padding: 10px 0 25px;
    }
    .service__policyTtl{
        writing-mode:inherit;
    }
    .service__policy_txt{
        line-height: 1.7;
    }
    .company{
        padding: 50px 0 90px;
    }
    .company__table,.company__hr{
        margin-bottom: 40px;
    }
    .company__tableTh{
        padding: 20px 0 5px;
    }
    .company__tableTd{
        padding-bottom: 20px;
    }
    .l-sec1{
        background: none;
        position: relative;
    }
    .l-sec1:before{
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left:0;
        background: url('../images/page-bg.jpg');
        background-size: cover;
        z-index: -1;
    }
    .l-sec2{
        background-color: #fff;
    }
    .recruit__detail{
        padding: 22px 20px;
    }
    .recruit__th{
        padding-bottom: 5px;
    }
    .recruit__td{
        padding-top: 0;
    }
    .form__inner{
        padding: 45px 18px;
    }
    .form__tel, .form__birth{
        width: 60%;
    }
    .c-page-h2{
        padding-top: 50px;
    }
    .c-btn{
        width: 100%;
    }
    .c-btn-2{
        margin-bottom: 20px;
    }
    .greeting__txt{
        margin-bottom: 20px;
    }
    .greeting__photo{
        text-align: center;
    }
    
}
    
    
