.captionbar{padding:0 19px;height: 100%;height: 100%;background: #2d2e30;}
.captionbar h3{height:45px;line-height:45px;font-size:20px;border-bottom:1px solid #4c4d4f;color:#fff;}
.captionbar .alert-word{color:#999;padding-top:10px;}
.captionbar .alert-word .u-icon{width:16px;height:16px;display: inline-block; vertical-align: middle; margin-right: 5px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA4RpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpiMTA2Y2VhZC03MDJjLTQ3NGItOWExZi0xZjkxYTg2OWNkN2IiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NkQ4QTMyNTk1N0Q0MTFFN0EwQUNFMDAyQURCQzhDRDUiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NkQ4QTMyNTg1N0Q0MTFFN0EwQUNFMDAyQURCQzhDRDUiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YTZlMmM5NTktYzJjOS1mNjRiLWJiZGYtYTIwNmVhYTQ5NDQwIiBzdFJlZjpkb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6Mzc5NzhkMzAtNTcyNy0xMWU3LTkxYWYtYWYyNTIxY2NiMDhhIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+28ABNQAAAVVJREFUeNqU07lKA1EUxvGZURNEfAIrU7lhRAIhoE2wiOgL2AdUFMQXccPCJbY+gYpFSKNFtHDBKNgIFr6BEowL/g98I5fL4HLgx0zuPeeEO3MmrBWLgRcDKGMSvVp7wDEquHOTI+c+hU3cYBl9SEu/1mxvC51+Ays+xALesYECuqWgNdubxYFqvhusYgJPyGMJdTxLXWt55di5V+IGg+rawjSunGOdSBy2N4VXzFltpAfWhm2v2GJM3LjGjmrK1qCkjf3g7xHnlqxBRj8u/tHgUtdM+y+JpwgT1jt0bUUaEovRhMTxhGdgMaTrY6QJs5hJSPTfQuDlVq3BHj70KrMJyf4RhpVrNRVr0NArTGsaR344gv3BkXKtphFPos15FT04wxpy6JKc1s6VU1NNEDpfY0rjOe99ZG58YlfFTf9rtFFe1BnXcY83vOBWa1mNcDMu+hJgAHxYSshUSk1cAAAAAElFTkSuQmCC) no-repeat;}


.captionlist{width:100%;height:100%;background:#3f3f3f;}
.captionlist h4{font-size:18px;color:#fff;height:40px;line-height:40px;text-align:center;}
.captionlist .record-detail{
    padding:0 15px;
    overflow-y:auto;
    /*立体滚动条背景颜色*/
    scrollbar-track-color: gray;
    /*滚动条的基色*/
    scrollbar-base-color:#555;

    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
.captionlist .record-detail p{
    color:#ccc;
    line-height:21px;
    margin-bottom: 20px;
    cursor: pointer;
}


.captionlist .record-detail .now{color:#ea7571;}


/*滚动条整体部分,必须要设置*/
.captionlist .record-scroll::-webkit-scrollbar{
    background-color: #333;
    width: 15px;
}
/*滚动条的轨道*/
.captionlist .record-scroll::-webkit-scrollbar-track{
    background-color: gray;
    border-radius: 3px;
}
/*滚动条的滑块按钮*/
.captionlist .record-scroll::-webkit-scrollbar-thumb{
    background-color: #555;
    border-radius: 3px;

}