html,body {overflow:hidden; font-family:'Work Sans','Noto Sans KR',sans-serif;font-size:16px;line-height:1.5;font-weight:300;background-color:#fff}
#memo { overflow:hidden; position:fixed; top:50px; bottom:0; left:0; right:0; }
#memo-header {overflow:hidden; display:none;}
#memo-body {overflow:hidden; position:absolute;top:0;left:0;right:0;bottom:60px}
#memo-body #memo-left  { padding:20px; width:120px;height:100%;background:#f8f8f8}
#memo-body #memo-right { padding:0; }
#memo-footer { overflow:hidden; position:absolute;left:0;right:0;bottom:0;height:60px;text-align:center;padding-top:20px;font-size:11px;border-top:1px solid#e2e8f0;color:#a0aec0;}
#memo-mng { width:100%; }
#memo-mng .mng-pr {text-align:center;padding:10px}
#memo-mng .chat-link{cursor:pointer;}
#memo-mng .mng-img,
#memo-mng .mng-name { width:100%; text-align:center}
#memo-mng .mng-img { width:60px; height:60px; overflow:hidden;border-radius:100%}
#memo-mng .mng-img img { width:100%}
#memo-mng .mng-name .badge3 { display:block; width:auto;margin-top:3px !important;padding:0.25rem;font-size:1rem;font-weight:300; white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:#e83e8c;color:#ffffff}

.top_menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  padding: 15px;
  z-index: 999; /* 다른 요소들 위에 올려놓기 위해 */
}

.top_menu .home {
  position: absolute;
  left: 20px;
  font-size: 20px;
  color: #4a4a4a;
}

.top_menu .logo {
  text-align:center
}

.top_menu .logo img {
  width: auto;
  height: 30px;
}

.top_menu .member {
  position: absolute;
  right: 20px;
  top:10px
}

.top_menu .member img {
  width: 40px;
  min-width: 40px;
  max-width: 40px;
  height: 40px;
  min-height: 40px;
  max-height: 40px;
  border-radius:50%
}

#memo-search { overflow:hidden;position:absolute;top:0;left:0;right:0;padding:10px 20px 10px 20px;height:60px;z-index:1;background-color:#fff;border-bottom:1px solid #ecf2f2}
#memo-search #search-input {}
a {
    color: #092ea4;
    text-decoration: none;
}


#memo-search #search-submit {position:absolute;top:12px;right:48px;padding:3px 0px 2px 10px;height:36px;background-color:#0000;border-top-right-radius:4px;border-bottom-right-radius:4px;color:#ff8900;border:0px}
#memo-search #search-submit:focus{outline:none !important}

.sec_inp {background-color:#ecf2f2;border-radius:10px;border:0px;padding-left:10px;padding:10px 0px 10px 0px;padding-left:10px;font-size:14px;width:100%;font-weight:bold;color:#5a5a5a}

.sec_inp:focus, #chat-message {
    outline: none !important; 
    border-color:none !important;
    -webkit-box-shadow:none !important;
    -moz-box-shadow:none !important;
    box-shadow:none !important;
}

.sec_inp::placeholder {color:#6a6a6a;}
.sec_inp::-webkit-input-placeholder {color:#6a6a6a}
.sec_inp:-ms-input-placeholder {color:#6a6a6a;}

#btn_close {display:inline-block;cursor:pointer;}
#btn_close2 {position:absolute; top: 16px; right:18px;cursor:pointer;color:#6a6a6a}
#btn_close3 {position:absolute; bottom: 21px; right:20px;cursor:pointer; color:#a0aec0; font-size: 14px}


#memo-chatlist { overflow:hidden; overflow-y:auto; position:absolute;top:60px;bottom:0;left:0;right:0}
#memo-chatlist ul, #memo-chatlist ol, #memo-chatlist dl {margin:0;padding:0;list-style:none;}
#memo-chatlist li, #memo-chatlist dt, #memo-chatlist dd {margin:0;padding:0;list-style:none;}
#memo-chatlist .memo-chatlist {padding-top: 10px;}
#memo-chatlist .memo-chatroom {margin:20px; padding:10px 20px;display:flex;align-items:center;cursor:pointer;;background-color: #0000;margin-top:10px;margin-bottom:5px;border-radius:10px}
#memo-chatlist .memo-chatroom:hover {box-shadow:0px 0px 5px rgba(0,0,0,0.1);}
#memo-chatlist .memo-chatroom .chatroom-icon { display:inline-block;border-radius:50%;overflow:hidden}
#memo-chatlist .memo-chatroom .chatroom-icon img {width:60px;height:60px;display:block;border-radius:50%}
#memo-chatlist .memo-chatroom .chatroom-view {margin-left:10px;}
#memo-chatlist .memo-chatroom .chatroom-title,
#memo-chatlist .memo-chatroom .chatroom-date {display:block;}


.chatroom-name {font-size: 14px;font-weight:bold;color:#cdcdcd}
.chatroom-title {color:#eee;font-size: 12px}
.chatroom-date {color:#a1a1a1;font-size:10px;opacity:0.7;font-weight:bold}

#memo-chatlist .memo-chatroom .chatroom-cnt2 {display:block;color:#666; margin-right:-25px}
#memo-chatlist .memo-chatroom .chatroom-cnt {display:block;color:#000;margin-right:8px;border-radius:4px;width:30px;text-align:center;border:1pxsolid #e2e8f0;font-size:11px !important}
#memo-chatlist .memo-chatroom .badge3 {position:absolute;right:35px;padding:0.25rem;font-size:1rem;font-weight:300;white-space:nowrap;overflow:hidden; text-overflow:ellipsis;}

#memo-chatlist .memo-chatroom .badge2 {position:absolute;right:35px;padding:0.25rem;white-space:nowrap;width: 100px;overflow:hidden;text-overflow:ellipsis;}
#memo-chatlist .memo-chatroom .badge2 .cntnum {font-weight:bold;color:#ffaa00;}

.no_read {background:#ac92ec;border:2px solid #fff;border-radius:10px;width:14px;height:14px;margin-left: -7px;}
.no_read2 {width:14px;height:14px; margin-left:-7px}

@keyframes blinker {
	50% {opacity:0}
}

@media all and (max-width:440px) {
    .cnttxt {display: none;}
    #memo-chatlist .memo-chatroom .badge2 {width: 50px;}
}

@media all and (max-width:390px) {
    #memo-chatlist .memo-chatroom .badge2 {display:none}
}


/*채팅 룸*/
#chat-header {z-index:999;overflow:hidden;position:absolute;top:0;left:0;right:0;height:60px;background-color: rgba(255, 255, 251, 0.55);-webkit-backdrop-filter: blur(17px);backdrop-filter: blur(17px);display: flex;justify-content: center;}
#chat-header .badge3 {margin-left:-10px;padding:0.2rem;font-size:14px;font-weight:bold;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#2a2a2a;line-height:60px;font-weight:bold;}

#chat-header .mo_bdgs {position: absolute; left: 20px; margin-left: 40px}
#chat-header .mo_nick {position:absolute;font-size:20px;font-weight:500;color:#3a3a3a;margin-left:-40px}
/*
#chat-header .mo_tits {position: absolute; right:20px; }
*/

#chat-body {position:absolute;top:0;left:0;right:0;bottom:60px;overflow:hidden;overflow-y:scroll;background-color:#f7f7f7}
#chat-history {background-color: #fff; border:0px; border-radius: 20px; font-size: 13px; padding: 10px; display:inline-block; min-width:150px;width: 30%; color:#718096;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.07);margin-top: 35px}
.chat_history_div {width: 100%; top:70px; position: fixed; text-align: center; z-index: 9999;}
.chat_history_div_wrap {width: 100%; height: 60px;}

#chat-list {}
#chat-list .recv {position:relative;float:right;margin-right:10px;clear:both;margin-bottom:0px;}
#chat-list .send {position:relative;float:left;margin-left:10px;clear:both;margin-bottom:0px}
#chat-list .p_icon{position: absolute;display:inline-block;width:40px;height:40px;border-radius:40%;overflow:hidden;margin-bottom:10px;}
#chat-list .p_icon img{width:100%;}
#chat-list .p_nick {position:absolute;margin-top:10px;left:50px;width:150px;font-weight:bold;font-size:15px;color:#3a3a3a}
#chat-list .chkdate{min-width:270px;width:60%;height:40px;margin:auto;text-align:center;line-height:40px;color:#a0aec0;font-size:11px;font-weight: bold;background-color:#fff;border-radius:25px;margin-bottom:40px}
#chat-list  .bubble_recv {word-break:break-all;position:relative;padding:5px 10px 5px 10px;background:#04a5ff;-webkit-border-radius:12px;-moz-border-radius:12px;border-radius:12px;max-width:250px;font-size:12px;margin-right:5px;color:#fff}

#chat-list .chat_time_send{text-align:right;margin-bottom:20px;font-size:9px;font-weight:bold;color:#304b95;opacity: 0.7;margin-top:5px}
#chat-list .chat_time_recv{width:100%;text-align:left;margin-bottom:20px;font-size:9px;font-weight:bold;color:#304b95;opacity:0.7;margin-top:5px}
#chat-list .chat_time2_send{width:100%;text-align:right;margin-bottom:20px;font-size:9px;font-weight:bold;color:#304b95;opacity:0.7;margin-top:5px}
#chat-list .chat_time2_recv{width:100%;text-align:left;margin-bottom:20px;font-size:9px;font-weight:bold;color:#304b95;opacity:0.7;margin-top:5px}

#chat-list  .bubble_send {word-break:break-all;position:relative;padding:5px 10px 5px 10px;background:#828282;webkit-border-radius:12px;-moz-border-radius:12px;border-radius:12px;max-width:250px;color:#fff; font-size:10px; margin-top: 50px; margin-left: 5px;}
#chat-list .chkdate {clear:both;}

#chat-footer {z-index:9999;overflow:hidden;position:absolute;left:0;right:0;bottom:0;height:60px;background:0000}

#chat-message {overflow:hidden;margin:0;border:0;background:#ecf1f2;border-radius:10px;font-size:15px;padding:20px 120px 20px 20px;min-height:50px;max-height:50px;margin-left:50px;min-width:95%;max-width:95%;color:#2a2a2a}

.chat_message_div {float:left;width:90%;padding-left:10px;padding-top:5px;background-color:#0000}
.chat_message_btn_div {float: right; width:1%;}

/*새로고침*/
#btn-ref {position:absolute;align-items:center;justify-content:center;background:#0000;width:60px;height:60px !important;cursor:pointer;text-align:center;font-weight:bold;color:#a0aec0;margin-top:0px;right:0px;padding-top:19px}

#btn-chat {position:absolute;align-items:center;justify-content:center;background:#ecf1f2;width:50px;height:50px !important;border-radius:5px;cursor:pointer;text-align:center;font-weight:bold;color:#afa2fe;margin-top:5px;margin-right:1%;right:60px;padding-top:15px;margin-left:10px;}

#chat_file_up {position:absolute;align-items:center;justify-content:center;background:#0b93fa;width:40px;height:40px !important;cursor:pointer;text-align:center;font-weight:bold;color:#a0aec0;margin-top:10px;left:10px;padding-top:19px;border-radius:50%}

.file-upload {
  position: relative;
  color:#f9f9f9;
  font-size:1.1.1em;
  bottom:12px
}

.file {
  display: none;
}

.fas {
  cursor: pointer;
}

.del_div {position:absolute;margin-top:-62px; margin-left:-20px;}

#chat-message::placeholder {color:#a0aec0;}
#chat-message::-webkit-input-placeholder {color:#a0aec0;}
#chat-message:-ms-input-placeholder {color:#a0aec0;}



input[type=text]:focus,input[type=password]:focus, textarea:focus,select:focus {
	outline:none !important; border:0px !important;
}

#chat-message:focus {outline:none !important; border:0px !important;}
.ui-state-active {background: #f9f9f9 !important; color:#000 !important; font-weight: bold !important; border:1px solid #f1f1f1 !important; box-sizing: border-box}