@charset "utf-8";

/**
 * menu
 */
 .menu{position: fixed; top: 0; right: -375px; background: #313131; height: 100%; border-left: 1px solid #DDD; z-index: 99; overflow: auto;}
 .menu::-webkit-scrollbar{height: 0; width: 0; }
 .menu-layout{display: table; width: 375px; height: 100%;}
 
 
 .menu-layout > div{display: table-cell; vertical-align: top; background: linear-gradient(45deg, #100f0f, #010101);}
 
 .menu-top {
     font-size: 30px;
     font-weight: 600;
     text-align: center;
     margin: 5px 0;
     color: #FFF;
 }
 
 .menu-quick_1:after{content: ""; display: block; clear: both; }
 .menu-quick_1 > a{float: left; width: 50%; padding: 15px 0; text-align: center; background-color: #f5f3f3; color: #000; font-size: 20px;}
 .menu-quick_1 > .active{background-color: #b20000;color: #fff; }
 
 .menu-quick_2:after{content: ""; display: block; clear: both; }
 .menu-quick_2 > a{float: left; width: 33.3333333333%; padding: 15px 0; text-align: center; background-color: #f5f3f3; color: #000;font-size: 15px; }
 .menu-quick_2 > .active{background-color:  #b20000;;color: #fff; }
 
 .menu-link{display: block; margin-top: 10px; padding: 15px 20px; color: #FFF;}
 .menu-box{  background-color: #fff; }
 .menu-box > div {padding: 15px 20px; border-bottom: 1px solid #bbb; background: #403f3f; color: #fff; font-size: 20px; }
 .menu-box > a {display: block; height: 50px; line-height: 50px; padding: 0 10px 0 30px; background-color: #ffffff; border-bottom: 1px solid #bbb; color: #000; font-size: 22px;}
 .menu-box > a > span,
 .menu-link > span{line-height: 1.45; border: 4px solid #ff4d4d; width: 17px; height: 17px; border-radius: 100%; font-weight: bold; text-align: center; color: #ff4d4d; }
 .menu-box > div:before,
 .menu-link:before{content: ""; display: inline-block; vertical-align: middle; width: 5px; height: 5px; margin-right: 10px; background-color: #b20000; border-radius: 100%; }
 .menu-toggle-btn{position: fixed; z-index: 5; right: 15px; bottom: 70px; height: 50px; width: 50px; border-radius: 100%; background-color: rgba(30, 30, 30, 0.7); color: #fff; }
 .menu-toggle-btn.active{background-color: rgba(255,77,77,0.7); }
 .menu-toggle-btn > i{ margin: 0;}
 .menu-toggle-btn > i:before{display: block; content: "\E5D2"; }
 .menu-toggle-btn.active > i:before{content: "\E5CD"; }
 
 .menu-btn-menu{position: absolute; z-index: 5; left: 15px; top: -5px; }
 .menu-btn-menu > i{ margin: 0;}
 .menu-btn-menu > i:before{display: block; content: "\E5CD"; }