@charset "utf-8";
/* CSS Document */
@media (min-width:769px) {
  .nav-drawer__navigation {
    display: block;
  }
  .header__navigation ul li {
    /*display: inline-block;*/
    margin-left: 40px;
  }
  .nav-drawer__navigation li a {
    color: #FFF;
    text-decoration: none;
  }
}
 @media (max-width:768px) {
  #nav-drawer {
    text-align: right;
    align-items: center;
    position: relative;
  }
    #nav-content {
    display: block;
    position: fixed;
    top: 0;
/*    left: 0;*/
      left: -120%;
    z-index: 9999;
    /*      ここを100％*/
    width: 100%;
/*    height: 100%;*/
      height: 100vh;
    background-image: url("../images/nav-image@2x.jpg");
    background-size: cover;
    object-fit: cover;
    text-align: left;
    padding: 20px 0 0 24px;
    transition: 0.5s ease-in-out;
  }
  .nav-drawer__title {
    display: block;
    font-size: 1.2rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 120px;
  }
  .nav-drawer__bg {
    width: 85px;
    object-fit: cover;
  }
  #nav-content ul li {
    margin-bottom: 15px;
  }
  
  #nav-content ul li a {
    font-family: 'Charmonman', cursive;
    font-weight: 700;
    font-size: 1.6rem;
    text-decoration: none;
    color: #000;
  }
    .nav-drawer__cross {
    position: absolute;
    bottom: 38px;
    left: 18px;
  }
  .nav-drawer__contact {
    position: absolute;
    bottom: 13px;
    right: 22px;
  }
  }
   .openbtn {
   cursor: pointer;
   }
   #nav-content.panelactive{
    left: 0;
}
 #nav-content__pc.panelactive{
    left: 0;
}

@media (min-width:769px) {
  #nav-drawer__pc {
    position: relative;
  }
  #nav-open__pc {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    height: 90px;
    padding-top: 14px;
    align-items: center;
    cursor: pointer;
  }
  #nav-content__pc {
    display: block;
    position: fixed;
    top: 0;
    left: -120%;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background-image: url("../images/navimage_pc.jpg");
    background-size: cover;
    background-repeat: no-repeat;
/*    object-fit: cover;*/
    text-align: left;
    padding: 15px 0 0 24px;
/*    transform: translateX(-105%);*/
    transition: 0.8s ease-in-out;
  }
  .nav-drawer__title {
    display: block;
    margin: 10px 0 15vh 35px; /*bottom 4vh*/
    width: 100px;
  }
  .nav-drawer__link-top {
    display: block;
  }
  #nav-content__pc ul li {
    margin-bottom: 2vh;
  }
  #nav-content__pc ul li a {
    font-family: 'Charmonman', cursive;
    font-weight: 700;
    font-size: 1.6rem;
    text-decoration: none;
    color: #000;
      }
    .nav-drawer__cross {
    position: absolute;
    bottom: 60px;
    left: 64px;
  }
  .openbtn {
   margin-top: 14px;
   }
}