/* 공통 */
.noti{font-size:13px; color:#777; margin-top:2rem;}


/* login */
.wrap.loginWrap{display:flex; align-items:center; padding:2rem; position:relative; max-width:640px; background:#fff;}
.wrap.loginWrap > .foot{position:absolute; bottom:20px; left:50%; transform:translateX(-50%); color:var(--grayColor); font-size:13px;}

.loginbox{width:100%;}
.loginbox > form > .logo{width:15rem; margin:0 auto 6rem;}
.loginbox > form > .logo > img{width:100%; object-fit:"cover";}
.loginbox > form > .btn{width:100%;}
.loginbox > form > .loginBtn{margin-top:10px;}

.loginbox > form > ul{display:flex; justify-content:space-between; align-items:center; margin:2rem 0 4rem;}

/* 회원가입 */
.agreeBox + .agreeBox{margin-top:15px;} 
.agreeBox > .text_field{background:#fff; border:1px solid #bbb; height:100px; padding:10px; overflow:hidden; overflow-Y:scroll; font-size:13px; margin-top:5px;}
.agreeWrap > .checkbox{margin-top:3rem;}

.joinSuccesWrap{display:flex; align-items:center; justify-content:center; height:50rem;}
.joinSuccesWrap > div{text-align:center; width:100%;}
.joinSuccesWrap > div > .xi{color:#bbb; font-size:10rem; margin-bottom:2rem;}
.joinSuccesWrap > div > span{display:block; font-weight:600;}
.joinSuccesWrap > div > span.s{font-size:1.5rem;}
.joinSuccesWrap > div > span.m{font-size:2.3rem;}
.joinSuccesWrap > div > p{font-size:14px; margin-top:3rem;}
.joinSuccesWrap > div > .btnArea{margin-top:5rem;}

/* 메인 대시보드 */
main.main .labels {width:60px; height:40px; display:flex; align-items:center; justify-content:center;}
main.main .labels::before{font-size:13px; color:#fff; font-weight: 700; display:inline-block;}

main.main .labels[data-type=c0] { background: #fa3457; }
main.main .labels[data-type=c0]::before { content:'지각'; }

main.main .labels[data-type=c1] { background: #00ccff; }
main.main .labels[data-type=c1]::before { content:'계획수정'; }

main.main .labels[data-type=c2] { background: #a04dff; }
main.main .labels[data-type=c2]::before { content:'외출중'; }

main.main .labels[data-type=c3] { background: #00d98b; }
main.main .labels[data-type=c3]::before { content:'학습중'; }

main.main .labels[data-type=c4] { background: #bbb; }
main.main .labels[data-type=c4]::before { content:'하원'; }

main.main .labels[data-type=c5] { background: #666; }
main.main .labels[data-type=c5]::before { content:'등원대기'; }

main.main .labels[data-type=c6] { background: #fe7c1c; }
main.main .labels[data-type=c6]::before { content:'수면중'; }

main.main .labels[data-type=c7] { background: #fa3457; }
main.main .labels[data-type=c7]::before { content:'외출지각'; }

main.main .labels[data-type=c8] { background: #757bf6;cursor: pointer; }
main.main .labels[data-type=c8]::before { content:'관리보류'; }

main.main .labels[data-type=c9] { background: #757bf6;cursor: pointer;}
main.main .labels[data-type=c9]::before { content:'결석예정'; }

main.main .labels[data-type=c10] { background: #828282; }
main.main .labels[data-type=c10]::before { content:'무단결석'; }

main.main .labels[data-type=c11] { background: #00ccff; }
main.main .labels[data-type=c11]::before { content:'일시정지'; }

main.main .labels[data-type=c12] { background: #757bf6; }
main.main .labels[data-type=c12]::before { content:'등원예정'; }

main.main .labels[data-type=c13] { background: #ffcb2a; }
main.main .labels[data-type=c13]::before { content:'쉬는시간'; }

main.main .labels[data-type=c14] { background: #ffcb2a; }
main.main .labels[data-type=c14]::before { content:'지각'; }

main.main .labels[data-type=c15] { background: #b98e2c; }
main.main .labels[data-type=c15]::before { content:'수업중'; }

main.main .labels[data-type=c16] { background: #b98e2c; }
main.main .labels[data-type=c16]::before { content:'수업지각'; }


/* 주의, 경고 카드 숨김 처리
main.main .studyYoil{display:flex; width:calc(100% - 60px - 5px);}
*/
main.main .studyYoil { display:flex; width:calc(100% - 60px - 73.53px - 10px); cursor: pointer;}

main.main .studyYoil > li{width:calc(100% / 7); background:#bbb; color:#fff; font-size:13px; font-weight:600; height:40px; display:flex; align-items:center; justify-content:center;}
main.main .studyYoil > li.on{background:#404d5e;}

main.main .cards { cursor: pointer; }
main.main .cards > span {display:inline-block; padding:5px 0px; width:35px; text-align: center; color:#fff;}
main.main .cards > span > p { font-size:11px; line-height:14px;}
main.main .cards > span > b { line-height:16px; text-align:center; display:block; font-size:13px; font-weight: 800;}
main.main .cards > span > b::before { content: attr(data-cnt); } 
main.main .cards > span.y { background: #ffcb2a;}
main.main .cards > span.r { background: #fa3457;}

main.main .status{display:flex; margin-top:10px;}
main.main .status > li{width:calc(100% / 5); padding:10px; text-align:center; background: #ccc;}
main.main .status > li > span { font-size:11px;display:block;color:#777;line-height: 14px;}
main.main .status > li > b { font-size:14px;display:block;font-weight:800;line-height: 16px;margin-top:3px;}
main.main .status > li.t{background:#777; color:#fff;}
main.main .status > li.t > span{color:#fff;}

main.main .rate { display:block; position: relative; margin-top:10px;}
main.main .rate > i { position: absolute; top:50%; transform:translateY(-50%); right:-6px; width:44px; height:44px; display:inline-block; font-style:normal;}
main.main .rate > i::before { font-family: 'xeicon' !important; font-size:44px;width:44px;height:44px;line-height:44px;display:block;text-align: center;}
main.main .rate > i[data-val=G]::before { content: "\e9e4";color:#00d98b; }
main.main .rate > i[data-val=Y]::before { content: "\e9eb";color:#ffcb2a; }
main.main .rate > i[data-val=R]::before { content: "\e9ee";color:#fa3457; }
main.main .rate > i[data-val=N]::before { content: "\e9ec";color:#ccc; }

main.main .rate > p {font-size:12px; display:block; margin-right:44px; position: relative; height:21px;}
main.main .rate > p + p{margin-top:2px;}
main.main .rate > p > span {position: absolute; top:50%; transform:translateY(-50%); right:0px; color:rgba(0,0,0,0.4); font-size:10px; z-index:5; padding-right:5px; font-weight: 800;}
main.main .rate > p > em { background: #bbb; border: 3px solid #bbb; display:block; height:21px; position: relative; overflow: hidden;}
main.main .rate > p > em > i { display:block; position: absolute; top:0px; left:0px; bottom:0px; background: rgba(145,232,225,1); height:21px; z-index: 1;}
main.main .rate > p > em > b { position: absolute; left:0; top:50%; transform:translateY(-50%); z-index: 2; font-weight: 800; color:rgba(0,0,0,0.6); font-size:11px; padding-left:2px;}
main.main .rate > p.progress > em > i { background: rgba(145,232,225,1); }
main.main .rate > p.achievement > em > i { background: rgba(228,211,84,1); }

main.main .todayInfo{padding:15px; background:#fff; margin-top:10px;}
main.main .todayInfo p {display:flex; justify-content:space-between;}

main.main .todayInfo p.t{font-size:14px; font-weight: 700;}
main.main .todayInfo p.s{font-size:13px; font-weight: 700;}
main.main .todayInfo p.c{font-size:12px; color:#999;}

main.main .todayInfo p.status { align-items: center; }
main.main .todayInfo p.status > .right-content { display: flex; align-items: center; gap: 15px; }
main.main .todayInfo p.status > .right-content > .btnReasonSet { display: none;}
main.main .todayInfo p.status > .right-content > .btnReasonSet.view { display: block; background: #404d5e; border: 1px solid rgba(0, 0, 0, 0.1); color: #fff; padding: 0px 10px; border-radius: 5px; }

.nowSt{background:#777; margin:-2rem -2rem 2rem; padding:1rem 2rem; color:#fff;}
.nowSt > .t{font-size:2rem; font-weight:600; white-space: nowrap; text-overflow: ellipsis; width: 100%; overflow: hidden; }
.nowSt > .s{font-size:1.4rem; font-weight:300; color:#fff; white-space: nowrap; text-overflow: ellipsis; width: 100%; overflow: hidden;}
.nowSt > .t > span{font-size:1.4rem; margin-left:5px; font-weight:300; color:#ddd;}
.nowSt > .s > span{font-size:12px; margin-left:5px; font-weight:300; color:#ddd;}

/* 정보수정 */
.chgPwBtn.on{background:var(--mainColor);}
.chgPw{display:none;}
.chgPw.view{display:block;}

.childInfoList{border-bottom:1px solid #bbb; padding-bottom:10px;}
.childInfoList > label{font-size:13px; color:#777; display:inline-block; margin-bottom:5px;}
.childInfoList > .childInfo{border:1px solid var(--grayColor2); background:#ddd; border-radius:6px; overflow:hidden; display:flex; align-items:center; justify-content:space-between; padding: 0 12px; height: 40px;}
.childInfoList > .childInfo + .childInfo{margin-top:5px;} 
.childInfoList > .childInfo > .child{font-size:14px;}
.childInfoList > .childInfo > .child > span{font-size:12px; color:#777; margin-left:5px;}
.childInfoList > .childInfo > span{font-size:12px; color:#777;}

.childFormList{margin-top:10px;}


/* 에러 페이지 */
.errorWrap { height: 100dvh; display: flex; justify-content: center; align-items: center; }
.errorWrap > .errorCon { text-align: center; padding: 0 1.5rem; }
.errorWrap > .errorCon > img { max-width: 150px; }
.errorWrap > .errorCon > .t { font-size: 20px; margin: 1.2rem 0; font-weight: 800; }
.errorWrap > .errorCon > p { line-height: 1.3; color: #999; font-size: 12px; font-weight: 600; }
.errorWrap > .errorCon > button { height: 30px; padding: 0px 20px; font-size: 14px; font-weight: 600; }


/* 채팅창 */
.chatWrap .nowSt{position: sticky; top: 70px; z-index: 1; display: flex; justify-content: space-between; }
.chatWrap .nowSt > .stProfile { width: 75%; }
.chatWrap .nowSt > .stProfile > .t{font-size:2rem; font-weight:600; white-space: nowrap; text-overflow: ellipsis; width: 100%; overflow: hidden; }
.chatWrap .nowSt > .stProfile > .s{font-size:1.4rem; font-weight:300; color:#fff; white-space: nowrap; text-overflow: ellipsis; width: 100%; overflow: hidden;}
.chatWrap .nowSt > .stProfile > .t > span{font-size:1.4rem; margin-left:5px; font-weight:300; color:#ddd;}
.chatWrap .nowSt > .stProfile > .s > span{font-size:12px; margin-left:5px; font-weight:300; color:#ddd;}

.chatWrap .nowSt > .btnWrap { display: flex; align-items: center; gap: 10px; }
.chatWrap .nowSt > .btnWrap > .cards { display: flex; font-size: 0px; z-index: 5; height: 30px; }
.chatWrap .nowSt > .btnWrap > .cards > p { display: inline-block; background: #999; padding: 0px 0px; width: 26px; text-align: center; color: #fff; text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); cursor: pointer; height: 30px; }
.chatWrap .nowSt > .btnWrap > .cards > p > span { font-size: 11px; display: none; line-height: 14px; }
.chatWrap .nowSt > .btnWrap > .cards > p > b { display: block; line-height: 2.3; text-align: center; display: block; font-size: 14px; font-weight: 800; }
.chatWrap .nowSt > .btnWrap > .cards > p > b::before { content: attr(data-cnt); }
.chatWrap .nowSt > .btnWrap > .cards > p.r { background: #fa3457; }
.chatWrap .nowSt > .btnWrap > .cards > p.y { background: #ffcb2a; }

.chatWrap .nowSt > .btnWrap > .reload_btn { display: block; font-family: 'xeicon' !important; font-size: 24px; color: white; cursor: pointer; /* width: 36px; height: 40px; line-height: 40px; text-align: center; position: absolute; top: 17px; right: 46px; */ }
.chatWrap .nowSt > .btnWrap > .reload_btn::before { content: "\e982"; display: block; height: 40px; line-height: 40px; }


.chatFooter {display:block; background: #fff; position: fixed; bottom:0px; right:0px;left:0px;z-index: 1;border-top:1px solid #ddd;box-shadow: 0px 0px 15px rgba(0,0,0,0.1); margin:0 auto; padding:0px;}

.chatFooter > .btns {display:flex; padding:10px 12px; font-size:0px;} 
.chatFooter > .btns > a {cursor:pointer; display:inline-block;line-height:28px;padding:0px 12px;border:1px solid #ddd;background: #fff;font-size:13px; vertical-align: top;border-radius: 5px;position: relative;overflow: hidden;}
.chatFooter > .btns > a > i { display:inline-block;line-height:28px;vertical-align: bottom;margin-left:5px;}
.chatFooter > .btns > a.arr { padding-right:10px; }
.chatFooter > .btns > a.arr > i { font-family:xeicon; }
.chatFooter > .btns > a.arr > i::before { content: "\e942"; }
.chatFooter > .btns > a.arr.opened { background: #eee;color:#999;}
.chatFooter > .btns > a.arr.opened > i::before { content:"\e945"; color:#999;}

.chatFooter > .btns > a input[type=file] {display:none;}
.chatFooter > .btns > a > label{cursor:pointer;}
.chatFooter > .btns > a + a { margin-left:2px; }
.chatFooter > .chat { display:block; padding:0px 12px 15px 12px; font-size:0px; background:#fff;}
.chatFooter > .chat > span { display:flex; border:1px solid #ddd;border-radius: 5px;background:#fff;overflow: hidden;}
.chatFooter > .chat > span > textarea {height:40px; padding:8px 10px; width:100%; border:0px;}
.chatFooter > .chat > span > button {border-radius: 3px; background:#404d5e; color:#fff; padding:0px 20px; margin:3px;}

.chatFooter > .boilerplate { display:none;font-size:0px;max-height: 200px;overflow: hidden;overflow-y: auto;background: #fff; box-shadow: 0px 0px 15px rgba(0,0,0,0.1);position: absolute;left:0px;right:0px;bottom:108px;}
.chatFooter > .boilerplate a {padding:10px 15px;line-height: 20px;font-size:13px;color:#666;cursor: pointer;font-weight: 600;display:block;}
.chatFooter > .boilerplate a + a { border-top:1px solid #ddd; }
.chatFooter > .boilerplate.opened { display:block; }

.chatFooter > .btns > .chatTarget { display: flex; margin-left:auto;}
/*
.chatFooter > .btns > .chatTarget > label {cursor:pointer; border:1px solid #ddd; background: #fff; padding:0px 10px; border-radius: 5px; height: 28px; width:55px; box-sizing:border-box; font-size:12px; display:flex; align-items:center; justify-content:center;}
.chatFooter > .btns > .chatTarget > label:has(input[type="checkbox"]:checked){background: #50CCC6; height: 28px; }
.chatFooter > .btns > .chatTarget > label:has(input[type="checkbox"]:checked) > span{color:#fff;}
*/

.chatFooter > .btns > .chatTarget > label{padding:0px; height:auto; width:auto;}
.chatFooter > .btns > .chatTarget > label + label{margin-left:2px;}
.chatFooter > .btns > .chatTarget input[type="checkbox"] { display:none;}
.chatFooter > .btns > .chatTarget input[type="checkbox"] + span{cursor:pointer; border:1px solid #ddd; background: #fff; padding:0px 10px; border-radius: 5px; height: 28px; box-sizing:border-box; font-size:12px; display:flex; align-items:center; justify-content:center;}
.chatFooter > .btns > .chatTarget input[type="checkbox"] + span:before { display:none;}

.chatFooter > .btns > .chatTarget input[type="checkbox"]:checked + span{background: #50CCC6; color:#fff; position:relative; padding-left:25px;}
.chatFooter > .btns > .chatTarget input[type="checkbox"]:checked + span:before{content: "\e929"; font-family:xeicon; display:inline-block; border:0px; background: transparent; color: #fff; position:absolute; left:4px; top:50%; transform:translateY(-50%);}
.chatFooter > .btns > .chatTarget span { color: #00090d; margin-left: 0px; font-size:12px;}
.chatFooter > .btns > .chatTarget span:last-child { margin-right: 0; }

.chat{padding-bottom:55px; }
.chat > ul { display:block; }
.chat > ul > li { display:block;text-align: left;position: relative;padding:0px 20px 0px 50px;overflow: hidden;}

.chat > ul > li a,
.chat > ul > li button{cursor:pointer;}

.chat > ul > li + li { margin-top:15px; }
.chat > ul > li > div { display:inline-block; max-width:70%; padding:10px 15px; background: #eee; border-radius: 10px; position: relative; }
.chat > ul > li > div > i { position: absolute;top:6px;left:-50px;display: block;width:40px;height:40px;border-radius: 50%;background-size: cover;background-repeat: no-repeat;border:1px solid #bbb;box-sizing: border-box;}

.chat > ul > li > div > p { display:block;font-size:12px;color:#999;line-height:20px;margin-bottom:6px;}
.chat > ul > li > div > p > b { display:inline-block;height:20px;line-height:20px;vertical-align: top;font-size:13px;font-weight:500;margin-right:7px;color:#111; }
.chat > ul > li > div > p > span.read { font-weight:600; color:#fe7c1c; }
.chat > ul > li > div > div { display:block; line-height:20px; }
.chat > ul > li > div > div > b { font-weight: 600;}
.chat > ul > li > div > div > img{width: 100%; height: 200px; object-fit: cover;}
.chat > ul > li > div > div > span { display:block;font-size:0px;margin-top:5px;margin-bottom:2px;}
.chat > ul > li > div > div > span > a { display:inline-block; line-height:1.2; padding:5px 10px; background: #999; font-size:12px; border-radius: 2px;color:#fff; }
.chat > ul > li > div > div > span > a.btn_preview { margin-left: 10px; }
.chat > ul > li > div > div > span > b { display:inline-block; line-height:1.2; padding:5px 0; margin-left:10px; font-size:12px; color:#999; font-weight: 700;}
.chat > ul > li > div:after,
.chat > ul > li > div:before {right: 100%; margin-right:0px; top: 18px; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.chat > ul > li > div:after { border-color: transparent; border-right-color: #fff; border-width: 9px; margin-top: 0px; }
.chat > ul > li > div > button{display:none;}

.chat > ul > li.me { text-align: right;padding:0px 20px;}
.chat > ul > li.me > div > p { color:rgba(0,0,0,0.6); }
.chat > ul > li.me > div { background: #eedcc6;}
.chat > ul > li.me > div:after,
.chat > ul > li.me > div:before {right:auto;left: 100%; margin-left:0px; top: 18px; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.chat > ul > li.me > div:after { border-color: transparent; border-left-color: #eedcc6; border-width: 9px; margin-top: 0px; }

.chat > ul > li.me > div > button {display:inline-block; background: transparent;width:26px;height:26px;line-height:26px;text-align:center;font-family: 'xeicon' !important;font-size:14px;position: absolute;top:10px;left:-26px;color:#999;}
.chat > ul > li.me > div > button::before {content: "\e921";}


.chat > ul > li.bot > div { background: rgba(90,229,223,0.5);}
.chat > ul > li.bot > div > p { color:rgba(0,0,0,0.6); }
.chat > ul > li.bot > div > p > b { font-weight: 700;letter-spacing: -0.5px;}
.chat > ul > li.bot > div > i { background: url(/common/images/bi_n.png) #404d5e no-repeat center;background-size: 75%;;background-repeat: no-repeat;border-radius: 5px;}
.chat > ul > li.bot > div:after,
.chat > ul > li.bot > div:before {right: 100%; margin-right:0px; top: 18px; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.chat > ul > li.bot > div:after { border-color: transparent; border-right-color: rgba(90,229,223,0.5); border-width: 9px; margin-top: 0px; }
.chat > ul > li.bot > div > div > span > a { background: #404d5e; }

.chat > ul > li.bot > .managerNoti > .botMsg > b > .stRead { margin-left: 30px; font-weight:500; color: #999; }
.chat > ul > li.bot > .managerNoti > .botMsg > b > .stRead.check { color: #000; }

.chat > ul > li.date { text-align: center;padding:10px 0px;}
.chat > ul > li.date > p { padding:5px 10px; font-size:13px; color:#999; }
.chat > ul > li.date > div:after,
.chat > ul > li.date > div:before { display:none; }

.chat > ul > li > div > div > span > a.waiting { background: #999; }
.chat > ul > li > div > div > span > a.waiting + b {color:#999;}
.chat > ul > li > div > div > span > a.proceeding { background:#45a171; }
.chat > ul > li > div > div > span > a.proceeding + b {color:#45a171;}
.chat > ul > li > div > div > span > a.deadlined { background:#8c2332; }
.chat > ul > li > div > div > span > a.deadlined + b {color:#8c2332;}
.chat > ul > li > div > div > span > a.pending { background:#8c2332; }
.chat > ul > li > div > div > span > a.pending + b {color:#8c2332;}
.chat > ul > li > div > div > span > a.confirmed { background:#45a171; }
.chat > ul > li > div > div > span > a.confirmed + b {color:#45a171;}

/* 사유서등록 팝업 */
.late, .absent{display:none;}
.late.on, .absent.on{display:block;}

/* 채팅 N */
.chat  > ul > li > b { display: inline-block;background: #fff;text-shadow: 0px 0px 0px rgba(255,255,255,0.4);font-size: 11px;font-weight: 300;color: rgba(0,0,0,0.7);line-height: 20px;height: 17px;width: 17px;text-align: center;vertical-align: top;margin-left: 5px;border-radius: 50%;box-shadow: 0px 0px 5px rgba(0,0,0,0.2); }
.chat  > ul > li.me > b { display: inline-block;background: #fff;text-shadow: 0px 0px 0px rgba(255,255,255,0.4);font-size: 11px;font-weight: 300;color: rgba(0,0,0,0.7);line-height: 20px;height: 17px;width: 17px;text-align: center;vertical-align: top;margin-left: 5px;border-radius: 50%;box-shadow: 0px 0px 5px rgba(0,0,0,0.2); }
.chat  > ul > li > b.new { background: #f58D3D; }
.chat  > ul > li > b.new::before { content: 'N'; color: #fff; }


/* nav 필수과제 */
.naviWrap > .con > .nav > ul > li > .task { display: none; }
.naviWrap > .con > .nav > ul > li > .task.view { display: flex; }


/* 공지사항 팝업 */
.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% - 66.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;} 


/* 공지사항 리스트 */
.noticeList div.board > ul.list { background: #fff; }
.noticeList div.board > ul.list > li:first-child { border-top: 1px solid #ccc; }
.noticeList div.board > ul.list > li { border-bottom: 1px solid #ccc; }
.noticeList div.board > ul.list > li > a { display: block; padding: 20px 15px; }
.noticeList div.board > ul.list[data-type=list] > li > a { position: relative; }
.noticeList div.board > ul.list > li > a > i { display: inline-block; position: absolute; float: right; right: 15px; bottom: 20px; width: auto; height: 20px; line-height: 20px; margin-top: 5px; margin-right: 0px; padding: 0px 10px; border-radius: 4px; background: #111; text-align: center; vertical-align: top; font-size: 12px; font-weight: 600; font-style: normal; color: #fff; }
.noticeList div.board > ul.list > li > a > strong { display: block; position: relative; margin-bottom: 0px; line-height: 22px; word-break: keep-all; font-size: 15px; font-weight: 400; }
.noticeList div.board > ul.list > li > a > span { display: block; line-height: 20px; font-size: 13px; color: #999; }

.noticeList div.board > .btns { display: block; margin: 0px; padding: 15px 15px; text-align: right; }
.noticeList div.board > .btns > a.more::before { display: block; width: 40px; line-height: 40px; font-family: 'xeicon'; content: "\e9c5"; vertical-align: top; font-size: 20px; color: inherit; }
.noticeList div.board > .btns > a.more { display: block; margin: 0 auto; width: 40px; height: 40px; line-height: 40px; border-radius: 50%; border: 1px solid #ccc; background: #fff; text-align: center; font-size: 15px; color: #666; }

.noticeList div.noData { height: 350px; text-align: center; display: flex; flex-direction: column; justify-content: center; }
.noticeList div.noData > i { font-size: 45px; color: #666; margin-bottom: 0px; line-height: 50px; }
.noticeList div.noData > h2 { font-size: 24px; color: #666; line-height: 40px; font-weight: 400; }
.noticeList div.noData > h2::before { content: 'No Data Available.'; }
.noticeList div.noData > p { font-size: 14px; color: #999; line-height: 20px; margin: 0px; padding: 0px; }
.noticeList div.noData > p::before { content: '조회된 공지사항이 없습니다.'; }

/* 공지사항 상세보기 */
.noticeView div.board > div.detail { display: block; background: #fff; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; }
.noticeView div.board > div.detail > div.tit { margin-bottom: 0px; padding: 20px 15px; border-bottom: 1px solid #eee; }
.noticeView div.board > div.detail > div.tit > strong { display: block; margin-bottom: 10px; line-height: 20px; word-break: keep-all; font-size: 16px; font-weight: 500; }
.noticeView div.board > div.detail > div.tit > span { display: block; line-height: 17px; font-size: 13px; color: #999; }
.noticeView div.board > div.detail > div.contents { padding: 20px 15px; }
.noticeView div.board > div.detail > div.contents > div.img { margin-top: 10px; text-align: center; }
.noticeView div.board > div.detail > div.contents > div.img > img { display: block; margin: 0 auto; max-width: 100%;}
.noticeView div.board > div.btns { display: block; margin: 0px; padding: 15px 15px; text-align: right; }
.noticeView div.board > div.btns > a.back { display: inline-block; margin: 0 auto; width: 70px; height: 40px; line-height: 40px; border-radius: 5px; border: 1px solid #ccc; background: #fff; text-align: center; font-size: 14px; color: #999;}