/* 色定義 */
:root{
  --nav-h:64px;
  --nav-vertical-padding:0.5rem;
  --nav-horizontal-padding:1rem;
  --nav-open-bg:#f5f1ef;         
  --nav-open-border:#e0d6d2;      
  --nav-open-text:#5f4b43;        
  --nav-deep-bg:#efe6e1;          
  --nav-parent-highlight:#f7f5f4; 
  --nav-transition:0.12s ease;
}
/* モバイル */

@media (max-width:991.98px){

  #mainNav .mobile-parent-label{
    display:block;
    width:100%;
    padding:var(--nav-vertical-padding) var(--nav-horizontal-padding);
    margin:0;
    color:inherit;
    text-decoration:none;
    box-sizing:border-box;
  }

  #mainNav .submenu-toggle{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    border:0;
    background:transparent;
    font-size:1.15rem;
    padding:0;
    cursor:pointer;
    z-index:4000;
    transition:transform var(--nav-transition);
  }
  #mainNav .submenu-toggle.is-open{ transform:rotate(90deg); }
  #mainNav .submenu-toggle:focus{ outline:2px solid rgba(13,110,253,0.15); border-radius:4px; }


  #mainNav .dropdown-menu.d-lg-block{ display:none!important; }

#mainNav .nav,
#mainNav .nav-link,
#mainNav .dropdown-item {
  padding-left: var(--nav-horizontal-padding) !important;
  margin-left: 0 !important;
}

h2, h3, h4, h5, article {
  scroll-margin-top: 80px; 
}
}

/*  共通 */
#mainNav .nav-subcollapse .nav-link{ color:#222; }
#mainNav .nav-subcollapse .nav-link:hover{ color:var(--nav-open-text); }


/* デスクトップ */

@media (min-width:992px){

  .d-lg-none{ display:none!important; }

  #mainNav .nav-item.dropdown > .dropdown-menu{
    display:none!important;
    position:absolute!important;
    top:100%!important;
    left:0!important;
    z-index:2000!important;
    white-space:nowrap;
    padding:0;
    margin:0;
    border-radius:0;
    overflow:visible;
  }

  #mainNav .navbar-nav > .nav-item {
    min-width: 0;
  }

  #mainNav .navbar-nav > .nav-item > .nav-link {
    min-width: 0;
    white-space: nowrap; 
  }
  #mainNav .nav-item.dropdown:hover > .dropdown-menu,
  #mainNav .dropdown-submenu:hover > .dropdown-menu,
  #mainNav .navbar-nav > .dropdown:hover > .dropdown-menu{
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
  }

  #mainNav .dropdown-item{
    display:block;
    width:100%;
    padding:0.5rem 1rem;
    line-height:1.4;
    font-weight:400;
    color:inherit;
    text-decoration:none;
    white-space:nowrap;
    background:transparent;
    border:0;
    border-bottom:1px solid rgba(0,0,0,0.06);
       font-size: 15px !important;
  }
  #mainNav .dropdown-menu .dropdown-item:last-child{ border-bottom:none; }
  #mainNav .dropdown-menu .dropdown-item:hover,
  #mainNav .dropdown-menu .dropdown-item:focus{
    color:var(--nav-open-text)!important;
    background:var(--nav-open-bg)!important;
    text-decoration:none!important;
  }

  #mainNav .dropdown-submenu{ position:relative; }
  #mainNav .dropdown-submenu > .dropdown-menu{
    display:none;
    position:absolute!important;
    top:0!important;
    left:100%!important;
    margin-left:.01rem!important;
    z-index:2000!important;
    white-space:nowrap;
  }
  #mainNav .dropdown-submenu:hover > .dropdown-menu{ display:block!important; }
  #mainNav .dropdown-submenu > .dropdown-item::after{
    content:"";
    display:inline-block;
    margin-left:0.5em;
    vertical-align:middle;
    border-top:0.28em solid transparent;
    border-bottom:0.28em solid transparent;
    border-left:0.28em solid currentColor;
    opacity:0.7;
  }

  #mainNav .navbar-nav > .nav-item > .nav-link,
  #mainNav .navbar-nav > .nav-item > a.nav-link{
    text-decoration:none!important;
    border-bottom:none!important;
    box-shadow:none!important;
    transition:color .12s ease, background .12s ease;
        font-size: 15px !important;       
    padding-left: 0.5rem !important;  
    padding-right: 0.5rem !important;

  }
  #mainNav .navbar-nav > .nav-item > .nav-link:hover,
  #mainNav .navbar-nav > .nav-item.show > .nav-link{
    color:var(--nav-open-text)!important;
    background:var(--nav-open-bg)!important;
    font-size: 15px !important;       
    padding-left: 0.5rem !important;  
    padding-right: 0.5rem !important;

  }

  #mainNav .navbar-nav > .nav-item {
    padding: 0 0.5rem;               
    margin: 0;                      
    border-left: 1px solid #dee2e6;   
    display: flex;
    align-items: center;
  }

  #mainNav .navbar-nav > .nav-item:last-child {
    border-right: 1px solid #dee2e6;
    padding-right: 0.75rem;
  }

  #mainNav .dropdown-submenu .dropdown-item,
  #mainNav .dropdown-submenu .dropdown-menu .dropdown-item,
  #mainNav .nav-subcollapse .nav-subcollapse .nav-link,
  #mainNav .nav-subcollapse .nav-subcollapse .dropdown-item{
    border-bottom:none!important;

  }

  #mainNav .dropdown-submenu > .dropdown-menu {
    padding-top: 0 !important;
    padding-bottom: 0 !important;

  }

h2, h3, h4, h5 {
  scroll-margin-top: 110px; 
}

}


/* ノートパソコン メニュー被り・折り返し対策 */
@media (min-width: 992px) and (max-width: 1400px) {
  
  #mainNav .header-logo {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: 100% !important;
  }

  #mainNav .header-logo img {
    height: 42px !important; 
    width: auto !important;
  }

  #mainNav .navbar-nav > .nav-item {
    padding: 0 0.35rem !important; 
    margin: 0 !important;
  }

  #mainNav .navbar-nav > .nav-item > .nav-link,
  #mainNav .navbar-nav > .nav-item > a.nav-link {
    font-size: 14px !important;       
    padding-left: 0.4rem !important;  
    padding-right: 0.4rem !important;
  }

  #mainNav .navbar-nav > .nav-item:last-child {
    padding-right: 0.5rem !important;
  }

  #mainNav .ms-3 {
    margin-left: 0.5rem !important;
  }

  #mainNav .dropdown-item {
    font-size: 14px !important;
  }

  #mainNav .dropdown-menu .dropdown-item {
    padding: 0.4rem 1rem !important; 
  }
}