#navi-main-container{position:absolute;width:100%;border-bottom:1px solid #bbb;font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:0.02em}#navi-bar{width:100%;height:46px;background-color:#557187}.navi-btn{position:absolute;top:0px;height:47px;padding:13px 22px 10px;color:#f4f2df;text-decoration:none;cursor:pointer;z-index:101;transition:opacity 0.5s ease;-moz-transition:opacity 0.5s ease;-webkit-transition:opacity 0.5s ease;-o-transition:opacity 0.5s ease}.navi-btn img{margin:0 10px 3px 0;vertical-align:middle}.navi-btn:hover{opacity:0.7}#navi-toggle{position:absolute;top:-9999px;left:-9999px}#navi-main{position:relative;width:100%;color:#f4f2df}#navi-main ul,#navi-main ul li{margin:0;padding:0;border:0;list-style:none;display:block;position:relative}#navi-main ul li a{display:block;position:relative;cursor:pointer;overflow:hidden;text-decoration:none;letter-spacing:0.06em;padding-left:20px;padding-top:0;height:0;vertical-align:middle;color:#f4f2df;transition:height 0.8s ease, padding-top 0.8s ease, color 0.5s ease;-moz-transition:height 0.8s ease, padding-top 0.8s ease, color 0.5s ease;-webkit-transition:height 0.8s ease, padding-top 0.8s ease, color 0.5s ease;-o-transition:height 0.8s ease, padding-top 0.8s ease, color 0.5s ease}#navi-main ul ul{display:none}#navi-main>ul>li.active>ul{display:block}#navi-main li.active>a,#navi-main li.trail>a{color:#aaa}#navi-main>ul>li{font-size:16px}#navi-main>ul>li>a{z-index:2;font-size:17px;background:#333}#navi-main>ul>li.active>a,#navi-main>ul>li.trail>a,#navi-main>ul>li>a:hover{color:#aaa}#navi-main ul ul li{font-size:14px}#navi-main ul ul li a,#navi-main ul ul li>.active{z-index:2;font-size:15px;padding-left:32px;background:#5d646f}#navi-main ul ul li>.active,#navi-main ul ul li.trail>a,#navi-main ul ul li a:hover{color:#9ccef3}#navi-main ul ul ul li a,#navi-main ul ul ul li>.active{padding-left:42px;background:#6f7682}#navi-main li .level-toggle{position:absolute;right:0px;top:1px;z-index:4;display:block;overflow:hidden;height:0;width:20%;background:#5d646f;cursor:pointer;transition:height 0.8s ease;-moz-transition:height 0.8s ease;-webkit-transition:height 0.8s ease;-o-transition:height 0.8s ease}#navi-main ul ul li .level-toggle{background:#6f7682}#navi-main ul>li.submenu>.level-toggle:after{position:relative;z-index:5;display:block;height:20px;width:20px;margin:17px auto;content:url(../img/arrow-down-line-white.svg);-webkit-transition:all 0.1s ease-out;-moz-transition:all 0.1s ease-out;-ms-transition:all 0.1s ease-out;-o-transition:all 0.1s ease-out;transition:all 0.1s ease-out}#navi-main ul>li.submenu.open>.level-toggle:after{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}#navi-main ul ul>li.submenu>.level-toggle:after{margin:14px auto}#navi-toggle:checked ~ #navi-main li .level-toggle{height:3.15em}#navi-toggle:checked ~ #navi-main ul li a,#navi-toggle:checked ~ #navi-main ul li>.active{height:3em}#navi-toggle:checked ~ #navi-main>ul>li>a,#navi-toggle:checked ~ #navi-main>ul>li>.active{padding-top:0.8em;border-top:1px solid #666}#navi-toggle:checked ~ #navi-main ul ul li a,#navi-toggle:checked ~ #navi-main ul ul li>.active{padding-top:0.75em;border-top:1px solid #666}
