.article-comment .comment-box .item-right .nickname .gold img{
        width: 30px;
        margin-right: 5px;
    }
    
    .article-box .article-right img {
        width: 22px;
        margin-right: 10px;
    }
    
    .article-box .article-right span {
        color: #777;
        font-size: 18px;
    }
    
    .article-middle {
        padding: 15px;
        height: 2000px;
        overflow: hidden;
        position: relative;
    }
    .article-middle.active{
        height: auto;
    }
    .article-middle .article-desc {
        color: #999;
        margin-bottom: 25px;
        font-size: 16px;
    }
    
    .article-comment {
        height: 1300px;
        overflow: hidden;
        position: relative;padding-right: 5px;
    }
    .article-comment.active{
        height: auto;
    }
    .comment-hr{
        width: 100%;
        height: 5px;
        background: #f3f3f3;
    }
    .article-comment .comment-top {
        font-size: 22px;
        padding: 10px 0px;color: #222;
    }
    .article-comment .comment-box{
        padding: 10px 0px;
    }
    .article-comment .comment-box .comment-item{
        display: flex;
        justify-content: space-between;
        margin-bottom: 20px;
    }
    
    .article-comment .comment-box .item-left    {
        width: 30px;height:30px;
        position: relative;
    }
    
    .article-comment .comment-box .item-left img {
        width: 30px;height:30px;
        border-radius: 15px;
    }
    .article-comment .comment-box .item-left img.vip{
        position: absolute;
        width: 15px;
        height: auto;
        left: 27.5px;
        top: 27.5px;
    }
    .article-comment .comment-box .comment-item-reply .item-left img.vip{
        left: 20px;
        top: 20px;
    }
    
    
    .article-comment .comment-box .item-right {
        width: calc(100% - 45px);
        position: relative;
    }
    .article-comment .comment-box .comment-item-reply .comment-item-box{
        padding-left: 50px;
    }
    .article-comment .comment-box .comment-item-reply .item-left{
        width: 32px;
    }
    .article-comment .comment-box .comment-item-reply .comment-item-box:last-child .item-right:last-child:after{
        display: none;
    }
    /*.article-comment .comment-box .item-right:after{
        content: '';
        display: block;
        border-bottom: 1px solid #f3f3f3;
        width: 100%;
        position: absolute;
        bottom: -10px;
        left: 0;
    }*/
    
    .article-comment .comment-box .item-right .nickname {
        font-size: 16px;
        color: #777;
        margin:0 0 8px;color: #406599;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    
    .article-comment .comment-box .item-right .nickname .gold{
        font-size: 16px;
        display: flex;
        align-items: center;
        background: #f3f9ff;
        color: #55a7fa;
        padding: 1px 10px;
        border-radius: 20px;
        margin-left: 5px;
    }
    
    .article-comment .comment-box .item-right .item-comment {
        font-size: 16px;color:#333;line-height:22px;
        margin-bottom: 8px;
    }
    .article-comment .comment-box .item-right .item-timer{
        display: flex;
        align-items: center;
        /*justify-content: space-between;*/
        justify-content: flex-end;
        color: #777;
    }
    .article-comment .comment-box .item-right .item-timer .action-box{
        display: flex;
        align-items: center;
    }
    .article-comment .comment-box .item-right .item-timer .action-box .star img.active,
    .article-comment .comment-box .item-right .item-timer .action-box .star.active img{
        display: none;
    }
    .article-comment .comment-box .item-right .item-timer .action-box .star img,
    .article-comment .comment-box .item-right .item-timer .action-box .star.active img.active{
        display: block;
    }
    .article-comment .comment-box .item-right .item-timer .action-box .star{
        width: 50px;
        height: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }
    .article-comment .comment-box .item-right .item-timer .action-box span.likes{
        color: #777;
        font-size: 14px;
    }
    .article-comment .comment-box .item-right .item-timer .action-box img{
        width: 15px;  
        height: auto;       
    }

    .nocomment{
        color: #999;
        font-size: 14px;
        margin-bottom: 20px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .nocomment img{
        width: 80px;
        margin-bottom: 10px;
    }
    .placeholder{
        height: 50px;
    }
    .article-content font{
        font-size: inherit !important;
    }
    .article-content img{width:100%;}
    .article-content img.large{
        width: 100% !important;
    }

    .article-cover{
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
    }
    .article-cover .cover-hr{
        height: .3rem;
        background: linear-gradient(rgba(255,255,255,0),rgb(255, 255, 255));
    }
    .article-cover div{
        padding: 30px 0;
        color: #55a7fa;
        cursor: pointer;
        font-size: 14px;
        background: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .article-cover div img{
        width: 22px;
    }
    .article-cover div.cover-bottom{
        color: #777;
    }
    .article-recom{
        padding: 10px 15px;
    }
    .article-recom .recom-title{
        font-size: 14px;
        color: #333;
        font-weight: 600;
        display: flex;
        align-items: center;
        margin-bottom: 10px;
    }
    .article-recom .recom-title img{
        width: 30px; 
        margin-right: 10px;
    }
    .article-recom .recom-item-box{
        font-size: 14px;
        color: #555;
    }
    .article-recom .recom-item-box .recom-item{
        padding: .1rem 0;
        text-align: left;
        display: flex;
        align-items: flex-start;
        border-bottom: 1px solid #f3f3f3;
    }
    .article-recom .recom-item-box .recom-item span{
        display: -webkit-box;
        -webkit-box-origin: verticle;
        -webkit-line-clamp: 2;
        overflow: hidden;
        text-overflow: ellipsis;
        /*max-height: .5rem;*/
        flex: 1;
    }
    .article-recom .recom-item-box .recom-item:before{
        content: '';
        display: inline-block;
        width: 5px;
        height: 5px;
        background: #555;
        border-radius: 50%;
        margin-right: 10px;
        margin-top: 12px;
    }

    .comment-sub{width:100%;height:170px;position:relative;}
    .comment-sub .comment-sub-tb{width:100%;height:120px;border: 1px solid #eee;
        border-radius: 15px 0 15px 0;
        background: #fafafa;}
    .comment-sub .comment-sub-tb .comment-texta{width:100%;height:100%;border: none;
        background: none;font-size: 16px;
        padding: 10px;color: #333;
        border-radius: 15px 0 15px 0;}
    .comment-sub .com-texta-n{position:absolute;right:10px;top:100px;text-align:right;width:100px;height:20px;
        z-index: 6;color:#333;
        font-size: 12px;}
    .comment-sub .com-sub-btn{width:96px;height:40px;line-height:40px;margin:10px 0;
        float:right;text-align:center;border-radius: 15px 0 15px 0;background:#589ffb;color:#fff;font-size:14px;
        cursor: pointer;
    }

    .modal-dialog{
        width:400px;height:auto;
        margin:0 auto;
        background: #fff;border-radius:6px;padding:20px;box-sizing:border-box;
    }
    .modal-header{position:relative;height: 50px;}
    .modal-body{padding-bottom:40px;}
    .modal-header .close{background:none;border:none;font-size:32px;float: right;color: #666;}
    .modal-c-t{text-align:center;line-height:30px;color:#333;font-size:22px;margin: 20px 0;}
    .modal-c-d{text-align:center;line-height:30px;color:#999;font-size:16px;margin: 20px 0;}
    .conboxli{display:flex;flex-direction:row;justify-content:space-around;align-items:center;margin:50px 0;}
    .conboxli .ctitle{width:100px;text-align:center;}
    .conboxli .ctitle img{width:70px;margin-bottom:10px;}