/* 雪碧图 */
.collect,.collect-active,.collect-num,.com-like,.com-like-active,.comment,.comment-active,.comment-num,.like,.look-num,.point,.qq,.qq-active,.qq-space,.qq-space-active,
.wb,.wb-active,.wx,.wx-active{position:absolute;background:url(../../../images/case/detail/case-xq.png) no-repeat;}
.collect{height:16px;width:17px;background-position:0 0;}
.collect-active{height:15px;width:17px;background-position:-26px 0;}
.collect-num{height:15px;width:16px;background-position:-51px 0;}
.com-like{height:14px;width:16px;background-position:-77px 0;}
.com-like-active{height:14px;width:16px;background-position:-102px 0;}
.comment{height:12px;width:16px;background-position:-127px 0;}
.comment-active{height:12px;width:16px;background-position:-150px 0;}
.comment-num{height:12px;width:16px;background-position:-174px 0;}
.like{height:22px;width:22px;background-position:-201px 0;}
.look-num{height:12px;width:16px;background-position:-233px 0;}
.point{height:4px;width:4px;background-position:-262px 0;}
.qq{left:46px;height:36px;width:36px;background-position:-279px 0;}
.qq-active{height:36px;width:36px;background-position:-324px 0;}
.qq-space{left:138px;height:36px;width:36px;background-position:-371px 0;}
.qq-space-active{height:36px;width:36px;background-position:-417px 0;}
.wb{left:92px;height:36px;width:36px;background-position:-463px 0;}
.wb-active{height:36px;width:36px;background-position:-508px 0;}
.wx{left:0px;height:36px;width:36px;background-position:-556px 0;}
.wx-active{height:36px;width:36px;background-position:-603px 0;}

/* 详情页中的标签、分享、收藏、点赞、评论 */

/* 案例标签 */
.label{
    height:26px;
    padding:60px 0 40px 0;
    border-bottom:1px solid #eee;
}
.label a{
    float:left;
    display:block;
    margin-right:10px;
    padding:6px 10px;
    border-radius:4px;
    color:#999;
    background:#F8F8F8;
}
.label a:hover{
    color:#fff;
    background:#FF8041;
}
/* 分享、收藏、点赞 */
.opertion{
    height:70px;
    margin-top:50px;
    color:#bbb;
}
.opertion .share-tab{
    float:left;
    width: 184px;
}
.opertion .share-tab .bdsharebuttonbox {
    position: relative;
}
.opertion .share-tab .bdsharebuttonbox::after{
    height:12px;
}
.opertion .share-tab .bdsharebuttonbox a {
    background-image: url('../../../images/case/detail/case-xq.png');
    padding-left: 0px;
    margin: 0;
    position: absolute
}
.opertion .share-tab a{
    float:left;
    display:block;
    width:36px;
    height:36px;
    margin-right:10px;
}
.opertion .share-tab p{
    margin-top:46px;
}
.opertion .share-tab .wx:hover{
    background-position:-603px 0;
}
.opertion .share-tab .qq:hover{
    height:36px;
    width:36px;
    background-position:-324px 0;
}
.opertion .share-tab .wb:hover{
    background-position:-508px 0;
}
.opertion .share-tab .qq-space:hover{
    background-position:-417px 0;
}
.opertion .like-tab{
    float:left;
    margin-left:211px;
    text-align:center;
}
.opertion .like-tab .like-ta{
    position:relative;
    display:block;
    width:70px;
    height:70px;
    border-radius:60%;
    background:#FF8041;
}
.opertion .like-tab .like-ta .like{
    top:19px;
    right:22px;
}
.opertion .like-tab .like-ta span{
    display:inline-block;
    margin-top:50px;
    color:#fff; 
}
.opertion .like-tab .like-ta:hover{
    background:#FF9763;
}
.opertion .like-tab .on{
    background:#eee;
}
.opertion .like-tab .on:hover{
    color:#666;
    background:#eee;
}
.opertion .like-tab .on span{
    margin-top:9px;
    color:#999;
}
.opertion .like-tab .like-ta .active{
    display:inline-block;
    width:100%;
    margin-top:22px;
    font-size:14px;
    color:#666;
}
.opertion .collect-tab{
    float:right;
}
.opertion .collect-tab .collect-ta{
    position:relative;
    display:block;
    width:90px;
    height:36px;
    margin-bottom:10px;
    border:1px solid #666;
    border-radius:4px;
    text-align:center;
    color:#666;
}
.opertion .collect-tab .collect-ta .collect{
    top:10px;
    right:53px;
}
.opertion .collect-tab .collect-ta span{
    display:inline-block;
    margin:13px 0 0 18px;   
}
.opertion .collect-tab .collect-ta:hover{
    border:1px solid #FF8041;
    background:#FF8041;
    color:#fff;
}
.opertion .collect-tab .collect-ta:hover .collect{
    background-position:-26px 0;
}
.opertion .collect-tab .on{
    border:1px solid #eee;
    background:#fff;
}
.opertion .collect-tab .on:hover{
    border:1px solid #eee;
    color:#666;
    background:#fff;
}
.opertion .collect-tab .collect-ta .active{
    margin-left:0;
}
.opertion .collect-tab p{
    text-align:right;
}

/* 评论 */
.comment-wrap{
    width:840px;
    margin-top:20px;
    padding:30px 30px 40px;
    border-radius:4px;
    font-size:14px;
    background:#fff;
}
.comment-wrap .com-enter{
    height:152px;
}
.comment-wrap .com-enter textarea{
    width:800px;
    height:64px;
    padding:20px;
    border-radius:4px;
    border:1px solid #FAFAFA;
    font-weight:400;
    line-height:20px;
    color:#666;
    background:#FAFAFA;
}
.comment-wrap .com-enter .com-button{
    float:right;
    display:block;
    width:90px;
    height:26px;
    margin-top:10px;
    padding-top:10px;
    border-radius:4px;
    text-align:center;
    color:#A9A9A9;
    background:#eee;
}
.comment-wrap .com-enter .com-button:hover{
    color:#fff;
    background:#FF8041;
}
.comment-wrap .com-list{
    margin-top:30px;
}
.comment-wrap .com-list .com-num{
    margin-bottom:10px;
}
.comment-wrap .com-list .com-num span{
    font-size:16px;
    color:#666;
}
.comment-wrap .com-list .com-num span+span{
    color:#bbb;
    margin-left:10px;
}
.comment-list .comment-item{
    padding:30px 0;
    border-bottom:1px solid #eee;
    overflow:hidden;
}
.comment-list .comment-item img{
    float:left;
    display:block;
    width:50px;
    height:50px;
    border-radius:50%;
}
.comment-list .comment-item .comment-tab{
    float:left;
    width:770px;
    margin-left:20px;
}
.comment-list .comment-name span{
    display:inline-block;
    margin-right:5px;
    font-size:14px;
    font-weight:bold;
    color:#bbb;
}
.comment-list .comment-name .re{
    color:#333;
}
.comment-list .comment-item .comment-name time{
    display:inline-block;
    margin-left:15px;
    font-size:12px;
    color:#ccc;
}
.comment-list .comment-item .text{
    width:770px;
    padding:19px 0 20px;
    font-size:14px;
    font-weight:400;
    line-height:1.6;
}
.comment-list .comment-item .comicons{
    width:100%;
    overflow:hidden;
}
.comment-list .comment-item .ricons{
    float:right;
}
.comment-list .comment-item .ricons .comment{
    display:inline-block;
    vertical-align:middle;
    position:static;
    margin-top:2px;
}
.comment-list .comment-item .ricons .comment:hover{
    background-position:-150px 0;
}
.comment-list .comment-item .ricons .com-like-ico{
    display: inline-block;
    vertical-align: middle;
    width:16px;
    height:14px;
    margin-left:15px;
    padding-left:21px; 
    color:#bbb;
    background:url("../../../images/case/detail/com-like.png") no-repeat;
}
.comment-list .comment-item .ricons .com-like-ico:hover{
    color:#FF8041;
    background:url("../../../images/case/detail/com-like-active.png") no-repeat;
}
.comment-list .com-reply{
    width:730px;
    margin-top:15px;
    padding:10px 20px 0;
    border-radius:4px;
    background:#FAFAFA;
}
.comment-list .com-reply li{
    padding:20px 0;
    border-bottom:1px dashed #ddd;
}
.comment-list .com-reply li:last-child{
    border-bottom:none;
}
.comment-item input{
    width:640px;
    height:36px;
    padding-left:15px;
    border-radius:4px;
    font-weight:400;
    border:1px solid #e8e8e8;
}
.comment-item .reply-btn{
    display:inline-block;
    width:58px;
    height:23px;
    margin-left:10px;
    padding-top:7px;
    border-radius:4px;
    font-size:14px;
    text-align:center;
    color:#A9A9A9;
    background:#eee;
}
.comment-item .on{
    color:#fff;
    background:#FF8041;
}
.comment-item .comment-tab .reply-bt{
    margin-top:20px;
}
.comment-item .comment-tab .reply-bt input{
    width:680px;
}
.com-list .more-com{
    display:block;
    width:107px;
    height:26px;
    margin:40px auto 0;
    padding-top:10px;
    border-radius:18px;
    border:1px solid #666;
    text-align:center;
    font-size:14px;
    color:#666;
}
.com-list .more-com:hover{
    color:#fff;
    border:1px solid #FF8041;
    background:#FF8041;
}