.nav4 ul, ol, li, dl{list-style-type: none;}
.Footbox{width: 100%;
display: -webkit-box;
display: -moz-box;
-webkit-box-orient: horizontal;
-moz-box-orient: horizontal;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;}
.Footbox > *{-webkit-box-flex: 1;
-moz-box-flex: 1;}
.font10{font-size: 0.5rem;}
.text-white{color:#fff}
.nav4{padding: 0; margin: 0; position: fixed; z-index: 200; bottom: 0; left: 0; width: 100%; height: 4rem; background: #0170e2; display: none;}
@media(max-width:767px){.nav4{display: block}}
.nav4 ul{padding:0;margin:0;width:100%;}
.nav4 li{border: 1px solid #82b0ea; height: 4rem; padding-top: 0.25rem; border-bottom: 0; border-left: 0; position: relative; float: left; width: 25%;}
.nav4 li:nth-of-type(1){border-left:0;}
.nav4 li>a{-webkit-box-sizing:border-box;box-sizing:border-box;/*border:1px solid #f9f8f9;-webkit-tap-highlight-color:rgba(0,0,0,0);*/border-bottom:0;display:block;line-height:1rem;text-align:center;/*-webkit-gradient(linear, 0 0, 0 100%, from(#f1f1f1), to(#dcdcdc), color-stop(35% ,#ededed), color-stop(50%, #e3e3e3) );*/}
.text-bof{color: #fff; font-size: 0.7rem;}
.avatar{display:-ms-inline-flexbox;display:inline-flex;overflow:hidden;flex-direction:column;width:2rem;height:2.5rem;vertical-align:middle;background-position:center;background-size:cover;-ms-flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.avatar img{display:block;width:100%;height:100%;margin:0}.avatar-sm{font-size:.6rem;width:1rem;height:1rem}.avatar-lg{font-size:1rem;width:2rem;height:2rem}.avatar-lg>.icon{font-size:1rem}.avatar-xl{font-size:1.75rem;width:3.5rem;height:3.5rem}.avatar-xl>.icon{font-size:1.75rem}
.nav4 li>a:only-child span{background:none;padding-left:0;}
.nav4 li>a.on + dl{display: block;}
.nav4 li > a span{color: #fff; display: inline-block; padding-left: 15px; /*background: url(imgs/1.svg#2) no-repeat 4px 18px;*/ -webkit-background-size: 9px auto; /*text-shadow: 0px 1px 0px #333333;*/} /**********************ºóÃæÎÞÓÃ*/
.nav4 dl{display:none;position:absolute;z-index:220;bottom:60px;left:50%;width:100px;margin-left:-50px;background:red;/*min-height:100px;*/background:#e4e3e2;/*border:1px solid #afaeaf;*/border-radius:5px;-webkit-box-shadow:inset 0 0 3px #fff;background:url(imgs/2.svg#3) no-repeat center center;-webkit-background-size:100%;background-size:100%;}
/*, .nav4 dl:after*/
.nav4 dl:before{content:"";display:inline-block;position:absolute;z-index:240;bottom:0;left:50%;/*width:0;height:0;border:8px solid red;border-color:#afaeaf transparent transparent transparent;margin-left:-8px;margin-bottom:-16px;*/width:10px;height:8px;background: url(imgs/1.svg#2) no-repeat center -55px;-webkit-background-size: 10px auto;bottom: -7px;margin-left: -5px;}
/*.nav4 dl:after{z-index:241;border-color:#e4e3e2 transparent transparent transparent;margin-bottom:-15px;}*/
.nav4 dl dd{line-height:45px;text-align:center;background:-webkit-gradient(linear, 0 0, 100% 0, from(rgba(194,194,194,0.8)), to(rgba(194,194,194,0.8)), color-stop(50%, rgba(194,194,194,0.8)));background-size:80% 1px;background-repeat:no-repeat;background-position: center bottom;/*background: url(imgs/3.svg#4) no-repeat center bottom;-webkit-background-size:100px 1px;*/}
.nav4 dl dd:last-of-type{background:none;}
.nav4 dl dd a{font-size: 15px;display:block;color:#4f4d4f;text-shadow:0px 1px 0px #ffffff;white-space: pre;overflow: hidden;text-overflow: ellipsis;}
.nav4 .masklayer_div{display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 180;background: rgba(0,0,0,0);}
.nav4 .masklayer_div.on{display: block;}