/* ヘッダーナビ：ドロップダウン（dd）専用CSS。header-nav.css から分離。
   pcナビ=dd のとき functions.php で条件付き enqueue。色は :root のナビ色変数。 */
.menu-top-navi-container{float:left;width:70%;margin:0;padding:0;display:block;}

/*------ドロップダウンメニュー-----*/
.menu-top-navi-container .menu{width:100%;max-width:var(--site-width);margin:0 auto;display:flex;justify-content:center;align-items:center!important; flex-wrap:nowrap;}
.menu-top-navi-container .menu > li{width:175px;text-align:center;position:relative;/*border-left:1px solid var(--navi-font);*/}
.menu-top-navi-container .menu > li:last-child{/*border-right:1px solid var(--navi-font);*/}
.menu-top-navi-container .menu li a{display:block;color:var(--navi-font);padding:14% 2%;font-size:var(--font-size);font-weight:600;line-height: 120%;}
.menu-top-navi-container .menu__second > li{border:solid 1px var(--navi-font-02, var(--navi-hover-font));border-bottom:none;}
.menu-top-navi-container .menu__second > li:last-child{border-bottom:solid 1px var(--navi-font-02, var(--navi-hover-font));}
.menu-top-navi-container .menu > li:hover{background:var(--navi-hover);}
.menu-top-navi-container .menu > li:hover a{color:var(--navi-hover-font);}
.menu-top-navi-container .menu li span{font-size:10px; clear:both;float:left;width:100%;}
.menu-top-navi-container .menu:before,
.menu-top-navi-container .menu:after{content:"";display:table;}
.menu-top-navi-container .menu:after{clear:both;}
.menu-top-navi-container .menu{*zoom:1;}
.menu-top-navi-container > .menu__second{position:relative;}


.menu__second{position:absolute; width:100%;background:var(--navi-back-02, var(--navi-hover));-webkit-transition:all .2s ease;transition:all .2s ease;visibility:hidden;opacity:0;
z-index:1;}
/* 2・3階層リンク色 */
.menu-top-navi-container .menu__second li a{color:var(--navi-font-02, var(--navi-hover-font));}

.menu-top-navi-container .menu > li:hover > .menu__second{visibility:visible;opacity:1;}

.menu-top-navi-container .menu > li > .menu__second > li{position:relative;}
.menu-top-navi-container .menu > li > .menu__second > li:hover{background:var(--navi-hover02, var(--navi-hover-font));}
.menu-top-navi-container .menu > li > .menu__second > li:hover a{color:var(--navi-hover-font02, var(--navi-hover));}

.menu-top-navi-container .menu > li > .menu__second > li > .menu__second{
  position:absolute;
  top:-1px;
  left:100%;
  width:100%;
  background:var(--navi-back-03, var(--navi));
  -webkit-transition:all .2s ease;
  transition:all .2s ease;
  visibility:hidden;
  opacity:0;
}

.menu-top-navi-container .menu > li > .menu__second li:hover > .menu__second{visibility:visible;background:var(--navi-back-03, var(--navi));opacity:1;}
.menu-top-navi-container .menu > li > .menu__second > li > .menu__second li a{color:var(--navi-font-03, var(--navi-font));}
.menu-top-navi-container .menu > li > .menu__second > li > .menu__second > li{border:1px solid var(--navi-font-03, var(--navi-font));border-top:none;}
.menu-top-navi-container .menu > li > .menu__second > li > .menu__second > li:first-child{border-top:1px solid var(--navi-font-03, var(--navi-font));}
.menu-top-navi-container .menu > li > .menu__second > li > .menu__second > li:hover{background:var(--navi-hover03, var(--navi-hover));}
.menu-top-navi-container .menu > li > .menu__second > li > .menu__second > li:hover a{color:var(--navi-hover-font03, var(--navi-hover-font));}