@charset "UTF-8";


.floating02 {
    position: fixed !important;
    width: 100%;
    top: 0px;
    margin-top: 0px !important;
    box-sizing: border-box;
    z-index: 100;
    /* transition: .5s; */
    background: #fff;
    box-shadow: 0px 15px 10px rgba(0,0,0,0.4);

}

  
.floating02.hide {
  
  
  transform: translateY(-200%);

}




.floating02.hide_sp {
  
  
    transform: translateY(-200%);
      /*display: none;*/
      visibility: hidden;
      opacity: 0;
  
  }

  .floating03 {
    position: fixed !important;
    width: 100%;
    top: 0px;
    margin-top: 0px !important;
    box-sizing: border-box;
    z-index: 100;
    /* transition: .5s;*/ 
    background: #fff;
    box-shadow: 0px 15px 10px rgba(0,0,0,0.4);
    transform: translateY(-200%);

     padding-top: 0px;
}


.floating03.open {
  
    transition: .5s; 
    transform: translateY(0%);
  
  
  }
  body .floating03.hide {
  
  
    transform: translateY(-200%);
  
  
  }
  
  

  .top-nav {

    -webkit-transition: all .5s;
    transition: all .5s;

  }

  .ht_mt {
    
    
    padding: 0 120px !important;
    
  
  }


@media screen and (max-width: 767px) {


  body .floating03.open {
  
        transition: none !important; /**/
        transform: translateY(0%);
      
      
      }
      

    .obf {

        overflow: hidden !important;
      }

      

    .floating02 {
  
        padding: 0 10px !important;
  
  
    }

    /*spmenu*/

    body .spmenu_on {

        transform: none !important;
      
           visibility: visible !important; /**/
          opacity: 1 !important;
      }
      

.hamburger-menu {
    height: 0px;
  z-index: 999;
  }
  
  .menu-btn {
    /* position: fixed; */
    position: absolute;
    top: 10px;
    right: 18px;
    display: flex;
    height: 60px;
    width: 60px;
    justify-content: center;
    align-items: center;
    z-index: 90;
    /*background-color: none;*/
    cursor: pointer;
}   
      .menu-btn span,
      .menu-btn span:before,
      .menu-btn span:after {
        content: '';
        display: block;
        height: 3px;
        width: 48.6px;
        border-radius: 3px;
        background-color: #6c7f56;
        position: absolute;
        left: 0;
        right: 0;
        margin: 0 auto;
      }
      .menu-btn span:before {
          bottom: 16.3px;
      }
      .menu-btn span:after {
          top: 16.3px;
      }
      
      
      .menu-content {
          width: 100%;
          height: 100%;
          position: fixed;
          top: 0;
          left: 100%;
          z-index: 80;
          background-color: #d3d9cc;
          transition: all 0.5s;/*アニメーション設定*/
          
          
      }
      .menu-content ul {
          padding: 70px 10px 0;
      }
      .menu-content ul li {
          border-bottom: solid 1px #6c7f56;
          list-style: none;
      }
      .menu-content ul li a {
          display: block;
          width: 100%;
          font-size: 15px;
          box-sizing: border-box;
          color:#6b7c5c;
          text-decoration: none;
          padding: 9px 15px 10px 0;
          position: relative;
      }
      .menu-content ul li a::before {
          content: "";
          width: 7px;
          height: 7px;
          border-top: solid 2px #6c7f56;
          border-right: solid 2px #6c7f56;
          transform: rotate(45deg);
          position: absolute;
          right: 11px;
          top: 16px;
      }
      
      
      #menu-btn-check:checked ~ .menu-content {
          left: 0;/*メニューを画面内へ*/
      }
      
      #menu-btn-check:checked ~ .menu-btn div {
        position: absolute;
        right: 100%;

      }



      #menu-btn-check:checked ~ .menu-btn span {
          background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
      }
      #menu-btn-check:checked ~ .menu-btn span::before {
          bottom: 0;
          transform: rotate(45deg);
      }
      #menu-btn-check:checked ~ .menu-btn span::after {
          top: 0;
          transform: rotate(-45deg);
      }
      
      
      #menu-btn-check {
          display: none;
      }
      
  
  /*--spmenu*/
  

}