html,
body {
    height: 100%;
    min-width: 1000px;
    min-height: 640px;
}

body {
    background: url("../images/bg.png");
    background-size: 100% 100%;
}

.container {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -400px;
    margin-top: -300px;
    width: 800px;
    height: 600px;
    border: 1px solid #5b7fab;
    background: #fff;
    border-radius: 4px;
}

.head {
    height: 51px;
    background: #5b7fab;
    border-radius: 4px 4px 0 0;
    line-height: 50px;
    color: #fff;
}

.huamn-name {
    float: left;
    margin-left: 15px;
    margin-top: -16px;
    padding-top: 16px;
    padding-left: 90px;
    font-size: 16px;
   // background: url("../images/service-icon.png") no-repeat left;
}

.head-operation {
    float: right;
}

.head-operation a {
    float: left;
    width: 80px;
    padding-top: 27px;
    margin-left: 1px;
    line-height: 24px;
    background-color: #6287b3;
    background-repeat: no-repeat;
    background-position: center 9px;
    text-align: center;
}

.head-operation a.leave {
    background-image: url("../images/icon-leave.png");
}

.head-operation a.exit {
    /* background-image: url("../images/icon-exit.png"); */
    background-image: url("../images/icon-user.png");
}

.head-operation a:hover {
    background-color: #698eb9;
}


.wechatcs-main-area {
    position: absolute;
    top: 51px;
    bottom: 0;
    left: 0;
    width: 100%;
}

.wechatcs-messages-welcome {
    margin: 5px 10px;
    padding: 0 20px;
    background: #edf3ff;
    line-height: 30px;
    font-size: 13px;
    color: #666;
}

.wechatcs-messages-wrapper {
    position: absolute;
    top: 0;
    bottom: 185px;
    left: 0;
    width: 100%;
    border-bottom: 1px solid #e2e6ee;
    overflow: auto;
    padding: 0 6px;
    text-align: center;
}

.wechatcs-messages-list {
    overflow: hidden;
    text-align: left;
}

.wechatcs-message-item {
    overflow: hidden;
    margin: 24px 0;
}

.wechatcs-message-content {
    overflow: hidden;
    padding-top: 3px;
}

.wechatcs-message-name {
    line-height: 1;
}

.wechatcs-message-time {
    /* display: none; */
    line-height: 1;
    color: #999;
}

.other .wechatcs-message-content {
    padding-left: 16px;
    padding-right: 62px;
}

.other .wechatcs-message-name,
.other .wechatcs-message-time {
    float: left;
    margin-right: 10px;
}

.me .wechatcs-message-content {
    padding-right: 16px;
    padding-left: 62px;
}

.me .wechatcs-message-name,
.me .wechatcs-message-time {
    float: right;
    margin-left: 10px;
}

.wechatcs-message-inner {
    line-height: 24px;
    padding: 8px 10px;
    margin-top: 11px;
    border-radius: 4px;
    position: relative;
    word-break: break-all;
}


.wechatcs-message-avatar {
    width: 46px;
    height: 46px;
    margin-top: 11px;
    background: #ffffff;
    overflow: hidden;
}

.wechatcs-message-avatar img {
    vertical-align: bottom;
    width: 100%;
    height: 100%;
}

.other .wechatcs-message-avatar {
    float: left;
}

.me .wechatcs-message-avatar {
    float: right;
}

.session-image-preview img {
    display: none;
}

a[data-fancybox].session-image-preview {
    display: inline-block;
    width: 24px;
    height: 24px;
    vertical-align: middle;
    background-color: #000;
    margin-top: -3px;
    background: url("../images/main/img.png") no-repeat;
    background-size: 100% 100%;
}

.other .wechatcs-message-inner {
    float: left;
    background: #f5f7fa;
    border-radius: 0 4px 4px 4px;
    border: 1px solid #ebeff5;
    max-width: 80%;
}

.me .wechatcs-message-inner {
    float: right;
    background: #e5efff;
    border-radius: 4px 0 4px 4px;
    border: 1px solid #d6e6ff;    
    max-width: 90%;
    
}


.other .wechatcs-message-inner {
    float: left;
    margin-left: 10px;
}
.wechatcs-message-inner img{
    max-width:100%
}
.me .wechatcs-message-inner {
    float: right;
    margin-right: 10px;
}

.other .wechatcs-message-inner:after {
    left: -7px;
    background: url("../images/main/inner-other.png")
}

.me .wechatcs-message-inner:after {
    right: -7px;
    background: url("../images/main/inner-me.png")
}

.wechatcs-message-send-state {
    position: absolute;
    top: 50%;
    width: 18px;
    height: 18px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    margin-top: -9px;
}

.other .wechatcs-message-send-state {
    right: -28px;
}

.me .wechatcs-message-send-state {
    left: -28px;
}

.wechatcs-message-send-state.sending {
    background-image: url("../images/main/sending.gif");
}

.wechatcs-message-send-state.error {
    background-image: url("../images/main/senderror.png");
    cursor: pointer;
    background-size: 90% auto;
}

.wechatcs-message-questions {
    color: #5b7fab;
}

.wechatcs-message-questions>li {
    /* padding-right: 20px; */
}

.wechatcs-message-question-item {
    cursor: pointer;
    text-decoration: underline;
}

.wechatcs-message-file {
    width: 260px;
}

.wechatcs-message-file.as-attach {
    position: relative;
    display: block;
    height: 56px;
    border: 1px solid #e6e6e6;
    line-height: 19px;
    background: #fafafa;
    color: #999;
    padding: 9px 6px 9px 56px;
}

.wechatcs-message-file.as-attach:hover {
    border-color: #a3bdd0;
    background: #fff;
}

.wechatcs-message-file .message-file-icon {
    position: absolute;
    top: 10px;
    left: 10px;
    display: block;
    width: 36px;
    height: 36px;
    background-position: center center;
    background-repeat: no-repeat;
}

.wechatcs-message-file .message-file-icon.common {
    background-image: url("../images/file/COMMON.png");
}

.wechatcs-message-file .message-file-icon.doc,
.wechatcs-message-file .message-file-icon.docx {
    background-image: url("../images/file/DOC.png");
}

.wechatcs-message-file .message-file-icon.xls,
.wechatcs-message-file .message-file-icon.xlsx {
    background-image: url("../images/file/XLS.png");
}

.wechatcs-message-file .message-file-icon.ppt,
.wechatcs-message-file .message-file-icon.pptx {
    background-image: url("../images/file/PPT.png");
}

.wechatcs-message-file .message-file-icon.zip,
.wechatcs-message-file .message-file-icon.rar {
    background-image: url("../images/file/ZIP.png");
}

.wechatcs-message-file .message-file-icon.png {
    background-image: url("../images/file/PNG.png");
}

.wechatcs-message-file .message-file-icon.jpg,
.wechatcs-message-file .message-file-icon.jpeg {
    background-image: url("../images/file/JPG.png");
}

.wechatcs-message-file .message-file-icon.gif {
    background-image: url("../images/file/GIF.png");
}

.wechatcs-message-file .message-file-icon.txt {
    background-image: url("../images/file/TXT.png");
}

.wechatcs-message-file .message-file-icon.pdf {
    background-image: url("../images/file/PDF.png");
}

.wechatcs-message-file .message-file-icon.psd {
    background-image: url("../images/file/PSD.png");
}

.wechatcs-message-file .message-file-icon.css {
    background-image: url("../images/file/CSS.png");
}

.wechatcs-message-file .message-file-icon.dll {
    background-image: url("../images/file/DLL.png");
}

.wechatcs-message-file .message-file-icon.eps {
    background-image: url("../images/file/EPS.png");
}

.wechatcs-message-file .message-file-icon.html {
    background-image: url("../images/file/HTML.png");
}

.wechatcs-message-file .message-file-icon.ico {
    background-image: url("../images/file/ICO.png");
}

.wechatcs-message-file .message-file-icon.mp3 {
    background-image: url("../images/file/MP3.png");
}

.wechatcs-message-file .message-file-icon.svg {
    background-image: url("../images/file/SVG.png");
}

.wechatcs-message-file .message-file-icon.swf {
    background-image: url("../images/file/SWF.png");
}

.wechatcs-message-file .message-file-icon.tif {
    background-image: url("../images/file/TIF.png");
}

.wechatcs-message-file .message-file-icon.ai {
    background-image: url("../images/file/AI.png");
}

.wechatcs-message-file .message-file-func {
    font-size: 12px;
}

.wechatcs-message-file .message-file-name {
    font-size: 14px;
}

.wechatcs-message-file .message-file-name>span {
    vertical-align: top;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    max-width: calc(100% - 82px);
}

.wechatcs-message-file .message-file>p {
    font-size: 12px;
}

.wechatcs-message-file .message-file-btn {
    margin-right: 4px;
    color: #0068bc;
    cursor: pointer;
}

.message-location {
    width: 260px;
    height: 132px;
    border: 1px solid #e6e6e6;
    background: #fff;
}

.message-location-top {
    height: 102px;
    padding: 8px;
    line-height: 26px;
}

.message-location-icon {
    float: left;
    width: 86px;
    height: 86px;
    background: url("../images/main/location.png") no-repeat center;
}

.message-location-info {
    margin-left: 86px;
    padding-left: 8px;
    color: #999;
}

.message-location-info h3 {
    font-weight: bold;
    font-size: 16px;
    color: #333;
}

.message-location-address {
    line-height: 16px;
    height: 32px;
    font-size: 12px;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.message-location-bottom {
    height: 28px;
    line-height: 28px;
    border-top: 1px solid #e6e6e6;
    padding: 0 8px;
    color: #0068bc;
    text-align: right;
    cursor: pointer;
}

.wechatcs-message-audio {
    max-width: 300px;
    min-width: 80px;
    height: 24px;
    line-height: 24px;
    cursor: pointer;
}

.wechatcs-message-choices {
    color: #999;
    font-size: 12px;
}

.wechatcs-message-choices a {
    padding: 2px 5px;
    margin-left: 5px;
    background: #ffa155;
    border-radius: 2px;
    color: #fff;
}

.wechatcs-message-choices a.close {
    background: #36bafa;
}

.me.unread .wechatcs-message-audio:after {
    content: "";
    position: absolute;
    left: -16px;
    top: 50%;
    width: 6px;
    height: 6px;
    margin-top: -2px;
    border-radius: 50%;
    background-color: #f00;
}

.other.unread .wechatcs-message-audio:before {
    content: "";
    position: absolute;
    right: -16px;
    top: 50%;
    width: 6px;
    height: 6px;
    margin-top: -2px;
    border-radius: 50%;
    background-color: #f00;
}

.wechatcs-message-audio-icon {
    display: inline-block;
    vertical-align: middle;
    width: 10px;
    height: 14px;
    background: url("../images/main/audio.png") no-repeat center;
    margin-top: -3px;
}

.wechatcs-message-audio.in-playing .wechatcs-message-audio-icon {
    background: url("../images/main/audio.gif") no-repeat center;
}

.wechatcs-message-item.me .wechatcs-message-audio {
    text-align: right;
}

.wechatcs-message-item.me .wechatcs-message-audio:before {
    content: attr(data-second);
    display: inline-block;
    margin-right: 4px;
}

.wechatcs-message-item.other .wechatcs-message-audio:after {
    content: attr(data-second);
    display: inline-block;
    margin-left: 4px;
}

.wechatcs-message-item.me .wechatcs-message-audio-icon {
    transform: rotateY(180deg);
}

.wechatcs-message-video {
    width: 260px;
    height: 120px;
    background-color: #000;
    border-radius: 4px;
    position: relative;
}

.wechatcs-message-video video {
    width: 100%;
    height: 100%;
}

.wechatcs-message-video-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
}

.wechatcs-message-video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    border: 1px solid #fff;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    background: rgba(0, 0, 0, 0.3);
    cursor: pointer;
    transition: background ease-in-out 0.1s;
}

.wechatcs-message-video-play:hover {
    background: rgba(0, 0, 0, 0.5);
}

.wechatcs-message-video-play:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    border: 10px solid transparent;
    border-left: 15px solid #fff;
    margin-left: -6px;
    margin-top: -10px;
    border-radius: 4px;
}

.wechatcs-message-video-info {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    color: #fff;
    padding: 8px 10px;
    line-height: 18px;
}

.wechatcs-message-video-info p {
    float: left;
    width: 75%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wechatcs-message-video-info span {
    float: right;
}

.wechatcs-session-content-loadmore {
    display: inline-block;
    padding: 0 10px;
    cursor: pointer;
}

.wechatcs-session-content-datesplit {
    display: block;
    color: #b6b9c5;
    font-size: 12px;
    text-align: center;
    margin-bottom: 6px;
}

.wechatcs-session-content-datesplit .date-text {
    text-align: center;
    display: inline-block;
    margin: 0 6px;
}

.wechatcs-session-content-datesplit .line-left,
.wechatcs-session-content-datesplit .line-right {
    display: inline-block;
    width: 160px;
    height: 1px;
    vertical-align: middle;
}

.wechatcs-session-content-datesplit .line-left {
    background: url("../images/main/line-left.png") 100% 50% no-repeat;
}

.wechatcs-session-content-datesplit .line-right {
    background: url("../images/main/line-right.png") 0% 50% no-repeat;
}

.wechatcs-session-content-timesplit {
    display: block;
    text-align: center;
    color: #b6b9c5;
    font-size: 12px;
    margin-bottom: 6px;
}

.wechatcs-session-content-system {
    display: block;
    text-align: center;
    margin-bottom: 6px;
}

.wechatcs-session-content-system span {
    display: inline-block;
    line-height: 26px;
    background: #eef0f8;
    color: #868b9f;
    font-size: 12px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 0 10px;
}

.wechatcs-player {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: none;
    background: rgba(0, 0, 0, 0.15);
}

.wechatcs-player.active {
    z-index: 1000;
    display: block;
}

.wechatcs-player .plyr--audio {
    visibility: hidden;
    display: none;
}

.wechatcs-player .plyr--video {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: #000;
    max-width: 1200px;
}

.wechatcs-main-input {
    position: absolute;
    width: 100%;
    height: 185px;
    bottom: 0;
    left: 0;
}

.wechatcs-main-input-toolbar {
    height: 40px;
    line-height: 40px;
}

.wechatcs-main-input-toolbar>span {
    display: inline-block;
}

.wechatcs-main-input-toolbar {
    padding: 0 10px;
    height: 40px;
    position: relative;
}

.wechatcs-main-input-toolbar .emotion-panel {
    left: 14px;
    bottom: 100%;
    position: absolute;
    display: none;
    width: 399px;
    height: 208px;
    padding: 10px;
    background: #fff;
    border: 1px solid #ddd;
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
}

.face-list{
	height: 180px;
    overflow: auto;
    padding-left: 1px;
    padding-top: 1px;
	
}

.wechatcs-main-input-toolbar .face-list:after {
    content: "";
    display: block;
    clear: both;
}

.wechatcs-main-input-toolbar .face-list li {
    float: left;
}

.wechatcs-main-input-toolbar .face-list .face {
    width: 32px;
    height: 32px;
    text-align: center;
    line-height: 32px;
    display: block;
    border: 1px solid #ddd;
    text-align: center;
    margin: -1px 0 0 -1px;
    cursor: pointer;
}

.wechatcs-main-input-toolbar .face-list .face img {
    vertical-align: middle;
    margin-top: -6px;
}

.wechatcs-main-input-toolbar .face-list .face:hover {
    border-color: aqua;
    position: relative;
    z-index: 10;
}

.wechatcs-icon {
    margin-top: 5px;
    display: inline-block;
    height: 30px;
    width: 25px;
    cursor: pointer;
    vertical-align: top;
    background-position: center;
    background-repeat: no-repeat;
    transition: all 0.2s ease-out;
}

.show-emotion-btn {
    background-image: url("../images/input/emotion.png");
}

.show-emotion-btn:hover {
    background-image: url("../images/input/emotion-hov.png");
}

.image-btn {
    background-image: url("../images/input/img.png");
    overflow: hidden;
}

.image-btn:hover {
    background-image: url("../images/input/img-hov.png");
}

.file-btn {
    background-image: url("../images/input/file.png");
    overflow: hidden;
}

.file-btn:hover {
    background-image: url("../images/input/file-hov.png");
}

.downloadimg-btn {
    background-image: url("../images/input/downloadimg.png");
    overflow: hidden;
}

.downloadimg-btn:hover {
    background-image: url("../images/input/downloadimg-hov.png");
}

.location-btn {
    background-image: url("../images/input/location.png");
    overflow: hidden;
}

.location-btn:hover {
    background-image: url("../images/input/location-hov.png");
}

.remotehelp-btn {
    background-image: url("../images/input/remotehelp.png");
    overflow: hidden;
}

.remotehelp-btn:hover {
    background-image: url("../images/input/remotehelp-hov.png");
}

.msg-backward {
    background-image: url("../images/input/backward.png");
    overflow: hidden;
}

.msg-backward:hover {
    background-image: url("../images/input/backward-hov.png");
}

.msg-forward {
    background-image: url("../images/input/forward.png");
    overflow: hidden;
}

.msg-forward:hover {
    background-image: url("../images/input/forward-hov.png");
}

.msg-backward.disabled,
.msg-forward.disabled {
    cursor: not-allowed;
}

.record-btn {
    background-image: url("../images/input/record.png");
    overflow: hidden;
}

.image-btn input,
.file-btn input {
    display: none;
}

.image-btn label,
.file-btn label {
    cursor: pointer;
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0;
    position: relative;
    overflow: hidden;
}

.image-btn>span,
.file-btn>span {
    display: block;
    width: 30px;
    height: 30px;
    position: relative;
}

.image-btn div,
.file-btn div {
    width: 100% !important;
    height: 100% !important;
}

.wechatcs-main-input-editor-wrap {

	
    position: absolute;
    top: 40px;
    bottom: 48px;
    width: 100%;
}

.wechatcs-main-input-quickMsg {
	margin-bottom:42px !important;
	margin-left:2px;
	
    position: absolute;
    bottom: 100%;
    left: 0;
    padding: 5px 12px;
    width: 528px;
    max-height: 160px;
    background: #fff;
    box-shadow: 0 0 6px rgba(66, 67, 75, .25);
    border: 1px solid #e8eef1;
    line-height: 30px;
    overflow: auto;
}

.wechatcs-main-input-quickMsg p:hover {
    color: #5b7fab;
}

.wechatcs-main-input-quickMsg:empty,
.wechatcs-main-input-editor:empty+.wechatcs-main-input-quickMsg {
    display: none !important;
}

.wechatcs-main-input-editor {
    padding: 0 16px;
    display: block;
    height: 100%;
    overflow: auto;
}

.wechatcs-main-input-editor:focus {
    outline: none;
}

.wechatcs-main-input-editor .eimg {
    vertical-align: middle;
}

.wechatcs-main-input-editor img {
    max-height: 100px;
    margin: 0 4px;
    vertical-align: bottom;
    vertical-align: text-bottom;
}

.wechatcs-main-input-editor .watting-upload {
    position: relative;
    display: inline-block;
    margin: 0 4px;
    vertical-align: bottom;
    vertical-align: text-bottom;
}

.wechatcs-main-input-editor .watting-upload:before {
    content: "正在上传";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 1000;
    text-align: center;
    color: #fff;
}

.wechatcs-main-input-bottom {
    position: absolute;
    bottom: 0;
    line-height: 40px;
    padding: 8px 10px;
    width: 100%;
}

.wechatcs-input-clear {
    float: left;
    color: #999;
}

.wechatcs-sendwrapper {
    float: right;
    position: relative;
}

.wechatcs-sendbtn-switch-drop {
    position: absolute;
    left: 70px;
    bottom: 24px;
    background: #fff;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
    padding: 4px 0;
    display: none;
    z-index: 999;
}

.wechatcs-sendbtn-switch-drop.active {
    width: 200px;
    display: block;
    text-align: center;
}

.wechatcs-sendbtn-switch-item {
    position: relative;
    display: block;
    line-height: 30px;
    padding-left: 30px;
    padding-right: 10px;
    cursor: pointer;
    text-align: left;
}

.wechatcs-sendbtn-switch-item:hover {
    background: #daeeff;
}

.wechatcs-sendbtn-switch-item:before {
    content: "";
    width: 16px;
    height: 16px;
    position: absolute;
    left: 8px;
    top: 7px;
    background: url("../images/input/selected.png") center center no-repeat;
    background-size: 100%;
    display: none;
}

.wechatcs-sendbtn-switch-item.selected:before {
    display: block;
}

.wechatcs-main-input-bottom .wechatcs-splitbtn {
    display: block;
    width: 98px;
    height: 32px;
    border-radius: 4px;
    line-height: 0;
    font-size: 0;
    background: #5a7eab;
    text-align: center;
}

.wechatcs-main-input-bottom .wechatcs-input-close {
    font-size: 14px;
    line-height: 32px;
    color: #fff;
    cursor: pointer;
    margin-right: 10px;
}

.wechatcs-main-input-bottom .wechatcs-sendbtn,
.wechatcs-main-input-bottom .wechatcs-arrowdown {
    display: inline-block;
}

.wechatcs-main-input-bottom .wechatcs-sendbtn {
    padding-left: 10px;
    font-size: 14px;
    color: #fff;
    line-height: 30px;
    vertical-align: top;
    text-align: center;
    cursor: pointer;
}

.wechatcs-main-input-bottom .wechatcs-arrowdown {
    width: 30px;
    height: 100%;
    margin-left: 4px;
    position: relative;
}

.wechatcs-main-input-bottom .wechatcs-arrowdown:before,
.wechatcs-main-input-bottom .wechatcs-arrowdown:after {
    content: "";
    display: block;
}

.wechatcs-main-input-bottom .wechatcs-arrowdown:after {
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -3px;
    margin-left: -6px;
    border: 6px solid transparent;
    border-top-color: #fff;
    border-bottom: 0;
    width: 0;
    height: 0;
}

.wechatcs-content-cover {
    position: absolute;
    z-index: 10;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    background: rgba(0, 0, 0, 0.15);
}

.wechatcs-session-confirm {
    position: absolute;
    z-index: 11;
    display: none;
    width: 180px;
    height: 100px;
    padding: 10px 8px 12px;
    line-height: 26px;
    background: #fff;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
}

.wechatcs-session-confirm-content {
    height: 52px;
    line-height: 22px;
}

.wechatcs-session-confirm-btns:after {
    display: block;
    clear: both;
    content: "";
}

.wechatcs-session-confirm-ok,
.wechatcs-session-confirm-cancel {
    float: left;
    width: 80px;
    height: 26px;
    cursor: pointer;
    -webkit-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    text-align: center;
    color: #fff;
}

.wechatcs-session-confirm-ok {
    background: #fcb62f;
}

.wechatcs-session-confirm-ok:hover {
    background: #ffc658;
}

.wechatcs-session-confirm-cancel {
    margin-left: 4px;
    background: #57c9c0;
}

.layui-layer,
.layui-layer * {
    box-sizing: border-box;
}

.layui-layer-btn a {
    min-width: 80px !important;
    line-height: 26px !important;
    border-color: #5a7eab !important;
    border-radius: 4px !important;
}

.layui-layer-btn a.layui-layer-btn0 {
    background-color: #5a7eab;
    color: #fff;
}

.layui-layer-btn a.layui-layer-btn1 {
    background-color: #fff;
    color: #5a7eab;
}

.wechat-layer .layui-layer {
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 0 24px 0 rgba(5, 43, 139, 0.3);
}

.wechat-layer .layui-layer.layui-layer-msg {
    background-color: #fff;
    color: #333;
}

.wechat-layer.layui-layer-dialog .layui-layer-content.layui-layer-padding {
    padding: 20px;
    text-align: center;
    line-height: 30px;
}

.wechat-layer.layui-layer-dialog .layui-layer-content.layui-layer-padding .layui-layer-ico {
    position: relative;
    top: 0;
    left: 0;
    display: inline-block;
    vertical-align: top;
    margin-right: 10px;
}

.wechat-layer.layui-layer {
    border-radius: 4px;
}

.wechat-layer .layui-layer-title {
    background: #fff;
    border-bottom: 1px solid #eee;
    border-radius: 4px 4px 0 0;
    /* color: #476892 !important; */
}

.wechat-layer .layui-layer-content {
    border-bottom: 1px solid #e9eef6;
}

.wechatcs-transfer {
    width: 320px;
    height: 510px;
    display: none;
}

.wechatcs-transfer-title {
    height: 40px;
    line-height: 40px;
    padding: 0 16px;
    border-bottom: 1px dashed #dfe5f2;
}

.wechatcs-transfer-content {
    height: 470px;
    border-bottom: 1px solid #e9eef6;
    overflow: hidden;
    position: relative;
}

.wechatcs-transfer-search {
    height: 30px;
    margin: 10px 15px;
    background-color: #eff2f5;
    line-height: 30px;
    border-radius: 15px;
    position: relative;
}

.wechatcs-transfer-search input {
    border: none;
    background: none;
    width: 100%;
    height: 100%;
    padding-right: 48px;
    padding-left: 16px;
    outline: none;
}

.wechatcs-transfer-search input::placeholder {
    color: #a3aab6;
}

.wechatcs-transfer-search button {
    position: absolute;
    top: 0;
    right: 0;
    width: 48px;
    height: 100%;
    border: none;
    background: url("../images/common/search.png") no-repeat center;
    cursor: pointer;
    outline: none;
}

.wechatcs-transfer-tree {
    position: absolute;
    top: 50px;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 0 5px;
    overflow: hidden;
}

.wechatcs-tree {
    position: relative;
}

.wechatcs-transfer-tip {
    width: 450px;
    height: 178px;
    border-bottom: 1px solid #e9eef6;
    text-align: center;
    overflow: hidden;
}

.wechatcs-transfer-tip-ico {
    display: block;
    width: 82px;
    height: 82px;
    margin: 30px auto 14px;
    background: url("../images/transfer/iconbg.png") no-repeat center;
}

.wechatcs-transfer-tip-ico:after {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    background: url("../images/transfer/tip.png") no-repeat center;
    animation-name: shake;
    animation-duration: 100ms;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

.wechatcs-transfer-tip p {
    color: #4e627c;
    font-size: 16px;
}

@keyframes shake {
    2% {
        transform: translate(1.5px, -1.5px) rotate(-0.5deg);
    }
    4% {
        transform: translate(-1.5px, -0.5px) rotate(1.5deg);
    }
    6% {
        transform: translate(1.5px, 2.5px) rotate(-0.5deg);
    }
    8% {
        transform: translate(2.5px, 0.5px) rotate(-0.5deg);
    }
    10% {
        transform: translate(2.5px, -0.5px) rotate(-0.5deg);
    }
    12% {
        transform: translate(-0.5px, 1.5px) rotate(1.5deg);
    }
    14% {
        transform: translate(2.5px, -0.5px) rotate(1.5deg);
    }
    16% {
        transform: translate(0.5px, -1.5px) rotate(0.5deg);
    }
    18% {
        transform: translate(2.5px, 2.5px) rotate(-0.5deg);
    }
    20% {
        transform: translate(1.5px, -0.5px) rotate(1.5deg);
    }
    22% {
        transform: translate(-0.5px, 1.5px) rotate(0.5deg);
    }
    24% {
        transform: translate(-1.5px, 1.5px) rotate(0.5deg);
    }
    26% {
        transform: translate(2.5px, 0.5px) rotate(1.5deg);
    }
    28% {
        transform: translate(-0.5px, -0.5px) rotate(0.5deg);
    }
    30% {
        transform: translate(0.5px, -0.5px) rotate(0.5deg);
    }
    32% {
        transform: translate(1.5px, -0.5px) rotate(1.5deg);
    }
    34% {
        transform: translate(1.5px, 0.5px) rotate(-0.5deg);
    }
    36% {
        transform: translate(0.5px, 2.5px) rotate(0.5deg);
    }
    38% {
        transform: translate(-1.5px, -0.5px) rotate(0.5deg);
    }
    40% {
        transform: translate(0.5px, -0.5px) rotate(0.5deg);
    }
    42% {
        transform: translate(0.5px, -0.5px) rotate(1.5deg);
    }
    44% {
        transform: translate(-1.5px, 0.5px) rotate(1.5deg);
    }
    46% {
        transform: translate(-1.5px, -0.5px) rotate(-0.5deg);
    }
    48% {
        transform: translate(-1.5px, -0.5px) rotate(-0.5deg);
    }
    50% {
        transform: translate(-0.5px, -0.5px) rotate(0.5deg);
    }
    52% {
        transform: translate(-1.5px, 0.5px) rotate(1.5deg);
    }
    54% {
        transform: translate(2.5px, 0.5px) rotate(-0.5deg);
    }
    56% {
        transform: translate(1.5px, 2.5px) rotate(1.5deg);
    }
    58% {
        transform: translate(0.5px, 1.5px) rotate(1.5deg);
    }
    60% {
        transform: translate(-1.5px, -1.5px) rotate(1.5deg);
    }
    62% {
        transform: translate(0.5px, 1.5px) rotate(-0.5deg);
    }
    64% {
        transform: translate(1.5px, 2.5px) rotate(1.5deg);
    }
    66% {
        transform: translate(1.5px, -0.5px) rotate(1.5deg);
    }
    68% {
        transform: translate(-1.5px, 1.5px) rotate(0.5deg);
    }
    70% {
        transform: translate(0.5px, 0.5px) rotate(-0.5deg);
    }
    72% {
        transform: translate(-0.5px, -0.5px) rotate(0.5deg);
    }
    74% {
        transform: translate(0.5px, -1.5px) rotate(0.5deg);
    }
    76% {
        transform: translate(-0.5px, 1.5px) rotate(0.5deg);
    }
    78% {
        transform: translate(1.5px, -1.5px) rotate(-0.5deg);
    }
    80% {
        transform: translate(-1.5px, -0.5px) rotate(0.5deg);
    }
    82% {
        transform: translate(0.5px, -0.5px) rotate(0.5deg);
    }
    84% {
        transform: translate(2.5px, 2.5px) rotate(1.5deg);
    }
    86% {
        transform: translate(2.5px, -0.5px) rotate(1.5deg);
    }
    88% {
        transform: translate(0.5px, 0.5px) rotate(-0.5deg);
    }
    90% {
        transform: translate(-0.5px, -1.5px) rotate(-0.5deg);
    }
    92% {
        transform: translate(2.5px, 1.5px) rotate(-0.5deg);
    }
    94% {
        transform: translate(2.5px, -1.5px) rotate(-0.5deg);
    }
    96% {
        transform: translate(2.5px, 2.5px) rotate(0.5deg);
    }
    98% {
        transform: translate(2.5px, -0.5px) rotate(0.5deg);
    }
    0%,
    100% {
        transform: translate(0, 0) rotate(0);
    }
}

.wechatcs-session-evaluate {
    padding: 30px 45px;
}

.wechatcs-session-evaluate p {
    margin-bottom: 16px;
}

.wechatcs-session-evaluate-item {
    line-height: 30px;
}

.wechatcs-radio input {
    display: none;
}

.wechatcs-radio label {
    color: #4e627c;
}

.wechatcs-radio label:before {
    content: "";
    display: inline-block;
    width: 15px;
    height: 15px;
    border: 1px solid #c7cfe1;
    border-radius: 50%;
    vertical-align: middle;
    margin-top: -2px;
    margin-right: 10px;
}

.wechatcs-radio input:checked+label:before {
    border-color: #57c9c0;
    background-color: #57c9c0;
    box-shadow: 0 0 0 3px #fff inset;
}

.wechatcs-selection-tools {
    position: absolute;
    z-index: 999;
    background-color: #fff;
    box-shadow: 0 0 16px 0 rgba(15, 52, 146, 0.2);
    border-radius: 4px;
    overflow: hidden;
}

.wechatcs-selection-tools span {
    display: inline-block;
    height: 40px;
    padding: 0 16px;
    line-height: 40px;
    vertical-align: top;
    cursor: pointer;
}

.wechatcs-selection-tools span~span {
    border-left: 1px solid #e9eef6;
}

.wechatcs-selection-tools span:hover {
    color: #4e627c;
    background: #f1f7ff;
}

.wechatcs-skill-group {
    padding: 80px 0;
    text-align: center;
    box-sizing: border-box;
}

.wechatcs-skill-select {
    display: inline-block;
    width: 320px;
    vertical-align: top;
}

.wechatcs-recoed-layer {
    height: 558px;
    position: relative;
    overflow: hidden;
}

.wechatcs-recoed-layer-search {
    width: 588px;
    height: 30px;
    background-color: #eff2f5;
    border-radius: 15px;
    margin: 20px auto 10px;
    overflow: hidden;
    position: relative;
    overflow: hidden;
}

.wechatcs-recoed-layer-search input {
    width: 100%;
    height: 100%;
    padding-left: 16px;
    padding-right: 42px;
    border: none;
    background: none;
    outline: none;
}

.wechatcs-recoed-layer-search input::placeholder {
    color: #a3aab6;
}

.wechatcs-recoed-layer-search button {
    position: absolute;
    width: 42px;
    height: 100%;
    top: 0;
    right: 0;
    border: none;
    background: url("../images/common/search.png") no-repeat center;
    cursor: pointer;
    outline: none;
}

.wechatcs-recoed-layer-head {
    border-bottom: 1px solid #e1e7f0;
    height: 35px;
    line-height: 34px;
    font-size: 0;
    text-align: center;
}

.wechatcs-recoed-layer-head li {
    display: inline-block;
    height: 35px;
    padding: 0 32px;
    margin: 0 4px;
    font-size: 14px;
    cursor: pointer;
}

.wechatcs-recoed-layer-head li.active {
    border-bottom: 1px solid #5a7eab;
    color: #5a7eab;
    font-weight: bold;
}

.wechatcs-recoed-layer-body {
    position: absolute;
    top: 96px;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 0 20px;
}

.wechatcs-recoed-layer-download .wechatcs-recoed-layer-body {
    padding: 0;
}

.wechatcs-recoed-list {
    height: 462px;
    overflow: auto;
    padding-left: 20px;
    margin-right: 10px;
}

.wechatcs-recoed-all-list {
    height: 422px;
}

.wechatcs-recoed-layer-item {
    padding: 24px 0 22px;
    overflow: hidden;
    border-bottom: 1px solid #e1e7f0;
}

.wechatcs-recoed-layer-item:last-child {
    border: none;
}

.wechatcs-recoed-layer-avatar {
    width: 46px;
    height: 46px;
    float: left;
    overflow: hidden;
    border-radius: 50%;
}

.wechatcs-recoed-layer-avatar img {
    vertical-align: top;
    width: 100%;
    height: 100%;
}

.wechatcs-recoed-layer-info {
    /* margin-left: 60px; */
    overflow: hidden;
}

.wechatcs-recoed-layer-name {
    margin-bottom: 6px;
    line-height: 22px;
    color: #5b7fab;
    overflow: hidden;
}

.wechatcs-recoed-layer-name h3 {
    float: left;
}

.wechatcs-recoed-layer-name span {
    float: right;
}

.wechatcs-recoed-layer-info p {
    line-height: 20px;
}

.wechatcs-recoed-layer-inner .wechatcs-message-audio {
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    /* height: 40px; */
    background-color: #ecf0f5;
    border-radius: 4px;
}

.wechatcs-recoed-layer-inner .wechatcs-message-audio:after {
    content: attr(data-second);
    margin-left: 4px;
}

.wechatcs-recoed-layer .wechatcs-session-content-system {
    margin-top: 6px;
}

.wechatcs-record-layer .wechatcs-recoed-iv-list {
    margin-left: 0;
    padding-right: 0;
}

.wechatcs-record-layer .wechatcs-recoed-iv-item {
    width: 45%;
    margin-right: 5%;
}

.wechatcs-record-layer .loadmore {
    text-align: center;
    line-height: 40px;
}

.wechatcs-record-layer .loadmore a {
    cursor: pointer;
}

.wechatcs-recoed-iv-list {
    overflow: hidden;
    /* margin-left: -10px; */
}

.wechatcs-recoed-iv-item {
    width: 170px;
    height: 110px;
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
    position: relative;
    cursor: pointer;
    border: 1px solid transparent;
}

.wechatcs-recoed-layer-download .wechatcs-recoed-iv-item:after {
    content: "";
    position: absolute;
    top: 11px;
    right: 11px;
    width: 16px;
    height: 16px;
    z-index: 10;
    background: url("../images/record/record-checkbox.png")
}

.wechatcs-recoed-layer-download .wechatcs-recoed-iv-item.checked {
    border-color: #5b7fab;
}

.wechatcs-recoed-layer-download .wechatcs-recoed-iv-item.checked:after {
    background: url("../images/record/record-checked.png");
}

.wechatcs-recoed-iv-item img {
    vertical-align: top;
    width: 100%;
    height: 100%;
}

.wechatcs-recoed-iv-item video {
    width: 100%;
    height: 100%;
}

.wechatcs-recoed-iv-split {
    float: left;
    width: 100%;
    line-height: 50px;
}

.wechatcs-recoed-iv-split input {
    display: none;
}

.wechatcs-recoed-iv-split~.wechatcs-recoed-iv-split {
    margin-top: -10px;
}

.wechatcs-recoed-iv-split .time-text:before {
    content: "";
    display: inline-block;
    width: 4px;
    height: 13px;
    margin-right: 5px;
    background: #5b7fab;
    border-radius: 2px;
}

.wechatcs-recoed-file-list .wechatcs-message-file {
    width: 100%;
}

.wechatcs-recoed-file-list .wechatcs-message-file.as-attach {
    height: auto;
    background-color: #fff;
    border: none;
    padding: 16px 0 16px 58px;
    border-bottom: 1px solid #e8edf4;
    line-height: 26px;
}

.wechatcs-recoed-file-list .wechatcs-message-file .message-file-icon {
    left: 0;
    top: 50%;
    margin-top: -18px;
}

.wechatcs-recoed-layer-download {
    width: 100%;
    height: 500px;
    position: relative;
}

.wechatcs-recoed-layer-download .wechatcs-recoed-layer-body {
    top: 0;
}

.wechatcs-recoed-layer-download .wechatcs-recoed-list {
    height: 502px;
}

.wechatcs-recoed-layer-download .wechatcs-message-video-wrapper:after {
    content: "视频";
    position: absolute;
    bottom: 0;
    right: 0;
    color: #fff;
    padding: 0 10px;
    background-color: #69b8f0;
}

.wechatcs-recoed-layer-download .wechatcs-message-video-play {
    display: none;
}

.wechatcs-recoed-layer-download .wechatcs-recoed-iv-split label {
    margin-left: 25px;
    color: #5b7fab;
    cursor: pointer;
}

.wechatcs-recoed-layer-download .wechatcs-recoed-iv-split input:checked+label:before {
    content: "取消";
}

.wechatcs-rightcontent {
    margin-left: 70%;
    height: 100%;
}

.wechatcs-rightcontent iframe {
    width: 100%;
    height: 100%;
}

.wechatcs-recoed-pager {
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 100%;
    height: 40px;
    padding: 0 20px;
    line-height: 40px;
    border-top: 1px solid #e1e7f0;
    background-color: #eff2f5;
}

.wechatcs-recoed-pager span {
    display: inline-block;
    min-width: 20px;
    height: 20px;
    vertical-align: middle;
    line-height: 20px;
    cursor: pointer;
    background-position: center center;
    background-repeat: no-repeat;
    user-select: none;
}

.wechatcs-recoed-pager span.disabled {
    filter: grayscale(100);
    cursor: not-allowed;
}

.wechatcs-recoed-pager .wechatcs-pager {
    margin-top: -3px;
    margin-left: 10px;
}

.wechatcs-record-datepicker:before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-top: -4px;
    background-image: url("../images/record/icon-datepicker.png");
    background-size: 16px auto;
    background-position: center center;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 4px;
}

.wechatcs-pager-first {
    background-image: url("../images/record/first.png");
}

.wechatcs-pager-prev {
    background-image: url("../images/record/prev.png");
}

.wechatcs-pager-next {
    background-image: url("../images/record/next.png");
}

.wechatcs-pager-last {
    background-image: url("../images/record/last.png");
}


/* 右侧区域样式 */

.right-tab {
    position: relative;
    height: 100%;
}

.righttab-head {
    height: 55px;
    border-bottom: 1px solid #eee;
    line-height: 55px;
    font-size: 15px;
    color: #999;
    text-align: center;
}

.righttab-title {
    display: inline-block;
    height: 55px;
    margin: 0 10px;
    cursor: pointer;
}

.righttab-title.active {
    color: #5b7fab;
    border-bottom: 2px solid #5b7fab;
}

.righttab-body {
    position: absolute;
    top: 55px;
    bottom: 0;
    width: 100%;
}

.righttab-content {
    height: 100%;
}


/* 访客信息 */

.right-accordion {
    height: 100%;
    overflow: auto;
}

.right-accordion-item+.right-accordion-item {
    border-top: 1px solid #eee;
}

.right-accordion-head {
    height: 40px;
    padding: 0 20px;
    line-height: 40px;
    border-bottom: 1px solid #eee;
}

.right-accordion-head::after {
    content: "";
    display: block;
    clear: both;
}

.right-accordion-toggle {
    float: right;
    margin-top: 17px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #b2bed0;
}

.right-accordion-head.active .right-accordion-toggle {
    border-top: 0;
    border-bottom: 5px solid #b2bed0;
}

.info-list {
    margin: 10px 20px;
    line-height: 36px;
}

.info-label {
    float: left;
    width: 60px;
    color: #999;
}

.info-content {
    margin-left: 60px;
}

.selected-tip {
    padding: 7px 0 0;
    font-size: 12px;
    color: #5b7fab;
    line-height: 1;
}

.selected-tip:empty:before {
    content: "点此添加";
    color: #999;
    line-height: 22px;
}

.selected-tip:empty {
    margin-bottom: 7px;
}

.tip-item {
    display: inline-block;
    height: 22px;
    padding: 0 5px;
    margin-bottom: 7px;
    margin-right: 7px;
    line-height: 20px;
    border: 1px solid #b2bed0;
    background: #ebeff5;
    border-radius: 2px;
}

.tip-item>span {
    display: inline-block;
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tip-delete {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-left: 8px;
    vertical-align: text-top;
    background: url("../images/rightcontent/tip-delete.png");
}

.tip-wrap {
    display: none;
}

.search-btn {
    float: left;
    position: relative;
    z-index: 100;
    margin-left: -30px;
    width: 30px;
    height: 32px;
    background: url("../images/transfer/search-btn.png") no-repeat center;
}

.note-text {
    width: 100%;
    border: 0;
    outline: 0;
}

.visit-list {
    padding-top: 4px;
    font-size: 12px;
    line-height: 14px;
}

.visit-list>li {
    position: relative;
    padding-bottom: 25px;
}

.visit-list>li::before {
    content: "";
    position: absolute;
    top: 15px;
    bottom: -10px;
    left: 6px;
    border-left: 1px solid #b2bed0;
}

.visit-list>li:last-child::before {
    content: unset;
}

.visit-icon {
    float: left;
    width: 13px;
    height: 13px;
    margin-top: 8px;
    background: url("../images/rightcontent/visit-icon.png");
}

.visit-list>li p {
    margin-left: 20px;
}

.visit-duration {
    margin-left: 4px;
    color: #f65637;
}

.visit-net {
    color: #5b7fab;
}


/* 快捷回复 */

.quickreply-head {
    height: 40px;
    border-bottom: 1px solid #eee;
    line-height: 40px;
}

.quickreply-title {
    display: inline;
    padding: 2px 7px;
    margin-left: 20px;
    border-radius: 10px;
    color: #999;
    cursor: pointer;
}

.quickreply-title.active {
    background: #ebeff5;
    color: #5b7fab;
}

.quickreply-refresh {
    float: right;
    padding-left: 20px;
    margin-right: 20px;
    background: url("../images/rightcontent/icon-refresh.png") no-repeat left center;
    color: #5b7fab;
    font-size: 12px;
}

.quickreply-body {
    position: absolute;
    top: 40px;
    bottom: 0;
    width: 100%;
}

.quickreply-search {
    margin: 15px 20px;
    height: 26px;
}

.quickreply-search::after {
    content: "";
    display: block;
    clear: both;
}

.quickreply-search input {
    float: left;
    width: 100%;
    height: 100%;
    padding-left: 11px;
    padding-right: 30px;
    border: 1px solid #ccd3dc;
}

.quickreply-search a {
    float: left;
    margin-left: -30px;
    width: 30px;
    height: 100%;
    background: url("../images/rightcontent/icon-search.png") no-repeat center;
}

.quickreply-wrap {
    position: absolute;
    top: 56px;
    bottom: 0;
    left: 20px;
    right: 20px;
    overflow: auto;
}

.quickreply-content.personal .quickreply-wrap {
    bottom: 40px;
}

.quickreply-group {
    margin-bottom: 10px;
}

.quickreply-group-head {
    height: 30px;
    line-height: 30px;
    background: #ebeff5;
    color: #5b7fab;
}

.quickreply-group-title {
    padding-left: 27px;
    background: url("../images/rightcontent/icon-group.png") no-repeat 8px center;
}

.quickreply-group-arrow {
    float: right;
    margin-right: 13px;
    margin-top: 11px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #b2bed0;
}

.quickreply-group-head.active .quickreply-group-arrow {
    border-top: 0;
    border-bottom: 5px solid #b2bed0;
}

.quickreply-list {
    display: none;
    margin-top: 5px;
    padding: 5px 12px;
    background: #f5f7fa;
    line-height: 26px;
    color: #666;
    font-size: 12px;
}

.quickreply-list>li {
    padding-left: 15px;
    background: url("../images/rightcontent/reply-dot.png") no-repeat left 10px;
    cursor: pointer;
}

.quickreply-config {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 40px;
    background: #ebeff5;
    color: #5b7fab;
    font-size: 12px;
    line-height: 40px;
    text-align: center;
}

.quickreply-config>span {
    padding-left: 19px;
    background: url("../images/rightcontent/icon-config.png") no-repeat left center;
}


/* 历史记录 */

.wechatcs-record-layer-body {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 0 20px;
    overflow-y: auto;
}

.wechatcs-record-layer-body .wechatcs-message-file {
    width: auto;
}

.wechatcs-record-list {
    position: absolute;
    top: 50px;
    bottom: 40px;
    left: 20px;
    right: 10px;
    padding-right: 10px;
    height: auto;
    overflow: auto;
}

.wechatcs-record-filter {
    padding-top: 10px;
}

.wechatcs-record-filter .quickreply-search {
    float: right;
    width: 60%;
    height: 30px;
    margin: 0;
}

.wechatcs-record-filter .mini-buttonedit {
    border-radius: 0;
}

.wechatcs-record-filter .mini-buttonedit-border {
    border-radius: 0;
}

.wechatcs-record-filter .quickreply-search input {
    border-left: 0;
}


/* 重新会话*/

.reconnect-wrap {
    position: relative;
    display: none;
    height: 100%;
}

.wechatcs-main-input.disconnect .input-wrap {
    display: none;
}

.wechatcs-main-input.disconnect .reconnect-wrap {
    display: block;
}

.reconnect-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    padding-left: 30px;
    transform: translate(-50%, -50%);
    background: url("../images/icon-reconnect.png") no-repeat left center;
}

.me-isread {
    padding: 22px 8px;
    margin-right: 8px;
    font-size: 13px;
    float: right;
    width: 6%;
}

.no{
    color:#3c80e6 !important;
}

.recall{
	display: flex;
	padding: 0 0 30px 0px;
}
.recall> span{
	padding:0 20px;
    font-size: 14px;
    text-align: center;
    margin: 0 auto;
    height: 32px;
    line-height: 32px;
    background-color: rgb(90, 115, 244,0.1);
    color: #999;
    border-radius: 10px;
    box-shadow: 0px 0px 5px 2px rgba(0,0,0,.12);
}
.quote{
    color: #8992A9;
    border-bottom: 1px solid #e2e2e2;
}
.quote-line{
    display: block;
    margin: 5px 0;
    border-bottom: 1px solid #e2e2e2;
}
.quote a[data-fancybox]{
    display: block;
}
.viewer-title{
    display: none;
}
.isrecall{
    position:relative;
    margin: 30px 0;
   }
  .isrecall> span {
    font-size: 12px;
    /* bottom:0px; */
    height: 26px;
    line-height: 26px;
    background: #EDF0F7;
   color: #4E5463;
    box-shadow: 0px 5px 5px  rgba(0, 0, 0, 0.1);
    border-radius: 2px;
  }