@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500&display=swap');
html,body,div,p,img,span,a,em,strong,pre,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,tbody,thead,tfoot,tr,th,td,form,fieldset,legend,caption,input,textarea,button,select,object,video,iframe,section,figure,header,footer,aside{margin:0;padding:0;box-sizing:border-box;word-break:break-word;outline:none;}
body{font-family:'Noto Sans KR', sans-serif;font-size:14px;line-height:1;color:#333;width:100%;height:100vh;overflow-x:hidden;background:#f9f9f9;}
img,fieldset,button,input,select,textarea,pre{border:0;border-radius:0;font-family:'Noto Sans KR', sans-serif;}
table{border-spacing:0}
ul,ol{list-style:none}
em,address,i,var,dfn{font-style:normal}
a,a:link,ins{text-decoration:none;color:#333}
hr,input::-ms-clear,select::-ms-expand{display:none}
legend,caption,.blind{position:absolute;top:-9999px;font-size:0;line-height:0}
label{cursor:pointer}
input,select,textarea{/*font-size:14px;*/-webkit-appearance:none;border:1px solid #ccc;}
input:disabled,select:disabled{background-color:#F2F2F2}
input::clear{display:none}
.scroll_off{position:fixed;overflow:hidden;height:100%;}

/* 스크롤바 css로만 만들기 */
body::-webkit-scrollbar, .board_list::-webkit-scrollbar{width: 8px;height: 8px;}
body::-webkit-scrollbar-thumb, .board_list::-webkit-scrollbar-thumb{background-color: #999;border-radius: 40px;border: 1px solid transparent;background-clip: content-box;}
body::-webkit-scrollbar-track, .board_list::-webkit-scrollbar-track{border-radius: 40px;background-color: transparent;}
.ml10{margin-left:10px !important;}
.ml20{margin-left:20px !important;}
.mr5{margin-right:5px !important;}
.mr10{margin-right:10px !important;}
.mr20{margin-right:20px !important;}
.mt10{margin-top:10px !important;}
.mt20{margin-top:20px !important;}
.pt10{padding-top:10px !important;}
.pt20{padding-top:20px !important;}
.pt30{padding-top:30px !important;}
.p10{padding:10px !important;}
.p0{padding:0 !important;}

.red{color:#FF0000;}
.green{color:#008000;}
.blue{color:#0000FF;}
.purple{color:#800080;}

/*common*/
.wrap{padding:70px 0 0 250px;transition:.2s all;}
.wrap.hidden{padding:70px 0 0 0;}
.wrap .gnb_box.hidden{width:0;opacity:0;}
.contents_wrap{min-height:100%;height:100%;padding:30px;}

/*::::: HEADER :::::*/
.header .top_box{position:fixed;top:0;left:0;width:100%;z-index:100;}
.header .top_box .top{height:70px;line-height:70px;color:#fff;background:#333;padding:0 30px 0 15px;}
.header .top_box .top:after{content:"";display:block;clear:both;}
.header .top_box .btn_gnb{float:left;display:block;width:40px;height:40px;border-radius:50%;background:url("../images/icon_menu.png") center center / 20px 20px no-repeat;margin:15px 15px 0 0;box-shadow:2px 2px 8px rgba(0,0,0,.9);transition:.3s all;cursor:pointer;}
.header .top_box .btn_gnb:hover{box-shadow:2px 2px 8px rgba(255,255,255,.6);}
.header .top_box .btn_gnb.hidden{background-color:rgba(92, 92, 92, 0.2);box-shadow:2px 2px 8px rgba(255,255,255,.6);}
.header .top_box .mgt{float:left;font-size:22px;font-weight:500;}
.header .top_box .mgt a{color:#fff;}
.header .top_box .site{float:left;color:#bbb;margin-left:15px;vertical-align:bottom;}
.header .top_box .user{float:right;}
.header .top_box .user .thumb{display:inline-block;width:35px;height:35px;background:#fff url("../images/icon_user.png") 50% 50% / 29px 26px no-repeat;border-radius:50%;vertical-align:middle;}
.header .top_box .user .name{display:inline-block;margin:0 10px;}
.header .top_box .user .a_name{display:inline-block;margin:0 10px;text-decoration: underline;color: #fff;}
.header .top_box .user .btn_logout{display:inline-block;color:#fff;border:1px solid #fff;width:80px;height:30px;line-height:28px;font-size:14px;text-align:center;transition:.3s all;}
.header .top_box .user .btn_logout:hover{background:#fff;color:#333;}
.header .gnb_box{position:fixed;top:70px;left:0;width:260px;height:100%;background:#333;border-right:1px solid #ddd;padding-bottom:70px;overflow-y:auto;}
.header .gnb a{display:block;width:100%;color:#eee;padding:0 15px;}
.header .gnb > li{border-top:1px solid rgba(0,0,0,.7);}
.header .gnb > li > a{height:50px;line-height:50px;font-size:16px;font-weight:600;}
.header .gnb > li > a:after{content:"＋";display:block;float:right;}
.header .gnb > li.on > a:after{content:"－";}
.header .gnb .lnb{display:none;}
.header .gnb .lnb.on{display:block;}
.header .gnb .lnb > li > a{height:40px;line-height:40px;font-weight:600;font-size:14px;padding-left:25px;}
.header .gnb .lnb > li.on > a{color:#fff;background:rgba(0,0,0,.3);}
.header .gnb .lnb > li > a:after{content:"＋";display:block;float:right;font-size:12px;}
.header .gnb .lnb > li.on > a:after{content:"－";}
.header .gnb .lnb_item{display:none;}
.header .gnb .lnb_item.on{display:block;}
.header .gnb .lnb_item > li:hover{background:rgba(0,0,0,.3);}
.header .gnb .lnb_item > li a{height:35px;line-height:35px;font-size:14px;padding-left:30px;border-left:3px solid transparent;transition:.1s all;}
.header .gnb .lnb_item > li a:before{content:"-";display:inline-block;margin-right:5px;}
.header .gnb .lnb_item > li:hover a{border-color:#dfdfdf;}
.header .gnb .lnb_item > li.on a{font-weight:600;color:#fff;background:rgba(0,0,0,.2);border-left:5px solid #fff;}
.header .gnb .lnb_item .icon_lb{margin-left:5px;}
.header .btn_menu{display:none;position:absolute;top:17px;right:15px;width:22px;height:16px;}
.header .btn_menu span{position:absolute;left:0;width:100%;height:3px;background-color:#fff;border-radius:3px;display:inline-block;transition:all .5s;}
.header .btn_menu span:nth-of-type(1){top:0;}
.header .btn_menu span:nth-of-type(2){top:6px;}
.header .btn_menu span:nth-of-type(3){bottom:0;}
.header .btn_menu.on span:nth-of-type(1){transform: translateY(6px) rotate(-45deg);}
.header .btn_menu.on span:nth-of-type(2){opacity:0;}
.header .btn_menu.on span:nth-of-type(3){transform: translateY(-7px) rotate(45deg);}

.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical, .mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical{margin:3px 0;}
.mCSB_inside>.mCSB_container{margin-right:3px;}
.mCSB_scrollTools{width:3px;}

.icon_lb{display:inline-block;background:#FF5757;height:18px;line-height:18px;padding:0 10px;color:#fff;font-size:10px;font-weight:400;border-radius:3px;}
.icon_arrow{display:inline-block;width:20px;height:20px;background:url("../images/icon_arrow.png") 0 0 / 100% 100% no-repeat;cursor:pointer;vertical-align:middle;}
.icon_arrow.down{transform:rotate(180deg);}

@media screen and (max-width: 768px){
.wrap{padding:50px 0 0;}
.header .top_box .top{height:50px;line-height:50px;padding:0 15px;}
.header .top_box .btn_gnb{display:none;}
.header .top_box .mgt{font-size:18px;}
.header .top_box .site{display:none;}
.header .top_box .user{display:none;position:fixed;bottom:10px;left:0;width:100%;text-align:center;float:none;color:#555;z-index:90;}
.header .top_box .user.on{display:block;}
.header .top_box .user .thumb{width:30px;height:30px;background-size:24px 21px;}
.header .top_box .user .name{font-size:12px;color:#fff;margin:0 5px;}
.header .top_box .user .btn_logout{font-size:12px;}
.header .top_box .user .btn_logout:hover{background:#555;color:#fff;}
.header .btn_menu{display:block;top:18px;width:20px;height:14px;}
.header .btn_menu span{height:2px;}
.header .btn_menu.on span:nth-of-type(3){transform:translateY(-6px) rotate(45deg)}
.header .gnb_box{display:none;width:calc(100% + 1px);top:50px;padding-bottom:120px;z-index:80;}
/*header width 값 체크할 것*/
.header .gnb_box.on{display:block;}
.header .gnb > li > a{height:40px;line-height:40px;font-size:15px;}
.header .gnb .lnb_item > li a{height:35px;line-height:35px;}
.contents_wrap{padding:20px 15px;/*padding-sbottom:calc(constant(safe-area-inset-bottom) + 20px);padding-bottom:calc(env(safe-area-inset-bottom) + 20px);*/}

.icon_lb{height:13px;line-height:13px;padding:0 5px;font-size:7px;}
}

/* 커스텀 스크롤 css 수정 */
.mCustomScrollBox{height:auto}
.mCSB_horizontal.mCSB_outside>.mCSB_container{min-height:auto}
.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal+.mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools.mCSB_scrollTools_horizontal{bottom:-16px}