.IM_nav{ width: 360px;}
.IM_nav ul{display: flex; padding-top:10px;}
.IM_nav li{height: 30px; cursor: pointer; text-align: center; color:#868E94; flex: 1;position: relative;}	
.IM_nav li .txt{
	display: inline;
	position: relative;
}
.IM_nav li .txt .unreadMsg{
	display: block;
  min-width: 15px;
  max-width: 50px;
  height: 15px;
  line-height: 15px;
  border-radius: 30px;
  background: #E95252;
  color: #F9f9f9;
  position: absolute;
  top: -7px;
  bottom: -7px;
  left: 35px;
  font-size: 12px;
  font-family: PingFangSC-Semibold !important;
  word-break: keep-all;
  padding: 0 4px;
}
.IM_nav li>i{font-size: 24px;}
.IM_nav li:hover{color: #E95252;}
.IM_nav li.checked{color: #E95252;}
.lihoverNote {height: 2px;background: #e95252;position: absolute;left: 0;bottom: -1px;width: 0%;}
.IM_nav li.checked .lihoverNote,
.IM_nav ul li:hover .lihoverNote {width: 100%; transition: width 0.3s;}
.IM_myNav{width: 330px; height: 40px; border:1px solid #868E94; background: rgba(255,255,255,.4); border-radius: 20px; margin: 20px 15px;}
.IM_myNav li{width: 105px; height: 20px; margin-top: 10px; cursor: pointer; font-size:14px; border-right: 1px solid #868E94; text-align: center; color: #666; float: left;}
.IM_myNav li.cked{color: #E95252;}
.IM_myNav li:last-child{border:none}
.IM_cont{height: 770px; overflow-y: auto; padding:5px 15px; }
.IM_cont_item{margin: 10px 0; padding: 10px; background: rgba(255,255,255,.6); border-radius: 4px;}
.IM_cont_item .userAndTime{font-size: 14px; color: #333;}
.IM_cont_item .userAndTime>img{width: 24px; height: 24px; border-radius: 12px; vertical-align: middle;}
.IM_cont_item .artcleCont{font-size: 14px; line-height: 24px; color: #666; margin: 10px 0;}
.myDynamicItem .artcleCont{font-size: 14px; line-height: 24px; color: #666;}
.IM_cont .artcleAddress{font-size: 12px; color: #666; padding: 5px 0; height: 24px; line-height: 24px;}
.IM_cont .artcleAddress{color: #999;}
.IM_cont .artcleAddress i{margin:0 2px;}
.IM_cont .artclePic>img{cursor: pointer;width:100%;}
.IM_contacts::-webkit-scrollbar,.IM_cont::-webkit-scrollbar,.IM_messageList::-webkit-scrollbar{width: 4px;height: 1px;}
.IM_contacts::-webkit-scrollbar-thumb,.IM_cont::-webkit-scrollbar-thumb,.IM_messageList::-webkit-scrollbar-thumb{-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);border-radius: 4px;background: #999;}
.praiseAndReview{margin: 15px 0; border-radius: 10px; width: 100%; height: auto; overflow: hidden;}
.praiseAndReview .praise{ width: 100%; background: #C8D8DF; padding: 10px; font-size: 14px; color: #4C6C99; height: auto; line-height: 24px; margin-bottom: 1px;}
.praiseAndReview .review{width: 100%;  background: #C8D8DF; padding: 10px; position: relative;}
.praiseAndReview .review .reviewIcon{width: 18px; height: 12px; background: #73BFFF; position: absolute; top: 16px; border-radius: 4px;}
.praiseAndReview .review .reviewIcon .sjx{
position: absolute;
left: 5px;
top: 11px;	
width: 0;
height: 0;
border-width: 4px;
border-style: solid;
border-color: #73BFFF transparent transparent transparent;
}
.praiseAndReview .review ul{padding-left: 25px;}
.praiseAndReview .review ul li{font-size: 12px; color: #333; line-height: 20px;margin: 2px 0;}
.praiseAndReview .review ul li p .iconfont{display:none; font-size: 12px; color: #666; cursor: pointer; margin-left: 5px;}
.praiseAndReview .review ul li:hover p .iconfont{display: inline-block; line-height: 18px;}
.praiseAndReview .review ul li span{color:#4C6C99;}
.IM_cont .el-input .el-input__inner{border-radius: 4px 0 0 4px!important; height: 28px;}
.IM_cont .el-upload--picture-card{height:80px; line-height: 82px;  width: 80px;}
.IM_cont .el-upload-list--picture-card .el-upload-list__item{width: 80px; height: 80px;}
.IM_cont .myDynamicTop{}
.IM_cont .myDynamicItem{width: 300px; height: auto; border-left:1px solid #B8C6CC; position: relative; margin-left: 40px; padding:0 10px 10px;}
.IM_cont .myDynamicItem .iconOut{width: 9px; height: 9px; padding: 2px; background:#73BFFF; border-radius: 50%; position: absolute; left:-5px; top:8px}
.IM_cont .myDynamicItem .iconOut .iconIn{width: 5px; height: 5px; background: #0078FF; border-radius: 50%;}
.IM_cont .aboutMeDynamicItem{width: 340px; height: auto; overflow: hidden; background:rgba(255,255,255,.6); margin-top: 20px; padding: 10px;}
.IM_cont .aboutMeDynamicItem .dynamicItemTop{height: auto; overflow: hidden; padding: 10px 0;}
.IM_cont .aboutMeDynamicItem .dynamicItemTop>div{float: left;}
.IM_cont .aboutMeDynamicItem .dynamicItemTop .leftDiv{width: 50px;}
.IM_cont .aboutMeDynamicItem .dynamicItemTop .leftDiv>img{width: 36px; height: 36px; border-radius: 18px;}
.IM_cont .aboutMeDynamicItem .dynamicItemTop .middleDiv{width: 200px;}
.IM_cont .aboutMeDynamicItem .dynamicItemTop .rightDiv{width: 70px;}
.IM_cont .aboutMeDynamicItem .dynamicItembottom{border-top:1px solid #DAE9F0; height: auto; padding: 10px 0; overflow: hidden;}
.IM_searchListBox{
    position: absolute;
    top: 40px;
    right: 0;
    left: 0;
    bottom: 40px;
}
.IM_searchList{padding: 10px 0;background: rgba(255, 255, 255, 0.8)}
.IM_searchList li{padding: 0 20px; line-height: 40px; font-size: 14px; color: #333; cursor: pointer;}
.IM_searchList li:hover{background: #f1f1f1;}
.IM_searchList li img{width: 24px; height:24px; border-radius: 12px; vertical-align: middle;}
.IM_searchList ul li .el-tag{height: 28px; line-height: 26px; padding: 0 5px;}
.IM_contacts{ overflow: auto;}
.contact-box{position: absolute;top: 81px;bottom: 0px; left: 0;right: 0;max-height:auto !important;background: rgba(255, 255, 255, 0.9) }
.contact-box .contacts-type-box{
    width: 100%;
    display: flex;
    padding: 5px;
    box-sizing: border-box;
    margin-top: 10px;
    margin-left: 10px;
    position: relative;
}
.contact-box .contacts-type-box .contacts-type-item{
    display: inline-block;
    padding: 1px 5px;
    background: #fff;
    flex: inherit;
    font-size: 14px;
    margin-right: 15px; 
    box-sizing: border-box;
    cursor: pointer;
    border-radius: 3px;
}
.contact-box .contacts-type-box .plus{
    top: 8px;
    right: 27px;
    position: absolute;
    color: #333;
    font-size: 14px;
    color:rgba(56, 103, 214,.9);
    cursor: pointer;
}
.contact-box .contacts-type-box .contacts-type-item.active,.contact-box .contacts-type-box .contacts-type-item:hover{
    background: rgba(56, 103, 214,.1);
    color:rgba(56, 103, 214,.5);
}
.contact-box .el-tree-node__content:hover{
    background: rgba(0, 0, 0, 0.1) !important;
}
.contact-box .IM_messageList {
    background:none;
    margin-top:10px;
}
.contact-box .IM_messageList ul li{
    padding: 5px 15px;
    height:auto;
}
.contact-box .IM_messageList ul li .cont {
    line-height:38px;
}
.IM_messageList ul li::after{
    content:"."; display:block; height:0; visibility:hidden; clear:both;
}
.el-tree-style-div{padding:10px;}
.el-tree-style-div .el-tree{background: transparent!important;}
.el-tree-style-div .el-tree-node{line-height: 30px!important;}
.el-tree-style-div  .el-tree-node__content{height: 30px!important;}
.IM_messageList{overflow-y: auto; position: absolute; top: 81px; left: 0;  bottom: 40px; right: 0; background: rgba(255,255,255,.8);user-select:none;}
.IM_messageList ul li{height:68px; cursor: pointer; position: relative; padding:15px; box-sizing: border-box;}
.IM_messageList ul li:hover{background:rgba(0,0,0,.1);}
.IM_messageList ul li:hover i.el-icon-circle-close-outline{display:inline-block!important;}
.IM_messageList ul li>img{width: 38px; height: 38px; border-radius: 19px; float: left; margin:0px 10px 0 0;}
.IM_messageList ul li .teamAvatar{width: 38px; height: 38px; border:1px solid #999; border-radius: 19px; float: left; margin:0px 10px 0 0;}
.IM_messageList ul li .cont{
    height: 38px;
    padding: 0px 0;
    font-size: 14px;
    float: left;
    width: 200px;
}
.IM_messageList ul li .cont.sys_cont{
  height: auto;
}
.IM_messageList ul li .cont .el-badge{line-height: 48px;}
.IM_messageList ul li .cont .el-badge__content{line-height: 16px}
.IM_messageList ul li .cont .name{font-size: 14px;color: #333;}
.IM_messageList ul li .cont .name.team {
    overflow: hidden;
    height: 38px;
    text-overflow: ellipsis;
}
.IM_messageList ul li .cont .msg{font-size: 12px; color: #999; line-height: 20px; overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
.IM_messageList ul li .cont .msg.sys_msg{
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: initial;
  white-space: inherit;
}
.IM_messageList ul li .tag-box{
    top:10px;
    right: 10px;
    color: #f1f1f1;
    position: absolute;
    font-size: 12px !important;
}
.IM_messageList ul li .tag-box .tag-depart{
    border-radius: 5px;
    background: #333;
    margin-right: 5px;
    padding: 2px 3px;
}
.IM_messageList ul li .tag-box .tag-company{
    border-radius: 5px;
    background: #e91e6369;
    margin-right: 5px;
    padding: 2px 3px;
}
.IM_messageList ul li .tag-box .tag-job{
    border-radius: 5px;
    background: #8854d0;
    padding: 2px 3px;
}
.search-none-data{padding: 10px;margin: 30px 0;box-sizing: border-box; text-align: center;font-size: 12px;color: #a0a0a0;}
.search-none-data i{font-size: 50px;color: #a0a0a0;}
.IM_tool{bottom: 0px;left: 0;right: 0;height: 40px;background: rgba(255,255,255,.9);position: absolute;}
.im-box.vdr{background: #eee;box-sizing: border-box;border-radius: 2px;box-shadow: 1px 1px 50px rgba(0,0,0,.15);border: 1px solid #D9D9D9;border-color: rgba(0,0,0,.15);display:flex;}
.im-box .handle-mr {
    top: 0px !important;
    right: 0px !important;
    cursor: e-resize !important;
    bottom: 0px !important;
    position: absolute !important;
    z-index: 5 !important;
    background: rgba(0,0,0,0) !important;
    height: calc(100% - 20px) !important;
    width: 4px !important;
    border: 0px !important;
    z-index: 99999 !important;
}
.im-box .handle-bm {
    bottom: 0px !important;
    left: 0px !important;
    cursor: s-resize !important;
    width: calc(100% - 20px) !important;
    height: 4px !important;
    background: rgba(0,0,0,0) !important;
    border: 0px  !important;
    z-index: 99999 !important;
}
.im-box .handle-br[data-v-1e95fd0f] {
    cursor: se-resize;
    width: 10px;
    height: 10px;
    right: 0px;
    bottom: 0px;
    border: 0px  !important;
    background: rgba(0,0,0,0) !important;
    z-index: 99999 !important;
}
.IM_message_box_left {
    width:62px;
    height: 100%;
    background-color: #D9D9D9;
    box-sizing: border-box;
    overflow: hidden;
}
.IM_message_box_left ul{
    width: 100%;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}
.IM_message_box_left ul::-webkit-scrollbar,.IM_message_box .drag-body .msg-content-box::-webkit-scrollbar,.IM_message_box .drag-body .team-member-box ul::-webkit-scrollbar,.addGroupByAlex .group-body .group-body-item .search-result-box::-webkit-scrollbar{
    width: 4px;
    height: 1px;
}

.IM_message_box_left ul::-webkit-scrollbar-thumb,.IM_message_box .drag-body .msg-content-box::-webkit-scrollbar-thumb,.IM_message_box .drag-body .team-member-box ul::-webkit-scrollbar-thumb,.addGroupByAlex .group-body .group-body-item .search-result-box::-webkit-scrollbar-thumb {
    border-radius: 4px;
    -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
    background: #c9c9c9;
}

.IM_message_box_left ul::-webkit-scrollbar-thumb,.IM_message_box .drag-body .msg-content-box::-webkit-scrollbar-thumb,.IM_message_box .drag-body .team-member-box ul::-webkit-scrollbar-thumb,.addGroupByAlex .group-body .group-body-item .search-result-box::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    background: #EDEDED;
}

.IM_message_box_left ul li{
    position: relative;
    margin: 5px;
    padding: 5px 30px 5px 5px;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    border-radius: 3px;
    white-space: nowrap;
    box-sizing: border-box;
}
.IM_message_box_left ul li.active,.IM_message_box_left ul li.active:hover{
    background: #f1f1f1;
}
.IM_message_box_left ul li:hover{
    background-color: #E2E2E2;
}
.IM_message_box_left ul li img{
    height: 40px;
    width: 40px;
    border-radius: 40px;
    margin-right: 7px;
}
.IM_message_box_left ul li .name{
    height: 40px;
    width:90px;
    line-height: 40px;
    vertical-align: top;
    font-size: 16px;
    color: #444;
    display: inline-block;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}
.IM_message_box_left ul li i{
    position: absolute;
    right: 5px;
    top: -15px;
    color: #555;
    font-size: 16px;
    display:none;
}
.IM_message_box_left ul li:hover i{
    display:block;
}
.IM_message_box_left ul li i:hover {
    color: #eb3b5a;
}
.IM_message_box_left ul li:hover .iconfont{
    display: block !important;
}
.IM_message_box{
    width: 100%;
    height: 100%;
    background-image: url('../img/imcontentbg/1.png');
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}
.IM_message_box.right{
    width: calc(100% - 200px);
    flex:1;
}
.IM_message_box .drag-title{
    height: 80px;
    border-bottom: none;
    background-color: #F8F8F8;
    background-color: rgba(245,245,245,.7);
    cursor:move;
    position: relative;
    margin: 0px !important;
}
.IM_message_box .drag-title .btn-box{
    top: 0;
    right: 0;
    height: 34px;
    display: flex;
    position: absolute;
    cursor: default;
}
.IM_message_box .drag-title .btn-box li{
    width: 32px;
    height: 34px;
    line-height: 34px;
    flex: inherit;
    text-align: center;
    cursor: pointer;
    color: #333;
}
.IM_message_box .drag-title .btn-box li:hover{
    background: rgba(0, 0, 0, 0.1);
}
.IM_message_box .drag-title .btn-box li.close:hover{
    background: #eb3b5a;
    color: #f1f1f1 !important;
}
.IM_message_box .drag-title .btn-box li i{
    
    font-size: 14px;
}
.IM_message_box .drag-title .user-box{
    padding: 15px;
    height: 50px;
    display: inline-block;
    cursor: default;
}
.IM_message_box .drag-title .user-box .icon-arrow-down{
    font-size: 18px;
}
.IM_message_box .drag-title .user-box .trans-box-down{
    transform:rotate(0deg);
    transition: all linear .5s;
    display: inline-block;
}
.IM_message_box .drag-title .user-box .arrow-down-box{
    margin-left:20px;
    color: #999;
    cursor: pointer;
    font-size: 14px !important;
}
.IM_message_box .drag-title .user-box .trans-box-down2{
    transform:rotate(180deg);
    transition: all linear .5s;
}
.IM_message_box .drag-title .user-box img{
    width:50px;
    height: 50px;
    border-radius: 50px;
    margin-right: 10px;
}
.IM_message_box .drag-title .user-box .name{
    display: inline-block;
    font-size: 18px;
    color:#444;
    height: 50px;
    line-height: 50px;
    
    vertical-align: top;
}
.IM_message_box .drag-body{
    top:80px;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background: rgba(255,255,255,.9)
}
.IM_message_box .drag-body .team-member-box{
    position: absolute;
    left: 0;
    top: 0px;
    right: 0;
    height: 200px;
    padding: 10px;
    border-bottom: 1px solid #D9D9D9;
    background-color: #fff;
    box-shadow: none;
    z-index: 2;
}
.IM_message_box .drag-body .team-member-box ul{
    width:100%;
    height:100%;
    display:flex;
    overflow-y: auto;
    flex-wrap: wrap;
}
.IM_message_box .drag-body .team-member-box ul li{
    width:120px;
    text-align:center;
    height: 100px;
}
.IM_message_box .drag-body .team-member-box ul li img{
    width: 48px;
    height: 48px;
    border-radius: 100%;
}
.IM_message_box .drag-body .team-member-box ul li span {
    display: block;
    padding: 0 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size:14px;
}
.IM_message_box .drag-body .team-member-box ul li .add{
    width: 48px;
    height: 48px;
    border-radius: 100%;
    border: 1px #999 dashed;
    
    text-align: center;
    line-height: 48px;
    display: inline-block;
    cursor: pointer;
}
.IM_message_box .drag-body .team-member-box ul li .add i{
    font-size: 32px;
    color: #999;
}
.IM_message_box .drag-body .team-member-box ul li .add:hover{
    border: 1px #333 dashed;
    
}
.IM_message_box .drag-body .team-member-box ul li .add:hover i{
    color: #666 !important;
}
.IM_message_box .drag-body .msg-content-box{
    left: 0;
    right: 0;
    top:0;
    bottom: 160px;
    overflow-y: auto;
    position: absolute;
    padding:15px;
}
.IM_message_box .drag-body .msg-foot-box{
    border-top: 1px solid #F1F1F1;
    position: absolute;
    bottom: 0px;
    height: 160px;
    left: 0px;
    right: 0px;
}
.IM_tool ul{
	display: flex;
	width: 100%;
	height: 100%;
	padding: 10px 0;
}

.IM_tool ul li{
	line-height: 20px;
	flex: 1;
	text-align: center;
}
.IM_tool ul li i{
	font-size: 18px;
    color: #999999;
    cursor: pointer;
    font-weight: bold;
}
.IM_tool .search{
    padding:5px;
    position: relative;
}
.IM_tool .search input {
    width: 100%;
    padding: 0 30px 0 10px;
    height: 30px;
    line-height: 30px;
    border: none;
    border-radius: 3px;
	background-color: #ddd;
    box-sizing: border-box;
}
.IM_tool .search input.s-box{
    padding-left:30px;
}
.IM_tool .search .close {
    position: absolute;
    right: 9px;
    top: 5px;
    font-size: 20px;
    cursor: pointer;
    color: #a0a0a0;
    font-weight: 400;
}
.IM_tool .search .search {
    position: absolute;
    top: 1px;
    left: 5px;
    font-size: 20px;
    cursor: pointer;
    color: #a0a0a0;
    font-weight: 400;
}
.IM_tool ul li i:hover,.IM_tool .search .close:hover{color:#eb3b5a;}
.IM_groupMemberList::-webkit-scrollbar,.IM_chatLayer .msg-content::-webkit-scrollbar{width: 4px;height: 1px;}
.IM_groupMemberList::-webkit-scrollbar-thumb,.IM_chatLayer .msg-content::-webkit-scrollbar-thumb {-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);border-radius: 4px;background: #ccc;}
.IM_chatLayer{position: absolute; right: 360px; top: 128px; bottom: 0; width: 800px; ; background: #ECF3F8; z-index: 99; border:1px solid #B4BCC2; border-top: none; border-bottom: none; }
.IM_chatLayer .chatHeader{height: 40px; line-height: 40px; border-bottom: 1px solid #d6dde2; padding: 0 10px; position: relative;}
.IM_chatLayer .chatHeader>i{color: #999; margin: 0 4px;}
.IM_chatLayer .chatHeader .chatHeaderLayer{position: absolute; width:120px; height: 60px;  background: #fff; right:-14px; top:37px; z-index: 80;border-radius: 4px;
box-shadow:0px 4px 10px 0px rgba(0,0,0,0.3);}
.chatHeaderLayerUpIcon{
	position: absolute;
left: 52px;
top: -14px;	
width: 0;
height: 0;
border-width: 8px;
border-style: solid;
border-color: transparent transparent #fff transparent;
}
.IM_chatLayer .chatHeader .chatHeaderLayer li{text-align: center; color: #333; cursor:pointer; height: 30px; line-height: 30px; cursor: pointer; border-radius: 4px;}
.IM_chatLayer .chatHeader .chatHeaderLayer li:hover{background: #f2f2f2;}
.IM_chatLayer .chatHeader .chatHeaderLayer li i{color: #666; font-size: 12px;}
.IM_chatLayer .msg-content{position: absolute;bottom: 60px;left: 0px;right: 0px;top: 40px ;padding: 20px;overflow-y: auto;-webkit-app-region: no-drag !important}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.msg-content .tip{text-align: center;margin: 15px;color: #999;font-size: 12px;cursor: pointer;}
.msg-content .line-msg-right{}
.msg-content .line-msg-left,
.msg-content .line-msg-right{margin-bottom:20px;width: 100%;-webkit-user-select:text;}
.msg-content .line-msg-left .head,
.msg-content .line-msg-right .head{float: left;width: 35px;height: 35px;border-radius: 35px;background: transparent !important;}
.msg-content .line-msg-right .head{float: right}
.msg-content .line-msg-right .comment-right {padding: 5px;max-width: 70%;background: #5FB878;border-radius: 9px 0 9px 9px;
float: right;margin:5px 12px 0 0;color:#333;word-wrap: break-word;word-break: normal;
position: relative;font-size: 14px; font-weight: 400;line-height: 24px; min-width: 30px;}
.msg-content .line-msg-right .comment-right>span{color: #fff;}

.msg-content .line-msg-left .comment-left .customDiv{background: #fff; display: flex; cursor: pointer;  min-width: 200px; padding:5px 5px 0; border-radius: 4px 4px 0 0;}
.msg-content .line-msg-left .comment-left .customDiv .iconDiv{padding-bottom: 6px;}
.msg-content .line-msg-left .comment-left .customDiv .iconDiv>img{float: left; height: 28px; margin-right: 6px; }
.msg-content .line-msg-left .comment-left .customDiv  p{line-height: 14px; height: 14px; padding: 0 5px; overflow: hidden; }
.msg-content .line-msg-left .comment-left .customDiv .fileName{font-size: 14px; color: #333; }
.msg-content .line-msg-left .comment-left .customDiv .fileSize{font-size: 12px; color: #666;}
.msg-content .line-msg-left .comment-left .dowload{color: #3FB9F8; font-size: 12px; padding: 2px 0;}
.msg-content .line-msg-left .comment-left .dowload:hover{color: #E95252; cursor: pointer;}
.msg-content .line-msg-left .comment-left .downloadDiv{border-top:1px solid #E6E6E6;width: 100%; 
background: #fff; overflow: hidden; border-radius: 0 0 4px 4px; padding-right: 10px;}

.msg-content .emoji-small{width: 30px;height: 30px;}
.msg-content .line-msg-right .comment-right .customDiv{background: #fff; display: flex; cursor: pointer; min-width: 200px; padding:5px 5px 0; border-radius: 4px 4px 0 0;}
.msg-content .line-msg-right .comment-right .customDiv .iconDiv{padding-bottom: 6px;}
.msg-content .line-msg-right .comment-right .customDiv .iconDiv>img{float: left; height: 28px; margin-right: 6px; }
.msg-content .line-msg-right .comment-right .customDiv  p{line-height: 14px; height: 14px; padding: 0 5px; overflow: hidden; }
.msg-content .line-msg-right .comment-right .customDiv .fileName{font-size: 14px; color: #333; }
.msg-content .line-msg-right .comment-right .customDiv .fileSize{font-size: 12px; color: #666;}
.msg-content .line-msg-right .comment-right .dowload{color: #3FB9F8; font-size: 12px; padding: 2px 0;}
.msg-content .line-msg-right .comment-right .dowload:hover{color: #E95252; cursor: pointer;}
.msg-content .line-msg-right .comment-right .downloadDiv{border-top:1px solid #E6E6E6;width: 100%; 
background: #fff; overflow: hidden; border-radius: 0 0 4px 4px; padding-right: 10px;}
.msg-content .line-msg-right .comment-right img,.msg-content .line-msg-left .comment-left img{border-radius:5px}
.customBg{background:#D9D9D9!important;}

.msg-content .line-msg-left .comment-left {padding: 5px;max-width: 70%;position: relative;
background:#e2e2e2;border-radius:0 9px 9px 9px;float: left;margin-left: 12px;word-wrap: break-word;
 word-break: normal;font-size: 14px;font-weight: 400;line-height: 24px;}

.msg-content .line-msg-left .comment-left a.a-download{cursor: pointer;}
.msg-content .line-msg-left .comment-left a.a-download:hover{text-decoration: underline; color: #E95252;}
.msg-content .tip-box{text-align: center;}
.msg-content .tip-box .item-tip,
.msg-content .tip-box .item-time{background: #DADADA;color: #fff;padding: 5px 10px;font-size: 12px;display: inline-block;border-radius: 4px;margin: 15px 0;}
.msg-foot-box .user-input-box .tool{
    padding: 0 8px;
    height: 38px;
    line-height: 38px;
    display:flex;
    width:100%;
    box-sizing:border-box;
}
.msg-foot-box .user-input-box .tool li{
    flex: inherit;
    margin: 0px 10px;
    
    height: 38px;
    line-height: 38px;
}
.msg-foot-box .user-input-box .tool li i{
    font-size:20px;
    color:#333;
    cursor: pointer;
}
.msg-foot-box .user-input-box .foot-Btn-Box{
    position: relative;
    height: 46px;
}
.msg-foot-box .user-input-box .foot-Btn-Box .chat-send-box{
    position: absolute;
    right: 15px;
    top: 3px;
    height: 32px;
    line-height: 32px;
    font-size: 0;
    cursor: pointer;
}
.msg-foot-box .user-input-box .foot-Btn-Box .chat-send-box .el-button--info{
    line-height: 30px;
    height: 30px;
    font-size: 14px;
    padding: 0 20px;
    border:none;
    background-color: #5FB878;
}
.msg-foot-box .user-input-box .foot-Btn-Box .chat-send-box .el-button--primary{
    background-color: #5FB878;
    border:none;
    vertical-align: top;
}
.msg-foot-box .user-input-box .foot-Btn-Box .chat-send-box .el-button--primary:hover,.msg-foot-box .user-input-box .foot-Btn-Box .chat-send-box .el-button--info:hover
{
    background-color: #69BC80;
}
.msg-foot-box .user-input-box input[type='file']{position: absolute;right: 0;top: 0;bottom: 0;left: 0;}
.msg-foot-box .user-input-box .tool-box i{color: #333;-webkit-app-region: no-drag !important;margin-left: 5px; font-size:22px;cursor: pointer;font-weight: 500;}
.msg-foot-box .user-input-box .tool-box .zt-emoji{font-size: 18px !important;}
.msg-foot-box .user-input-box .input{
    display: block;
    width: 100%;
    padding:0 10px;
    height: 68px;
    line-height: 20px;
    border: none;
    resize: none;
    background: 0 0;
    overflow-y: auto;
    cursor:text;
    box-sizing:border-box;
    font-size:14px;
    color:#444;
    font-family:"微软雅黑";
}
.msg-foot-box .user-input-box .input::-webkit-scrollbar{width: 0px;height: 0px;background-color: #F5F5F5;}
/*定义滚动条的轨道，内阴影及圆角*/
.msg-foot-box .user-input-box .input::-webkit-scrollbar-track{background-color: #F5F5F5;}
/*定义滑块，内阴影及圆角*/
.msg-foot-box .user-input-box .input::-webkit-scrollbar-thumb{border-radius: 20px;background-color: #aaa;margin-bottom: 24px;}
.msg-foot-box .user-input-box .input:hover::-webkit-scrollbar,
.msg-foot-box .user-input-box .input:focus::-webkit-scrollbar{width: 4px;height: 4px;background-color: #F5F5F5;}
.msg-foot-box .user-input-box .bottom-op-box{text-align: right;padding-right: 20px;position: relative;}
.msg-foot-box .user-input-box .bottom-op-box .errorTip{color:#ef4455;font-size: 12px;position: absolute;left: 30px;top: 10px;}
.msg-foot-box .user-input-box .bottom-op-box .send-msg{height: 35px;padding: 0px 30px;font-size: 16px;background: #E9E8E5;border: none;outline: none;color: #7B7A79;border-radius: 4px;cursor: pointer;}
.msg-foot-box .user-input-box .bottom-op-box .close-letter{height: 35px;padding: 0px 30px;font-size: 16px;background: #e0af1b;border: none;outline: none;color: white;border-radius: 4px;cursor: pointer;margin-right: 10px;}
.msg-foot-box .user-input-box .readBtn,
.msg-foot-box .user-input-box .send-msg:hover{color: #FFF !important;background: #ef4455 !important;}

.IM_groupMemberList{width: 100%; max-height: 100px; padding: 10px; overflow-y: auto; border-bottom: 1px dashed #ccc;}
.IM_groupMemberList li{position: relative; width:40px; height: 60px; overflow: hidden; font-size: 12px; float: left; margin: 5px;}
.IM_groupMemberList li>img{width:40px; height: 40px; border-radius: 20px;}
.IM_groupMemberList li i{position: absolute; right: 0; top: 0; cursor:pointer; display: none;}
.IM_groupMemberList li:hover i{display: block;}
.IM_groupName{padding: 10px 20px;}
.IM_groupName .el-input .el-input__inner,.IM_groupName .el-select .el-input{border-radius: 0!important;}
.IM_cloudTable{width: 100%;}
.IM_cloudTable tr th{text-align: left; background: #f2f2f2; padding: 3px 0; text-indent: 5px;}
.IM_cloudTable tr{font-size: 12px;}
.IM_cloudTable tr td{padding:3px 0;}
/*.el-tree-style-div .el-tree-node:hover{background: rgba(0,0,0,.1)!important;}*/
.IM_messageList .sysMsgDiv{font-size: 18px; padding: 10px;}
.IM_messageList .sysMsgDiv i{font-size: 18px; color: #E95252; cursor: pointer;}
.addGroupByAlex{
    z-index: 99999 !important;
    
}
.addGroupByAlex .el-dialog__header{
    display: none;
    
}
.addGroupByAlex .el-dialog__body{
    border-top: 3px solid #0095ff;
    padding: 10px !important;
    
}
.addGroupByAlex .el-dialog{
    width:660px;
}
.addGroupByAlex .el-dialog__body .title{
    font-size: 24px;
    width: 100%;
    height: 40px;
    line-height: 40px;
    position: relative;
    font-family: "PingFangSC-fine";
    color:#0095ff;
}
.addGroupByAlex .el-dialog__body .title .icon-jiesan{
    position: absolute;
    right: 0;
    color: #ef4455;
    cursor: pointer;
}
.addGroupByAlex .new-group-name .search-input{
    width:100%;
    height: 30px;
    line-height: 30px;
    padding: 5px;
    box-sizing: border-box;
    border: 1.5px solid #ddd;
    border-radius: 1.5px;
    color: #666;
}
.addGroupByAlex .group-body{
    width:100%;
    display: flex;
    height: 360px;
    overflow: hidden;
}
.addGroupByAlex .group-foot{
    width:100%;
    display: block;
    height: 40px;
    text-align: right;
}
.addGroupByAlex .group-body .group-body-item{
    width:49%;
    flex: inherit;
    height: 100%;
    padding: 10px 0;
    box-sizing: border-box;
    position: relative;
}
.addGroupByAlex .group-body .group-body-item:last-child{
    margin-left: 2%;
}
.addGroupByAlex .group-body .group-body-item .search-input{
    width:100%;
    height: 30px;
    line-height: 30px;
    padding: 5px;
    box-sizing: border-box;
    border: 1.5px solid #ddd;
    border-radius: 1.5px;
    color: #666;
}
.addGroupByAlex .group-body .group-body-item .search-input:focus,.addGroupByAlex .new-group-name .search-input:focus{
    border: 1.5px solid #bbb;
    border-radius: 1.5px;
}
.addGroupByAlex .group-body .group-body-item .search-result-box{
    position: absolute;
    top: 50px;
    bottom: 0;
    right: 0;
    left: 0;
    overflow-y: auto;
    font-size: 12px;
}
.addGroupByAlex .group-body .group-body-item .search-result-box .el-tree-node__content{
    height: auto !important;
}
.addGroupByAlex .group-body .group-body-item .search-result-box .IM_messageList{
    top:0px;
    bottom:0px;
}

.addGroupByAlex .group-body .group-body-item .search-result-box .IM_messageList ul li{
    height: 40px;
    padding: 5px;
}
.addGroupByAlex .group-body .group-body-item .search-result-box .IM_messageList ul li img{
    height: 30px;
    width: 30px;
}
.addGroupByAlex .group-body .group-body-item .search-result-box .IM_messageList ul li .close{
    visibility: hidden;
    position: absolute;
    top: 7px;
    right: 10px;
}
.addGroupByAlex .group-body .group-body-item .search-result-box .IM_messageList ul li:hover .close{
    visibility: visible;
}
.addGroupByAlex .group-body .team-member-box{
    position: absolute;
    left: 0;
    top: 0px;
    right: 0;
    height: 200px;
    padding: 10px;
    border-bottom: 1px solid #D9D9D9;
    background-color: #fff;
    box-shadow: none;
    z-index: 2;
}
.addGroupByAlex .group-body .team-member-box ul{
    width:100%;
    height:100%;
    display:flex;
    overflow-y: auto;
    flex-wrap: wrap;
    padding-top: 10px;
}
.addGroupByAlex .group-body .team-member-box ul li{
    width:120px;
    text-align:center;
    height: 100px;
    position: relative;
}
.addGroupByAlex .group-body .team-member-box ul li img{
    width: 48px;
    height: 48px;
    border-radius: 100%;
}
.addGroupByAlex .group-body .team-member-box ul li span {
    display: block;
    padding: 0 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size:14px;
}
.addGroupByAlex .group-body .team-member-box ul li .icon-close1{
    position: absolute;
    top: -11px;
    right: 28px;
    cursor: pointer;
}
.addGroupByAlex .group-body .team-member-box ul li .icon-close1:hover{
    color: #ef4455;
}
.addGroupByAlex .cl-name{
    padding: 5px 0;
    font-size: 14px;
    color: #999;
    font-family: PingFangSC-Semibold !important;
    margin:15px 0 0 0;
}