@charset "utf-8";
/* 以下实际使用若已初始化可删除 .leftnav height父级需逐级设置为100%*/
body,html{height: 100%;background: #E2E2E2}
body,ul{margin:0;padding:0}
body{font:14px "微软雅黑","宋体","Arial Narrow",HELVETICA;-webkit-text-size-adjust:100%;} 
li{list-style:none} 
a{text-decoration:none;}
/* 以上实际使用若已初始化可删除 */

/* leftnav */
.leftnav{width: 220px;height: 100%;background: #263238;transition: all .3s;}
.leftnav a{display: block;overflow: hidden;padding-left: 20px;line-height: 46px;max-height: 46px;color: #ABB1B7;transition: all .3s;}
.leftnav a span{margin-left: 10px;}
.leftnav-item{position: relative;}
.leftnav-item.leftnav-show{border-bottom: none;}
.leftnav-item ul{display: none;background: rgba(0,0,0,.1);}
.leftnav-item.leftnav-show ul{display: block;font-size: 12px;}
.leftnav-item>a:before{content: "";position: absolute;left: 0px;width: 2px;height: 46px;opacity:0;transition: all .3s;}
.leftnav .leftnav-icon{font-size: 20px;position: absolute;margin-left:-1px;}

.item-hospital>a:before{background: rgba(255, 0, 0, 0.8);}
.item-school>a:before{background: rgba(0, 255, 255, 0.8);}
.item-lvyou>a:before{background: rgba(255, 255, 0, 0.8);}
.item-train>a:before{background: rgba(0, 255, 0, 0.8);}
.item-jiaotong>a:before{background: #ffffff;}
/* 此处修改导航图标 可自定义iconfont 替换*/
.icon_1::after{content: "\e7d8";}
.icon_2::after{content: "\e6d1";}
.icon_3::after{content: "\e657";}
.icon_4::after{content: "\e65b";}
/*---------------------*/
.leftnav-more{float:right;margin-right: 20px;font-size: 12px;transition: transform .3s;}
/* 此处为导航右侧箭头 如果自定义iconfont 也需要替换*/
.leftnav-more::after{content: "\e621";}
/*---------------------*/
.leftnav-show .leftnav-more{transform:rotate(90deg);}
.leftnav-show,.leftnav-item>a:hover{color: #FFF;background:rgba(0,0,0,.1);}
.leftnav-show>a:before,.leftnav-item>a:hover:before{opacity:1;}
.leftnav-item li:hover a{color: #FFF;background: rgba(0, 0, 0,.1);}

/* leftnav-mini */
.leftnav-mini.leftnav{width: 60px;}
.leftnav-mini.leftnav .leftnav-icon{/* margin-left:-2px; */}
.leftnav-mini.leftnav .leftnav-item>a span{display: none;}
.leftnav-mini.leftnav .leftnav-more{margin-right: -20px;}
.leftnav-mini.leftnav .leftnav-item ul{position: absolute;top:0px;left:60px;width: 180px;z-index: 99;background:#3C474C;overflow: hidden;}
.leftnav-mini.leftnav .leftnav-item:hover{background:rgba(255,255,255,.1);}
.leftnav-mini.leftnav .leftnav-item:hover .leftnav-item a{color:#FFF;}
.leftnav-mini.leftnav .leftnav-item:hover a:before{opacity:1;}
.leftnav-mini.leftnav .leftnav-item:hover ul{display: block;}





