.select-user-container {background-color:#fff; padding: 0px;height: 100%;width: 500px; position:relative;}
.select-user-container .top {border-top: 1px;border-right: 1px;border-bottom: 0;border-left: 1px;border-style: solid;border-color: #e6e6e6;padding: 5px;}
.select-user-container .top .selected-user {border: 1px dotted #e6e6e6;line-height: 30px;padding: 5px;overflow: hidden;}
.select-user-container .top .selected-user .list {width: 498px;height: 60px;overflow-y: scroll;overflow-x: hidden;}
.select-user-container .center {border: 1px solid #e6e6e6;height: 40px;overflow: hidden;}
.select-user-container .center .list {padding: 5px 8px;line-height: 30px;height: 50px;white-space: nowrap;overflow-x: scroll;overflow-y: hidden;}
.select-user-container .center .list span {cursor: pointer;}
.select-user-container .center .list span::after {content: ' > ';}
.select-user-container .center .list span:last-child {color: #b7b5b5; cursor: default;}
.select-user-container .center .list span:last-child::after {content: ''}
.select-user-container .bottom {font-size: 0;}
.select-user-container .bottom .left {display: inline-block;width: 198px;border-top: 0;border-right: 1px;border-bottom: 1px;border-left: 1px;border-style: solid;border-color: #e6e6e6;overflow: hidden;}
.select-user-container .bottom .left .list {width: 216px;height: 300px;overflow-y: scroll;overflow-x: hidden;}
.select-user-container .bottom .left .list div {font-size: 14px;padding: 5px 8px;line-height: 28px;border-top: 0;border-right: 1px;border-bottom: 1px;border-left: 0;border-style: dotted;border-color: #e6e6e6; cursor: pointer;}
.select-user-container .bottom .left .list div:last-child {border-bottom: 0;}
.select-user-container .bottom .right {display: inline-block;width: 299px;border-top: 0;border-right: 1px;border-bottom: 1px;border-left: 0px;border-style: solid;border-color: #e6e6e6;overflow: hidden;}
.select-user-container .bottom .right .list {width: 316px;height: 300px;overflow-y: scroll;overflow-x: hidden;}
.select-user-container .bottom .right .list .user-item {padding: 5px;border-bottom: 1px dotted #e6e6e6; cursor: pointer;}
.select-user-container .bottom .right .list .user-item .avatar {display: inline-block;width: 40px;height: 40px; line-height: 40px; font-size: 20px; border-radius: 20px; text-align: center;}
.select-user-container .bottom .right .list .user-item .avatar img {width: 100%;height: 100%;}
.select-user-container .bottom .right .list .user-item .info {display: inline-block;font-size: 14px;line-height: 20px;vertical-align: top;margin-left: 5px;}
.select-user-container .bottom .right .list .user-item .info div {overflow: hidden;white-space: nowrap;text-overflow: ellipsis;width: 244px;}
.select-user-container .bottom .right .list .user-item .checked {display: none;}
.select-user-container .bottom .right .list .active {background: #f1f1f1;position: relative;}
.select-user-container .bottom .right .list .active .checked {position: absolute;display: block;top: 12px;right: 12px;width: 25px;height: 25px; font-size: 25px;}
.select-user-container .footer {background-color:#fff;position: absolute;bottom: 0;width: 100%;text-align: center;}
.select-user-container .footer div {padding: 5px;}