.layui-container{width:100%;max-width:1024px;}

.breadcrumb{margin-top: 10px;background: #f5f5f5;padding: 5px;border: 1px solid #ddd;visibility: visible}
.mainleft,.mainright{margin-top:82px;padding: 5px;}
.article_list .item{
    margin-bottom:30px;
    border:1px dotted #eee;
    padding:5px;
}
.article_list .item:hover{
    border:1px solid #eee;
}
.article_list .item .title{
    overflow:hidden;
    text-overflow: ellipsis;
}
.article_list .item .title a{
    font-size:16px;
    font-weight:500;
}
.article_list .item .title a:hover{
    color:#1c86d1;
}
.article_list .item .content{
    overflow:hidden;
    text-overflow: ellipsis;
    margin:10px 0;
    text-indent:20px;
    color:#999;
}
.article_list .item .info{
    color:#333;
}
.page_content {
    word-break:break-all;
}
.page_content img{
    max-width:100%;
}
.article_content h1{
        font-size: 37px;
        font-weight: 600;
        line-height: 56px;
        color: #000;
}
.article_content .article-meta {
    margin:16px 0 36px;
    font-size:14px;
    line-height:20px;
    color:#707070
   }
   .article_content .article-meta span {
    display:inline-block;
    cursor:auto
   }
   .article_content .article-meta .original-tag {
    margin:1px 8px 1px 0;
    border-radius:3px;
    padding:1px 4px;
    font-size:12px;
    line-height:16px;
    color:#707070;
    background:#f2f2f2
   }
   .article_content .article-meta .dot {
    display:inline-block;
    margin:0 4px
   }
.article_content .content{
    word-break:break-all;
}
.article_content .content img{
    max-width:100%;
}

.user-info {
    text-align: center;
   
}
.user-info .user-avatar {
    display:block;
    width:60px;
    height:60px;
    margin:auto;
    position:relative
   }
   .user-info .user-avatar {
    display:block;
    width:60px;
    height:60px;
    margin:auto;
    position:relative
    border: 1px solid rgba(119, 127, 146, .10);
    border-radius: 50%;
   }
   .related-title {
    margin:36px 0 8px;
    font-size:14px;
    line-height:20px;
    font-weight:500;
    letter-spacing:.02em;
    color:#222;
    text-align:center;
    position:relative
   }
.related-title:before {
    display:block;
    content:"";
    width:100%;
    height:1px;
    background-color:#f2f2f2;
    position:absolute;
    top:50%;
    z-index:-1;
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    transform:translateY(-50%)
   }
   .related-title span {
    padding:0 18px;
    background-color:#fff
   }
 .related-list-item {
    padding:16px 0;
    overflow:hidden
   }
  .related-list-item .left-img {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:96px;
    height:72px;
    margin-right:12px;
    border-radius:4px;
    border:1px solid #f2f2f2;
    overflow:hidden;
    float:left
   }
  .related-list-item .left-img:hover .pic {
    -webkit-transform:matrix(1.04,0,0,1.04,0,0);
    -moz-transform:matrix(1.04,0,0,1.04,0,0);
    transform:matrix(1.04,0,0,1.04,0,0);
    -webkit-backface-visibility:hidden;
    -moz-backface-visibility:hidden;
    backface-visibility:hidden
   }
   .related-list-item .left-img .pic {
    display:block;
    width:100%;
    height:100%;
    background-size:cover;
    background-position:50%;
    -webkit-transition:all .5s ease-out .1s;
    -moz-transition:all .5s ease-out .1s;
    transition:all .5s ease-out .1s
   }

 .related-list-item .right-content {
    height:72px;
    display:-moz-box;
    display:-ms-flexbox;
    display:flex;
    -moz-box-orient:vertical;
    -moz-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    -moz-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between
   }
   .related-list{

    margin: 10px 0 18px;
   }

   .pnArt {
    padding:20px  0 0px 0 
   }
   .pnArt a {
    font-size:16px;
    line-height:40px
   }
   .preArt {
    border-bottom:#dcdcdc solid 1px
   }
   .nextArt {
    line-height:40px
   }
.mainright .box{
    border:1px dotted #eee;
    padding:5px;
    margin-bottom:20px;
}
.mainright .box .title{
    font-size:16px;
    font-weight:500;
    margin-bottom:5px;
    color:#1c86d1;
}
.mainright .box li{
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
}
.mainright .box li.active a{
    color:#1c86d1;
}
.mainright .box li a{
    line-height:1.5;
}
.pagelist a{border: 1px solid #C9C9C9;background-color: #fff;color: #555;display: inline-block;height: 30px;line-height: 30px;padding: 0 10px;font-size: 12px;white-space: nowrap;text-align: center;border-radius: 2px;cursor: pointer;outline: 0;-webkit-appearance: none;-webkit-transition: all .3s;box-sizing: border-box;vertical-align: middle;font-style: inherit;font-weight: inherit;}
.pagelist a+a{margin-left:5px}
.pagelist a.active,.pagelist a:hover{background-color: #1c86d1;color:#fff;border: 1px solid #1c86d1;}


@media screen and (max-width: 992px){
  .header-container{padding:0}
  
}