@media screen and (max-width:768px){
  .l-contact h2 span,body{
    font-family:YakuHanJP,'ヒラギノ角ゴシック Pro','Hiragino Kaku Gothic Pro','游ゴシック','Yu Gothic',YuGothic,'メイリオ',Meiryo,Osaka,'ＭＳ Ｐゴシック','MS PGothic',sans-serif
  }

  .l-contact,.l-kv,footer,footer .l-footer_top>ul,header{
    min-width:0
  }

  header{
    height:5vw
  }

  header .c-logo{
    position:relative;
    z-index:1;
    padding:2vw 0 0 2vw
  }

  header .c-logo img{
    width:10vw
  }

  header .c-menu_btn{
    position:relative;
    z-index:1;
    width:15vw;
    height:100%;
    padding-right:15px
  }

  header .c-menu_btn span{
    position:absolute;
    right:2vw;
    width:8vw;
    height:2px;
    background:#fff
  }

  header .c-menu_btn span:first-of-type{
    top:22px;
    -webkit-transition:top .45s .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s .45s cubic-bezier(.075,.82,.165,1),transform .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s .45s cubic-bezier(.075,.82,.165,1),transform .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s cubic-bezier(.075,.82,.165,1)
  }

  header .c-menu_btn span:nth-of-type(2){
    top:28px;
    -webkit-transition:all .9s cubic-bezier(.075,.82,.165,1);
    transition:all .9s cubic-bezier(.075,.82,.165,1)
  }

  header .c-menu_btn span:last-of-type{
    top:34px;
    -webkit-transition:top .45s .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s .45s cubic-bezier(.075,.82,.165,1),transform .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s .45s cubic-bezier(.075,.82,.165,1),transform .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s cubic-bezier(.075,.82,.165,1)
  }

  header .c-menu_btn.close_btn span:first-of-type{
    top:28px;
    -webkit-transition:top .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s cubic-bezier(.075,.82,.165,1),transform .45s .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s cubic-bezier(.075,.82,.165,1),transform .45s .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s .45s cubic-bezier(.075,.82,.165,1);
    -webkit-transform:rotate(38deg);
    transform:rotate(38deg)
  }

  header .c-menu_btn.close_btn span:nth-of-type(2){
    opacity:0
  }

  header .c-menu_btn.close_btn span:last-of-type{
    top:28px;
    -webkit-transition:top .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s cubic-bezier(.075,.82,.165,1),transform .45s .45s cubic-bezier(.075,.82,.165,1);
    transition:top .45s cubic-bezier(.075,.82,.165,1),transform .45s .45s cubic-bezier(.075,.82,.165,1),-webkit-transform .45s .45s cubic-bezier(.075,.82,.165,1);
    -webkit-transform:rotate(-38deg);
    transform:rotate(-38deg)
  }

  header nav{
    font-size:0;
    position:absolute;
    top:56px;
    left:0;
    visibility:hidden;
    width:100%;
    padding:0;
    -webkit-transition:all .9s cubic-bezier(.075,.82,.165,1);
    transition:all .9s cubic-bezier(.075,.82,.165,1);
    -webkit-transform:scale(.9);
    transform:scale(.9);
    opacity:0;
    border:0
  }

  .l-service_nav ul,header nav>ul>li,header nav>ul>li .l-subnav>ul:first-of-type>li:first-of-type a{
    border-top:1px solid #fff
  }

  header nav.is-open{
    visibility:visible;
    -webkit-transform:scale(1);
    transform:scale(1);
    opacity:1
  }

  header nav>ul{
    display:block;
    overflow-y:auto
  }

  header nav>ul>li:last-of-type{
    border-bottom:1px solid #fff
  }

  header nav>ul>li>a{
    font-size:14px;
    line-height:50px;
    display:block;
    padding:0 15px
  }

  header nav>ul>li>a::after{
    display:none
  }

  header nav>ul>li>a:hover::after{
    -webkit-transform:scale(0,1);
    transform:scale(0,1)
  }

  header nav>ul>li:nth-of-type(3) span{
    position:absolute;
    top:0;
    right:0;
    display:block;
    width:48px;
    height:48px
  }

  header nav>ul>li:nth-of-type(3) span::after,header nav>ul>li:nth-of-type(3) span::before{
    position:absolute;
    top:50%;
    width:12px;
    height:1px;
    background:#fff;
    content:''
  }

  header nav>ul>li:nth-of-type(3) span::before{
    right:24px;
    -webkit-transition:all .9s cubic-bezier(.075,.82,.165,1);
    transition:all .9s cubic-bezier(.075,.82,.165,1);
    -webkit-transform:rotate(90deg);
    transform:rotate(90deg);
    opacity:1
  }

  header nav>ul>li:nth-of-type(3) span::after{
    right:18px;
    -webkit-transform:translate(-50%,0);
    transform:translate(-50%,0)
  }

  header nav>ul>li:nth-of-type(3) span.is-open::before{
    -webkit-transform:rotate(0);
    transform:rotate(0);
    opacity:0
  }

  header nav>ul>li:nth-of-type(3):hover{
    background:0 0
  }

  header nav>ul>li .l-subnav{
    position:relative;
    top:0;
    display:none;
    visibility:visible;
    width:100%;
    padding:0;
    -webkit-transition:none;
    transition:none;opacity:1
  }

  header nav>ul>li .l-subnav>ul{
    padding-left:0
  }

  header nav>ul>li .l-subnav>ul:nth-of-type(2)>li{
    position:relative
  }

  header nav>ul>li .l-subnav>ul:nth-of-type(2)>li span{
    position:absolute;
    top:0;
    right:0;
    display:block;
    width:48px;
    height:48px
  }

  header nav>ul>li .l-subnav>ul:nth-of-type(2)>li span::before{
    position:absolute;
    top:50%;
    right:24px;
    width:12px;
    height:1px;
    content:'';
    -webkit-transition:all .9s cubic-bezier(.075,.82,.165,1);
    transition:all .9s cubic-bezier(.075,.82,.165,1);
    -webkit-transform:rotate(90deg);
    transform:rotate(90deg);
    opacity:1;
    background:#fff
  }

  header nav>ul>li .l-subnav>ul:nth-of-type(2)>li span::after{
    position:absolute;
    top:50%;
    right:18px;
    width:12px;
    height:1px;
    content:'';
    -webkit-transform:translate(-50%,0);
    transform:translate(-50%,0);
    background:#fff
  }

  header nav>ul>li .l-subnav>ul:nth-of-type(2)>li span.is-open::before{
    -webkit-transform:rotate(0);
    transform:rotate(0);
    opacity:0
  }

  header nav>ul>li .l-subnav>ul:nth-of-type(3)>li{
    position:relative
  }

  header nav>ul>li .l-subnav>ul:nth-of-type(3)>li span{
    position:absolute;
    top:0;
    right:0;
    display:block;
    width:48px;
    height:48px
  }

  header nav>ul>li .l-subnav>ul:nth-of-type(3)>li span::before{
    position:absolute;
    top:50%;
    right:24px;
    width:12px;
    height:1px;
    content:'';
    -webkit-transition:all .9s cubic-bezier(.075,.82,.165,1);
    transition:all .9s cubic-bezier(.075,.82,.165,1);
    -webkit-transform:rotate(90deg);
    transform:rotate(90deg);
    opacity:1;
    background:#fff
  }

  header nav>ul>li .l-subnav>ul:nth-of-type(3)>li span::after{
    position:absolute;
    top:50%;
    right:18px;
    width:12px;
    height:1px;
    content:'';
    -webkit-transform:translate(-50%,0);
    transform:translate(-50%,0);
    background:#fff
  }

  header nav>ul>li .l-subnav>ul:nth-of-type(3)>li span.is-open::before{
    -webkit-transform:rotate(0);
    transform:rotate(0);
    opacity:0
  }

  header nav>ul>li .l-subnav>ul:last-of-type>li:last-of-type a{
    border-bottom:none
  }

  header nav>ul>li .l-subnav>ul>li>a{
    font-size:14px;
    display:block;
    margin-bottom:0;
    padding:16px 15px;
    border-bottom:1px solid #fff
  }

  header nav>ul>li .l-subnav>ul>li>a:hover::after{
    -webkit-transform:scale(0,1);
    transform:scale(0,1)
  }

  header nav>ul>li .l-subnav>ul>li .l-subnav_service_sub{
    display:none
  }

  header nav>ul>li .l-subnav>ul>li .l-subnav_service_sub li>a{
    display:block;
    margin-bottom:0;
    padding:16px 30px;
    border-bottom:1px solid #fff
  }

  header nav>ul>li .l-subnav>ul>li .l-subnav_service_sub li>a:hover::after{
    -webkit-transform:scale(0,1);
    transform:scale(0,1)
  }
 }
