/* main */
main > .stateWrap{display:flex; position:sticky; top:75px; z-index: 2;}
main > .stateWrap > .totalPresent{padding:0 20px; background:#ddd; height:6rem; display:flex; flex-direction:column; align-items: center; justify-content: center;}
main > .stateWrap > .totalPresent > .tit{font-size:13px; display:block; text-align: center; color:#666;}
main > .stateWrap > .totalPresent > .num{font-size:20px; display:block; text-align: center; color:#666;}
main > .stateWrap > .totalPresent > .num > b{color:var(--fontColor);}

main > .stateWrap > .detailsPresent{background:#efefef; width:100%; padding:0 20px; height:6rem; display:flex; flex-direction:column; justify-content: center;}
main > .stateWrap > .detailsPresent > div{display:flex; align-items: center; justify-content: space-between;}
main > .stateWrap > .detailsPresent > div > .tit{font-size:13px; color:#666;}
main > .stateWrap > .detailsPresent > div > .num{font-size:13px; color:#666;}
main > .stateWrap > .detailsPresent > div > .num > b{color:var(--fontColor);}

main > .chatList{padding:20px 0;}
main > .chatList > .item + .item{margin-top:20px;}
main > .chatList > .item > a{display:flex; padding:0 20px 0 15px; gap:10px; align-items: center; position:relative;}
main > .chatList > .item > a > .profile{width:60px; height:60px; position:relative; flex-shrink: 0;}
main > .chatList > .item > a > .profile > .profileImg{width:100%; height:100%; border-radius: 50%; overflow:hidden;}
main > .chatList > .item > a > .profile > .profileImg > img{width:100%; height:100%; object-fit:cover;}
main > .chatList > .item > a > .profile > .state{position:absolute; bottom:0; left:0; right:0p; text-align: center; width:100%; padding:5px; color:#fff; font-size:12px;}
main > .chatList > .item > a > .profile > .state.type0{background:#cc0000;} 
main > .chatList > .item > a > .profile > .state.type1{background:#3399cc;} 
main > .chatList > .item > a > .profile > .state.type2{background:#9933cc;} 
main > .chatList > .item > a > .profile > .state.type3{background:#006600} 
main > .chatList > .item > a > .profile > .state.type4{background:#444;} 
main > .chatList > .item > a > .profile > .state.type5{background:#444;} 
main > .chatList > .item > a > .profile > .state.type6{background:#fe7c1c;} 
main > .chatList > .item > a > .profile > .state.type7{background:#cc0000;} 
main > .chatList > .item > a > .profile > .state.type8{background:#757bf6} 
main > .chatList > .item > a > .profile > .state.type9{background:#757bf6} 
main > .chatList > .item > a > .profile > .state.type10{background:#444;} 
main > .chatList > .item > a > .profile > .state.type11{background:#3399cc;} 
main > .chatList > .item > a > .profile > .state.type12{background:#444;} 
main > .chatList > .item > a > .profile > .state.type13{background:#ffcb2a;} 
main > .chatList > .item > a > .profile > .state.type14{background:#ffcb2a;} 

main > .chatList > .item > a > .chatCon{width:calc(100% - 70px);}
main > .chatList > .item > a > .chatCon > .tit{display:flex; align-items: center; justify-content: space-between;}
main > .chatList > .item > a > .chatCon > .tit > .name{font-size:15px; font-weight:600;}
main > .chatList > .item > a > .chatCon > .tit > .date{font-size:13px; color:#666;}
main > .chatList > .item > a > .chatCon > .txt{font-size:13px; margin-top:5px; width:100%; word-break: break-all;}

main > .chatList > .item > a > .alam{position:absolute; bottom:0; right:15px; background:#cc0000; padding:0 5px; height:25px; min-width:25px; display:flex; align-items: center; justify-content: center; border-radius:50%; color:#fff; font-size:12px; font-weight: 600;}



/* 공지사항 팝업 */
.notice-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 999; display: none; }
.notice-overlay.view { display: flex; }
.notice-overlay.none{display:none !important;}

.notice_modal{position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 1000; display: none; justify-content: center; align-items: center;}
.notice_modal.view{display: flex;}
.notice_modal.none{display:none !important;}
.notice_modal > .con{background: #fff; max-width: 90%; border-radius: 5px; width: 500px; overflow:hidden; max-height:400px; height:90%; position:relative; border:1px solid #333;}
.notice_modal > .con > .head{padding: 15px; border-bottom: 1px solid #ccc; font-size: 18px;}
.notice_modal > .con > .head > span{font-size:13px; display:block; margin-top:5px; color:#bbb;}
.notice_modal > .con > .body{width:100%; padding:15px; height:calc(100% - 90.6px - 71.8px); overflow-Y:auto; box-sizing:border-box;}
.notice_modal > .con > .body > img{width:100%; object-fit:cover; box-sizing:border-box; margin-top: 15px;}
.notice_modal > .con > .btnArea{display:flex; align-items:center; justify-content:end; gap:20px; background:#ddd; padding:15px; margin:0px !important; max-width:none;}
.notice_modal > .con > .btnArea > .noticePopCloseBtn{text-align: center;padding: 10px 20px; border-radius: 5px; font-size: 13px; font-weight: 500; display: inline-block; background:#777; color:#fff;}
.notice_modal > .con > .btnArea > .checkbox > input{display:none;}
.notice_modal > .con > .btnArea > .checkbox > label{padding:0px; display:flex; align-items:center; gap:7px; font-size:13px; color:#111;}
.notice_modal > .con > .btnArea > .checkbox > label > span{border:1px solid #111; display:flex; align-items:center; justify-content:center; width:15px; height:15px;}
.notice_modal > .con > .btnArea > .checkbox > input:checked + label > span:after{content: "\e928"; display:inline-block; font-family:xeicon; font-size:13px; width:13px;}