@charset "utf-8";

@font-face {
    font-family: 'NanumSquareRound';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumSquareRound.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* color: #222; color: var(--theme-color); */
:root{--theme-color: #fff;}

/* 공통 구조
**********************************************/
#wrap .only-pc { display: block;}
#wrap .only-mobile { display: none;}
#wrap.fixed .header-wrap{position: fixed;top: 0;left: 0;transition: 0.2s;transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);box-shadow: 0px 18px 18px rgba(68, 68, 68, 0.06), 0px 0px 1px rgba(68, 68, 68, 0.31);z-index: 999;}
#wrap.header-roll-up .header-wrap{-webkit-transform: translateY(-150%);-ms-transform: translateY(-150%);transform: translateY(-150%);}


/* Global */
body {position: relative;min-height: 100%;}
body.noscroll {overflow: hidden;}
.container{min-height: 640px;padding-bottom: 160px;}
.inner{position: relative;margin-left: auto;margin-right: auto;padding-top: 24px;}
.inner-sm{max-width: 588px;}
.inner-md{max-width: 828px;}
.inner-lg{max-width: 956px;}
.inner-xl{max-width: 1134px;}
.inner-xxl{max-width: 1200px;}
.inner-mart{margin-top: 32px;}
.full{width: 100%;}
.half{width: 50%;}
.spinner{top:50% !important;left:50% !important;}


/* 공통 STYLE
**********************************************/
/* 텍스트 */
.fc-theme{color: #383838 !important;color: var(--theme-color) !important;}
.fc-orange{color: #DC7B09 !important;}
.fc-blue{color: #3366E2 !important;}
.fc-red{color: #E22134 !important;}
.fwb{font-weight: bold !important;}

/* 정렬 */
.tal { text-align:left !important;}
.tac { text-align:center !important;}
.tar { text-align:right !important;}

/* 버튼 */

.btn2{ position: relative; display: inline-block;height: 28px;line-height: 26px;padding: 0 16px;font-weight: bold;font-size: 13px;background-color: #fff;border: 1px solid #e1e1e1;border-radius: 4px;box-sizing: border-box;transition: background-color 0.2s, color 0.2s, border-color 0.2s;font-family: "Roboto", "Noto Sans KR", "맑은 고딕", Malgun Gothic, sans-serif;}
.btn{display: inline-flex;align-items: center;justify-content: center;padding: 0px 4px;border-radius: 4px;font-weight: bold;letter-spacing: -1px;transition: background-color 0.2s, color 0.2s, border-color 0.2s;}
.btn i.ico{margin-right: 4px;}
.btn i.ico.next{margin: 0 0 0 4px;}
.btn.default{background-color: #fff;border: 1px solid #dbdbdb;}
.btn.default:hover{background-color: #f5f5f5;}
.btn-theme{color: #fff !important;background-color: #383838;background-color: var(--theme-color);border:2px solid #383838;border: 2px solid var(--theme-color);}
.btn-white{border: 1px solid #222;color: rgba(0, 0, 0, 0.78);}
.btn-white:hover{background-color: #f5f5f5;}
.btn-dark{color: #fff !important;background-color: #484848;border:2px solid #484848;}
.btn-box-theme{color: #383838 !important;color: var(--theme-color) !important;border:1px solid #383838;border: 1px solid var(--theme-color);}
.btn-box-dark{color: rgba(0, 0, 0, 0.78) !important;border:1px solid #222;}
.btn-h50{height: 50px;font-size: 16px;font-weight: bold;}
.btn-lg{width: 216px;height: 50px;padding: 0;font-size: 16px;}
.btn-xl{width: 260px;height: 50px;padding: 0;font-size: 16px;}
.btn-wrap{display: flex;justify-content: center;flex-direction: row;}
.btn-wrap > *{margin-left: 4px;}
.btn-more{width: 28px;height: 20px;background: url("/images/ico_more_2x.png") no-repeat center;background-size: 12px 12px;}
.heartBtn{display: inline-block;}
.heartBtn i.heart{width: 24px;height: 24px;margin-right: 4px;background: url("/images/ico_heart_2x.png") no-repeat;background-size: 24px 24px;background-color: #D1D3D8;}
.heartBtn.active i.heart{background-color: #383838;background-color: var(--theme-color);}
.heartBtn span{margin-left: 4px;font-weight: bold;color: #383838;color: var(--theme-color);}
.likeBtn{display: inline-block;}
.likeBtn i.like{width: 18px;height: 18px;margin-right: 4px;background: url("/images/ico_like_2x.png") no-repeat center;background-size: 18px 18px;background-color: rgba(0, 0, 0, 0.3);border: 1px solid #fff;border-radius: 50%;overflow: hidden;}
.likeBtn.active i.like{background-color: #383838;background-color: var(--theme-color);}
.likeBtn span{display: inline-block;vertical-align: middle;}
.likeBtn b{display: inline-block;vertical-align: text-top;margin-left: 4px;font-weight: bold;color: rgba(0, 0, 0, 0.3);}
.likeBtn.active b{color: #383838;color: var(--theme-color);}
.commentBtn{display: inline-block;}
.commentBtn i.comment{width: 18px;height: 18px;margin-right: 4px;background: url("/images/ico_comment_2x.png") no-repeat center;background-size: 18px 18px;background-color: rgba(0, 0, 0, 0.3);border-radius: 50%;overflow: hidden;}
.commentBtn.active i.comment{background-color: #383838;background-color: var(--theme-color);}
.commentBtn span{display: inline-block;vertical-align: middle;}
.commentBtn b{display: inline-block;vertical-align: text-top;margin-left: 4px;font-weight: bold;color: rgba(0, 0, 0, 0.3);}
.commentBtn.active b{color: #383838;color: var(--theme-color);}
.inputBtn input{width: 0.1px;height: 0.1px;opacity: 0;overflow: hidden;position: absolute;z-index: -1;}
.inputBtn label{cursor: pointer;}
.inputBtn label span{display: inline-block;margin-left: 8px;color: rgba(0, 0, 0, 0.58);}
.moreBtn{width: 100%;height: 44px;background: #FFF;border: 1px solid #D8D8D8;border-radius: 8px;font-weight: bold;font-size: 16px;}
.moreBtn:hover{background-color: #f5f5f5;}
.moreBtn span{display: inline-block;padding-right: 32px;background: url("/images/ico_arrow_bottm_2x.png") no-repeat right center;background-size: 12px 8px}
.closeBtn-xs{width: 21px;height: 21px;background: url("/images/ico_close_sm_2x.png") no-repeat center;background-size: 11px 11px;}


/* 아이콘 */
i.ico{display: inline-block;vertical-align: middle;font-size: 0;text-indent: -999px;}
i.rightArrow-round{width: 16px;height: 16px;background: url("/images/ico_rightArrow_round.png") no-repeat;}
i.close-round{width: 16px;height: 16px;background: url("/images/ico_close_round.png") no-repeat;}
i.login{width: 18px;height: 18px;background: url("/images/ico_login_2x.png") no-repeat;background-size: 18px 18px;}
i.logout{width: 18px;height: 18px;background: url("/images/ico_logout_2x.png") no-repeat;background-size: 18px 18px;}
i.user{width: 17px;height: 16px;background: url("/images/ico_member_2x.png") no-repeat;background-size: 17px 16px;}
i.cart{width: 32px;height: 32px;background: url("/images/ico_cart_2x.png") no-repeat;background-size: 32px 32px;}
i.cart-sm{width: 23px;height: 18px;background: url("/images/ico_cart_sm_2x.png") no-repeat;background-size: 23px 18px;}
i.filter{width:32px;height:32px;background:url("/images/ico_filter.png") no-repeat 0 0;}
i.filter2{width:16px;height:17px;background:url("/images/ico_filter2_2x.png") no-repeat 0 0;background-size: 16px 17px;}
i.list{width: 14px;height: 17px;background: url("/images/ico_list_2x.png") no-repeat 0 0;background-size: 14px 17px;}
i.listWhite{width: 14px;height: 17px;background: url("/images/ico_list_white_2x.png") no-repeat 0 0;background-size: 14px 17px;}
i.booking{width: 28px;height: 22px;background: url("/images/ico_booking.png") no-repeat 0 0;background-size: 28px 22px;}
i.booking2{width: 27px;height: 22px;background: url("/images/ico_booking_2x.png") no-repeat 0 0;background-size: 27px 22px;}
i.youtube{width: 28px;height: 21px;background: url("/images/ico_youtube_2x.png") no-repeat 0 0;background-size: 28px 21px;}
i.prdEmpty{width: 46px;height: 42px;background: url("/images/ico_file_empty_2x.png") no-repeat 0 0;background-size: 46px 42px;}
i.receipt{width: 16px;height: 16px;background: url("/images/ico_receipt_2x.png") no-repeat 0 0;background-size: 16px 16px;}
i.bell{width: 23px;height: 26px;background: url("/images/ico_bell_2x.png") no-repeat center;background-size: 23px 26px;}
i.check-sm{width: 13px;height: 9px;background: url("/images/ico_check_sm_2x.png") no-repeat center;background-size: 13px 9px;}
i.close-sm{width: 11px;height: 11px;background: url("/images/ico_close_sm_2x.png") no-repeat center;background-size: 11px 11px;}
i.write{width: 19px;height: 19px;background: url("/images/ico_write_2x.png") no-repeat 0 0;background-size: 19px 19px;}
i.writeBlack{width: 19px;height: 19px;background: url("/images/ico_write_black_2x.png") no-repeat 0 0;background-size: 19px 19px;}
i.emptyFolder{width: 46px;height: 42px;background: url("/images/ico_emptyFolder_2x.png") no-repeat center;background-size: 46px 42px;}
i.setting{width: 44px;height: 44px;background: url("/images/ico_setting_2x.png") no-repeat center;background-size: 44px 44px;}
i.member{width: 41px;height: 41px;background: url("/images/ico_member_2x.png") no-repeat center;background-size: 41px 41px;}
i.commentNone{width: 45px;height: 41px;background: url("/images/ico_comment_none_2x.png") no-repeat center;background-size: 45px 41px;}
i.deleteFile{width: 34px;height: 41px;background: url("/images/ico_deleteFile_2x.png") no-repeat center;background-size: 34px 41px;}
i.lock{width: 12px;height: 16px;background: url("/images/ico_lock_2x.png") no-repeat center;background-size: 12px 16px;}
i.lockOpen{width: 16px;height: 16px;background: url("/images/ico_lock_open_2x.png") no-repeat center;background-size: 16px 16px;}
i.prev{width: 5px;height: 8px;background: url("/images/ico_arrow_left_xs_2x.png") no-repeat;background-size: 5px 8px;}
i.next{width: 5px;height: 8px;background: url("/images/ico_arrow_right_xs_2x.png") no-repeat;background-size: 5px 8px;}
i.file{width: 14px;height: 14px;background: url("/images/ico_file_2x.png") no-repeat center;background-size: 14px 14px;}
i.dropbox{width: 19px;height: 19px;background: url("/images/ico_dropbox_2x.png") no-repeat center;background-size: 19px 19px;}
i.info{width: 18px;height: 19px;background: url("/images/ico_info_2x.png") no-repeat center;background-size: 18px 19px;}



/* input */
select{cursor: pointer;}
.selectBox-wrap::after{display: block;content: '';clear: both;}
.selectBox{position: relative;display: inline-block;font-weight: bold;font-size: 14px;color: rgba(0, 0, 0, 0.78);background-color: #fff;cursor: pointer;z-index: 9;}
.selectBox .select{position: relative;display: block;height:40px;line-height: 40px;padding: 0 32px 0 8px;border: 1px solid #D8D8D8;border-radius: 4px;}
.selectBox .select span::after{display: inline-block;content: "";width: 12px;height: 8px;position: absolute;right: 12px;top: 50%;margin-top: -4px;background: url("/images/ico_arrow_bottm_2x.png") no-repeat 0 0;background-size: 12px 8px;}
.selectBox .selectOptions{display: none;position: absolute;width: 100%;max-height: 200px;padding: 4px 12px;opacity: 0;background-color: #fff;border: 1px solid #D8D8D8;border-radius: 4px;overflow-y: auto;z-index: 99;}
.selectBox .selectOptions li a{display: block;padding: 4px 0;color: rgba(0, 0, 0, 0.58);}
.selectBox .selectOptions li a:hover{color: rgba(0, 0, 0, 0.78);}
.selectBox .selectOptions li a.active{color: #000;}
.selectBox.show{height: auto;z-index: 99;}
.selectBox.show .select{border-bottom: 1px solid transparent;border-radius:4px 4px 0 0;}
.selectBox.show .selectOptions{opacity: 1;display: block;border-top: 1px solid transparent;border-radius: 0 0 4px 4px;}
.selectBox.disabled{background: #F5F5F5;}
.selectBoxX{position: relative;display: inline-block;font-weight: bold;font-size: 14px;color: rgba(0, 0, 0, 0.78);background-color: #fff;cursor: pointer;z-index: 9;}
.selectBoxX .select{position: relative;display: block;height:40px;line-height: 40px;padding: 0 32px 0 8px;border: 1px solid #D8D8D8;border-radius: 4px;}
.selectBoxX .select span::after{display: inline-block;content: "";width: 12px;height: 8px;position: absolute;right: 12px;top: 50%;margin-top: -4px;background: url("/images/ico_arrow_bottm_2x.png") no-repeat 0 0;background-size: 12px 8px;}
.selectBoxX .selectOptions{display: none;position: absolute;width: 100%;max-height: 200px;padding: 4px 12px;opacity: 0;background-color: #fff;border: 1px solid #D8D8D8;border-radius: 4px;overflow-y: auto;z-index: 99;}
.selectBoxX .selectOptions li a{display: block;padding: 4px 0;color: rgba(0, 0, 0, 0.58);}
.selectBoxX .selectOptions li a:hover{color: rgba(0, 0, 0, 0.78);}
.selectBoxX .selectOptions li a.active{color: #000;}
.selectBoxX.show{height: auto;z-index: 99;}
.selectBoxX.show .select{border-bottom: 1px solid transparent;border-radius:4px 4px 0 0;}
.selectBoxX.show .selectOptions{opacity: 1;display: block;border-top: 1px solid transparent;border-radius: 0 0 4px 4px;}
.selectBoxX.disabled{background: #F5F5F5;}
.selectBox-2 .select{border: none;border-bottom: 1px solid #D8D8D8;border-radius: 0;}
.selectBox-2.show .select{border-bottom: 1px solid #D8D8D8;border-radius:0;}
.selectBox-2.show .selectOptions{border-radius: 0;}
.selectBox-wrap > .selectBox{margin-right: 4px;}
.selectBox-wrap > .selectBox:last-child{margin-right: 0;}
.selectBoxA{position: relative;display: inline-block;height: 32px;line-height: 32px;padding: 0 30px 0 12px;border: 1px solid #D8D8D8;border-radius: 4px;font-size: 14px;background: url("/images/ico_arrow_bottm_sm_2x.png") no-repeat right 10px center;background-size: 10px 7px;background-color: #fff;}
.selectBoxB{position: relative;display: inline-block;height: 32px;line-height: 32px;padding: 0 30px 0 12px;border:none;border-bottom: 1px solid #D8D8D8;border-radius: 0;font-size: 14px;background: url("/images/ico_arrow_bottm_sm_2x.png") no-repeat right 10px center;background-size: 10px 7px;background-color: #fff;}
.selectBoxC{position: relative;display: inline-block;height: 32px;line-height: 32px;padding: 0 30px 0 12px;border: none;border-radius: 4px;font-size: 14px;background: url("/images/ico_arrow_bottm_sm_2x.png") no-repeat right 10px center;background-size: 10px 7px;background-color: #f5f5f5;}
input.input-underline{border:none;box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.07);}
.checkboxA{position: relative;display: inline-block;height: 20px;}
.checkboxA input{display:none;}
.checkboxA input + label::before{content:'';position: absolute;left: 0;top: 0;display: inline-block;width: 20px;height: 20px;margin-right: 2px;cursor: pointer;border-radius: 4px; background-image: url('/images/ico_checkbox_default_2x.png');background-size: 20px 20px;background-repeat: no-repeat;background-position: 0 0;background-color: #fff;}
.checkboxA input:disabled + label::before{background-color: #f9f9f9;}
.checkboxA input:checked + label::before{background-image: url('/images/ico_check_2x.png');background-size:13px 10px;background-color: #383838;background-color: var(--theme-color);background-position: center;}
.checkboxA label{position: relative;display: block;min-width: 20px;line-height: 20px;cursor: pointer;}
.checkboxA label span{margin-left: 24px;color: rgba(0, 0, 0, 0.58);}
.radioA{position: relative;display: inline-block;}
.radioA input{display:none;}
.radioA input + label::before{content:'';position: absolute;left: 0;top: 0;display: inline-block;width: 20px;height: 20px;margin-right: 2px;cursor: pointer;border-radius: 50%; background-image: url('/images/ico_radio_default.png');background-size: 20px;background-repeat: no-repeat;background-color: #fff;}
.radioA input:disabled + label::before{background-color: #f9f9f9;}
.radioA input:checked + label::before{background-image: none;background-color: #383838;background-color: var(--theme-color);background-size: auto;background-position: center;}
.radioA input:checked + label::after{display: block;content: '';position: absolute;top: 50%;left:7px;width: 6px;height: 6px;margin-top: -3px;border-radius: 50%;background-color: #fff;}
.radioA label{position: relative;display: block;padding-left:28px;line-height: 20px;cursor: pointer;}
.radioA label span{margin-left: 28px;color: rgba(0, 0, 0, 0.58);}
input.datepicker{width:110px;padding: 0 8px;background: url("/images/ico_date_2x.png") no-repeat right 10px center;background-size: 14px 15px;color: rgba(0, 0, 0, 0.58);font-weight: normal;letter-spacing: -1px;}
.ui-datepicker .ui-widget-header .ui-icon{background-image: url("/images/icon_datepicker_2x.png");background-size:14px 10px;}
.ui-datepicker-prev span{width:7px;height:10px;background-position: 0px 0px;}
.ui-datepicker-next span{width:7px;height:10px;background-position: -7px 0px;}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next{cursor: pointer;}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span{margin-left: -3.5px;margin-top: -5px;}



/* component */
.list-more{position: relative;margin-top: 16px;}
.fileList li{position: relative;display: inline-block;margin: 4px 6px 4px 0;padding: 8px 16px 8px 20px;background: #FFF;border: 1px solid #dbdbdb;border-radius: 20px;}
.fileList li:last-child{margin-right: 0;margin-bottom: 0px;}
.fileList li a{display: inline-block;vertical-align: middle;font-weight: bold;font-size: 12px;color: rgba(0, 0, 0, 0.58);}
.fileList li span{display: block;max-width: 220px;padding-left: 26px;padding-right: 2px;white-space: normal;line-height: 22px;text-align: left;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}
.fileList li button{font-size: 13px;text-decoration: underline;}
.fileList li button:hover{-webkit-text-stroke: 1px #383838;-webkit-text-stroke: 1px var(--theme-color);color: #383838;color: var(--theme-color);border-bottom: 1px solid #383838;border-bottom: 1px solid var(--theme-color);}
.fileList .fileDownload{width: 16px;height: 16px;background: url("/images/ico_download_xs_2x.png") no-repeat center;background-size: 9px 9px;}
.fileList .fileDelete{display: inline-block;width: 16px;height: 16px;margin-left: 4px;background: url("/images/ico_close_xs_2x.png") no-repeat center;background-size: 8px 8px;vertical-align: middle;}
.file-img{background: url("/images/ico_file_img_lg_2x.png") no-repeat left center;background-size:20px 15px;}
.file-pdf{background: url("/images/ico_file_pdf_lg_2x.png") no-repeat left center;background-size:18px 21px;}
.file-zip{background: url("/images/ico_file_zip_lg_2x.png") no-repeat left center;background-size:20px 19px;}
.file-etc{background: url("/images/ico_file_etc_lg_2x.png") no-repeat left center;background-size:17px 20px;}
.fileList-xs li{position: relative;display: inline-block;margin-right: 12px;margin-top: 4px;padding: 1px 12px;background: #fff;border: 1px solid rgba(0, 0, 0, 0.38);border-radius: 20px;}
.fileList-xs li:last-child{margin-right: 0;margin-bottom: 0px;}
.fileList-xs li a{display: inline-block;vertical-align: middle;font-size: 13px;color: rgba(0, 0, 0, 0.58);}
.fileList-xs li span{display: block;max-width: 180px;padding-left: 20px;padding-right: 2px;white-space: normal;line-height: 22px;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}
.fileList-xs .file-img{background: url("/images/ico_file_img_xs_2x.png") no-repeat left center;background-size:16px 12px;}
.fileList-xs .file-pdf{background: url("/images/ico_file_pdf_xs_2x.png") no-repeat left center;background-size:14px 13px;}
.fileList-xs .file-zip{background: url("/images/ico_file_zip_xs_2x.png") no-repeat left center;background-size:15px 14px;}
.fileList-xs .file-etc{background: url("/images/ico_file_etc_xs_2x.png") no-repeat left center;background-size:11px 13px;}
/* .fileList-xs .fileDownload{width: 16px;height: 16px;background: url("/images/ico_download_xs_2x.png") no-repeat center;background-size: 9px 9px;} */
.fileList-xs .fileDelete{display: inline-block;width: 16px;height: 16px;margin-left: 4px;background: url("/images/ico_close_xs_2x.png") no-repeat center;background-size: 8px 8px;}
/* .fileList-xs button::after{display: block;content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;} */
.file-del{position: absolute;top: 50%;right: 20px;transform: translateY(-50%);display: inline-block;width: 17px;height: 17px; background: url("/images/icon_close_round.png") no-repeat 0 0;vertical-align: middle;}
.title-underline{padding-bottom: 16px;border-bottom: 2px solid #222;}
.youtube-url{position: relative;width: 100%;height: 0;padding-bottom: 56.25%;background: #000;border-radius: 12px;overflow: hidden;}
.youtube-url iframe{position: absolute;width: 100.4%;height: 100.4%;}
.data-none{padding: 16px 0; text-align: center;color: rgba(0, 0, 0, 0.58);}
.filter-wrap{width:32px;height:32px;position: absolute;top: 0;right: 0;}
.filter-wrap:hover .filter-list{display: block;z-index: 9;}
.filterBtn{display: block;}
.filter-list{display: none;position: absolute;top: -8px;left: 60px;width: 107px;padding: 20px 25px;background: #fff;border: 1px solid #EEE;box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);border-radius: 8px;transition: .2s ease;transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);z-index: 1;}
.filter-list::before{display: block;content: '';position: absolute;top:-1px;left: -13px;width: 105px;height: 33px;background: url("/images/bubble_top.png") no-repeat left center;z-index: -1;}
.filter-list::after{display: block;content: '';position: absolute;top: 0;left: -30px;width: 100px;height: 100px;z-index:-1;}
.filter-list li a{position: relative; display: inline-block;line-height: 29px;font-size: 12px;}
.filter-list li a::after{display: none;content: '';position: absolute;bottom: 6px;left: 0px;width: 100%;height: 1px; background: rgba(0, 0, 0, 0.58);}
.filter-list li:hover a, .filter-list li a.active{font-weight: bold;}
.filter-list li:hover a::after, .filter-list li a.active::after{display: block;}
.mark{display: inline-block;padding: 7px 6px;font-weight: bold;font-size: 14px;line-height: 140%;color: rgba(0, 0, 0, 0.58);background-color: #fff;border: 1px solid #D8D8D8;border-radius: 8px;text-align: center;}
.warning{padding-left: 20px;line-height: 17px;font-weight: bold;font-size: 12px;color: #E22134;background: url("/images/ico_warning_2x.png") no-repeat left top;background-size: 16px 16px;}
.bubble-wrap{position: relative;}
.bubble-wrap.show .bubble-box{display: block;}
.bubble-wrap .bubble-box{display: none;position: absolute;top: 0;right: 0;width: 100%;padding: 16px 20px;border: 1px solid #EEE;background: #fff;border-radius: 8px;box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);z-index: 99;}
.bubble-wrap .bubble-box.bubble-top::after{display: block;content: '';position: absolute;top: -15px;right: 18px;width: 14px;height: 16px;background: url("/images/ico_bubble_top_arrow_2x.png") no-repeat center;background-size: 18px 14px;}
.bubble-wrap .bubble-box .bubble-header{display: flex;justify-content: space-between;align-items: center;margin-bottom: 10px;}
.bubble-wrap .bubble-box .bubble-header h5{line-height: 20px;font-size: 14px;color: #000;}
.nodata{display: flex;justify-content: center;align-items: center;flex-direction: column;padding: 40px 0;text-align: center;border-bottom: 1px solid #dbdbdb;}
.nodata:first-of-type{border-top: 1px solid #222;}
.nodata i.ico{width: 80px;height: 80px;}
.nodata p{font-size: 14px;color: rgba(0, 0, 0, 0.58);word-break: keep-all;}
.flag{display: inline-block;vertical-align: middle;}
.flag.new{width: 16px;height: 16px;margin-left: 8px;background: url("/images/ico_new_2x.png") no-repeat center;background-size: 6px 8px;background-color: #383838;background-color: var(--theme-color);border-radius: 4px;}
.flag.new2{position: relative;width: 22px;height: 22px;margin-left: 8px;background-color: #383838;background-color: var(--theme-color);border-radius: 4px;font-style: normal;font-size: 11px;}
.flag.new2::after{display: block;content: '';position: absolute;top: 2px;left: 2px;width: 18px;height: 18px;background: url("/images/ico_new2_2x.png") no-repeat 0 0;background-size: 18px 18px;border-radius: 2px;}
.flag.notice{display: inline-flex;align-items: center;justify-content: center;height: 24px;line-height: 20px;padding: 0 3px 0 2px;border: 2px solid #383838;border: 2px solid var(--theme-color);font-weight: bold;font-size: 12px;text-align: center;color: #383838;color: var(--theme-color);border-radius: 4px;}
.bar {display: inline-block;width: 8px;height: 1px;margin: 0 0 0 4px;background-color: rgba(0, 0, 0, 0.3);vertical-align: middle;}


/* board */
.board-header{display: flex;justify-content: space-between;align-items: flex-end;min-height: 32px;margin-bottom: 12px;}
.board-header .title{font-size: 18px;}
.board-header .title span{margin-left: 4px;font-weight: normal;font-size: 13px;color: rgba(0, 0, 0, 0.58);}
.board-header .bo-sort{display: flex;justify-content: center;flex-direction: row;}
.board-header .bo-sort .bo-select{position: relative;display: block;height: 32px;line-height: 32px;margin-left: 4px;padding: 0 48px 0 12px;border: none;border-radius: 4px;font-size: 14px;background: url("/images/ico_arrow_bottm_sm_2x.png") no-repeat right 10px center;background-size: 10px 7px;background-color: #f5f5f5;color: rgba(0, 0, 0, 0.58);font-family: 'Noto Sans KR', sans-serif;}
.board-header .view-title{display: table-cell;vertical-align: middle;}
.board-header .view-title > *{margin-right: 8px;}
.board-header .view-title .cate{font-weight: bold;font-size: 18px;color: rgba(0, 0, 0, 0.38);vertical-align: middle;}
.board-header .view-title .subject{display: inline;vertical-align: middle;font-size: 18px;}
.board-header .view-title .cnt{font-weight: bold;font-size: 13px;color: #383838;color: var(--theme-color);vertical-align: bottom;}
.board-header .view-title .flag.new{margin-left: 0;}

.board-prev-next{flex-shrink: 0;text-align: right;}
.board-prev-next button{position: relative;height: 32px;margin-left: 6px;padding: 0 16px;font-size: 13px;}
.board-prev-next .prevBtn + .nextBtn::before{display: inline-block;content: '';position: absolute;top: 50%;left: -10px;width: 1px;height: 8px;margin-top: -4px;background-color: #c4c4c4;}
.board-prev-next .nextBtn{margin-left: 15px;}


.board-tab-wrap{padding: 14px 0 34px;border-top: 1px solid #000;overflow: auto;}
.board-tab-wrap::-webkit-scrollbar {display: none;}
.board-tab-wrap .tab-btn{width: 100%;min-width: max-content;}

.htable-wrap{border-top: 1px solid #000;border-bottom: 1px solid #eee;}
.htable-wrap .thead{border-bottom: 1px solid #eee;}
.htable-wrap .thead > ul{position: relative;display: flex;align-items: center;justify-content: flex-start;height: 47px;}
.htable-wrap .thead > ul > li{font-size: 13px;font-weight:bold;text-align: center;}
.htable-wrap .thead > ul > li.cell-no{width: 7%;}
.htable-wrap .thead > ul > li.cell-checkbox{width: 4%;}
.htable-wrap .thead > ul > li.cell-checkbox .checkboxA{margin-top:4px;}
.htable-wrap .thead > ul > li.cell-cate{width: 11%;}
.htable-wrap .thead > ul > li.cell-subject{flex-grow: 1;justify-content: center;width: auto;}
.htable-wrap .thead > ul > li.cell-name{width: 8%;}
.htable-wrap .thead > ul > li.cell-date{width: 8%;}
.htable-wrap .thead > ul > li.cell-view{width: 7%;}
.htable-wrap .thead > ul > li.cell-like{width: 7%;}
.htable-wrap .thead > ul > li.cell-url{width: 10%;}
.htable-wrap .thead > ul > li.cell-comment{padding-left:8px;text-align: left;}

.htable-wrap .tbody > ul{position: relative;display: flex;align-items: center;justify-content: flex-start;height: 47px;border-bottom: 1px solid #eee;}
.htable-wrap .tbody > ul:last-child{border-bottom:none;}
.htable-wrap .tbody > ul > li{text-align: center;color: rgba(0, 0, 0, 0.58);}
.htable-wrap .tbody > ul > li.cell-no{flex-shrink: 0;width: 7%;color: rgba(0, 0, 0, 0.38);}
.htable-wrap .tbody > ul > li.cell-no .flag.notice{}
.htable-wrap .tbody > ul > li.cell-checkbox{flex-shrink: 0;width: 4%;}
.htable-wrap .tbody > ul > li.cell-checkbox .checkboxA{margin-top: 4px;}
.htable-wrap .tbody > ul > li.cell-cate{flex-shrink: 0;width: 11%;}
.htable-wrap .tbody > ul > li.cell-cate .cate{}
.htable-wrap .tbody > ul > li.cell-cate .cate.none{display: block;margin: 0 auto;width:3px;height:3px;background: rgba(0, 0, 0, 0.58);border-radius: 50%;font-size: 0;}
.htable-wrap .tbody > ul > li.cell-subject{flex-grow: 1;overflow: hidden;text-align: left;}
.htable-wrap .tbody > ul > li.cell-subject > *{margin-right: 8px;}
.htable-wrap .tbody > ul > li.cell-subject > *:last-child{margin-right: 0;}
.htable-wrap .tbody > ul > li.cell-subject a{padding-right: 2px;}
.htable-wrap .tbody > ul > li.cell-subject .cnt{}
.htable-wrap .tbody > ul > li.cell-subject .flag.new{}
.htable-wrap .tbody > ul > li.cell-name{flex-shrink: 0;width: 8%;}
.htable-wrap .tbody > ul > li.cell-name span{}
.htable-wrap .tbody > ul > li.cell-date{flex-shrink: 0;width: 8%;}
.htable-wrap .tbody > ul > li.cell-view{flex-shrink: 0;width: 7%;}
.htable-wrap .tbody > ul > li.cell-view a{color: rgba(0, 0, 0, 0.38);text-decoration: underline;}
.htable-wrap .tbody > ul > li.cell-view a:hover{font-weight: bold;}
.htable-wrap .tbody > ul > li.cell-like{flex-shrink: 0;width: 7%;color: rgba(0, 0, 0, 0.38);}
.htable-wrap .tbody > ul > li.cell-url{flex-shrink: 0;width: 10%;}
.htable-wrap .tbody > ul > li.cell-url button{height:24px;font-size: 12px;border: 1px solid #dbdbdb;background-color:#fff;}
.htable-wrap .tbody > ul > li.cell-url button:hover{color: rgba(0, 0, 0, 0.68);}
.htable-wrap .tbody > ul > li.cell-comment{flex-grow: 1;padding:16px 8px;text-align: left;}
.htable-wrap .tbody > ul > li.cell-comment .subject{font-weight: bold;color: rgba(0, 0, 0, 0.58);}
.htable-wrap .tbody > ul > li.cell-comment .text{margin: 8px 0;white-space: pre-line;}

.htable-wrap .tbody > ul:hover::before{display: block;content: '';position: absolute;top: 0;left: 0; width: 100%;height: 100%;background-color: #F9F9F9;z-index: -1;}
.htable-wrap .tbody > ul.bo-notice::before{display: block;content: '';position: absolute;top: 0;left: 0; width: 100%;height: 100%;background-color: #383838;background-color: var(--theme-color);opacity: 0.07;z-index: -1;}
.htable-wrap .tbody > ul.bo-notice:hover::before{background-color: #383838;background-color: var(--theme-color);opacity: 0.17;}
.htable-wrap .tbody > ul.bo-notice > li.cell-view a:hover{color: #383838;color: var(--theme-color);}


.reply-list .htable-wrap .tbody > ul{height: auto;}




/*.htable-wrap{border-top: 1px solid #000;border-bottom: 1px solid #dbdbdb;}
.htable-wrap .thead{border-bottom: 1px solid #dbdbdb;}
.htable-wrap .thead > ul{display: table;table-layout: fixed;width: 100%;height: 46px;}
.htable-wrap .thead > ul > li{display: table-cell;vertical-align: middle;font-weight: bold;font-size: 13px;text-align: center;}
.htable-wrap .thead > ul > li.cell-no{width: 7%;}
.htable-wrap .thead > ul > li.cell-checkbox{width: 4%;}
.htable-wrap .thead > ul > li.cell-checkbox .checkboxA{margin-top:4px;}
.htable-wrap .thead > ul > li.cell-cate{width: 11%;}
.htable-wrap .thead > ul > li.cell-subject{width: auto;}
.htable-wrap .thead > ul > li.cell-name{width: 8%;}
.htable-wrap .thead > ul > li.cell-date{width: 8%;}
.htable-wrap .thead > ul > li.cell-view{width: 7%;}
.htable-wrap .thead > ul > li.cell-like{width: 7%;}
.htable-wrap .thead > ul > li.cell-url{width: 10%;}
.htable-wrap .thead > ul > li.cell-comment{padding-left:8px;text-align: left;}
.htable-wrap .tbody > ul{position: relative;display: table;table-layout: fixed;width: 100%;height: 46px;border-bottom: 1px solid #eee;}
.htable-wrap .tbody > ul:hover li:first-child:before{display: block;content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: #f9f9f9;z-index: -1;}
.htable-wrap .tbody > ul:hover li.cell-subject a{text-decoration: underline;}
.htable-wrap .tbody > ul:hover li.cell-comment .subject{text-decoration: underline;}
.htable-wrap .tbody > ul:last-child{border-bottom: none;}
.htable-wrap .tbody > ul > li{display: table-cell;vertical-align: middle;text-align: center;color: rgba(0, 0, 0, 0.58);}
.htable-wrap .tbody > ul > li.cell-no{width: 7%;}
.htable-wrap .tbody > ul > li.cell-no .flag.notice{height: 23px;}
.htable-wrap .tbody > ul > li.cell-checkbox{width: 4%;}
.htable-wrap .tbody > ul > li.cell-checkbox .checkboxA{margin-top: 4px;}
.htable-wrap .tbody > ul > li.cell-cate{width: 11%;color: rgba(0, 0, 0, 0.58);}
.htable-wrap .tbody > ul > li.cell-cate .cate{display: inline-block;max-width: 66px;margin: 0 auto;overflow: hidden;vertical-align: middle;}
.htable-wrap .tbody > ul > li.cell-cate .cate.none{width:3px;height:3px;background: rgba(0, 0, 0, 0.58);border-radius: 50%;}
.htable-wrap .tbody > ul > li.cell-subject{width: auto;text-align: left;}
.htable-wrap .tbody > ul > li.cell-subject > *{margin-right: 4px;}
.htable-wrap .tbody > ul > li.cell-subject > *:last-child{margin-right: 0;}
.htable-wrap .tbody > ul > li.cell-subject a{display: inline-block;max-width: 80%;padding-right: 2px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;vertical-align: middle;color: rgba(0, 0, 0, 0.58);}
.htable-wrap .tbody > ul > li.cell-subject .cnt{vertical-align: middle;font-weight: bold;color: #383838;color: var(--theme-color);}
.htable-wrap .tbody > ul > li.cell-subject .flag.new{margin-left: 0;}
.htable-wrap .tbody > ul > li.cell-name{width: 8%;color: rgba(0, 0, 0, 0.38);}
.htable-wrap .tbody > ul > li.cell-name span{display: inline-block;max-width: 66px;margin: 0 auto;overflow: hidden;vertical-align: middle;}
.htable-wrap .tbody > ul > li.cell-date{width: 8%;color: rgba(0, 0, 0, 0.38);}
.htable-wrap .tbody > ul > li.cell-view{width: 7%;color: rgba(0, 0, 0, 0.38);}
.htable-wrap .tbody > ul > li.cell-view a{color: rgba(0, 0, 0, 0.38);text-decoration: underline;}
.htable-wrap .tbody > ul > li.cell-view a:hover{font-weight: bold;}
.htable-wrap .tbody > ul > li.cell-like{width: 7%;color: rgba(0, 0, 0, 0.38);}
.htable-wrap .tbody > ul > li.cell-url{width: 10%;}
.htable-wrap .tbody > ul > li.cell-url button{height:24px;font-size: 12px;border: 1px solid #dbdbdb;background-color:#fff;}
.htable-wrap .tbody > ul > li.cell-url button:hover{color: rgba(0, 0, 0, 0.68);}
.htable-wrap .tbody > ul > li.cell-comment{padding:16px 8px;text-align: left;}
.htable-wrap .tbody > ul > li.cell-comment .subject{font-weight: bold;color: rgba(0, 0, 0, 0.58);}
.htable-wrap .tbody > ul > li.cell-comment .text{margin: 8px 0;line-height: 140%;}
.htable-wrap .tbody > ul.bo-notice li:first-child:before{display: block;content: '';position: absolute;top: 0;left: 0; width: 100%;height: 100%;background-color: #383838;background-color: var(--theme-color);opacity: 0.1;z-index: -1;}
.htable-wrap .tbody > ul.bo-notice li.cell-cate .cate{color: #383838;color: var(--theme-color);font-weight: bold;}
.htable-wrap .tbody > ul.bo-notice li.cell-subject, .htable-wrap .tbody > ul.bo-notice > li.cell-subject a{padding-right:2px;color: #383838;color: var(--theme-color);font-weight: bold;}
.htable-wrap .tbody > ul.bo-notice li.cell-view a:hover{color: #383838;color: var(--theme-color);font-weight: bold;}
.htable-wrap .tbody > ul.bo-reply li.cell-subject a{padding-left: 26px;background: url("/images/ico_reply_2x.png") no-repeat left 4px center;background-size: 8px 12px;}
.htable-wrap .tbody > ul.bo-reply li.cell-subject a::before{display: inline-block;content: 'Re : ';margin-right: 4px;font-weight: bold;}
*/

.board-element-wrap{display: flex;flex-direction: column;}
.board-element-wrap .board-btn + .board-search-wrap{margin-top: 16px;}
.board-btn{margin-top: 8px;text-align: right;}
.board-btn button{height: 48px;margin-left: 6px;padding: 0 24px;font-size: 14px;font-weight: bold;color: #40454E;background-color: #fff;border: 1px solid #dbdbdb;border-radius: 8px;}
.board-btn button:hover{background-color: #f5f5f5;}
.board-btn button i.ico{margin-right: 8px;}
.board-search-wrap{margin-top: -1px;padding: 8px 0;background-color: #f9f9f9;border-top: 1px solid #eee;border-bottom: 1px solid #eee;}
.board-search-wrap .pagination-wrap{margin: 0;}
.board-search-wrap .board-search{margin-top: 8px;}
.board-search{display: flex;justify-content: center;align-items: center;}
.board-search select{margin-right: 6px;}
.input-searchBox{position: relative;width: 320px;height: 32px;background: #FFF;border: 1px solid #D8D8D8;border-radius: 4px;}
.input-searchBox input{width: 100%;height: 30px;padding-right: 60px;border: none;font-weight: normal;}
.input-searchBox button{position: absolute;top: 4px;right: 3px;width: 54px;height: 22px;background: #FFF;border: 1px solid #999CA2;border-radius: 4px;font-weight: bold;font-size: 12px;color: #40454E;}

.board-gallery .galleryList{padding-top: 16px;}
.galleryList{border-top: 1px solid #000;}
.galleryList > ul{margin-left: -12px;}
.galleryList > ul::after{display: block;content: '';clear: both;}
.galleryList > ul.list2 li{width: 50%;}
.galleryList > ul.list3 li{width: 33.333%;}
.galleryList > ul.list4 li{width: 25%;}
.galleryList > ul li{float: left;height: 450px;padding-left: 12px;padding-bottom: 24px;}
.gallery-box:hover .subject{text-decoration: underline;}
.gallery-box .gall-thumb{width: 100%;background-color: #F5F5F5;border: 1px solid #D8D8D8;border-radius: 8px;overflow: hidden;}
.galleryList > ul.list2 li .gall-thumb{height: 472px;}
.galleryList > ul.list3 li .gall-thumb{height: 310px;}
.galleryList > ul.list4 li .gall-thumb{height: 228px;}
.gallery-box .gall-thumb a span{display: block;width: 100%;height: 100%;background-repeat: no-repeat;background-position: center;background-size: cover;}

.gallery-box .gall-thumb.no-img span{background-image: url("/images/no_img_2x.png");background-size: 102px 126px;}

.gallery-box .gall-cont{padding-top: 4px;}
.gallery-box .gall-cont .cate{font-weight: bold;font-size: 13px;color: rgba(0, 0, 0, 0.58);}
.gallery-box .gall-cont .text{display: flex;align-items: center;margin-top: 4px;overflow: hidden;}
.gallery-box .gall-cont .text > *{margin-right: 4px;}
.gallery-box .gall-cont .text a{display: inline-block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;vertical-align: middle;color: rgba(0, 0, 0, 0.58);}
.gallery-box .gall-cont .text .cnt{flex-shrink: 0;font-weight: bold;color: #383838;color: var(--theme-color);vertical-align: middle;}
.gallery-box .gall-cont .text .flag.new{flex-shrink: 0;margin-left: 0;vertical-align: middle;}
.gallery-box .gall-cont .name{margin-top: 8px;font-size: 12px;color: rgba(0, 0, 0, 0.38);}
.gallery-box .gall-cont .date{margin-top: 8px;font-size: 12px;color: rgba(0, 0, 0, 0.38);}



.reply-list .ul-list .tbody li{padding: 0 16px;border-bottom: none;}
.reply-list .ul-list .tbody li:last-child{border-bottom: 1px solid #dbdbdb;}
.reply-list .ul-list .tbody li .col-title{width: 100%;}

.cell-subject{display: flex;align-items: center;}
.cell-subject > *{margin-right: 8px;vertical-align: middle;}
.cell-subject > *:last-child{margin-right: 0;}
.cell-subject .flag.notice{flex-shrink: 0;}
.cell-subject .cate{flex-shrink: 0;}
.cell-subject .subject{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;color: rgba(0, 0, 0, 0.58);}
.cell-subject .subject:hover{text-decoration: underline;}
.cell-subject .cnt{flex-shrink: 0;font-weight: bold;color: #383838;color: var(--theme-color);}
.cell-subject .lock{flex-shrink: 0;}
.cell-subject .flag.new{flex-shrink: 0;margin-left: 0;}
.cell-subject .reply{flex-shrink: 0;display: inline-block;width: 18px;height: 22px;background: url("/images/ico_reply_2x.png") no-repeat center;background-size: 8px 12px;vertical-align: top;font-size: 0;text-indent: -999px;}
.cell-subject .wr-reply{position: relative;flex-shrink: 0;width: 60px;}
.cell-subject .wr-reply::after{display: inline-block;content: '';position: absolute;top: 50%;right: 0;width: 14px;height: 1px;background-color: #dbdbdb;}

.bo-notice .cell-subject{font-weight: bold;color: #383838;color: var(--theme-color);}
.bo-notice .cell-subject .subject{color: #383838;color: var(--theme-color)}
.bo-reply .cell-subject .subject::before{display: inline-block;content: 'Re : ';margin-right: 2px;font-weight: bold;}

/*
.board-thumb-list .board-list .htable-wrap .tbody > ul{display: flex;align-items: center;padding-left: 16px;}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li{display: inline-block;width: auto;text-overflow: ellipsis;overflow: hidden;}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-no{flex-shrink: 0;}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-no .flag.notice{height: 24px;margin-right: 8px;}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-cate{flex-shrink: 0;}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-cate span{max-width: 65px;width: auto;height: 24px;margin-right: 8px;overflow: hidden;display: inline-block;padding: 0 4px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;border: 1px solid rgba(0, 0, 0, 0.38);font-weight: normal;font-size: 12px;text-align: center;color: rgba(0, 0, 0, 0.38);border-radius: 4px;vertical-align: middle;}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-subject{flex-grow: 1;}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-subject a{max-width: 68%;}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-name{flex-shrink: 0;max-width: 72px;margin-right: 16px;padding: 0 0 0 16px;color: rgba(0, 0, 0, 0.38);font-size: 12px;white-space: nowrap;}
.board-thumb-list .board-list .htable-wrap .tbody > ul.bo-notice > li.cell-cate span{border-color: #383838;border-color: var(--theme-color);color: #383838;color: var(--theme-color);}
*/

.dash-list-wrap{border-top: 1px solid #000;border-bottom: 1px solid #dbdbdb;}
.dash-list-wrap .tbody{}
.dash-list-wrap .tbody > ul{ position: relative; display: flex; align-items: center; justify-content: flex-start; min-height: 47px; padding: 6px 16px; border-bottom: 1px solid #eee; }
.dash-list-wrap .tbody > ul:last-child{border-bottom:none;}
.dash-list-wrap .tbody > ul > li{}
.dash-list-wrap .tbody > ul > li.cell-no{flex-shrink: 0;}
.dash-list-wrap .tbody > ul > li.cell-no .notice{display: block;margin-right:8px;line-height: 20px;}
.dash-list-wrap .tbody > ul > li.cell-cate{flex-shrink: 0;}
.dash-list-wrap .tbody > ul > li.cell-cate .cate{display: block;max-width: 65px;height: 24px;margin-right: 8px;padding: 0 4px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;border-radius: 4px;border: 1px solid rgba(0, 0, 0, 0.38);font-weight: bold;text-align: center;font-size: 12px;color: rgba(0, 0, 0, 0.38);}
.dash-list-wrap .tbody > ul > li.cell-subject{display: flex;flex-grow: 1;overflow: hidden;}
.dash-list-wrap .tbody > ul > li.cell-subject .subject{margin-right: 4px;padding-right: 2px;}
.dash-list-wrap .tbody > ul > li.cell-name{flex-shrink: 0;padding-left: 16px;letter-spacing: -1px;color: rgba(0, 0, 0, 0.38);font-size: 12px;}
.dash-list-wrap .tbody > ul.bo-notice > li.cell-cate .cate{border-color: #383838;border-color: var(--theme-color);color: #383838;color: var(--theme-color);}
.dash-list-wrap .tbody > ul.bo-notice::before{display: block;content: '';position: absolute;top: 0;left: 0; width: 100%;height: 100%;background-color: #383838;background-color: var(--theme-color);opacity: 0.07;z-index: -1;}
.dash-list-wrap .tbody > ul.bo-notice:hover::before{opacity: 0.17;}
.dash-list-wrap .tbody > ul.bo-notice > li.cell-name{font-weight: bold;}
.dash-list-wrap .tbody > ul.bo-list:hover::before{display: block;content: '';position: absolute;top: 0;left: 0; width: 100%;height: 100%;background-color: #F9F9F9;z-index: -1;}

.reply-list .dash-list-wrap .tbody > ul:hover::before{display: block;content: '';position: absolute;top: 0;left: 0; width: 100%;height: 100%;background-color: #F9F9F9;z-index: -1;}
.reply-list .dash-list-wrap .tbody > ul > li.cell-name{padding-left:0;}
.reply-list .dash-list-wrap .tbody > ul > li.cell-subject{position: relative;}
.reply-list .dash-list-wrap .tbody > ul > li.cell-name + li.cell-subject{padding-left:8px;}
.reply-list .dash-list-wrap .tbody > ul > li.cell-name + li.cell-subject::before{display: block;content: '';flex-shrink: 0;width: 14px;height: 1px;margin-right: 6px;background-color: #dbdbdb;}

/*
.board-thumb-list .board-list .htable-wrap .tbody > ul{display: flex;align-items: center;justify-content: flex-start;}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li{}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-no{}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-no .flag.notice{}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-cate{}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-cate span{}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-subject{}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-subject a{}
.board-thumb-list .board-list .htable-wrap .tbody > ul > li.cell-name{}
.board-thumb-list .board-list .htable-wrap .tbody > ul.bo-notice > li.cell-cate span{}

.board-thumb-list .reply-list .htable-wrap .tbody > ul{display: flex;align-items: center;padding-left: 16px}
.board-thumb-list .reply-list .htable-wrap .tbody > ul > li{display: inline-block;width: auto;text-overflow: ellipsis;overflow: hidden;}
.board-thumb-list .reply-list .htable-wrap .tbody > ul > li.cell-name{max-width: 60px;flex-shrink: 0;color: rgba(0, 0, 0, 0.38);white-space: nowrap;text-overflow: inherit;}
.board-thumb-list .reply-list .htable-wrap .tbody > ul > li.cell-subject{flex-grow: 1;padding-left: 8px;}
.board-thumb-list .reply-list .htable-wrap .tbody > ul > li.cell-subject::before{display: inline-block;content: '';width: 14px;height: 1px;margin-right: 4px;background-color: #dbdbdb;vertical-align: middle;}
*/

.board-list .htable-wrap .tbody > ul > li.cell-cate, .board-list .htable-wrap .tbody > ul > li.cell-name{overflow: hidden;text-overflow: inherit;white-space: nowrap;}
.board-list .ul-list .tbody li .col-title{padding-left: 16px;}

.board-view-wrap .board-header{align-items: center;height: auto;min-height: 45px;margin-bottom: 0;padding-bottom: 12px;border-bottom: 1px solid #000;}
.board-info{display: flex;justify-content: space-between;align-items: center;padding: 12px 0 14px;border-bottom: 1px solid #dbdbdb;}
.board-info .write-info .center{margin: 0 8px;font-size: 12px;color: rgba(0, 0, 0, 0.58);}
.board-info .write-info .grade{font-size: 12px;color: rgba(0, 0, 0, 0.58);}
.board-info .write-info .date{display: block;margin-top: 4px;font-size: 13px;color: rgba(0, 0, 0, 0.38);}
.board-info .board-metoo{flex-shrink: 0;}
.board-cont .view-file{padding: 16px 0 8px;text-align: right;}
.board-cont .view-cont{ padding: 32px 16px; font-size: 16px; line-height: 180%; letter-spacing: -0.3px; word-break: break-all; color: #1a1818; text-rendering: optimizeLegibility; }
.board-cont .view-cont a{color: #0782C1;text-decoration: underline;}
.board-cont .view-cont img{display: block;height: auto !important;margin-top: 10px;}
.commentWriter{position: relative;margin-top: 20px;padding: 16px;background-color: #fff;border: 1px solid #dbdbdb;border-radius: 8px;}
.commentWriter .writer-info{margin-bottom: 8px;line-height: 27px;}
.commentWriter .closeBtn-xs{position: absolute;top: 16px;right: 16px;z-index: 1;}
.writer-info {position: relative;margin-bottom: 10px;line-height: 32px;}
.writer-info .name{margin-right: 4px;font-size: 16px;}
.writer-info .center{margin-right: 4px;font-size: 13px;color: rgba(0, 0, 0, 0.58);font-weight: normal;}
.writer-info .grade{margin-right: 8px;font-size: 13px;color: rgba(0, 0, 0, 0.58);font-weight: normal;}
.writer-info .date{font-size: 13px;color: rgba(0, 0, 0, 0.38);font-weight: normal;}
.writer-info .cmt-tool{position: absolute;top: 0;right: 0;z-index: 1;}
.writer-box{display: flex;}
.writer-box textarea{height: 100px;font-size: 15px;caret-color: #383838;caret-color: var(--theme-color);}
.writer-box button{width: 100px;height: 100px;margin-left: 10px;background: #FFF;border: 1px solid #999CA2;border-radius: 8px;color: #000;}
.writer-attach{display: flex;justify-content: space-between;margin-top: 10px;}
.writer-attach .cmt-secret{flex-shrink: 0;flex-basis: 80px;margin-top: 6px;text-align: right;}
.file-input-wrap{display: flex;justify-content: flex-start;align-items: center;}
.file-input-wrap .inputBtn{flex-shrink: 0;width: 74px;margin: 6px 8px 0 0;}
.board-comment-wrap .fileList-xs li{margin-right: 4px;background-color: #fff;}
.comment-list-wrap{margin-top: 16px;}
.comment-list-wrap h4{margin-bottom: 24px;padding-bottom: 16px;font-size: 16px;color: rgba(0, 0, 0, 0.58);border-bottom: 2px solid #40454E;}
.comment-list-wrap h4 span{margin: 0 4px;color: #383838;color: var(--theme-color);}
.comment-list-wrap .commentList > li{margin-bottom: 16px;}
.comment-list-wrap .commentList > li:last-child{margin-bottom: 0;}
.comment-list-wrap .nodata{padding-top:16px;}
.commentList-box{padding: 16px;background: #FFF;border: 1px solid #D8D8D8;border-radius: 8px;}
.commentList-box > .writer-info{line-height: 32px;}

.commentBox{}
.commentBox::before{display: block;content: '';width: 100%;height: 2px;margin: 32px 0 24px;background-color: #40454E;}
.commentBox:first-child::before{display: none;}
.cmt-tool:hover .cmt-tool-box{display: block;}
.cmt-tool .cmt-tool-btn{display: block;width: 32px;height: 32px;background: #FFF;border: 1px solid #DDD;border-radius: 4px;}
.cmt-tool .cmt-tool-btn::after{display: block;content: '';width: 30px;height: 30px;background: url("/images/ico_more_btn_2x.png") no-repeat center;background-size: 3px 13px;}
.cmt-tool .cmt-tool-box{display: none;position: absolute;top: -8px;right: 40px;width: 149px;padding: 20px 0;background: #FFF;border: 1px solid #EEE;box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);border-radius: 8px;}
.cmt-tool .cmt-tool-box::before{display: block;content: '';position: absolute;top: 7px;right: -30px;width: 32px;height: 100%;z-index: -1;}
.cmt-tool .cmt-tool-box::after{display: block;content: '';position: absolute;top: 16px;right: -16px;width: 16px;height: 14px;background: url("/images/ico_bubble_right_arrow_2x.png") no-repeat center;background-size: 16px 14px;}
.cmt-tool .cmt-tool-box li{padding-left: 32px;}
.cmt-tool .cmt-tool-box li a{display: block;padding: 0 10px;line-height: 29px;font-size: 12px;color: rgba(0, 0, 0, 0.58);}
.cmt-tool .cmt-tool-box li a:hover{font-weight: bold;text-decoration: underline;}
.cmt-text-box{padding: 2px 0 12px;font-size: 15px;color: rgba(0, 0, 0, 0.58);}
.cmt-text-box .lock{padding-left: 22px;background: url("/images/ico_lock_2x.png") no-repeat left center;background-size: 12px 16px;}
.cmt-text-box img{display: block;margin-top: 8px;height: auto !important;}
.cmt-etc-btn ul li{display: inline-block;margin-right: 28px;}
.cmt-etc-btn ul li:last-child{margin-right: 0;}
.cmt-fileList{margin-top: 8px;}
.cmtReplyList{margin:16px 0;padding: 0 16px;}
.cmtReplyList:last-child{margin-bottom: 0;}
.cmtReplyList:last-child .cmtReplyList-box{border-bottom: none;}
.cmtReplyList-box{position: relative;padding: 16px 16px 16px 32px;background-color: #F5F5F5;border-radius: 8px;}
.cmtReplyList-box::before{display: block;content: '';position: absolute;top: 50%;left: 8px;width: 18px;height: 22px;margin-top: -9px;background: url("/images/ico_reply_2x.png") no-repeat center;background-size: 8px 12px;}
.board-user-btn{display: flex;flex-wrap: wrap;justify-content: space-between;margin-top: 32px;border-top:1px solid #dbdbdb;}
.board-user-btn > div{margin-top: 16px;}
.board-user-btn .user-btn button{height: 32px;margin-left: 4px;padding: 0 16px;font-weight: bold;font-size: 13px;}
.board-user-btn .user-btn button:first-child{margin-left: 0;}
.board-user-btn > .btn_board_list{display:none;}
.board-user-btn .btn_board_list{background: #40454E;color: #FFF;border: 1px solid #40454E;}
.board-prev-next button:first-child{margin-left: 0;}
.board-view-wrap .board-list{margin-top: 64px;}
.board-view-wrap .board-element-wrap{margin-bottom: 32px;}
.board-write-form{padding-top: 12px;border-top: 1px solid #000;}
.board-w-group{margin-bottom: 8px;}
.board-w-group select{margin-right: 2px;margin-bottom: 4px;}
.board-w-title{display: flex;justify-content: space-between;align-items: center;margin-bottom: 12px;}
.board-w-title .w-subject{flex-grow: 1;}
.board-w-title .w-subject input{font-weight: normal;color: rgba(0, 0, 0, 0.78);}
.board-w-title .w-secret{flex-shrink: 0;flex-basis: 73px;text-align: right;}
.board-w-title .w-secret .checkboxA label span{font-weight: bold;}
.board-w-option{margin-bottom: 12px;}
.board-w-option .notice-chk{display: inline-block;padding-right: 10px;}
.board-w-option .notice-chk::after{display: inline-block;content: '';position: relative;top: -1px;width: 1px;height: 8px;margin-left: 10px;background-color: #dbdbdb;}
.board-w-option .notice-chk .checkboxA label span{font-weight: bold;}
.board-w-option .notice-date{display: inline-block;}
.board-w-option .notice-date span{margin-right: 2px;color: rgba(0, 0, 0, 0.58);}
.editor-content{border-top: 1px solid #dbdbdb;border-bottom: 1px solid #eee;}
.editor-content .cke{width:auto !important;}
.board-w-file{display: flex;align-items: center;padding: 16px 0;border-bottom: 1px solid #dbdbdb;}
.board-w-file > span{flex-shrink: 0;width: 113px;font-weight: bold;color: rgba(0, 0, 0, 0.58);}
.board-w-file > span .file-info-box{margin-left:4px;}
.board-w-file .file-info-box{position:relative; padding: 6px 0;}
.board-w-file .file-info-box .info-box{opacity:0; visibility:hidden; transition: all .2s; position: absolute;top: 32px;right: 0;left: -54px;padding: 8px;background: #FFF;border: 1px solid #EEE;box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);border-radius: 8px;font-size: 12px;font-weight: 400;z-index: 10;margin: 0 auto;}
.board-w-file .file-info-box .info-box.w370{width:370px; left:-66px;}
.board-w-file .file-info-box .info-box.w163{width:164px;}
.board-w-file .file-info-box:hover .info-box{opacity:1; visibility:visible;}

.board-w-file .inputBtn{position: relative;padding-right: 81px;}
.board-w-file .inputBtn::after{display: inline-block;content: '';width: 1px;height: 12px;position: absolute;top: 50%;right: 40px;margin-top: -6px;background-color: #c4c4c4;}
.board-w-file .inputBtn label{display: block;width: 120px;height: 40px;background: #FFF;border: 1px solid #40454E;border-radius: 8px;text-align: center;line-height: 38px;}
.board-w-file .inputBtn label i{margin-top: -3px;}
.board-w-file .fileList-wrap > p{color: rgba(0, 0, 0, 0.58);}
.board-w-btn{margin-top: 12px;text-align: right;}
.board-w-btn button{width: 97px;height: 46px;margin-left: 6px;border-radius: 8px;}
.board-list .nodata{border-bottom: none;}


/* 로그인 */
.admin_wrap .modal_wrap{background-color: #F8F8FA;}
.admin_wrap .modal_wrap.login_wrap{display: block;}
.admin_wrap .modal_wrap .modal_content{max-width: 616px;padding: 0 24px;border: none;background: transparent;box-shadow: none;}
.admin_wrap .modal_wrap h2{display: flex;-webkit-justify-content:center; justify-content: center;align-items: center;margin-bottom: 32px;}
.admin_wrap .modal_wrap h2 img{width: 158px;}
.admin_wrap .modal_wrap h2 span{font-family: 'NanumSquareRound';display: inline-block;margin-left: 8px;padding: 4px 8px 3px;font-weight: 800;font-size: 13px;line-height: 140%;color: #3366E2;border: 1px solid rgba(51, 102, 226, 0.38);box-sizing: border-box;border-radius: 4px;vertical-align: middle;}
.admin_wrap .modal_wrap .cont_box{padding: 28px 20px 20px;background-color: #fff;box-shadow: 0px 18px 24px rgba(0, 0, 0, 0.12);border-radius: 8px;}
.login_wrap .form dt{margin-bottom: 8px; font-weight: bold;font-size: 11px;color: rgba(0, 0, 0, 0.58);}
.login_wrap .form dd input{width: 100%;height: 44px;margin-bottom: 20px;padding: 0 8px;border: none;box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.07);font-weight: bold;font-size: 14px;color: rgba(0, 0, 0, 0.58); caret-color: #383838;}
.login_wrap .form dd input::placeholder{font-weight: bold;font-size: 14px;color: rgba(0, 0, 0, 0.3);}
.login_wrap .checkboxB + label{font-size: 12px;color: rgba(0, 0, 0, 0.58);}
.login_wrap .text{display: block;margin-top: 24px;line-height: 160%;font-size: 12px;color: rgba(0, 0, 0, 0.58);text-align: center;letter-spacing: 0;font-family: 'NanumSquareRound';text-align: center;}
.admin_wrap .modal_wrap.ie_message{display: block;}
.admin_wrap .ie_message .modal_content{padding-bottom: 40px;}
.ie_message .text{text-align: center;font-size: 14px;color: rgba(0, 0, 0, 0.58);font-family: 'NanumSquareRound';}
.btn_wrap .lbtn{width: 100%;height: 60px;margin-top: 20px;padding: 0;background: #FFF;border: 2px solid #1E5DF8;box-sizing: border-box;border-radius: 8px;text-align: center;line-height: 55px;font-weight: 700;font-size: 16px;color: #3366E2;transition: background .3s, color .3s;font-family: 'Noto Sans KR', sans-serif;}
.btn_wrap .lbtn:hover{background:#3366E2;color: #fff;}
.admin_wrap .checkboxA input:checked + label::before{background-color: #1E5DF8;}



/* header */
.header-cont{width: 100%;z-index: 99;}
.header{width:100%;height: 80px; border-bottom: 1px solid #dbdbdb;background-color: #fff;}
.header-inner{position: relative;max-width: 1232px;margin: 0 auto;height: 100%;}
.header-wrap{width: 100%;height: 79px;padding: 0 16px;background-color: #fff;}
.header-area{position: relative;max-width: 1200px;height: 100%;margin: 0 auto;display: flex;align-items: center;flex-direction: row;}
.logo {position: relative;display: table;height: 64px;margin-right: 40px;z-index: 1;}
.logo a{display: table-cell;vertical-align: middle;}
.logo img{max-width: 168px;max-height: 64px;vertical-align: middle;}
.header-title {flex-shrink: 0;}
.logo .no-img{display: inline-block;max-width: 168px;line-height: 64px;vertical-align: middle;font-size: 24px;color: #000;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.header-title .center-select{height: 64px;vertical-align: middle; width: 100%;}
.header-title .center-select .select{position: absolute;top: 0;left: 0;display: inline-block;width: 100%;height: 64px;padding: 0;color:#fff;border: none;background: url("/images/arrow_com_change.png") no-repeat right 0px center;background-size: 32px 32px;z-index: 0;}
.header-title .center-select .select option{color: rgba(0, 0, 0, 0.58);font-weight: bold;}
/* .header-title .center-select{display: flex;align-items: center;height: 64px;}
.header-title .center-select .select{display: inline-block;width: 32px;height: 32px;margin-left: 8px;padding: 0;border: none;background: url("/images/ico_arrow_bottm_2x.png") no-repeat center;background-size: 12px 8px;}
.header-title .center-select.selectBox.show .selectOptions{top: 66px;left: 0; border-top: 1px solid #dbdbdb;border-radius: 4px;} */
.header-search-wrap{flex-grow: 1;}
.header-search{position: relative;max-width: 535px;height: 38px;margin: 0 32px 0 40px;background: #F9F9F9;border: 1px solid #D8D8D8;border-radius: 20px;overflow: hidden;}
.header-search input{width: 100%;height: 36px;padding: 0 82px 0 32px;font-size: 14px;letter-spacing: -1px;color: rgba(0, 0, 0, 0.78);border:none;background: url("/images/ico_search_grey_2x.png") no-repeat left 10px center;background-size: 13px 14px; background-color: transparent;border-radius: 28px;caret-color: #383838;caret-color: var(--theme-color);}
.header-search input::placeholder{font-size: 14px;color: rgba(0, 0, 0, 0.38);letter-spacing: -1px;font-weight: normal;}
.header-search .btnCleaer{display: none; position: absolute;top: 11px;right: 72px;width: 15px;height: 15px;background: url("/images/ico_close_circle_2x.png") no-repeat center;background-size: 15px 15px;font-size: 0;text-indent: -999px;}
.header-search input:focus + .btnCleaer{display: block;}
.header-search .btnSearch{position: absolute;top: 2px;right: 3px;width: 56px;height: 32px;background-color: #FFF;border: 1px solid #D8D8D8;border-radius: 16px;font-weight: bold;color: #40454E;letter-spacing: -0.05em;font-size: 13px;}

.member-profile{display: flex;align-items: center;}
.mb-img-box{width: 48px;height: 48px;}
.mb-img-box > p{position: relative;display: inline-block;width: 48px; height: 48px; margin-top:0; border: 1px solid #eee; border-radius: 50%;background-color: #fff;box-shadow: 0px 10px 10px rgba(68, 68, 68, 0.06), 0px 0px 1px rgba(68, 68, 68, 0.21);overflow: hidden;}
.mb-img-box .mb-img img{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);width: 44px;height: 44px;object-fit: cover;margin: auto;border-radius: 50%;}
.mb-img-box .mb-no-img::before{display: inline-block;content: '';position: absolute;top: 1px;left: 1px; width: 44px;height: 44px;background: url("/images/no_profile.png") no-repeat;border-radius: 50%;}
.mb-img-box .mb-no-img span{position: absolute;top: 1px;left: 1px;display: block;width: 44px;height: 44px;line-height: 44px;font-weight: bold;font-size: 13px;color: #FFF;text-align: center;z-index: 1;}
.mb-img-box .mb-no-img::after{display: inline-block;content: '';position: absolute;top: 1px;left: 1px; width: 44px;height: 44px;background-color:#383838;background-color:var(--theme-color);border-radius: 50%;opacity: 0.68;}
.member-profile .mb-name{margin-left: 10px;font-weight: bold;font-size: 13px;}

.mb-active{width: 133px;margin-left: 32px;}
.mb-active .select{font-size:13px;}
.mb-active.selectBox-2 .selectOptions{padding: 4px 16px;border-radius: 0 0 4px 4px;box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);}
.mb-active .selectOptions li a{display: flex;justify-content: space-between;font-size: 12px;}
.mb-active .selectOptions li a b{position: relative; color: #383838;color: var(--theme-color);}
.mb-active .selectOptions li a b::after{display: block;content: '';position: absolute;bottom: 3px;left: 0;width: 100%;height: 1px;background-color: #383838;background-color: var(--theme-color);}
.mb-active .selectOptions li.logout{margin-top: 4px;padding-top: 4px;border-top: 1px solid #dbdbdb;}

.tch-profile-img {position: relative;display: inline-block;width: 80px; height: 80px; margin-top:0; border: 1px solid #eee; border-radius: 50%;background-color: #fff;box-shadow: 0px 10px 10px rgba(68, 68, 68, 0.06), 0px 0px 1px rgba(68, 68, 68, 0.21);overflow: hidden;}
.tch-profile-img img{position: absolute;left: 50%;top: 50%;height: auto;transform: translate(-50%, -50%);width: 74px;height: 74px;object-fit: cover;margin: auto;border-radius: 50%;}
.tch-profile-img.tch-profile-no-img::before{display: inline-block;content: '';position: absolute;top: 2px;left: 2px; width: 74px;height: 74px;background: url(/images/no_profile.png) no-repeat;border-radius: 50%;}
.tch-profile-img.tch-profile-no-img span{position: relative; display: block;line-height: 76px;font-weight: bold;color: #FFF;text-align: center;z-index: 1;}
.tch-profile-img.tch-profile-no-img::after{display: inline-block;content: '';position: absolute;top: 2px;left: 2px; width: 74px;height: 74px;background-color:#383838;background-color:var(--theme-color);border-radius: 50%;opacity: 0.68;}

.header-member-wrap{flex-shrink: 0;/*position: absolute;top: 16px;right: 0;*/display: flex;flex-direction: row;align-items: center;}
.header-member{width: 106px;font-size: 12px;color: rgba(0, 0, 0, 0.58);}
.header-member .select{height: 32px;line-height:30px;padding: 0 8px;}
.header-member .select span{padding-left: 26px;background:url("/images/ico_member_2x.png") no-repeat left center;background-size: 17px 16px;}
.header-member.selectOptions{padding: 0 10px;}
.header-member .selectOptions li a{padding-left:22px;font-size: 12px;font-weight: bold;}
.header-member .selectOptions li a:hover{color: #383838; color: var(--theme-color);}
.header-member .selectOptions li.mb-logout a{background: url("/images/ico_logout_2x.png") no-repeat left center;background-size: 18px 18px;}
.header-member .selectOptions li a i{margin-right: 4px;}

.header-notice{margin-left: 16px;}
.header-notice .noticeBtn{display: block;width: 48px;height: 48px;line-height: 48px;text-align: center;}
.header-notice .noticeBtn i{width: 48px;height: 48px;background-position: center;}
.header-notice span{position: absolute;top: 8px;right: 5px;display: block;height: 18px;line-height: 18px;padding:0 6px 0 5px;background-color:#383838;background-color: var(--theme-color);border-radius: 10px;color: #fff;text-align: center;font-weight: bold;font-size: 12px;}
.header-notice .bubble-box{top: 55px;width: 270px;}
.header-notice .bubble-header .readBtn{font-size: 12px;}
.header-notice .bubble-header .closeBtn{width: 24px;height: 24px;margin-left: 8px;text-align: center;}
.header-notice .bubble-header .closeBtn i.close-sm{width: 24px;height: 24px;}
.header-notice .bubble-content{padding-top: 10px;border-top: 1px solid #40454E;overflow: auto;}
.header-notice .bubble-content::-webkit-scrollbar {width: 10px;height: 10px;}
.header-notice .bubble-content::-webkit-scrollbar-thumb {background-color: #d1d1d1;border-radius: 10px;background-clip: padding-box;border: 3px solid transparent;}
.header-notice .bubble-content::-webkit-scrollbar-corner{display: none;}
.header-notice .bubble-content .list-group{max-height: 204px;}
.header-notice .bubble-content .list-group li{margin-bottom: 8px;}
.header-notice .bubble-content .list-group strong{display: block;font-size: 13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.header-notice .bubble-content .list-group p{font-size: 12px;color: rgba(0, 0, 0, 0.58);}
.header-notice .bubble-content .list-group p b{margin-left: 4px;}
.header-notice .bubble-content .moreBtn{height: 33px;margin-top: 8px;font-size: 12px;}


/* gnb menu */
.gnb{position: absolute;top: 104px;left: 16px;width: 220px;z-index: 9;}
.gnb .m-member, .gnb .m-seaech, .gnb .sideMenu-close{display: none;}
nav{padding: 24px 0;background: #FFF;border: 1px solid #EEE;box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.07);border-radius: 8px;overflow: auto;}
nav::-webkit-scrollbar {width: 10px;height: 10px;}
nav::-webkit-scrollbar-thumb {background-color: #d1d1d1;border-radius: 10px;background-clip: padding-box;border: 3px solid transparent;}
nav::-webkit-scrollbar-corner{display: none;}
.gnb-menu > li{position: relative;margin-bottom: 24px;}
.gnb-menu > li:last-child{margin-bottom:16px;}
.gnb-menu > li > a{position: relative;display: block;padding: 0 30px 0 16px;line-height: 22px;font-weight: bold;font-size: 14px;color: rgba(0, 0, 0, 0.78);}
.gnb-menu > li > a:hover, .gnb-menu > li > a.on{color: #383838;color: var(--theme-color);}
.gnb-menu > li > a span{display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.gnb-menu > li .menu-tgl-button{position: absolute;top:5px;right:16px;width: 12px;height: 12px;background: url("/images/ico_plus_sm_2x.png") no-repeat center;background-size: 8px 8px;font-size: 0;z-index: 1;}
.gnb-menu > li .menu-tgl-button.active{background: url("/images/ico_minus_sm_2x.png") no-repeat center;background-size: 8px 2px;}
.gnb-menu .sub-title{position: relative;margin-right: 42px;padding: 0 0 0 42px;z-index: 0;}
.gnb-menu .sub-title.on{color: #383838;color: var(--theme-color);}
.gnb-menu .sub-title i.folder{display: inline-block;position: absolute;top: 0;left: 16px;width: 22px;height: 22px;background: url("/images/ico_folder_close_2x.png") no-repeat 0 0;background-size: 22px 22px;}
.gnb-menu .sub-title.on i.folder{background-image: url("/images/ico_folder_open_bc_2x.png");}
.gnb-menu .sub-title.on i.folder{background-color: #383838;background-color: var(--theme-color);}
.gnb-menu .sub-title .open{position: absolute;top: 0;right: -22px;width:20px;height:20px;z-index: 999;}
.gnb-menu .sub-title  span{display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.sub-menu{display: none;margin-top: 16px;}
.sub-menu.active{display: block;}
.sub-menu > li{margin-bottom: 8px;}
.sub-menu > li:last-child{margin-bottom: 0;}
.sub-menu > li > a{position: relative;display: block;padding: 0 16px 0 44px;line-height: 22px;font-weight: bold;font-size: 13px;color: rgba(0, 0, 0, 0.58);overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.sub-menu > li > a::before{display: inline-block;content: '';position: absolute;top: 50%;left: 32px;width: 4px;height: 4px;margin-top: -2px;background-color: #D1D3D8;border-radius: 50%;}
.sub-menu > li > a.on, .sub-menu > li > a:hover{color: #383838;color: var(--theme-color);}
.sub-menu > li > a.on::before, .sub-menu > li > a:hover::before{background-color: #383838;background-color: var(--theme-color);}
.sub-menu > li > a .flag.new2{vertical-align: bottom;}
.gnb .writeBtn{width: 100%;height: 48px;margin-top: 18px;background-color: #383838;background-color: var(--theme-color);color: #fff;border-radius: 8px;font-weight: bold;font-size: 14px;box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);}
.gnb .writeBtn i{margin-right: 8px;}
.gnb .directBtn{margin-top: 12px;background-color:#fff;border:1px solid #383838;border:1px solid var(--theme-color);color:#383838;color:var(--theme-color);}


/* side menu */
.sideMenu-btn{ display:none;background-color: #fff;}
.sideMenu-btn::before{content: ''; display: block; width: 24px; height: 2px; background: #000; }
.sideMenu-btn::after{content: ''; display: block; width: 24px; height: 2px; background: #000; }
.sideMenu-close{position: absolute;top: 8px;right: 16px;display: block;width: 48px;height: 48px;background: url("/images/ico_m_close_2x.png") no-repeat center;background-size:20px 20px;font-size: 0;text-indent: -999px;}
.m-member{padding: 18px 16px;border-bottom: 1px solid #D8D8D8;}
.m-member > p{display: inline-block;}
.m-member > p a, .m-member > p span{font-weight: bold;border-bottom: 1px solid rgba(0, 0, 0, 0.78);}
.m-member > a{margin-left: 4px;font-size: 12px;padding: 2px 6px;}
.lnb-menu > li > a{position: relative; display: block;padding: 16px;border-bottom: 1px solid #eee;font-weight: bold;}
.lnb-menu > li > a::after{content: '';position: absolute;top: 50%;right: 16px;display: block;width: 7px;height: 10px;margin-top: -3.5px;background: url("/images/ico_arrow_right_sm_2x.png") no-repeat center;background-size:7px 10px;}
.lnb-menu > li.home > a::after{display: none;}
.lnb-menu > li.on > a, .lnb-menu > li > a:hover{color: #383838;color: var(--theme-color);}
.lnb-menu > li.on > a::after{background: url("/images/ico_m_menu_close_2x.png") no-repeat center;background-size:13px 6.5px;}
.lnb-menu > li.on .m-sub-menu{display: block;}
.lnb-menu > li .m-sub-menu{display: none; padding: 16px 32px;background: #F5F5F5;}
.lnb-menu > li .m-sub-menu > li{display: inline-block;width: 50%;}
.lnb-menu > li .m-sub-menu > li > a{position: relative; display: block;padding: 8px 0 8px 10px;}
.lnb-menu > li .m-sub-menu > li > a::before{display: inline-block;content: '';position: absolute;top:17px;left: 0; width: 3px;height: 3px;border-radius: 50%;background: rgba(0, 0, 0, 0.3);}
.lnb-menu > li .m-sub-menu > li.on > a, .lnb-menu .m-sub-menu > li > a:hover{color: #383838;color: var(--theme-color);}
.lnb-menu > li .m-sub-menu > li.on > a::before, .lnb-menu .m-sub-menu > li > a:hover::before{background: #383838;background: var(--theme-color);}
.m-seaech{position: relative; width: 100%;height: 48px;margin: 8px 0; padding: 0 16px;}
.m-seaech input{width: 100%;height: 48px;padding: 0 48px 0 0; border:none;border-bottom: 1px solid #dbdbdb;border-radius: 0;}
.m-seaech button{position: absolute;top: 0;right: 16px;width: 48px;height: 48px;background: url("/images/ico_search_darkgrey_2x.png") no-repeat center;background-size: 20px 20px;font-size: 0;text-indent: -999px;}



/* footer */
.footer{position: absolute;bottom: 0;left: 0;width: 100%;background-color: #383838;background-color: var(--theme-color);}
.footer-inner{max-width: 1232px;margin: 0 auto;padding: 0 16px;}
.footer-wrap{display: flex;justify-content: space-between;align-items: center;height: 80px;}
.footer-wrap .copy{font-weight: bold;color: #fff;}


/* layout */
.content-wrap{padding-left: 244px;}


/* 메인 */
.main-board-wrap{display: flex;width: 100%;margin-left: -16px;}
.main-board-wrap::after{display: block;content: '';clear: both;}
.main-board-wrap .main-board-left, .main-board-wrap .main-board-right{width: 50%;}
.main-board-wrap .main-board-row {width: 100%;margin-bottom: 32px;padding-left: 16px;}

.main-board-wrap .main-board-row .board-header{min-height: 22px;margin-bottom: 12px;}
.main-board-wrap .main-board-row .board-header h3{font-size: 18px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.main-board-wrap .board-thumb-list{font-size: 13px;}
.main-board-wrap .board-thumb-list .board-list .tbody li .cell-subject{/*padding-left: 16px;line-height: 23px;overflow: hidden;*/}
.main-board-wrap .main-board-row .nodata{height: 278px;border-bottom: 1px solid #dbdbdb;}
.main-board-wrap .nodata-wrap{width:100%;padding-left: 16px;}

/* 상품 */
.m-filter-wrap{display: none;width: 100%;margin-top: -24px;margin-bottom: 16px;}
.m-filter-wrap .filter-sort{padding: 8px 16px;border-bottom: 1px solid #eee;}
.m-filter-wrap .filter-select{padding: 12px 16px;border-bottom: 1px solid #eee;}
.m-filter{display: flex;align-items: center;}
.filter-btn{display: block;width: 32px;height: 32px;background: url("/images/ico_filter2_2x.png") no-repeat center;background-size: 16px 17px;background-color: #383838;background-color: var(--theme-color);border-radius: 4px;}
.m-filter .filter-cnt{margin-left: 8px;font-weight: bold;font-size: 13px;color: #383838;color: var(--theme-color);}
.m-filter .filter-cnt em{margin-left: 4px;font-weight: bold;}
.filter-select-list li{position: relative;display: inline-block;padding: 0 8px;border: 1px solid #D8D8D8;border-radius: 4px;}
.filter-select-list li .opt{margin-right: 12px;font-weight: bold;font-size: 12px;color: rgba(0, 0, 0, 0.58);}
.filter-select-list li .delete{width: 10px;height: 10px;margin-bottom: 3px;background: url("/images/ico_close_sm_2x.png") no-repeat center;background-size: 8px 8px;}
.filter-select-list li .delete::after{position: absolute;top: 0;left:0;content: '';width: 100%;height: 100%;}
.m-prd-filter-header, .prd-filter-wrap .prd-title .cnt{display: none;}
.prd_wrap .prd_contents{display: flex;}
.prd-filter-wrap{flex-shrink: 0;width: 240px;background-color: #fff;}
.prd-filter-wrap .prd-title{padding: 17px 0;font-size: 20px;line-height: 120%;border-bottom: 2px solid #222;}
.filter-box-list::after{display: block;content: '';width: 100%;height: 1px;background-color: #dbdbdb;}
.filter-box-list:last-child::after{display: none;}
.filter-box-list .filter-title{position: relative; padding: 16px 0;}
.filter-box-list .filter-title h3{font-size: 13px;line-height: 140%;}
.filter-box-list .filter-title .filter-toggle{position: absolute;top: 50%;right: 0;margin-top: -8px;width: 16px;height: 16px;background: url("/images/ico_arrow_down_thin_2x.png") no-repeat center;background-size: 12px 7px;}
.filter-box-list .filter-title .filter-toggle.on{background-image: url("/images/ico_arrow_up_thin_2x.png");}
.filter-box{display: block; padding-bottom: 36px;}
.filter-box .filter-depth{margin-bottom: 12px;}
.filter-box .filter-depth:last-child{margin-bottom: 0;}
.filter-box .filter-depth h4{margin-bottom: 8px; font-size: 12px;line-height: 140%;color: rgba(0, 0, 0, 0.58);}
.filter-list-check::after{display: block;content: '';clear: both;}
.filter-list-check > li{float: left;margin-right: 4px;margin-bottom: 4px;}
.filter-list-check > li:last-child{margin-right: 0;}
.filter-checkbox span input{display: none;}
.filter-checkbox span input + label{cursor: pointer;}
.filter-checkbox span input + label span{display: block;padding: 3px 7px;line-height: 140%;color: rgba(0, 0, 0, 0.58);text-align: center;border: 1px solid #D8D8D8;border-radius: 4px;}
.filter-checkbox span input:checked + label span{color: #fff;text-shadow: 0px 0px 1px #fff;background-color: #383838;background-color: var(--theme-color);border-color: #383838;border-color: var(--theme-color);}
.m-filter-button{display: none;width: 100%;background-color: #fff;}
.m-filter-button ul{display: flex;flex-direction: row;width: 100%;}
.m-filter-button li{width: 50%;}
.m-filter-button button{width: 100%;height: 52px;font-weight: bold;}
.m-filter-button .btn-reset{display: flex;justify-content: center;align-items: center;border: 3px solid #383838;border: 3px solid var(--theme-color);color: #383838;color: var(--theme-color);}
.m-filter-button .btn-reset span{margin-left: 10px;}
.m-filter-button .btn-reset svg path{fill: #383838;fill: var(--theme-color);}
.m-filter-button .btn-confirm{background-color: #383838;background-color: var(--theme-color);color: #fff;}

.prd-list-wrap{flex-grow: 1;margin-left: 67px;}
.sort-tab{padding: 20px 0;}
.sort-tab .m-sort-select{display: none;padding: 5px 32px 5px 8px;background: url("/images/ico_arrow_down_thin_2x.png") no-repeat right 10px center;background-size: 12px 7px;font-size: 13px;font-weight: bold;color: rgba(0, 0, 0, 0.58);cursor: pointer;}
.sort-tab ul{display: flex;justify-content: right;align-items: center;height: 18px;}
.sort-tab li input{display: none;}
.sort-tab li input + label{position: relative;padding: 0 10px;font-size: 13px;line-height: 140%;color: rgba(0, 0, 0, 0.58);cursor: pointer;}
.sort-tab li input + label:hover {font-weight: bold;color: rgba(0, 0, 0, 0.78);}
.sort-tab li input:checked + label{font-weight: bold;color: rgba(0, 0, 0, 0.78);}
.sort-tab li label::after{display: inline-block;content: '';position: absolute;top: 50%;right: 0;margin-top: -4px;width: 1px;height: 8px;background-color: #dbdbdb;}
.sort-tab li:last-child label::after{display: none;}

.prdList{margin-left: -26px;}
.prdList::after{display: block;content: '';clear: both;}
.prdList li{position: relative;float: left;width: 33.333%;padding: 0 0 26px 26px;}
.prd-box{position: relative;height: 373px;border: 1px solid #D8D8D8;border-radius: 12px;overflow: hidden;transition: border-color .2s ease, box-shadow .2s ease;cursor: pointer;}
.prd-box > div{position: absolute;top: 0;left: 0;width: 100%;height: 100%;padding: 24px;background-color: #fff;transition: opacity .4s ease;}
.prd-thumb{display: flex;justify-content: center;align-items: flex-end;width: 100%;height: 160px;margin-bottom: 24px;}
.prd-thumb img{max-height: 162px;box-shadow: 0px 10px 10px rgba(68, 68, 68, 0.1);border: 1px solid rgba(120, 120, 120, 0.1); border-radius: 4px;image-rendering: -moz-crisp-edges; /* Firefox */ image-rendering: -o-crisp-edges; /* Opera */ image-rendering: -webkit-optimize-contrast; /* Webkit (non-standard naming) */ image-rendering: crisp-edges; -ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */}
.prd-info .prd-title{display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;height: 44px;line-height: 22px;overflow: hidden;text-overflow: ellipsis;font-weight: bold;font-size: 16px;}
.prd-info .prd-brand{margin-top: 4px; font-weight: bold;font-size: 13px;color: rgba(0, 0, 0, 0.38);white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.prd-info .prd-price{position: absolute;bottom: 24px;left: 24px;}
.prd-info .prd-price .price-del{font-size: 12px;color: rgba(0, 0, 0, 0.38);text-decoration: line-through;}
.prd-info .prd-price .price{ font-weight: bold;font-size: 12px;color: #000;}
.prd-info .prd-price .price span{margin-right: 3px;font-size: 20px;line-height: 120%;color: #383838;color: var(--theme-color);}
.prd-info .mark.member{position: absolute;right: 14px;bottom: 20px;}

.prd-box:hover{border-color: #383838;border-color: var(--theme-color);box-shadow: 0px 10px 10px rgba(68, 68, 68, 0.06), 0px 0px 1px rgba(68, 68, 68, 0.21);}
.prd-box .on{opacity: 1;}
.prd-box:hover .on{opacity: 0;}
.prd-box:hover .over{opacity: 1;}
.prd-box .over{opacity: 0;}
.prd-box .over .prd-info .prd-price{position: inherit;margin-top: 3px;}
.prd-box .over .prd-info .mark{display: block;width: 88px;;margin: 50px auto 0;transition: background-color .2s ease;border-radius: 4px;}
.prd-box .over .prd-info .mark:hover{background-color: #f5f5f5;}
.prd-box .prd-button{position: absolute;bottom: 0;left: 0;display: flex;width: 100%;height: 48px;z-index: 99;}
.prd-box .prd-button button{width: 50%;height: 48px;color: #fff;font-weight: bold;}
.prd-box .prd-button .btn-cart{background-color: #484848;}
.prd-box .prd-button .btn-buy{background-color: #383838;background-color: var(--theme-color);}

.product-empty{padding: 90px 0 70px; text-align: center;border-top: 2px solid #222;border-bottom: 1px solid #dbdbdb;}
.product-empty span{display: block;margin-top: 18px; color: rgba(0, 0, 0, 0.58);}


.search-result-wrap{padding: 16px 0 18px;border-top: 1px solid #000;border-bottom: 1px solid #dbdbdb; text-align: center;}
.search-result-wrap .result-text span{font-weight: bold;font-size: 20px;line-height: 120%;}
.search-result-wrap .result-text .word{margin-right: 4px;color: #383838;color:var(--theme-color);}

.sub-search-content .htable-wrap{border-top: none;}
.sub-search-content .nodata:first-of-type{border-top: none;}


/* sub page */
.sub-header{display: flex;justify-content: space-between;align-items: center;}
.sub-header.line{border-bottom: 2px solid #222;}
.sub-header.jcLeft{justify-content: flex-start;}
.sub-title{font-size: 20px;line-height: 58px}
.sub-cont-area{position: relative;}
.sub-aside-cont-area{position: relative;margin-left: 280px;}
.sub-cont-title{margin-bottom: 16px;font-weight: bold;font-size: 24px;line-height: 120%;color: #000;}
.sub-cont-title-2{position: relative;margin-bottom: 16px;padding-left: 20px;font-weight: bold;font-size: 24px;line-height: 120%;color: #000;}
.sub-cont-title-2::before{display:inline-block;content: '';position: absolute;top: 0;left: 0;width: 10px;height: 28px;margin-right: 10px;background-color: #383838;background-color: var(--theme-color);}
.sub-cont{position: relative;}


/* 탭 */
.tab-box{margin-bottom: 16px;border-bottom: 1px solid #dbdbdb;}
.tab-box .tab-list{height: 37px;line-height: 37px;}
.tab-box .tab-list li{display: inline-block;}
.tab-box .tab-list li a{position: relative;display: block;font-size: 13px;color: rgba(0, 0, 0, 0.58);text-align: center;}
.tab-box .tab-list li a:hover, .tab-list li a.on{font-weight: bold;color: #383838;color: var(--theme-color);}
.tab-box .tab-list li a::after{content: '';position: absolute;bottom: 0;left: 0;width: 100%;height: 3px;background-color: transparent;}
.tab-list li a.on::after{background-color: #383838;background-color: var(--theme-color);}

.tab-box-b{margin-bottom: 36px;border-bottom: none;}
.tab-box-b .tab-list{max-width: 320px;margin: 0 auto;text-align: center;border-bottom: 2px solid #dbdbdb;}
.tab-box-b .tab-list li{float:left;width: 160px;}
.tab-box-b .tab-list li a{display: inline-block;width: 100%;padding: 0;font-weight: bold;}
.tab-box-b .tab-list li a:hover, .tab-box-b .tab-list li a.on{color: #000;}
.tab-box-b .tab-list li a::after{bottom:0;height: 2px;}

.tab-contents > div{display: none;}
.tab-contents > div.current {display: block;}
.tab-btn li{position: relative;display: inline-block;margin-right: 16px;}
.tab-btn li:last-child{margin-right: 0;}
.tab-btn li a{display: block;padding: 8px 20px;color: rgba(0, 0, 0, 0.38);font-weight: bold;font-size: 14px;border-radius: 20px;background-color: #fff;}
.tab-btn li a.active, .tab-btn li a:hover{font-weight: bold;color: #fff;background-color: #383838;background-color: var(--theme-color);}

.tab-list-btn{width:100%;border-radius: 4px;overflow: hidden;}
.tab-list-btn::after{display: block;content: '';clear: both;}
.tab-list-btn li{float: left;width: 33.333%;}
.tab-list-btn li a{display: block;padding: 8px 0;font-weight: bold;color: rgba(0, 0, 0, 0.3);background: #F5F5F5;text-align: center;}
.tab-list-btn li a.on, .tab-list-btn li a:hover{color:#fff;background: #383838;background: var(--theme-color);}

.tab-btn-2 li{display: inline-block;margin: 0 4px 8px 0;}
.tab-btn-2 li:last-child{margin-right: 0;}
.tab-btn-2 li a{display: block;padding: 12px 28px;color: rgba(0, 0, 0, 0.38);border-radius: 8px;border: 1px solid #DDD;background-color: #fff;}
.tab-btn-2 li a.on, .tab-btn-2 li a:hover{-webkit-text-stroke: 0.2px white;color:#fff;background: #383838;background: var(--theme-color);border: 1px solid #383838;border: 1px solid var(--theme-color);}

.pagination-wrap{margin:20px 0;}
.paging{text-align: center;}
.paging > button{display: inline-block;margin: 0 3px;padding:14px 7px;}
.paging > button span{display: block;width: 11px;height: 18px;font-size: 0;background-image: url("/images/ico_pagination_2x.png");background-repeat: no-repeat;background-size: 47px 16px; opacity: 0.3;z-index: -9999;}
.paging .first span{width: 15px;height: 16px;background-position: 0 0;}
.paging .prev span{width: 8px;height: 16px;background-position: -15px 0;}
.paging .next span{width: 8px;height: 16px;background-position: -24px 0;}
.paging .last span{width: 15px;height: 16px;background-position: -33px 0;}
.paging .paging-num{display: inline-block;margin: 0 3px;vertical-align: middle;}
.paging .paging-num a{position: relative;top:0;display: inline-block;margin: 10px;font-size: 14px;color: rgba(0, 0, 0, 0.58);cursor: pointer;}
.paging .paging-num a.on, .paging .paging-num a:hover{-webkit-text-stroke: 1px #383838;-webkit-text-stroke: 1px var(--theme-color);color: #383838;color: var(--theme-color);border-bottom: 1px solid #383838;border-bottom: 1px solid var(--theme-color);}



/* modal */
.modal_wrap{display: none;position:fixed;top:0;left:0;width:100%;height:100%;text-align:center;background-color: rgba(0, 0, 0, 0.5);z-index: 999;}
.modal_wrap .modal_content{position: relative; display:inline-block;width: 93%;max-width: 684px;max-height: 90%;padding:48px; background:#fff;border: 1px solid #eee;box-sizing: border-box;vertical-align:middle;box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.07);border-radius: 12px;text-align: left;overflow: auto;}
.modal_wrap::after{display:inline-block;content: ''; width:0;height:100%;vertical-align:middle;}
.modal_header{display: flex;-webkit-justify-content:space-between; justify-content: space-between;align-items: center;padding-bottom:16px;border-bottom: 2px solid #222;}
.modal_header h2{font-size: 24px;line-height: 32px;}
.modal_header .modal_close{width: 18px;height: 18px;background: url("/images/ico_close_2x.png") no-repeat center;background-size: 18px 18px;font-size: 0;text-indent: -999px;cursor: pointer;}
.modal_body{padding: 16px 0;}
.modal_footer{padding-top: 32px; text-align: center;}
.modal_footer button{height: 38px;padding: 0 32px;}
.modal_wrap .modal_content::-webkit-scrollbar {width: 10px;height: 10px;}
.modal_wrap .modal_content::-webkit-scrollbar-thumb {background-color: #d1d1d1;border-radius: 10px;background-clip: padding-box;border: 3px solid transparent;}
.modal_wrap .modal_content::-webkit-scrollbar-corner{display: none;}


.modal_writer .modal_content{max-width: 636px;padding: 24px;}
.modal_writer .modal_header{height: 48px;}
.modal_writer .writer-info{margin-bottom: 0;}
.modal_writer .writer-box {flex-direction: column;}
.modal_writer .writer-box textarea{height: 160px;}
.modal_writer .writer-box button {width: 100%;height: 54px;margin-top: 12px;margin-left: 0;}



/* 팝업 */
.pop-wrap{}
.pop-content{padding: 28px 24px 24px;}
.pop-header{padding-bottom:12px;border-bottom: 1px solid #000;}
.pop-header h2{font-size: 24px;line-height: 32px;}
.pop-body{}



/* 에러 페이지 */
.error-cont{position: absolute;top: 50%;left: 50%;width: 100%;margin: 0 auto;transform: translate(-50.3%, -50.3%);text-align: center;}
.error-cont .title{margin: 14px 0;word-break: keep-all;font-weight: bold;font-size: 20px;color: #000; line-height: 1.4;}
.error-cont .text{margin-bottom: 14px;font-size: 13px;color: rgba(0, 0, 0, 0.58);word-break: keep-all;}
.error-cont .errorText{margin-bottom: 14px;font-size: 13px;}
.error-cont .errorText .code{ position: relative; display: block; margin-right: 4px; }
.error-cont .btn{width: 152px;height: 42px;border-radius: 19px;border-width: 2px;color: #fff;background-color: #383838;background-color: var(--theme-color);border: 2px solid #383838;border: 2px solid var(--theme-color);transition: inherit;}
.page-error svg circle {stroke: #000;stroke: var(--theme-color);}
.page-error svg path {fill: #000;fill: var(--theme-color);}

.error-cont .brand_list { position: relative; display: block; max-width: 450px; border-top: 2px solid rgba(0, 0, 0, 0.78); padding-top : 14px; margin: 0 auto; }
.error-cont .brand_list li { border: 1px solid #fff; margin-bottom: 14px; border-radius: 100px; }
.error-cont .brand_list li a { position: relative; display: flex; justify-content: center; align-items: center; border-radius: 100px; padding: 16px 0; border: 1px solid #ddd; color: rgba(0, 0, 0, 0.38); font-weight: 700; font-size: 20px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: left; }
.error-cont .brand_list li:hover { border: 1px solid var(--theme-color); }
.error-cont .brand_list li a:hover { border: 1px solid var(--theme-color); color: var(--theme-color); box-shadow: 0 4px 6px 4px rgba(166, 166, 166, 0.18); }

.error-cont .certify { position: relative; display: flex; justify-content: center; align-items: center; margin: 0 auto; max-width: 568px; padding: 0 16px; margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid #ddd;}
.error-cont .certify .info { padding: 14px; border: 1px solid rgba(0, 0, 0, .78); position :relative; display: block; border-radius: 8px; }
.error-cont .certify .info li { display: flex; justify-content: flex-start; align-items: center;}
.error-cont .certify .info li span { font-size: 15px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: left; min-width: 64px; margin-right: 14px;	}
.error-cont .certify .info li b { font-size: 15px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: center; white-space: nowrap; color: var(--theme-color); }

/* 게시글 열람자 */
.views-history-list{}
.views-history-list > li { display: flex; padding: 8px 0;border-bottom:1px solid #ddd;}
.views-history-list > li > div{}
.views-history-list > li .cell-num { width: 40px; padding-left: 8px; }
.views-history-list > li .cell-num span{font-weight: bold;}

.views-history-list > li .cell-img { position: relative; display: block; margin-right: 8px; }
.views-history-list > li .cell-img .img-box { position: relative; display: flex; justify-content: center; align-items: center; min-width: 48px; height: 48px; }
.views-history-list > li .cell-img .img-box img { position: relative; display: block; min-width: 40px; max-width: 40px; height: 40px; object-fit: cover; border-radius: 50%; overflow: hidden; }

.views-history-list > li .cell-info{ width: calc(100% - 180px);}
.views-history-list > li .cell-info .mem-info{}
.views-history-list > li .cell-info .mem-info b{margin-right:4px;}
.views-history-list > li .cell-info .mem-info span{margin-right:4px;font-weight: bold;color: rgba(0, 0, 0, 0.38);}
.views-history-list > li .cell-info .date{display: block;margin-top: 4px;font-size: 13px;color: rgba(0, 0, 0, 0.38);}
.views-history-list > li .cell-view { width: 80px; text-align: right; }
.views-history-list > li .cell-view .view-txt{}
.views-history-list > li .cell-view .view-txt b{margin-right:4px;}
.views-history-list > li .cell-view .view-txt span{font-weight: bold;color: rgba(0, 0, 0, 0.38);}
.views-history-list > li.data-none{justify-content: center;padding: 16px 0;}



/* url 복사 페이지 */
.ct-content{max-width: 988px;width: 100%;margin: 0 auto;padding: 0 16px;}
.board_url{position: absolute;top: -999px;left: -999px;opacity: 0;}



/* 설문 */
/* 공통 수정 */
.selectBoxA{line-height: 31px;}
.radioA input + label::before{border: 1px solid #ddd;}
.radioA input:checked + label::before{border: none;}

/* 대시보드 게시판 수정 */
.dash-list-wrap .tbody > ul > li.cell-cate:empty{display:none;}
.dash-list-wrap .tbody > ul > li.cell-subject .subject{max-width: calc(100% - 44px); overflow: visible; text-overflow: initial; white-space: normal; display: flex;}
.dash-list-wrap .tbody > ul > li.cell-subject .subject span{overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: inline-block;}
.dash-list-wrap .cell-subject .d-line, .dash-list-wrap .bo-notice .cell-subject .d-line{font-size: 13px; margin-left:4px;}
.dash-list-wrap i.survey{height:19px;}

.reply-list .dash-list-wrap .tbody > ul > li.cell-subject .subject { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; max-width: 100%; }

/* 전체글 보기 게시판 수정 */
.htable-wrap .tbody > ul > li.cell-subject a{max-width: calc(100% - 70px); display: flex; white-space: normal; overflow: visible; text-overflow: initial;}
.htable-wrap .tbody > ul > li.cell-subject a span{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.htable-wrap .tbody > ul > li.cell-subject a span{margin-left: 4px;}

/* 아이콘 */
i.survey{width: 13px; height: 17px;}
i.excel{width: 22px; height: 21px; background: url(/images/ico_exel_2x.png) no-repeat center / 22px 21px; margin-right: 5px;}
i.survey svg, i.survey svg path{fill: var(--theme-color); display: block;}
.board-btn button i.survey svg path{fill: #40454E;}
.htable-wrap .tbody > ul > li.cell-subject .flag.new{margin-top: 2px;}
.htable-wrap .tbody > ul > li.cell-subject .cnt{font-size: 13px;}
.bar{margin: -3px 2px 0 4px;}

/* 설문 게시글 전체보기 */
.cell-subject .d-line{font-size: 14px; font-weight: 700; color: rgba(0, 0, 0, 0.58); flex: none; margin-left:8px;}
.cell-d-line{font-size: 12px; color: rgba(0, 0, 0, 0.58); font-weight: 700; display: none;}
.bo-notice .cell-subject .d-line{font-size: 14px; font-weight: 700; color: var(--theme-color);}

.survey-end .cell-subject .subject{color: rgba(0, 0, 0, 0.38);}
.survey-end.bo-notice .cell-subject .subject{color: var(--theme-color);}

/* 설문 글쓰기 */
.board-survey-wrap.board-write-wrap .board-w-title .w-secret{flex-basis: 82px;}
.board-w-title textarea{padding: 5px 10px; border-radius: 4px; border-color: #d4d4d4; height: 80px; display: block;}
.survey-content .board-w-title .w-subject input::placeholder, .survey-content .board-w-title textarea::placeholder{color: rgba(0, 0, 0, 0.38);}
.board-w-title textarea::placeholder{letter-spacing: -1px;}

.survey-content{border-top: 1px solid #ddd; padding-top: 8px;}
.survey-content .content-w-title p{font-size: 16px; font-weight: 700; color: rgba(0, 0, 0, 0.58);}
.survey-content .list-box{display: flex; margin-bottom: 12px;}
.survey-content .list-box:first-child{margin-top: 9px;}
.survey-content .list-box:last-child{margin-bottom: 8px;}
.survey-content .list-box .left{display: flex; min-height: 56px; border-radius: 4px; border: 1px solid #D8D8D8; width: 100%; max-width: calc(100% - 64px); align-items: center; padding: 10px 15px; transition: all 0.3s;}
.survey-content .list-box .left > div{margin-left: 16px; height: 100%; display: flex; align-items: center; border-bottom: 1px solid #d8d8d8;}
.survey-content .list-box.keyup .left{box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.08);}

.survey-content .list-box .left > div:first-child{margin-left: 0;}
.survey-content .list-box .left > div.l-upload{border-bottom: none;}
.survey-content .list-box .left textarea, .survey-content .list-box .left input[type=text]{border-radius: 0; border: none; font-size: 13px; padding: 0; width: 100%; color: rgba(0, 0, 0, 0.58); height: 100%; font-weight: 400;}
.survey-content .list-box .left textarea::placeholder, .survey-content .list-box .left input[type=text]::placeholder{font-weight: 400; color: rgba(0, 0, 0, 0.38); letter-spacing: -1px;}
.survey-content .list-box .left input[type=text]{max-height: 26px; border-bottom: none;}
.survey-content .list-box .left textarea{box-sizing: border-box; height: 19px; overflow: hidden;}
.survey-content .list-box .left input[type=file]{display: none;}
.survey-content .list-box .l-num{width: 48px; flex: none;}
.survey-content .list-box .l-num input{text-align: center;}
.survey-content .list-box .l-subject{width: 100%;}
.survey-content .list-box .l-upload{flex: none;}
.survey-content .list-box .l-upload label{cursor: pointer; text-decoration: underline; position: relative; padding-left: 44px; color: rgba(0, 0, 0, 0.58);}
.survey-content .list-box .l-upload label::before{content: ""; position: absolute; left: 12px; top: 0; bottom: 0; display: block; width: 16px; height: 12px; margin: auto 0; background: url(/images/ico_picture_2x.png) no-repeat center / 16px 12px;}
.survey-content .list-box .l-upload .thumb-wrap{width: 40px; height: 40px; position: relative;}
.survey-content .list-box .l-upload .thumb{width: 40px; height: 40px; border: 1px solid #d8d8d8; border-radius: 4px; padding: 2px 5px; position: relative; overflow: hidden; background-color:#fff;}
.survey-content .list-box .l-upload .thumb img{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);max-width: 38px;max-height: 38px;margin: auto; }
.survey-content .list-box .l-upload .thumb-wrap .delete-btn{position: absolute; width: 16px; height: 16px; border: 1px solid #d8d8d8; border-radius: 4px; background-color: #fff; right: -6px; top: -6px;}
.survey-content .list-box .l-upload .thumb-wrap .delete-btn .line-box{width: 16px; height: 16px; position: relative; display: block;}
.survey-content .list-box .l-upload .thumb-wrap .delete-btn .line-box span{width: 8px; height: 2px; background-color: #999; display: block; position: absolute; left: -2px; right: 0; bottom: 0; top: -2px; margin: auto;}
.survey-content .list-box .l-upload .thumb-wrap .delete-btn .line-box .line1{transform: rotate(45deg);}
.survey-content .list-box .l-upload .thumb-wrap .delete-btn .line-box .line2{transform: rotate(-45deg);}

.survey-content .list-box .right{width: 56px; height: 62px; flex: none;margin-left: 8px;}
.survey-content .list-box .right .remove-btn{width: 100%; height: 100%; border: 1px solid #d8d8d8; border-radius: 4px;display: flex;}
.survey-content .list-box .right .remove-btn .line-box{width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;}
.survey-content .list-box .right .remove-btn .line-box .line1{width: 18px; height: 2px; background-color: #999;}


/* 리스트 수정불가 */
.survey-content .list-box.disabled .left{background-color:#F9F9F9; border-color:#eee;}
.survey-content .list-box.disabled .left textarea, .survey-content .list-box.disabled .left input[type=text], .survey-content .list-box.disabled .l-upload label{color:rgba(0,0,0,.38);}
.survey-content .list-box.disabled .left textarea[disabled], .survey-content .list-box.disabled .left textarea[readonly]{background-color: transparent;}
.survey-content .list-box .left .l-subject .readonly pre{font-size: 13px; color: rgba(0, 0, 0, 0.38);}
.survey-content .list-box.disabled .left input[type=text][readonly], .survey-content .list-box.disabled .left input[type=text][disabled]{background-color: transparent;}
.survey-content .list-box.disabled .l-upload label{cursor:default;}
.survey-content .list-box.disabled .right .remove-btn{background-color:#F9F9F9; border-color:#eee; cursor:default;}
.survey-content .list-box.disabled .right .remove-btn .line-box .line1{background-color:rgba(0,0,0,.2);}
.survey-content .list-box.disabled .l-upload .thumb-wrap .delete-btn{display:none;}

.survey-content .add-list{height: 40px; max-width: 176px; margin: 0 auto; border: 2px solid var(--theme-color); width: 100%; border-radius: 8px; display: block; position: relative;}
.survey-content .add-list .line-box{position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.survey-content .add-list .line-box span{width: 2px; height: 12px; background-color: var(--theme-color); position: absolute; left: 0; right: 0; bottom: 0; top: 0; margin: auto;}
.survey-content .add-list .line-box span.line2{transform: rotate(90deg);}

.survey-setting{padding-bottom: 17px; border-bottom: 1px solid #d8d8d8; margin-top: 8px;}
.survey-setting .content-w-title{font-size: 16px; font-weight: 700; color: rgba(0, 0, 0, 0.58);}
.survey-setting .set-box{margin-top: 8px; border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8; display: flex; padding: 12px 0;}
.survey-setting .set-box .box{display: flex; align-items: center; margin-right: 58px; position: relative;}
.survey-setting .set-box .box:last-child{margin-right: 0;}
.survey-setting .set-box .box::after{content: ""; position: absolute; display: block; top: 0; bottom: 0; right: -32px; width: 1px; height: 12px; background-color: #c4c4c4; margin: auto 0;}/* 구분선 */
.survey-setting .set-box .box:last-child::after{display: none;}
.survey-setting .set-box .box .title{font-size: 13px; color: rgba(0, 0, 0, 0.58); font-weight: 700; flex: none;}
.survey-setting .set-box .box .title .required{color: #E22134; margin-left: 4px;}
.survey-setting .set-box .box .title + *{margin-left: 16px;}
.survey-setting .set-box .box .chk .title + *{margin-left: 8px;}
.survey-setting .set-box .box .chk{display: flex; align-items: center;}
.survey-setting .set-box .box .chk{margin-left: 32px;}
.survey-setting .set-box .box .chk:first-child{margin-left: 0;}
.survey-setting .set-box .box .chk input{display: none;}
.survey-setting .set-box .box .chk label{width: 51px; height: 31px; background-color: #eee; border-radius: 50px; margin-left: 8px; flex: none; transition: all 0.3s; position: relative; cursor: pointer;}
.survey-setting .set-box .box .chk label .circle{width: 27px; height: 27px; background-color: #fff; border-radius: 50%; display: block; position: absolute; left: 2px; top: 2px; box-shadow: 0px 3px 1px 0px rgba(0, 0, 0, 0.06), 0px 3px 8px 0px rgba(0, 0, 0, 0.15); transition: all 0.3s}
.survey-setting .set-box .box .chk input:checked + label{background-color: var(--theme-color);}
.survey-setting .set-box .box .chk input:checked + label .circle{left: 22px;}
.survey-setting .set-box .box .radioA{margin-left: 24px; flex: none;}
.survey-setting .set-box .box .radioA label{font-size: 14px; color: rgba(0, 0, 0, 0.58);}

/* 비활성화 */
.survey-setting .set-box .box .chk.disabled{}
.survey-setting .set-box .box .chk.disabled .title{color:rgba(0, 0, 0, 0.3);}
.survey-setting .set-box .box .chk input:checked{}
.survey-setting .set-box .box .chk.disabled input + label{background-color: #F9F9F9; cursor:default;}

/* 설문 게시글 */
.board-survey-wrap.board-view-wrap .view-cont{font-size: 14px; padding: 0; padding-top: 12px;}
.board-survey-wrap.board-view-wrap .round-box{}
.board-survey-wrap.board-view-wrap .round-box pre{white-space:pre-line; font-family:'Noto Sans KR'; letter-spacing: -1px; font-size: 14px; background-color: #f9f9f9; border: 1px solid #d8d8d8; border-radius: 4px; padding: 8px 16px; color: rgba(0, 0, 0, 0.58); margin-bottom: 12px; }
.board-survey-wrap.board-view-wrap .round-box pre:empty{display:none;}
.board-survey-wrap.board-view-wrap .survey-info{color: rgba(0, 0, 0, 0.78); letter-spacing: -1px; padding-left: 9px; position: relative; line-height: 1.5; font-size: 13px;}
.board-survey-wrap.board-view-wrap .survey-info::before{content: ""; width: 3px; height: 3px; background-color: var(--theme-color); display: block; top: 8px; left: 0;bottom: 0; position: absolute;}/* 점 */
.board-survey-wrap.board-view-wrap .survey-info:first-child{margin-top: 0;}
.board-survey-wrap.board-view-wrap .survey-info mark{background-color: transparent; color: var(--theme-color);}
.board-survey-wrap.board-view-wrap .survey-info br{display: none;}


.vote-list-box{padding: 28px 0; border-top: 1px solid #d8d8d8; margin-top: 12px;}
.vote-list-box .vote-item{display: flex; align-items: center; margin-top: 30px; justify-content: space-between;}
.vote-list-box .vote-item:first-child{margin-top: 0;}
.vote-list-box .vote-item .chk{align-self:flex-start;}
.vote-list-box .vote-item .chk input{display: none;}
.vote-list-box .vote-item .chk input + label{width: 24px; height: 24px; border: 1px solid #d8d8d8; border-radius: 50%; background: url(/images/ico_survey_chk_2x.png) no-repeat center 6px / 14px 11px; display: block; transition: all 0.3s; cursor: pointer;}
.vote-list-box .vote-item .chk input:checked + label{width: 24px; height: 24px; border: 1px solid #d8d8d8; border-radius: 50%; background: var(--theme-color) url(/images/ico_survey_chk_active_2x.png) no-repeat center 6px / 14px 11px; display: block; border-color: var(--theme-color);}
.vote-list-box .vote-item .progress-box{margin-left: 16px; width: 100%;  max-width:786px;}
.vote-list-box .vote-item .progress-box .sub{font-size: 16px; color: rgba(0, 0, 0, 0.78);letter-spacing: -0.5px; }
.vote-list-box .vote-item .progress-box pre{white-space:pre-line; font-family:'Noto Sans KR'; letter-spacing: -1px; font-size: 16px;}
.vote-list-box .vote-item .progress-box .bar-wrap{display: flex; margin-top: 4px; align-items: center;}
.vote-list-box .vote-item .progress-box .bar-wrap .bar{width: 100%; height: 8px; border-radius: 10px; background-color: #eee; position: relative; overflow: hidden; margin: 0;}
.vote-list-box .vote-item .progress-box .bar-wrap .gage{background-color: var(--theme-color); position: absolute; left: 0; top: 0; height: 100%;border-radius: 10px;}
.vote-list-box .vote-item .right{display:flex; flex:none; align-items: flex-end; align-self: flex-end; width:117px; height:100%; justify-content: right; position: relative; top:9px; margin-left:auto;}
.vote-list-box .vote-item .right .cnt-box{display:flex; flex:none;}
.vote-list-box .vote-item .right .cnt{flex: none; font-size: 16px; margin-left: 8px; color: rgba(0, 0, 0, 0.78); text-decoration: none; display: flex; align-items: center;}
.vote-list-box .vote-item .right .cnt button{}
.vote-list-box .vote-item .right .cnt.active button{color: var(--theme-color); text-decoration:underline;}
.vote-list-box .vote-item .right .btn{font-size: 13px; font-weight: 400; padding: 6px 8px; color: rgba(0, 0, 0, 0.58); margin-left: 4px; flex:none; height:29px;}
.vote-list-box .vote-item .right .thumb-box{flex: none; width: 40px; height: 40px; margin-left: 16px;}
.vote-list-box .vote-item .right .thumb-box a{margin-top:-6px; width: 40px; height: 40px; border: 1px solid #d8d8d8; border-radius: 4px; padding: 2px 5px; position: relative; overflow: hidden; display: block;}
.vote-list-box .vote-item .right .thumb-box a img{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);max-width: 38px;max-height: 38px;margin: auto; }

.board-survey-wrap.board-view-wrap .board-w-btn{display: flex; justify-content: space-between; padding-top: 12px; border-top: 1px solid #d8d8d8;}
.board-survey-wrap.board-view-wrap .board-w-btn .btn{width: auto; padding: 0 24px;}
.board-survey-wrap.board-view-wrap .board-w-btn .btn:first-child{margin-left: 0;}
.board-survey-wrap.board-view-wrap .board-w-btn .btn.line-isolation{position: relative;}
.board-survey-wrap.board-view-wrap .board-w-btn .btn.line-isolation::after{content: ""; position: absolute; display: block; top: 0; bottom: 0; width: 1px; height: 12px; right: -13px; background-color: #c4c4c4; margin: auto 0;}/* 구분선 */
.board-survey-wrap.board-view-wrap .board-w-btn .btn.line-isolation + .btn{margin-left: 21px;}
.board-survey-wrap.board-view-wrap .board-w-btn .admin-btn{flex: none;}
.board-survey-wrap.board-view-wrap .board-w-btn .user-btn{width: 100%; margin-left: 16px;}
.board-survey-wrap.board-view-wrap .board-w-btn .btn.vote{width: 100%; margin-left: 0; max-width: 145px; min-width: 100px;}


.board-survey-wrap.board-view-wrap .comment-list-wrap{margin-top: 44px;}


/* 설문 이미지 팝업 */
.modal_wrap.original-img-modal .modal_content{max-width: 600px;}
.modal_wrap.original-img-modal .img-box{display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; min-height: 500px;}
.modal_wrap.original-img-modal .modal_content{margin: 0 auto;}
.modal_wrap.original-img-modal .modal_content .modal_close{width: 18px;height: 18px;background: url("/images/ico_close_2x.png") no-repeat center;background-size: 18px 18px;font-size: 0;text-indent: -999px;cursor: pointer; position: absolute; right: 24px; top: 24px;}


/* 설문 현황 팝업 */
.current-vote-modal.modal_wrap .modal_content{padding: 28px 24px 50px 24px;}
.current-vote-modal.modal_wrap .modal_header .modal_close{align-self: flex-start;}
.current-vote-modal.modal_wrap .vote-current{font-size: 16px; font-weight: 700;margin-top: 12px;}
.current-vote-modal.modal_wrap .vote-current span{color: var(--theme-color); margin: 0 2px;}
.current-vote-modal.modal_wrap .vote-current span:first-child{margin-left: 0;}
.current-vote-modal.modal_wrap .modal_content .modal_body{padding: 0;}
.current-vote-modal.modal_wrap .member{display: flex; align-items: center; padding: 12px 0; border-bottom: 1px solid rgba(0, 0, 0, 0.07);}
.current-vote-modal.modal_wrap .img-box{width: 48px; height: 48px; border-radius: 50%; background-color: #fff; border: 2px solid #fff; box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.08); overflow: hidden; position: relative; flex: none;}
.current-vote-modal.modal_wrap .img-box img{position: absolute; max-width: 100%; max-height: 48px; top: 0;left: 0; right: 0; bottom: 0; margin: auto;}
.current-vote-modal.modal_wrap .right{font-size: 14px; color: rgba(0, 0, 0, 0.38); margin-left: 8px;}
.current-vote-modal.modal_wrap .right span{display: block;}
.current-vote-modal.modal_wrap .right span span{display: inline-block; color: rgba(0, 0, 0, 0.38); font-weight: 400;}
.current-vote-modal.modal_wrap .right .name{color: rgba(0, 0, 0, 0.78); font-weight: 700;}
.current-vote-modal.modal_wrap .right .center{font-size: 13px;}
.current-vote-modal.modal_wrap .right .id{margin-left: 8px;}
.current-vote-modal.modal_wrap .pagination-wrap{margin: 0; padding: 8px 0; background-color: #f9f9f9; border-bottom: 1px solid #ddd;}
.current-vote-modal.modal_wrap .btn-box{margin-top: 24px;}
.current-vote-modal.modal_wrap .btn-box .btn{height: 60px; border-radius: 8px; border-color: #d8d8d8; color: rgba(0, 0, 0, 0.58);}

.header-area .common_btn { display: flex; justify-content: flex-start; align-items: center; } 
.header-area .common_btn>* { margin-left: 16px; } 
.header-area .common_btn>*:last-child { margin-right: 8px; } 
.header-area .common_btn>*.service_info { width: 32px; height: 32px; }
.header-area .common_btn>*.service_info .profile_img { width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 50%; border: 1px solid #ddd; }
.header-area .common_btn>*.service_info .profile_img img { width: 100%; height: 100%; object-fit: cover; }
.header-area .common_btn>*.service_info .profile_none { position: relative; display: block; border-radius: 50%; background-color: #222222; border: 1px solid #ddd; }

.header-area .common_btn>*>i.ic_question { position: relative; display: block; width: 24px; height: 24px; background: url(/images/ic_common_question.png) no-repeat center / contain; } 
.header-area .common_btn>*>i.ic_service { position: relative; display: block; width: 32px; height: 32px; background: url(/images/ic_common_service.png) no-repeat center / contain; } 
.header-area .common_btn>* .profile_none i.ic_profile { position: relative; display: block; width: 30px; height: 30px; background: url(/images/ic_common_profile.png) no-repeat center / contain; top: 4px; } 

.header-area .common_btn>*:not(.sideMenu-btn) { position: relative; display: block; } 
.header-area .common_btn>* .tooltip { height: 35px; position: absolute; display: block; top: 32px; left: -16px; border: none; transition: all 0.2s ease-in-out; height: 0; overflow: hidden; } 
.header-area .common_btn>*.service_info .tooltip { top: 35px; left: -7px; }
.header-area .common_btn>*.service_guide .tooltip { top: 26px; left: -20px; }
.header-area .common_btn>*:hover .tooltip { height: 35px; z-index: 2; } 
.header-area .common_btn>* .tooltip i { position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: url(/images/service_sb_2x.png) no-repeat center / contain; width: 31px; height: 8px; z-index: 9; } 
.header-area .common_btn>* .tooltip span { position: relative; display: block; white-space: nowrap; font-size: 12px; font-weight: 600; line-height: 1.4; color: rgba(0, 0, 0, 0.78); padding: 4px 6px; border: 1px solid #ddd; margin-top: 6px; border-radius: 4px; background-color: #fff; } 

#header .service_sb { position: fixed; top: 48px; right: calc( (100% - 1200px)/2 + 38px ); display: block; z-index: 9; border-radius: 8px; max-width: 306px; height: 0px; overflow: hidden; transition: all 0.2s ease-in-out; z-index: 1000; } 
#header .service_sb_pos { margin-top: 23px; padding: 16px; border: 1px solid #ddd; box-shadow: 0px 4px 4px 0px #00000012; background-color: #fff; border-radius: 8px; } 
#header .service_sb::before { content: ''; position: absolute; top: 12px; right: 0; width: 51px; height: 12px; display: block; background: url('/images/service_sb_2x.png') no-repeat center / contain; } 
#header .service_sb .service_list_wrap h6 { white-space: nowrap; display: flex; justify-content: flex-start; align-items: center; font-size: 15px; font-weight: 600; line-height: 1.2; letter-spacing: -0.3px; text-align: left; padding: 8px 0 16px; } 
#header .service_sb .service_list_wrap h6::after { content: ''; position: relative; width: 100%; height: 1px; background-color: #EEEEEE; margin-left: 16px; } 
#header .service_sb .service_list_wrap .list { display: flex; justify-content: flex-start; align-items: center; padding-bottom: 8px; flex-wrap: wrap; } 
#header .service_sb .service_list_wrap .list li { width: 25%; padding-bottom: 12px; } 
#header .service_sb .service_list_wrap .list li a { min-width: 60px; overflow: hidden; display: flex; justify-content: center; flex-direction: column; align-items: center; border: 1px solid transparent; margin: 0 8px; } 
#header .service_sb .service_list_wrap .list li:nth-child(4n-3) a { margin-left: 0; } 
#header .service_sb .service_list_wrap .list li:nth-child(4n) a { margin-right: 0; } 
#header .service_sb .service_list_wrap .list li a span { position: relative; font-size: 12px; font-weight: 400; line-height: 1.5; letter-spacing: -0.05em; text-align: left; padding-bottom: 4px; } 
#header .service_sb .service_list_wrap .list li a img { width: 33px; height: 32px; margin-top: 2px; } 
#header .service_sb .service_list_wrap .list li a:hover { border: 1px solid #eee; border-radius: 8px; box-shadow: 0px 4px 4px 0px #00000014; } 
#header .service_sb .service_list_wrap .list li a:active { background-color: #F5F5F9; } 
#header .service_sb .service_list_wrap .list li div.service_list_icon { width: 60px; height: 40px; background-repeat: no-repeat !important; background-size: cover !important; background-position: 1px 0px !important; } 
#header .service_sb .service_list_wrap .list li a:hover .service_list_icon { background-position: 1px -60px !important; } 
#header .service_sb .service_list_wrap .list li a:active .service_list_icon { background-position: 1px 0 !important; } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.mswitch { background: url('/images/service_list_mswitch.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.mtalk { background: url('/images/service_list_mtalk.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.mcom { background: url('/images/service_list_mcom.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.mmall { background: url('/images/service_list_mall.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.mreserve { background: url('/images/service_list_reserve.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.mconnect { background: url('/images/service_list_mconnect.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.mtest { background: url('/images/service_list_mtest.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.mnote { background: url('/images/service_list_note.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.mpod { background: url('/images/service_list_pdf.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.mstore { background: url('/images/service_list_store.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.mpay { background: url('/images/service_list_mpay.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.home { background: url('/images/service_list_home.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.group { background: url('/images/service_list_group.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.busi_info { background: url('/images/service_list_busi_info.png'); } 
#header .service_sb .service_list_wrap .list li div.service_list_icon.aca { background: url('/images/service_list_aca.png'); } 
#header .info_box { position: fixed; display: block; top: 54px; right: calc( (100% - 1200px)/2 - 9px ); z-index: 9; height: 0; overflow: hidden; transition: all 0.2s ease-in-out; z-index: 1000; } 
#header .info_box.active { height: 235px; } 
#header .info_box::before { content: ''; position: absolute; top: 6px; right: 0; width: 51px; height: 12px; display: block; background: url('/images/service_sb_2x.png') no-repeat center / contain; } 
#header .info_box_pos { border: 1px solid #ddd; border-radius: 8px; padding: 16px; background-color: #fff; width: 204px; max-width: 292px; box-shadow: 0px 4px 4px 0px #00000012; overflow: hidden; margin-top: 17px; } 
#header .info_box .personal { display: flex; justify-content: flex-start; align-items: center; padding-bottom: 8px; margin-bottom: 8px; border-bottom: 1px solid #EEEEEE; } 
#header .info_box .personal img { width: 32px; height: 32px; margin-right: 8px; overflow: hidden; border-radius: 50%; object-fit : cover; border: 1px solid #ddd; } 
#header .info_box .personal .profile { position: relative; display: block; } 
#header .info_box .personal .profile span { position: relative; display: block; font-size: 12px; font-weight: 600; line-height: 1.6; letter-spacing: -1px; color: #000000C7; } 
#header .info_box .personal .profile strong { position: relative; display: block; font-size: 12px; font-weight: 600; line-height: 1.6; letter-spacing: -1px; color: #00000061; } 
#header .info_box .list { margin-bottom: 8px; border-bottom: 1px solid #eee; } 
#header .info_box .list li { display: flex; justify-content: space-between; align-items: center; padding-bottom: 8px; } 
#header .info_box .list a { position: relative; display: block; font-size: 12px; font-weight: 600; line-height: 1.6; letter-spacing: -1px; color: rgba(0, 0, 0, .58); padding-bottom: 8px; } 
#header .info_box .list a.profile_info { display: flex; justify-content: center; align-items: center; padding-bottom: 0; } 
#header .info_box .list a.profile_info i { background: url(/images/ic_profile_info_arrow_2x.png) no-repeat center / contain; width: 7px; height: 8px; } 
#header .info_box a.logout { position: relative; display: block; background-color: #F6F6F6; padding: 4px 0; border: 1px solid #ddd; font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: center; border-radius: 4px; color: #00000094; } 

#header .info_box .list li span { font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; } 
#header .info_box .list li .lang_btn { display: flex; justify-content: center; align-items: center; } 
#header .info_box .list li .lang_btn a { padding-bottom: 0; font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: center; text-decoration: underline; margin-left: 4px; } 
#header .info_box .list li .lang_btn a.active { color: var(--theme-color); }

 #wrap.header-roll-up #header .info_box, #wrap.header-roll-up #header .service_sb { top:0; opacity:0; transition: opacity 0.2s, top 0.2s; pointer-events: none; }
 
 
 .service_guide.inner-side i.ic_question { position: relative; display: block; width: 24px; height: 24px; background: url(/images/ic_common_question.png) no-repeat center / contain; } 


.service_guide.inner-side { position: relative; margin-right: 50px; }
.service_guide.inner-side .tooltip { height: 35px; position: absolute; display: block; top: 32px; left: -16px; border: none; transition: all 0.2s ease-in-out; height: 0; overflow: hidden; } 
.service_guide.inner-side .tooltip { top: 26px; left: -14px; z-index: 1; }
.service_guide.inner-side:hover .tooltip { height: 35px; } 
.service_guide.inner-side .tooltip i { position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: url(/images/service_sb_2x.png) no-repeat center / contain; width: 31px; height: 8px; z-index: 9; } 
.service_guide.inner-side .tooltip span { position: relative; display: block; white-space: nowrap; font-size: 12px; font-weight: 600; line-height: 1.4; color: rgba(0, 0, 0, 0.78); padding: 4px 6px; border: 1px solid #ddd; margin-top: 6px; border-radius: 4px; background-color: #fff; } 


/* 교재 업데이트 */
.htable-wrap .thead > ul > li.cell-update { min-width: 10%; }
.htable-wrap .thead > ul > li.cell-update-status { min-width: 10%; }
.htable-wrap .tbody > ul > li.cell-update { min-width: 10%; }
.htable-wrap .tbody > ul > li.cell-update-status { display: flex; justify-content: center; align-items: center; min-width: 10%; }
.htable-wrap .tbody > ul > li.cell-update-status .update-status-wrap { display: flex; justify-content: center; gap: 8px; }
.board-desc { padding: 16px 0; border-top: 1px solid #000000; }
.type-board-search .header-search { margin: 0 auto; }
.status_wrap { display: flex; flex-wrap: wrap; gap: 32px; margin-top: 8px; padding: 20px 16px; border: 1px solid #D8D8D8; border-radius: 8px; box-shadow: 0px 4px 8px 0px #00000014; }
.status_wrap .stts_list { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-right: 32px; }
.status_wrap .stts_list::after { content:''; display: block; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 12px; background: #D8D8D8; }
.status_wrap .stts_list:last-child { padding-right: 0; }
.status_wrap .stts_list:last-child::after { display: none; }
.status_wrap .stts_tit { display: flex; align-items: center; gap: 8px; }
.status_wrap .stts_tit .badge { width: 24px; height: 24px; border-radius: 24px; font-weight: 700; font-size: 13px; color: #fff; text-align: center; }
.stts_desc { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.stts_desc li { display: flex; align-items: center; gap: 8px; padding: 0 8px; }
.stts_desc li .badge { width: 8px; height: 8px; border-radius: 2px; }
.uddate-cnt-wrap { position: relative; width: 24px; height: 24px; border-radius: 24px; border: 1px solid #00000012; background: #F1F1F1; font-size: 13px; color: #fff; font-weight: 700; text-align: center; cursor: pointer; }
.update-tooltip { position: absolute; left: -10px; top: 32px; display: none; white-space: nowrap; font-size: 12px; font-weight: 600; line-height: 1.4; color: rgba(0, 0, 0, 0.78); padding: 4px 6px; border: 1px solid #ddd; margin-top: 6px; border-radius: 4px; background-color: #fff; z-index: 10; }
.update-tooltip i { position: absolute; top: -20px; left: 20px; transform: translateX(-50%); background: url(/images/service_sb_2x.png) no-repeat center / contain; width: 51px; height: 28px; z-index: 9; }
.uddate-cnt-wrap:hover .update-tooltip { display: block; }
.board_views_hist { text-decoration: underline; cursor: pointer; }

.board-cont-tit { padding-top: 16px; font-size: 16px; }
.board-view-wrap .board-list.update-detail-board { margin-top: 8px; }
.update-detail-board .htable-wrap .thead { display: block !important; }
.update-detail-board .cell-subject { justify-content: start !important; padding: 0 16px; }
.update-detail-board .htable-wrap .tbody > ul { flex-wrap: wrap; height: unset !important; }
.update-detail-board .htable-wrap .tbody > ul.on { background: #F9F9F9; }
.update-detail-board .htable-wrap .tbody > ul.on .cell-btn-toggle { transform: rotate(-180deg); }
.update-detail-board .htable-wrap .tbody > ul > li { min-height: 47px; color:#000000C7; }
.update-detail-board .cell-hidden { display: none; padding: 8px; width: 100%; background: #fff !important; min-height: unset !important; text-align: left !important; white-space: pre-line; }
.update-detail-board .cell-page { display: flex; align-items: center; justify-content: center; min-width: 48px; }
.update-detail-board .htable-wrap .tbody > ul > li.cell-ex-num { color: #00000061; }
.update-detail-board .htable-wrap .tbody > ul > li.cell-ex-num b { color: #000000C7; }
.update-detail-board .cell-ex-num { display: flex; align-items: center; justify-content: center; min-width: 58px; }
.update-detail-board .cell-subject { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; line-height: 40px; max-width: calc(100% - 306px); }
.update-detail-board .cell-update-status { min-width: 160px !important; }
.update-detail-board .cell-update-status .badge { position: absolute; display: flex; align-items: center; gap: 4px; padding: 0 8px; border-radius: 20px; border: 1px solid #ddd; overflow: hidden; }
.update-detail-board .cell-update-status .badge::after { content:''; position: absolute; left:0; right:0; top:0; bottom: 0; background-color: #fff; opacity: 93%; z-index: 1; }
.update-detail-board .cell-update-status .dot { display: block; width: 4px; height: 4px; border-radius: 4px; }
.update-detail-board .cell-update-status .badge * { position: relative; z-index: 2; font-weight: 700; font-size: 12px; }
.update-detail-board .cell-update-status .badge span { overflow: hidden; max-width: 116px; text-overflow: ellipsis; white-space: nowrap; }
.update-detail-board .cell-btn-toggle { width: 40px; height: 100%; }
.update-detail-board .htable-wrap .tbody > ul { cursor: pointer; }
.update-detail-board .htable-wrap .tbody > ul > li.cell-btn-toggle { display: inline-block; background: url(/images/ico_arrow_bottm_2x.png) no-repeat center; background-size: 12px 8px; }

@media screen and (max-width: 1024px) {
    .type-board-search .header-search { display: block !important; }
    .htable-wrap .tbody > ul > li.cell-update-status { justify-content: space-between; padding-top: 8px; width: 100% !important; }
    .status_wrap .stts_list::after { display: none; }
    .update-tooltip { display: none !important; }
    .update-detail-board .htable-wrap .tbody > ul > li { min-height: 40px; }
    .update-detail-board .htable-wrap .tbody > ul > li.cell-hidden { border-top: 1px solid #EEEEEE; box-shadow: 0px 4px 2px 0px #0000000A inset; }
    .update-detail-board .htable-wrap .tbody > ul { padding: 0 !important; }
    .update-detail-board .htable-wrap .tbody > ul > li.cell-btn-toggle { width: 40px !important; order: 5; }
    .update-detail-board .cell-ex-num { order: 1; }
    .update-detail-board .cell-page { order: 2; }
    .update-detail-board .cell-subject { order: 3; width: calc(100% - 106px) !important; max-width: unset; }
    .update-detail-board .htable-wrap .tbody > ul > li.cell-subject { order: 3; width: calc(100% - 106px) !important; max-width: unset; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; line-height: 40px; }
    .update-detail-board .htable-wrap .tbody > ul > li.cell-update-status { order: 4; padding-top: 0 !important; width: calc(100% - 40px) !important; }
    .update-detail-board .cell-update-status .badge { margin-left: 8px; }
    .update-detail-board .cell-update-status .badge span { max-width: unset; }
    .update-detail-board .htable-wrap .tbody > ul > li.cell-btn-toggle { order: 5; }
    .update-detail-board .htable-wrap .tbody > ul > li.cell-hidden { order: 6; width: 100% !important; }
    .update-detail-board .htable-wrap .thead > ul > li.cell-update-status { display: none; }
    .update-detail-board .htable-wrap .thead > ul > li.cell-btn-toggle { display: none; }
}

