*,*:before,*:after{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
body,p,button,h2,h3,pre,ul,li{margin:0;padding:0;list-style:none;font-weight:normal}
a,input,textarea,button,select{outline:0;border:0 NONE}
.clearfix{*zoom:1;} 
.clearfix:before,.clearfix:after{display:table;line-height: 0;content:"";}
.clearfix:after{clear:both;}
a{color:#C36;text-decoration:none;}
a:hover{text-decoration:none}
body, td, input, textarea, select, button {color: #444;background-color:#F1F2F9;;font:normal 12px/1.6em 'Microsoft YaHei',Helvetica,Tahoma,Arial,sans-serif;font-weight:normal}
::-webkit-scrollbar {width:5px;}
::-webkit-scrollbar-track {background-color:#1E1E1E;-webkit-border-radius:2em;-moz-border-radius:2em;border-radius:2em;}
::-webkit-scrollbar-thumb{background-color:#686868;-webkit-border-radius:2em;-moz-border-radius:2em;border-radius:2em;}

.mobile{display:none;z-index: 100;height: 60px;position: fixed;top: 0;left: 0;right: 0;background-color: #171717;}
.mobile .mobile-logo {display: block;text-decoration: none;margin: 10px auto;width: 40px;}
.mobile .mobile-logo img {width: auto;height: 40px;display: block;}
.btn-mobile-sidenav {left: 0;top: 0;width: 40px;height: 100%;color: #ddd;cursor: pointer;display: none;}
.nav-bar {padding: 24px 50px 40px 16px;position: fixed;z-index: 1000;}
.nav-bar span {margin-left: auto;margin-right: auto;display: block;width: 20px;height: 1px;margin-bottom: 6px;position: relative;background: #fff;border-radius: 3px;z-index: 1;-webkit-transform-origin: 20px;transform-origin: 20px;-webkit-transition: background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),opacity 0.55s ease,-webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1);transition: background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),opacity 0.55s ease,-webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1);transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),opacity 0.55s ease;transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),opacity 0.55s ease,-webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1);}

#wrap{margin-left:230px}
#main{margin:auto}
#main .tips{position: relative;background-color:#FFFAE8;padding:10px 20px;border-bottom: 1px solid #FAF5E3;border-radius:6px 6px 0 0;}
#main .tips i{font-size:18px;font-weight:800;margin-right:10px;float:left;}
#main .tips a,#main .tips i{color:#F93C12;}
#main .item{background-color: #FFFFFF;border-radius: 6px;padding: 20px;margin: 20px 0;}
#main .top{border-radius:0 0 6px 6px;margin-top:0;}
.item-title {padding: 8px 12px;display: inline-block;margin-bottom: 16px;font-size: 12px;font-weight: 900;color: #666;}
.card {box-shadow: 0px 2px 0px rgba(170,170,170,0.1);background: #F8F8F8;margin-bottom: 20px;border-radius: 3px;}
.card:hover{background-color:#F1F2F9;}
.item-panl{margin:0 -5px;}
.panl-item{float:left;}
.panl-card{margin:0 5px;position: relative;min-height: 1px;padding:0 10px;}
.panl-card a {overflow: hidden;margin-bottom: 7px;display: block;cursor: pointer;padding: 10px 15px;color: #333}
.panl-card a:hover{color:#38B7EA;}
.panl-card a .card-ico{width: 32px;height: 32px;border-radius: 32px;float: left;display: block;}
.panl-card a .card-ico img {display: block;width: 100%;height: 100%;border-radius: 32px;}
.panl-card a .card-title {display: block;padding-left: 40px;margin-top: 6px;font-weight: 700;font-size: 15px;color: inherit;}

.main-img{margin:20px -5px;}
.main-img .img-item{float:left;margin-bottom:10px;}
.main-img .img-item a{padding:0 5px;display: block;}
.main-img .img-item a img{display: block;width: 100%;height: auto;}

#footer{margin-bottom:20px;color: #bbb;}
#footer a{color: #000;}
#footer a:hover{color:#38B7EA;}

#sidebar{width: 230px;position: fixed;z-index: 200;top: 0;left: 0;bottom: -100px;background-color: #171717;padding: 31px 0;color:#686868;text-align: center;}
#sidebar .active{background-color: #fff;margin-top: 20px;}
#sidebar .navitem a{color: #fff;text-align: center;font-size: 14px;font-weight: 700;padding: 7px;display: block;}
#sidebar .navitem a:hover{color: #000;background-color: #FFF;}
#sidebar .navitem a span {position: relative;top: -2px;}
#sidebar .navitem a .csz {display: block;text-align: center;font-size: 20px;font-weight: 200;}
#sidebar .navitem.active a{color: #000;}
#sidebar .nav-tags {display: none;list-style: none;padding: 0;max-height: 400px;overflow: scroll;overflow-x: hidden;margin: 0;}
#sidebar .nav-tags li a {text-decoration: none;color: #686868;display: block;padding: 9px;font-size: 12px;text-align: center;}
#sidebar .nav-tags li a:hover{color:#FFF;}
#sidebar .nav-tags li a .csz {font-size: 14px;margin-right: 8px;}
#sidebar .nav-tags::-webkit-scrollbar {width:5px;}
#sidebar .nav-tags::-webkit-scrollbar-track {background-color:#1E1E1E;-webkit-border-radius:2em;-moz-border-radius:2em;border-radius:2em;}
#sidebar .nav-tags::-webkit-scrollbar-thumb{background-color:#686868;-webkit-border-radius:2em;-moz-border-radius:2em;border-radius:2em;}

@media screen and (min-width: 1300px){
	#main{width:1050px;}
	.panl-item{width:25%}
	.main-img .img-item{width:50%}
}
@media screen and (max-width: 1299px) and (min-width: 992px){
	#main{width: 760px;}
	.main-img .img-item{width:50%}
	.panl-item{width:33.3333333%}
}
@media screen and (max-width: 991px) and (min-width: 758px){
	#wrap{margin-left:180px}
	#main{width: 580px;}
	#sidebar{width:180px}
	.panl-item{width:50%}
	.main-img .img-item{width:100%}
}
@media screen and (max-width: 757px){
	#wrap{margin-left:0}
	#main{margin: 0 10px;padding-top: 68px;}
	.panl-item{width:100%}
	.mobile,.btn-mobile-sidenav{display: block;}
	.sidehide{transform: translate(-230px, 0);transition: transform 430ms cubic-bezier(0.3, 0, 0, 1);}
	.sideshow{transform: translate(0, 0);transition: transform 430ms cubic-bezier(0.3, 0, 0, 1);}
}
@media screen and (min-height: 900px){
	#sidebar .nav-tags{max-height:400px}
}
@media screen and (min-height: 760px) and (max-height: 899px){
	#sidebar .nav-tags{max-height:320px}
}@media screen and (min-height: 630px) and (max-height: 759px){
	#sidebar .nav-tags{max-height:200px}
}
@media screen and (max-height: 629px){
	#sidebar .nav-tags{max-height:200px}
}