*, *::before, *::after {box-sizing: border-box;}
html, body {height: 100%;display: flex;flex-direction: column;margin: 0;background: #f2f2f2;font-size: 14px;}
a {vertical-align: baseline;background: transparent;text-decoration: none;color: #333;cursor: pointer;}
ul, li, ol{list-style: none;padding: 0;margin: 0;}
p,h1,h2,h3,h4,h5,h6{margin:0;padding:0}

button, input, optgroup, select, textarea {margin: 0;font-family: auto;outline: 0;}
.tox-tinymce{border-radius: 0 !important;}
.container{
  width: 720px;
  margin: 0 auto;
}
.main{flex: 1 0 auto;}
/*row*/
.row{display: flex;flex-wrap: wrap;}
.row:after{display: table;content:"";clear: both;}
.row-1,.row-col-1{width:8.333333% !important;}
.row-2,.row-col-2{width:16.666667% !important;}
.row-3,.row-col-3{width:25% !important;}
.row-4,.row-col-4{width:33.333333% !important;}
.row-5,.row-col-5{width:41.666667% !important;}
.row-6,.row-col-6{width:50% !important;}
.row-7,.row-col-7{width:58.333333% !important;}
.row-8,.row-col-8{width:66.666667% !important;}
.row-9,.row-col-9{width:75% !important;}
.row-10,.row-col-10{width:83.333333% !important;}
.row-11,.row-col-11{width:91.666667% !important;}
.row-12,.row-col-12{width:100% !important;}
main.row-col-9{width:72% !important;}
aside.row-col-3{width:28% !important;}
.clear:after{
    display: table;
    content: "";
    clear: both;
}
hr {
    margin-top: 10px;
    margin-bottom: 10px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}
#content {
    flex: 1 0 auto;
}
footer{
  background: #fff;
  padding: 10px;
  line-height: 2;
  color: #555;
}

.comment_list .avatar{
    height: 30px;
    width: 30px;
    display: block;
    border-radius: 5px;
}
.comment_form a{
  color: #17a2f3;
}
.comment_form .put{
}
.comment_form .put .user{
    display: flex;
    align-items: center;
    margin-bottom: 5px;
}
.comment_form .put .user span{
    font-size: 14px;
    color: #979797;
}
.comment_form .put .avatar{
    height: 15px;
    width: 15px;
    margin-right: 5px;
    border-radius: 5px;
    display: none;
}
.comment_form .reply_ing{
    font-size: 14px;
    color: #b1daea;
    display: none;
    margin-bottom: 8px;
}
.comment_form .reply_no{
    color: #a8a8a8 !important;
    font-size: 14px;
    margin: 4px;
}
/*page*/
.pages{
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    margin-top: 10px;
    margin-bottom: 10px;
}
.pages li a{
    padding: 4px 12px;
    background: #fff;
    margin-left: -1px;
    border: 1px solid #dfdfdf;
    display: block;
} 
.pages li.active a{
    background: #dbc696;
    color: #fff;
}
.reply-kj{
    display: inline-block;
    background-color: #ff914d;
    color: #fff;
    border-radius: 3px;
    letter-spacing: 0.5px;
    padding: 8px 15px;
    
}
.sider{margin-left:25px}
@media (max-width: 640px) {
.sider{margin: 0;}
}
.top-3{color: #ff7575;}
.top-2{color:red}
.top-1{color:red}
.user-top{
  display: block;
  cursor: pointer;
  margin: 0;
  font-size: 13px;
  line-height: 1;
  padding: 6px 0;
  background: #dadada;
  white-space: nowrap;
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #4aafe3), color-stop(1, #99dcff));
  box-shadow: inset 0 1px 0 #82ddea, inset 0 -1px 2px #2fbaff;
  color: #fff;
}
.user-top a{
    padding: 3px 10px;
    display: inline-block;
    color: #fff;
}
.user-top a.active{
    color: #1e79a7;
    font-weight: bold;
}
.user-main{
    padding: 5px 0 15px;
    border-radius: 3px;
}
.user-main a{
    color: #1e79a7;
    width: auto;
}
.user-main .button{
    display: inline-block;
    cursor: pointer;
    margin: 0;
    font-size: 13px;
    line-height: 1;
    font-weight: bold;
    padding: 4px 6px;
    border: 1px solid #5ac4ff;
    border-radius: 2px;
    white-space: nowrap;
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #4aafe3), color-stop(1, #89d7ff));
    box-shadow: inset 0 1px 0 #a5e0ff, inset 0 -1px 2px #99d8f8;
    color: #fff;
}
.user-nav{
    background: #fff;
    margin-bottom: 1px;
    margin-top: 5px;
    border-radius: inherit;
}
.user-body{
    padding: 15px;
}
.user-body .profile{
    line-height: 2;
}
.user-body .profile .avatar{
    width: 60px;
    height: 60px;
    border-radius: 5px;
}
.user-body .profile li{
    border-bottom: 1px solid #efefef;
    padding: 6px 0;
}
.user-nav a{
    padding: 6px 0;
    display: inline-block;
    margin: 0 10px;
}
.user-nav .active{border-bottom: 1px solid #4482b3;}
.post_ub{
    font-size: 14px;
    margin-top: 5px;
    cursor: pointer;
}
.subtip{
    font-size: 14px;
    color: #f71e1e;
}
.links{
}
.links a{
    margin-right: 10px;
}
[class^="icon-"], [class*=" icon-"] {
    font-family: "iconfont" !important;
    font-weight: normal;
    font-style: normal;
    text-decoration: inherit;
    -webkit-font-smoothing: antialiased;
}
.fieldset a{
    color: #3a63d5;
    font-size: 13px;
}
textarea, input{
  border-radius: 3px;
  border: 1px solid #dedede;
  padding: 7px 10px;
  font-family: Helvetica, Arial, sans-serif;
}
.pager{
  padding: 8px 0;
  margin-bottom: 15px;
  text-align: center;
}
.pager .active{
  color: #fff;
  background: #17a2f3;
  text-align: center;
  border-radius: 3px;
}
.pager a, .pager span {
  display: inline-block;
  margin: 0 3px;
  padding: 2px 10px;
}

.pager span {
  color: #777;
}
.tagPostList{
  padding: 0 0px 10px;
}
.tagPostList li{
  float:left;
  padding: 2px 5px;
  margin: 0 5px 5px;
  font-size: 14px;
  color: #1ba8ac;
}
.tagPostList li.on{
  background: #e4e4e4;
  border-radius: 3px;
}
label{
  position:relative;
  margin-right: 0;
  padding-right: 0;
  cursor: pointer;
  display: inline-block;
}
label span{
  font-size: 14px;
  margin-left: 2px;
}
label input[type=radio]{
  /*clip: rect(0, 0, 0, 0);*/
  cursor: pointer;
  width: 13px;
  height: 13px;
}
/*other*/
.mx{margin:0 auto}
.inp{padding: 8px 8px;margin-bottom: 10px;border: 1px solid #ccc;border-radius: 3px;}
.popRemind{display:none;z-index:999;padding:4px;}
.popRemind .bg{z-index:-1;position:absolute;left:0;top:0;height:100%;width:100%;opacity:0.2;border-radius:4px}
.popRemind .conBox{background: #2ea5ff;border-radius:3px;padding: 8px 10px;font-size: 12px;}
.popRemind .error.conBox{background: #ff8181;}
.popRemind .con{font-size:14px;color:#FFFFFF;text-align:center}
.modal-open {
  overflow: hidden;
}

.modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  display: none;
  overflow: hidden;
  outline: 0;
}

.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}

.modal-dialog {
  position: relative;
  width: auto;
  margin: 0.5rem;
  pointer-events: none;
}

.modal.fade .modal-dialog {
  transition: transform 0.3s ease-out;
  transform: translate(0, -25%);
}

.modal.show .modal-dialog {
  transform: translate(0, 0);
}

.modal-dialog-centered {
  display: flex;
  align-items: center;
  min-height: calc(100% - (0.5rem * 2));
}

.modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  pointer-events: auto;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0.3rem;
  outline: 0;
}
.modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000;
}

.modal-backdrop.fade {
  opacity: 0;
}

.modal-backdrop.show {
  opacity: 0.5 !important;
}

.modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 0.4rem 0.8rem;
  border-bottom: 1px solid #e9ecef;
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
}

.modal-header .close {
  padding: 0.5rem;
  font-size: 18px;
  margin: -0.4rem;
  border: 0;
  background: #fff;
}

.modal-title {
  margin-top: 5px;
}

.modal-body {
  position: relative;
  flex: 1 1 auto;
  padding: 15px;
}

.modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 10px;
  border-top: 1px solid #e9ecef;
}

.modal-footer > :not(:first-child) {
  margin-left: .25rem;
}

.modal-footer > :not(:last-child) {
  margin-right: .25rem;
}

.modal-scrollbar-measure {
  position: absolute;
  top: -9999px;
  width: 50px;
  height: 50px;
  overflow: scroll;
}
.modal-content .button{
    padding: 5px 10px;
    border-radius: 5px;
}
.modal-content .button.close{
    background: #999999;
}
@media (min-width: 576px) {
  .modal-dialog {
    max-width: 500px;
    margin: 1.75rem auto;
  }
  .modal-dialog-centered {
    min-height: calc(100% - (1.75rem * 2));
  }
  .modal-sm {
    max-width: 300px;
  }
}
.show{display:block}
.fade.show {
    opacity: 1;
}
.fade{opacity: .5;
    transition: opacity .6s;
}
/* color */
.white{background: #fff;}
.mr-5{margin-right:25px}
.mr-4{margin-right:20px}
.mr-3{margin-right:15px}
.mr-2{margin-right:10px}
.mr-1{margin-right:5px}
.ml-5{margin-left:25px}
.ml-4{margin-left:20px}
.ml-3{margin-left:15px}
.ml-2{margin-left:10px}
.ml-1{margin-left:5px}

.pr-3{padding-right:15px}
.pr-2{padding-right:10px}
.pr-1{padding-right:5px}
.pl-3{padding-left:15px}
.pl-2{padding-left:10px}
.pl-1{padding-left:5px}

.mt-3{margin-top:15px}
.mt-2{margin-top:10px}
.mt-1{margin-top:5px}
.mb-3{margin-bottom:15px}
.mb-2{margin-bottom:10px}
.mb-1{margin-bottom:5px}

.pt-3{padding-top:15px}
.pt-2{padding-top:10px}
.pt-1{padding-top:5px !important}
.pb-3{padding-bottom:15px}
.pb-2{padding-bottom:10px}
.pb-1{padding-bottom:5px !important}

.px-0{padding:0 !important}

.text-r{text-align:right}
.text-l{text-align:left}
.text-c{text-align:center}
.float-r{float:right}
.float-l{float:left}

.d-none{display:none}
.x-none{display:none;}
.thread-user-info{
    font-size: 11px;
}
.thread-user-info .avatar{
    width: 30px;
    float: left;
    margin-right: 5px;
    border-radius: 5px;
}
.thread-user-info span{
    margin-right: 10px;
    color: #a5a5a5;
}
.thread-user-info .username{
    font-size: 13px;
    font-weight: bold;
}
.block{
  padding: 15px;
  background: #fff;
  background-color: #fff;
  margin-bottom: 10px;
  box-shadow: 3px 3px 10px rgb(224 224 224 / 10%);
}
@media (max-width: 640px){
  .container{width:100%;}
  .row>main {margin: 0 10px;}
  .row-col-1,.row-col-2,.row-col-3,.row-col-4,.row-col-5,.row-col-6,.row-col-7,.row-col-8,.row-col-9,.row-col-10,.row-col-11,.row-col-12{width:100% !important}
  main.row-col-9{width: 100% !important;}
  aside.row-col-3{width: 100% !important;}
  .links{padding-left:10px}
  .m-none{display: none !important;}
  .x-none{display: block !important}
  aside{padding-left: 0 !important;}
}