html,body {overflow:hidden; font-family:'Work Sans','Noto Sans KR',sans-serif; height:100%; font-size:16px; line-height:1.5; font-weight:300;/*background-color: #F1F6FB;*/}
#memo { overflow:hidden; position:fixed; top:0; 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}
#memo-search { overflow:hidden; position:absolute; top:0; left:0; right:0; padding:10px 20px 10px 20px; height:60px; z-index:1; background-color: #ffcc00;}
#memo-search #search-input {}


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


#btn_close {display:inline-block;cursor:pointer;}
#btn_close2 {position:absolute; top: 18px; right:18px;cursor:pointer;}
#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; -webkit-flex: 1; -ms-flex: 1; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center;cursor:pointer; background-color: #fff; margin-top: 10px; margin-bottom: 5px;border-radius: 6px;}
#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; width:50px; border-radius:40%; overflow:hidden; }
#memo-chatlist .memo-chatroom .chatroom-icon img { width:100%; display:block; }
#memo-chatlist .memo-chatroom .chatroom-view {margin-left:20px;}
#memo-chatlist .memo-chatroom .chatroom-title,
#memo-chatlist .memo-chatroom .chatroom-date {display:block;}


.chatroom-name {font-size: 14px; font-weight: bold; color:#2D3748;}
.chatroom-title {color:#718096; font-size: 12px;}
.chatroom-date {color:#718096; 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:#4a5568; !important; margin-right: 8px; border-radius: 4px; width: 30px; text-align: center; border:1px solid #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:#FFCC00;border:2px solid #fff;border-radius:10px;width:14px;height:14px; margin-left: -7px;}
.no_read2 {width:14px;height:14px; margin-left: -7px;}
.no_read {animation:blinker 1s linear infinite}

@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 {overflow:hidden; position:absolute; top:0; left:0; right:0; height:30px; background-color: #ff0000; color:#fff;}
#chat-header .badge3 {padding:0.2rem; font-size:20px; font-weight:bold; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;color:#fff; line-height: 30px; font-weight: bold;}

#chat-header .mo_tits {float: left; margin-left: 20px;}
#chat-header .mo_bdgs {float: right; margin-top: 4px; margin-right: 20px;}

#chat-body {position:absolute; top:286px; left:0; right:0; bottom:60px;overflow:hidden;overflow-y:scroll;}
#chat-history {background-color: #e2e8f0; border:0px; border-radius: 4px; font-size: 13px; padding: 10px; display:inline-block; width: 95%; color:#718096;}
.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: 14px;}
#chat-list .chkdate{width:100%;text-align:center;line-height:50px; color: #a0aec0; font-size: 11px; font-weight: bold; border-top:1px solid #e2e8f0;}
#chat-list .chktotal{width:100%;text-align:center;color: #a0aec0; font-size: 11px; line-height: 50px;}
#chat-list  .bubble_recv {word-break:break-all; position: relative;padding: 5px 10px 5px 10px;background: #fff;-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;max-width:250px; font-size:12px; margin-right: 5px; box-shadow: 0px 0px 3px rgba(0,0,0,0.1);}
#chat-list  .bubble_recv:after {content: '';position: absolute;border-style: solid;border-width: 0 8px 12px;border-color: #fff transparent;display: block;width: 0;z-index: 1;top: -5px;right: 5px;}

#chat-list .chat_time_send{text-align:right;margin-bottom:20px; font-size: 9px; font-weight: bold; color: #718096; 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: #718096; 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: #718096; 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: #718096; opacity: 0.7; margin-top: 5px;}



#chat-list  .bubble_send {word-break:break-all; position: relative;padding: 5px 10px 5px 10px;background: #A1A5AB;-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;max-width:250px;color:#ffffff; font-size:12px; margin-top: 50px; margin-left: 5px;}
#chat-list  .bubble_send:after {content: '';position: absolute;border-style: solid;border-width: 0 8px 12px;border-color: #A1A5AB transparent;display: block;width: 0;z-index: 1;top: -5px;left: 5px;}
#chat-list .chkdate {clear:both;}

#chat-footer { overflow:hidden; position:absolute; left:0; right:0; bottom:0; height:60px; background:#fff; box-shadow: 0 -3px 15px rgba(0,0,0,0.05);}

#chat-message {/*overflow:hidden;*/ margin:0;border:0;width:100%;height:60px; line-height:18px; background:#fff; border-radius:0; font-size: 14px; padding:20px 10px 20px 10px; resize:none;}

.chat_message_div {float: left; width: 70%;}
.chat_message_btn_div {float: right; width:30%;}

#btn-icon {position: absolute; align-items:center;justify-content:center;background:#fff;width:50px;height:60px !important;cursor:pointer;text-align:center;font-weight:bold; color:#9900cc; margin-top: 0px; right: 50px; padding-top: 19px; border-right: 1px solid rgba(0,0,0,0.05);}
#btn-squib {position: absolute; align-items:center;justify-content:center;background:#fff;width:50px;height:60px !important;cursor:pointer;text-align:center;font-weight:bold; color:#9900cc; margin-top: 0px; right: 50px; padding-top: 9px; border-right: 1px solid rgba(0,0,0,0.05);}

#btn-ref {position: absolute; align-items:center;justify-content:center;background:#fff;width:50px;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:#fff;width:50px;height:60px !important;cursor:pointer;text-align:center;font-weight:bold; color:#ffcc00; margin-top: 0px; right: 100px; padding-top: 19px; border-right: 1px solid rgba(0,0,0,0.05); border-left: 1px solid rgba(0,0,0,0.05);}

#icons_list {position:relative; margin-top:-250px; padding:10px; height:210px; background:#ccffcc; opacity:0.9;}

#btn-icon_close {position:absolute; top:-15px; right:15px; background:#ccffcc; font-size:2em; cursor:pointer;}

#icons_content {position:absolute; top:10px; left:10px; right:0; bottom:10px; overflow:hidden; overflow-y:scroll;}
.icon_button {float:left; margin-bottom:5px; margin-right:5px; padding:2px 5px; background:#dddddd; border:1px solid #000000; border-radius:7px; color:#000000; cursor:pointer;}
.icon_button_white {float:left; margin-bottom:5px; margin-right:5px; padding:2px 5px; background:#ffffff; border:1px solid #000000; border-radius:7px; cursor:pointer;}


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

.sec_inp {background-color: #ffcc00; border:0px; border-radius: 4px; padding: 10px 0px 10px 0px; font-size: 14px; width:80%; color:#fff; font-weight: bold;}

.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:#fff;}
.sec_inp::-webkit-input-placeholder {color:#fff;}
.sec_inp:-ms-input-placeholder {color:#fff;}

#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}




.bttn{height:30px;border:0;border-radius:5px;padding:0 10px;font-weight:bold;font-size:1.09em;vertical-align:middle}
a.bttn{display:inline-block;height:30px;line-height:30px;border:0;border-radius:5px;padding:0 10px;font-weight:bold;font-size:1.09em;vertical-align:middle}
.btn_submit{background:#ff4081;color:#fff}
a.btn_submit{background:#ff4081;color:#fff}
.btn_submit:hover{background:#ff1464}
.btn_01,a.btn_01{height:30px;line-height:30px;background:#ff4081;color:#fff;}
.btn_01:hover,a.btn_01:hover{background:#ff1464;color:#fff;}

.btn_02,a.btn_02{height:30px;line-height:30px;background:#9eacc6;color:#fff;}
.btn_03,a.btn_03{height:30px;line-height:30px;background:#3f51b5;color:#fff;}
.btn_04,a.btn_04{height:30px;line-height:30px;background:#ff3333;color:#fff;}
.btn_red,a.btn_red{height:30px;line-height:30px;background:#ff0000;color:#fff;}
.btn_red:hover,a.btn_red:hover{background:#ff0000;color:#ffff99;}
.btn_blue,a.btn_blue{height:30px;line-height:30px;background:#3366ff;color:#fff;}
.btn_blue:hover,a.btn_blue:hover{background:#3366ff;color:#ffff99;}
.btn_blue:hover,a.btn_blue:active{background:#3366ff;color:#fff;}
.btn_green,a.btn_green{height:30px;line-height:30px;background:#006600;color:#fff;}
.btn_green:hover,a.btn_green:hover{background:#006600;color:#ffff99;}
.btn_green:hover,a.btn_green:active{background:#006600;color:#fff;}

input.hrno_text {margin-bottom:0; width:100%; height:100%; border:0; text-align:center; font-weight:bold; font-size:13pt;}




.tbl_head_streaming {}
.tbl_head_streaming table {clear:both;width:100%;border-collapse:collapse;border-spacing:0;}
.tbl_head_streaming thead th {background:#000000;border:1px solid #000000;color:#ffffff;font-weight:bold;text-align:center;padding:7px 2px;font-size:1.12em;}
.tbl_head_streaming tbody th{border:0;height:30px;text-align:center}
.tbl_head_streaming tbody td{border:1px solid #000000;height:20px;text-align:center}

.trvoid {height:5px;}

.fontcolor_black{color:black;}
.fontcolor_blue{color:blue;}
.fontcolor_red{color:red;}





.fontsize_15 {font-size:15px}
.fontsize_16 {font-size:16px}
.fontsize_17 {font-size:17px}
.fontsize_18 {font-size:18px}
.fontsize_19 {font-size:19px}
.fontsize_20 {font-size:20px}

.fontsize_15b {font-size:15px; font-weight:bold;}
.fontsize_16b {font-size:16px; font-weight:bold;}
.fontsize_17b {font-size:17px; font-weight:bold;}
.fontsize_18b {font-size:18px; font-weight:bold;}
.fontsize_19b {font-size:19px; font-weight:bold;}
.fontsize_20b {font-size:20px; font-weight:bold;}