@charset "UTF-8";
body, html{ width:100%; }
body{ background-color: #fff; font-size: 14px; line-height: 140%; font-family:"Microsoft Yahei",Helvetica,Arial,sans-serif;line-height:1.5; color: #757575;}
body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div,tr{ margin:0; padding:0; font-weight:normal;}
input,select{ font-size:12px; vertical-align:middle; border:none;}
ul,li,ol,li{ list-style-type:none;}
img{ border:0 none;}
p{ margin-bottom: 10px;}
.down-ico{background-image:url(../images/down.png);}
.comment-ico{background-image:url(../images/comment.png);}
.time-ico{background-image:url(../images/time.png);}
.book-ico{background-image:url(../images/d.png);}
.search-ico{background-image:url(../images/search.png);}
/* 页 */
*{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box}
*,:after,:before{ -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}
.page{ padding-top: 86px;}
.page-bd{ position: relative; margin-right: auto; margin-left: auto;}
.page-bd:before,.page-bd:after,.row:before,.row:after,.clearfix:before, .clearfix:after{ display: table; content: " "; clear: both;}
@media (min-width: 1024px){ .page-bd{ width: 768px;}}
/* 文本 */
h1{ font-size: 26px; line-height: 32px;}
h2{ font-size: 24px; line-height: 28px;}
h3{ font-size: 18px; line-height: 22px;}
h4{ font-size: 16px; line-height: 18px;}
h5{ font-size: 14px; line-height: 16px;}
h6{ font-size: 12px; line-height: 14px;}
h1,h2,h3,h4,h5,h6{ font-weight: 400; margin-bottom:10px;}
.text-center{ text-align: center;}
.text-red{ color: #f00;}
.text-blue{ color:#00f;}
.text-muted{ color: #333;}
.text-link{ color: #00f;}
.split-line{ position: relative; display: inline-block; margin-right: 20px; height: 14px; vertical-align: -2px;}
.split-line:before{ content: " "; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; border-left: 1px solid rgba(0,0,0,0.1); border-left: 1px solid rgba(0,0,0,0.1); color: rgba(0,0,0,0.1); -webkit-transform-origin: 0 0;  transform-origin: 0 0; -webkit-transform: scaleX(0.5); transform: scaleX(0.5);}

/* 按钮 */
button{ border-color: transparent; background: none; }
a,button{ text-decoration:none; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0); color: #333;}
a:focus,a:hover,a:active,button:focus,button:hover,button:active{ cursor: pointer; text-decoration: none; color: #f00;}
.btn{ display: inline-block; padding: 10px 25px; border-radius: 30px; color: #fff;}
.btn.btn-mini{ padding: 6px 12px;font-size: 12px;}
.btn.btn-width{ min-width: 160px;text-align: center;}
.btn:hover,.btn:active,.btn:focus{ color: #fff;}
.btn-blue,.btn.blue{ background-color: #00f;}
.btn-red,.btn.red{ background-color: #f00;}
.btn-border{ border: 1px solid #f7f7f7; color: #ededed;}
.btn-default{ background-color: #f7f7f7; border: 1px solid #f7f7f7; color: #ededed;}
.btn-default,.btn-border,.btn-default:hover,.btn-default:active,.btn-default:focus,.btn-border:hover,.btn-border:active,.btn-border:focus{ color: #ededed;}
.btn:hover{ box-shadow: 0 5px 10px rgba(0,0,0,.05);}

/* 图片 */
img{ max-width: 100%; border: 0; vertical-align:middle}
img.img-radius{ border-radius: 10px;}

/* 表格 */
select{cursor:pointer;border:none;outline:none;}
input,textarea{outline:medium none; outline: none; -webkit-tap-highlight-color: rgba(0,0,0,0);}
input.form-control,input.btn{outline: 0px; -webkit-appearance:none;}
input[type="checkbox"]{vertical-align:-2px;}
.form-control{ display:block; width:100%; height: 40px; padding: 0 20px; font-size:12px; line-height: 20px; border-radius: 8px; background-color:rgba(0,0,0,0.3); border: 1px solid #00f; color: #ededed;}
.form-control:active,.form-control:focus{ outline: none; border: 1px solid 00f;}
textarea.form-control{ height: auto; padding: 6px 15px;}
.search-form{ position: relative;}
.search-form .submit{ position: absolute; top: 0; right: 0; border-radius: 0 5px 5px 0; z-index: 3; padding: 10px 18px; background-color: #00f; color: #fff;}

/* table */
table{padding: 15px; border-collapse:collapse;border-spacing:0;table-layout:fixed;max-width:100%;margin-bottom:20px;table-layout:fixed;background-color: #f7f7f7;}
tbody>tr>td,tbody>tr>th,tfoot>tr>td,tfoot>tr>th,thead>tr>td,thead>tr>th{ border:1px solid rgba(0,0,0,0.1); padding:10px;vertical-align:middle;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}

/* 导航 */
.nav-tabs{ position: relative; display: -webkit-box; display: -webkit-flex;display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center;}
.nav-tabs li{ position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1;text-align: center;}
.nav-tabs li a{ display: inline-block; padding-bottom: 12px; font-size: 16px;}
.nav-tabs li::before {content: ""; display: table; width: 0; height: 3px; border-radius: 3px 3px 0 0; opacity: .1; background:  #00f; position: absolute; left: 50%; bottom: 0; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s;}
.nav-tabs li:hover::before,.nav-tabs li.active::before { width: 32px; margin-left: -16px; opacity: 1;}

/* 头部 */
.header{ position: fixed; top: 0; z-index: 999; width: 100%; background-color: #FAFEFF; box-shadow: 0 2px 5px rgb(0,0,0,0.1);}
.header_hd{ padding-top: 10px; margin-right: 10px;}
.header_hd img{ width: 40px;}
.header_bd,.header_ft{ padding: 10px 0;}
.header_bd .icon,.header_ft .icon{ display: inline-block; margin-left: 25px; font-size: 24px;}

/* 菜单 */
.nav-menu li{ position: relative;}
.nav-menu li a{ display: block; padding: 12px 0; font-size: 18px; color:#fff;}
.nav-menu li.active > a{ color: #6467f0;}
.nav-menu li ul.child li{ padding-left: 15px;}
.nav-menu li:before{ content: " "; position: absolute; left: 0; top: 0; right: 0; height: 1px; border-top: 1px solid rgba(0,0,0,0.1); border-top: 1px solid rgba(255,255,255,0.5); -webkit-transform-origin: 0 0;  transform-origin: 0 0; -webkit-transform: scaleY(0.5); transform: scaleY(0.5);}
.nav-menu li:first-child:before{ display: none;}
.nav-p{ position: relative; padding: 30px; margin-bottom: 30px; }


/* 面板 */
.panel{ position: relative; padding: 30px; margin-bottom: 30px; background-color:#fff;border: 1px solid #eee;}
.panel.bg{ background-color: #f00}
.panel_hd{ position: relative; margin-bottom: 15px;}
.panel_hd:after{content: " "; position: absolute; left: 0; bottom: 0; right: 0; height: 1px; border-bottom: 1px solid rgba(0,0,0,0.1); border-bottom: 1px solid rgba(0,0,0,0.1); -webkit-transform-origin: 0 100%; transform-origin: 0 100%; -webkit-transform: scaleY(0.5); transform: scaleY(0.5);}
.panel_hd h3{ padding-bottom: 15px;}
.panel_hd .more{ font-size: 12px; color: rgba(0,0,0,0.5);}
.panel_bread{ padding-bottom: 15px; color: rgba(0,0,0,0.5);}
.panel_bread a,.panel_bread .icon{ font-size: 12px; color: rgba(0,0,0,0.5);}
.panel_ft{ position: relative; margin-top: 30px; padding-top: 30px;}
.panel_ft:before{ content: " "; position: absolute; left: 0; top: 0; right: 0; height: 1px; border-top: 1px solid rgba(0,0,0,0.1); border-top: 1px solid rgba(0,0,0,0.1); -webkit-transform-origin: 0 0;  transform-origin: 0 0; -webkit-transform: scaleY(0.5); transform: scaleY(0.5);}

/* 媒体 */
.media-box{ position: relative; padding: 15px; margin-top: 6px;background-color: #fff;border-radius: 0px; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; transition:all .3s;border-bottom: 1px solid #eee;}
.media-box_hd{ -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0;}
.media-box_desc{ margin-bottom: 10px; color: rgba(0,0,0,0.5);}
.media-box_time{ color: rgba(0,0,0,0.5);}
.media-box_time .down-ico{display:inline-block;margin-right:3px;width:16px;height:16px;background-size:100%;background-repeat:no-repeat;vertical-align:-3px;}
.media-box_time .time-ico{display:inline-block;margin-right:3px;width:16px;height:16px;background-size:100%;background-repeat:no-repeat;vertical-align:-3px;}
.media-box_bd{ width: 65px; margin-left: 20px;}
.media-box_bd img{ max-width: 100%;}
.media-box_title{ color:#00f; font-size:22px;}
/* 文章 */
.article_content h1,.article_content h2,.article_content h3,.article_content h4,.article_content h5,.article_content h6{ font-weight: bold;color:#000;}
.article_content a{ color: #00f;}
.article_content a:hover{ color: #f00;}
.article_content a:active{ color: grey;}
.article_content p{ overflow:hidden;letter-spacing:0px;line-height:38px;font-size:18px;color:#333; }
.article_content img{ max-width: 100%; cursor: -webkit-zoom-in; cursor: zoom-in;}
.article_content ol li { list-style: decimal; padding-left: 3px}
.article_content ul li{ list-style-type: disc;}
.article_desc,.tzt-article_content blockquote{ padding: 30px; background-color: #f7f7f7; border-radius: 10px;}
.article_tag{ margin-bottom: 15px;}
.article_title{ overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:32px;margin: 22px 0;text-align: center; font-weight:bold;}
/* 评论 */
.comment-box{ position: relative; padding: 15px; margin-top: 15px;background-color: #f7f7f7;border-radius: 10px; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: initial; -webkit-align-items: initial; align-items: initial; transition:all .3s;}
.comment-box_bd{-webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-left: 15px;}
.comment-box_hd{ width: 42px;}
.comment-box_hd img{ border-radius: 50%;}
.comment-box.active{ margin-top: 15px; padding: 15px; background-color: #fff;}
.comment-box.active .comment-box_bd{ margin: 0;}
.comment-box.active .comment-box_user{ font-size: 12px;}
.comment-box.active .comment-box_user img{ border-radius: 50%;}
.comment-box.child{ padding: 10px 0 0; margin-top: 10px;}
.comment-box.child:first-child{ margin-top: 10px;}
.comment-box.child:before{ content: " "; position: absolute; left: 0; top: 0; right: 0; height: 1px; border-top: 1px solid rgba(0,0,0,0.1); border-top: 1px solid rgba(0,0,0,0.1); -webkit-transform-origin: 0 0;  transform-origin: 0 0; -webkit-transform: scaleY(0.5); transform: scaleY(0.5);}

/* 页码 */
.pagination{ text-align: center;}
.pagination li{ display: inline-block; margin: 5px;}
.pagination li a{ padding: 6px 12px; border-radius: 4px; background-color:#00f; color: #fff;}
.pagination li a:hover{ padding: 6px 12px; border-radius: 4px; background-color:#f00; color: #fff;}
.pagination li.active a{ background-color:  #f00; color: #fff;}

/* 对话 */
.dialog{position:fixed;z-index:5000;-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s;background-color:rgba(0,0,0,0.7); color:#fff;overflow-y: auto;}
.dialog .panel{ background: none;}
.dialog.bottom{left:0;right:0;bottom:0;min-height:255px;max-height:75%;-webkit-transform:translateY(100%);transform:translateY(100%)}
.dialog.right{top:0;right:0;bottom:0;min-width:255px;max-width:75%;-webkit-transform:translateX(100%);transform:translateX(100%)}
.dialog.bottom.show{-webkit-transform:translateY(0);transform:translateY(0)}
.dialog.right.show{-webkit-transform:translateX(0);transform:translateX(0)}

/* 更多 */
.code{ width: 240px;position: absolute;top: 86px; right: -270px;}
.link li{ float: left; margin: 0 10px 10px 0;}
.footer{ padding-bottom: 25px;}
.mt15{ margin-top: 15px;}
.mb15{ margin-bottom: 15px;}
.pull-left{ float: left !important;}
.pull-right{ float: right !important;}
.margin-0{ margin: 0 !important;}
.fixed{ position: fixed;top: 0;left: 0;right: 0;}
.mask{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1000;background-color:rgb(0,0,0,0.6)}
.backtop{ position: fixed; right: 30px; bottom: 30px; z-index: 998; width: 50px; height: 50px; line-height: 50px; text-align: center; background-color: rgb(0,0,0,0.1); }
.icon-collection{ color:#f00 ;}
.icon-delete{ color:#f00 ;font-size: 32px;}
@media (min-width: 1024px){
	.panel{ border-radius: 10px;}
	.media-box:hover{ -webkit-box-shadow:0 34px 20px -24px rgba(136,161,206,0.3); box-shadow:0 34px 20px -24px rgba(136,161,206,0.3); -webkit-transform:translateY(-5px); transform:translateY(-5px); -ms-transform:translateY(-5px); }
	.comment_input{ display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center;}
	.comment_input p{-webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0;}
	.comment_input p.center{ padding: 0 10px;}
}
@media (max-width: 1024px){
	h1{ font-size:28px;}
	h3{ font-size:20px;}
	.page{ padding-top: 56px;}
	.m-hidden{ display: none !important;}
	.header{ padding: 0 15px;}
	.header_bd .icon,.header_ft .icon{ margin-left: 15px;}
	.nav-tabs li a{ font-size: 14px;}
	.panel,.article_desc,.article_content blockquote{ padding: 15px;}
	.panel_ft{ padding-top: 15px; margin-top: 15px;}
	.media-box{ padding: 15px;margin-top: 15px;}
	.media-box_bd{ width: 50px; margin-left: 10px;}
	.media-box_time{ font-size: 12px;}
	.pagination li a{ border-radius: 2px; font-size: 12px;}
	.backtop{ right: 15px; bottom: 15px; width: 35px; height: 35px; line-height: 35px; border-radius: 5px;}
}