﻿@charset "utf-8";

.content,.content ul{margin:0!important;}


.vertical-nav{width: 200px;margin:0;padding:0;float: left;font-family: Segoe UI, Arial;position:relative;list-style: none;/*box-shadow: 0 1px 2px rgba(0,0,0,0.5);*/}

.vertical-nav li{display: block;width: 100%;padding:0;float:left;font-size:14px;position:relative;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box; border-bottom:1px solid #999;}

.vertical-nav li a{width: 100%;display:block;padding:15px 20px;color: #434343;text-decoration:none;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-o-transition: all .3s ease-in-out;-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}



.vertical-nav li:hover > a > i,.vertical-nav > li.active a > i{background: #95a5a6;color: #F0B01C;}

.vertical-nav ul, .vertical-nav ul li ul{list-style: none;margin: 0;padding: 0;display: none;position: absolute;z-index: 999;width:100%;background: #F0B01C;box-shadow: 0 1px 3px rgba(0,0,0,0.3);}
.vertical-nav ul{top: 0;left: 100%;}


.vertical-nav ul li ul{top: 1px;}
.vertical-nav ul li{clear: both;width: 100%; background:#000;}
.vertical-nav ul li a{padding: 10px 20px;text-decoration:none;display:inline-block;border:0 none;float:left;clear:both; color:#F0B01C;}
.vertical-nav dark red .active{ color: #fff;background: #F0B01C;}
.vertical-nav .submenu-icon{font-size: 12px;float: right;margin-right: 10px;line-height: 50px; font-weight:10px; font-weight:700; font-family:"宋体"}
.vertical-nav > li > a > .submenu-icon:before{content: "\f0c9";}.
vertical-nav > li ul a .submenu-icon:before{content: "\f0c9";float: right;line-height: 23px;}

.vertical-nav > li i{line-height: 24px !important;margin: -16px 14px 0 -20px;font-size: 25px;float: left;border-right: solid 1px #dedede;padding-right: 10px;padding:14px 15px 12px 15px;width: 28px;text-align: center;-o-transition: background .3s ease-in-out;-webkit-transition: background .3s ease-in-out;-moz-transition: background .3s ease-in-out;transition: background .3s ease-in-out;}

.vertical-nav > li.showhide{display: none;width: 100%;height: 50px;cursor: pointer;color:#888;border-bottom: solid 1px rgba(0, 0, 0, 0.1);background: #fff;}
.vertical-nav > li.showhide span.title{margin: 16px 0 0 25px;float: left;}

.vertical-nav > li.showhide span.icon{margin: 17px 20px;float: right;}
.vertical-nav > li.showhide .icon em{margin-bottom: 3px;display: block;width: 20px;height: 2px;background: #ccc;}

.vertical-nav.dark, .vertical-nav.dark ul, .vertical-nav.dark ul li ul{background: #F7F7F9!important; color:#666;}
.vertical-nav.dark > li.showhide{background: #222;color: #F0B01C !important;}
.vertical-nav.dark > li.showhide .icon em{background: #fff;}


.red li.active > a{ color: #F0B01C; font-weight:bold;}
.red li:hover > a{color: #fff;background: #F0B01C;}


@media (max-width: 768px){
.vertical-nav,.vertical-nav li{width: 100%;}
.vertical-nav > li > a{padding-top:15px;padding-bottom:15px;padding-left: 25px;}
.vertical-nav a{width: 100%;}.vertical-nav ul, 
.vertical-nav ul li ul{width: 100%;left: 0;border-left: none;position: static;}
.vertical-nav ul li{background: #e9e9e9;}
.vertical-nav.dark ul li{background: #333;}
.vertical-nav ul li a{padding-top:10px;padding-bottom:10px;}
.vertical-nav > li i{margin: -16px 14px 0 -25px;}
.vertical-nav > li > ul > li > a{padding-left: 40px !important;}
.vertical-nav > li > ul > li > ul > li > a{padding-left: 60px !important;}
.vertical-nav > li > ul > li > ul > li > ul > li > a{padding-left: 80px !important;}
.vertical-nav .submenu-icon{margin-right: 5px;}
.vertical-nav ul .submenu-icon{display: none;}
}



.vertical-nav{margin: 20px 0 0 0;}