@charset "utf-8"; @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200;300;400;500;600;700;900&display=swap');
@font-face { font-family: 'S-CoreDream-3Light'; src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff'); font-weight: normal; font-style: normal; } 

#wrap .only-pc,
#modal-wrap .only-pc { display: block; }
#wrap .only-mobile,
#modal-wrap .only-mobile { display: none; }
.only-mobile { display: none; }
.only-mobile-flex { display: none !important; }

.fc-theme { color: #383838 !important; color: var(--theme-color) !important; }
.fw800 { font-weight:800 !important; }
.fw700 { font-weight:700 !important; }
.theme-color { color: var(--theme-color); }

a.no-link{cursor: default;}


/* Global */
body { position: relative; overflow-x: hidden; }
body.noscroll { overflow: hidden; }
body.noslogan { padding-top: 215px; }
.container { min-height: 380px; padding-bottom: 120px; }
.container.pb0 {padding-bottom:0;}
#progressIndicator::before {content: '';display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: transparent;z-index: 111;}

.inner { /* position: relative; */
 margin-left: auto; margin-right: auto; max-width: 1232px; padding: 0 16px; }
.inner-sm { max-width: 588px; }
.inner-sm-2 { max-width: 600px; }
.inner-md-1 { max-width: 828px; }
.inner-md-2 { max-width: 870px; }
.inner-md { max-width: 894px; }
.inner-lg-1 { max-width: 920px; }
.inner-lg { max-width: 1100px; }
.inner-xl { max-width: 1134px; }
.inner-xxl { max-width: 1232px; }
.inner-xxxl { max-width: 1432px; }
.inner-mart { margin-top: 32px; }
.full { width: 100%; }
.half { width: 50%; }
.content { margin-top: 16px; }

/* normal font-color */
.fc_30 { color: rgba(0, 0, 0, .30); }
.fc_58 { color: rgba(0, 0, 0, .58); }
.fc_78 { color: rgba(0, 0, 0, .78); }

/* button */
.btn { display: inline-block; padding: 8px 12px; border-radius: 4px; font-weight: bold; transition: 0.2s; transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1); transition: background-color 0.2s, color 0.2s, border-color 0.2s; }
.btn.default { background-color: #fff; border: 1px solid #dbdbdb; color: rgba(0, 0, 0, 0.58); }
.btn.default:hover { background-color: #f7f7f7; }
.btn.submit { background-color: #383838; background-color: var(--theme-color); color: #FFF; border-radius: 8px; }
.btn.btn-white { border: 1px solid #222; color: rgba(0, 0, 0, 0.78); }
.btn.btn-white:hover { background-color: #f5f5f5; }
.btn.btn-theme { border: 1px solid #383838; background: var(--theme-color); border: 1px solid var(--theme-color); color: #fff; }
.btn.btn-theme:hover { color: #fff; background-color: #383838; background-color: var(--theme-color); }
.btn.btn-theme-2 { border: 2px solid #383838; border: 2px solid var(--theme-color); color: #383838; color: var(--theme-color); }
.btn.btn-box-theme { color: #383838 !important; color: var(--theme-color) !important; border: 1px solid #383838; border: 1px solid var(--theme-color); }
.btn.btn-h35 { height: 51px; font-size: 16px; text-align: center; line-height: 35px; }
.btn.btn-h51 { height: 51px; font-size: 16px; text-align: center; line-height: 42px; }
.btn.btn-h64 { height: 64px; font-size: 16px; text-align: center; line-height: 52px; }
.btn i.ico { margin-right: 4px; }
.btn i.ico.next { margin: 0 0 0 4px; }
.btn.pd16 { padding: 16px 0; }
.btn.pd11 { padding: 11px 0; }
.btn.br8 { border-radius: 8px; }

.btn.default { background-color: #fff; border: 1px solid #dbdbdb; color: rgba(0, 0, 0, 0.58) !important; }
.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-lg { width: 216px; padding: 10px; 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 .btn { margin: 0 4px; }


/* form */
.frm-nm { margin-bottom: 3px; font-weight: bold; font-size: 12px; color: rgba(0, 0, 0, 0.58); }
.frm-input { width: 100%; height: 40px; box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.07); }
.frm-input.underLine { border: none; border-radius: 0; }
.checkboxA { position: relative; display: inline-block; }
.checkboxA input { display: none; }
.checkboxA input+label::before { content: ''; position: absolute; left: 0; top: 0; display: inline-block; width: 20px; height: 21px; 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; }
.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 input[disabled]+label::before { background-color: #F5F5F5; }
.checkboxA label { position: relative; display: block; height: 20px; line-height: 20px; cursor: pointer; }
.checkboxA label span { margin-left: 28px; 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_2x.png'); background-size: 20px; background-repeat: no-repeat; background-color: #fff; }
.radioA input:checked+label::before { background-image: url('/images/ico_radio_active_2x.png') no-repeat center !important; background-size: contain !important; }

.radioA input[disabled]+label::before { background-color: #F5F5F5; }
.radioA label { position: relative; display: block; padding-left: 42px; line-height: 20px; cursor: pointer; }
.radioA label span { margin-left: 28px; color: rgba(0, 0, 0, 0.58); }
.datepicker { max-width: 110px; background: url("/images/admin/icon_date.png") no-repeat right 10px center; color: rgba(0, 0, 0, 0.58) !important; font-size: 12px; font-weight: lighter; }
.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; }
i.required { width: 10px; height: 8px; background: url("/images/admin/icon_required_2x.png") no-repeat 0 0; background-size: 10px 8px; }


/* 정렬 */
.tal { text-align: left !important; }
.tac { text-align: center !important; }
.tar { text-align: right !important; }

.scroll { overflow-y: auto; }
/* .scroll::-webkit-scrollbar { width: 10px; height: 8px; background-color: rgba(0, 0, 0, .16); border-radius: 10px; }
.scroll::-webkit-scrollbar-thumb { background-color: var(--theme-color); border-radius: 10px; background-clip: padding-box; }
.scroll::-webkit-scrollbar-corner { display: none; } */

.scroll-x { overflow-x: auto; }
.scroll-x::-webkit-scrollbar { width: 10px; height: 10px; }
.scroll-x::-webkit-scrollbar-thumb { background-color: #d1d1d1; border-radius: 10px; background-clip: padding-box; border: 3px solid transparent; }
.scroll-x::-webkit-scrollbar-corner { display: none; }

/* header (엠몰참조) :: 230811 { */
 #wrap.fixed .header-area { 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); }
 #wrap.fixed .header { box-shadow: 0px 18px 18px rgba(68, 68, 68, 0.06), 0px 0px 1px rgba(68, 68, 68, 0.31); }
 #wrap.header-roll-up .header-area { -webkit-transform: translateY(-150%); -ms-transform: translateY(-150%); transform: translateY(-150%); }

 .header { position: relative; width: 100%; background-color: #fff; }
 .header.pb150 { padding-bottom: 150px; }
 .header.pb86 { padding-bottom: 86px; }
 .header-area { z-index: 99; position: relative; display: block; width: 100%; height: 86px; border-bottom: 1px solid #d8d8d8; background-color: #fff; }
 .header-inner { max-width: 1232px; margin: 0 auto; padding: 0 16px; height: 100%; }
 .header-wrap { position: relative; height: 100%; display: flex; justify-content: space-between; align-items: center; flex-direction: row; }
 .header-wrap .header-title { flex-shrink: 0; }

 .logo { display: block; }
 .logo img { max-width: 168px; max-height: 64px; vertical-align: middle; }
 .logo .no-img { display: inline-block; vertical-align: middle; font-size: 24px; color: #000; }
 .logo .campus { display: inline-block; height: 25px; vertical-align: middle; }
 .logo .campus span { display: inline-block; max-width: 120px; height: 25px; line-height: 20px; margin-left: 16px; padding: 2px 8px; background-color: #fff; border-radius: 4px; color: rgba(0, 0, 0, 0.58); border: 1px solid rgba(0, 0, 0, 0.38); font-weight: bold; font-size: 13px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

 .ml-2 { margin-left: 2px !important; }
 .mr-4 { margin-right: 4px !important; }
 .mr-8 { margin-right: 8px !important; }
 .mr-16 { margin-right: 16px !important; } 
 .pb-0 { padding-bottom:0px !important; }
 .mb-0 { margin-bottom:0px !important; }
 .mb-8 { margin-bottom: 8px !important; }
 .mt-8 { margin-top: 8px !important; }
 .pt-8 { padding-top: 8px !important; }
 .mr-32 { margin-right: 32px !important; }

/* icon */
i.ico { display: inline-block; vertical-align: middle; background-size: 100% 100% !important; }
i.split { display: inline-block; vertical-align: middle; }
i.member { width: 18px; height: 18px; background: url("/images/ico_member_2x.png") no-repeat; }
i.member-mobify { width: 18px; height: 18px; background: url("/images/ico_member_modify_2x.png") no-repeat; }
i.login { width: 18px; height: 18px; background: url("/images/ico_login_2x.png") no-repeat; }
i.logout { width: 18px; height: 18px; background: url("/images/ico_logout_2x.png") no-repeat; }
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/icon_close_round.png") no-repeat; }
i.close-w { margin-top: -1px; width: 19px; height: 19px; background: url("/images/ico_closed_white.png") no-repeat; } 
i.reset { margin-top:-2px; width: 18px; height: 18px; background: url("/images/ico_reset.png") no-repeat center; } 
i.language { width: 18px; height: 18px; background: url("/images/ico_language_2x.png") no-repeat; }
i.blog { width: 36px; height: 36px; background: url("/images/ico_sns_blog_2x.png") no-repeat; }
i.facebook { width: 36px; height: 36px; background: url("/images/ico_sns_facebook_2x.png") no-repeat 0 0; }
i.insta { width: 36px; height: 36px; background: url("/images/ico_sns_insta_2x.png") no-repeat 0 0; }
i.band { width: 36px; height: 36px; background: url("/images/ico_sns_band_2x.png") no-repeat 0 0; }
i.cafe { width: 36px; height: 36px; background: url("/images/ico_sns_cafe_2x.png") no-repeat 0 0; }
i.lock { width: 12px; height: 16px; background: url("/images/ico_lock_2x.png") no-repeat center; background-size: 12px 16px; display: none; }
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.new { display: inline-block; vertical-align: middle; width: 16px; height: 16px; 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; font-size: 0; text-indent: -999px; }
i.filter { width: 32px; height: 32px; background: url("/images/ico_filter.png") no-repeat 0 0; }
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.emptyFolder { width: 46px; height: 42px; background: url("/images/ico_emptyFolder_2x.png") no-repeat center; }
i.emptyCart { width: 46px; height: 42px; background: url("/images/ico_emptyCart_2x.png") no-repeat center; }
i.emptyOrder { width: 46px; height: 42px; background: url("/images/ico_emptyOrder_2x.png") no-repeat center; }
i.setting { width: 44px; height: 44px; background: url("/images/ico_setting_2x.png") no-repeat center; background-size: 44px 44px !important; }
i.commentNone { width: 45px; height: 41px; background: url("/images/ico_comment_none_2x.png") no-repeat center; background-size: 45px 41px !important; }
i.deleteFile { width: 34px; height: 41px; background: url("/images/ico_deleteFile_2x.png") no-repeat center; background-size: 34px 41px !important; }
i.hd-mtalk { width: 25px; height: 26px; background: url("/images/ico_header_mtalk_2x.png") no-repeat center; background-size: 25px 26px !important; }
i.search-dark { width: 14px; height: 14px; background: url("/images/ico_search_darkgrey_2x.png") no-repeat center; background-size: 14px 14px !important; }
i.plus { position: relative; width: 12px; height: 12px; }
i.plus span { position: absolute; width: 12px; height: 2px; background-color: #444; top: 50%; left: 50%; }
i.plus span.line1 { transform: translate(-50%, -50%); }
i.plus span.line2 { transform: translate(-50%, -50%) rotate(90deg); }

i.cart { width: 32px; height: 32px; background: url("/images/ico_cart_2x.png") no-repeat; background-size: 32px 32px; }
i.dropdown { width:22px; height: 22px; background: url('/images/ico_dropdown_2x.png') no-repeat; background-size:22px 21px; }
i.my_lec { width: 32px; height: 31px; background: url(/images/ico_my_lec_2x.png) no-repeat; background-size: 66px 31px !important; }
i.commentary { width: 16px; height: 16px; background: url('/images/ico_cate_commentary_2x.png') no-repeat; background-size: 16px 16px; }
i.header_arrow { background: url('/images/ico_arrow_bottom_2x.png') no-repeat center; width: 24px; height: 24px; background-size: contain !important; margin-top: -3px; margin-right: 0 !important; margin-left: 10px; }
i.phone { width: 13px; height: 18px; background: url('/images/ico_call_2x.png') no-repeat center; background-size: contain !important; }
i.list { width: 18px; height: 18px; background: url('/images/ico_list_2x.png') no-repeat 0 0; background-size: 14px 17px; }
i.cart-sm { width: 23px; height: 18px; background: url('/images/ico_cart_sm_2x.png') no-repeat; background-size: 23px 18px; }
i.location_arrow { width: 16px; height: 16px; background: url('/images/ico_location_arrow_2x.png') no-repeat; background-size: contain !important; }
i.caution { width: 64px; height: 64px; background: url('/images/ico_caution_2x.png') no-repeat; background-size: contain !important; }
i.file_del { width: 18px; height: 18px; background: url('/images/ico_file_del_2x.png') no-repeat; background-size: contain !important; }
i.file_submit { width: 18px; height: 18px; background: url('/images/ico_file_submit_2x.png') no-repeat; background-size: contain !important; }
i.qr { width: 19px; height: 22px; background: url(/images/ico_qr_2x.png) no-repeat; background-size: contain !important; }
i.listWhite { width: 14px; height: 17px; background: url("/images/ico_list_white_2x.png") no-repeat 0 0; background-size: 14px 17px !important; margin-top: -3px; }
i.download { width: 24px; height: 24px; background: url(/images/ico_download_2x.png) no-repeat center / contain; }
i.private { width: 16px; height: 16px; background: url("/images/ico_private_2x.png") no-repeat center; }
i.private span { display: none;}
i.ic_lec_apply { width: 24px; height: 24px; background: url("/images/ico_lec_apply_2x.png") no-repeat center / contain; }

 .pageTitle { display: none; position: relative; }
 .pageTitle .btnBack { position: absolute; top: -2px; left: 0; width: 24px; height: 24px; background: url("../images/ico_arrow_left_2x.png") no-repeat center; background-size: 10px 17px; }
 .pageTitle .subTitle { margin-left: 32px; font-weight: bold; font-size: 16px; line-height: 140%; }

 .header-search { position: relative; max-width: 536px; height: 54px; margin-left: 48px; background: #FAFAFA; border: 1px solid #D8D8D8; border-radius: 28px; overflow: hidden; }
 .header-search input { width: 100%; height: 52px; padding: 0 82px 0 28px; font-size: 13px; letter-spacing: -1px; color: rgba(0, 0, 0, 0.78); border: none; background-color: transparent; border-radius: 28px; caret-color: #383838; caret-color: var(--theme-color); }
 .header-search input::placeholder { font-size: 13px; color: rgba(0, 0, 0, 0.3); letter-spacing: -1px; font-weight: normal; }
 .header-search input:focus { background-color: #fff; }
 .header-search .btnCleaer { display: none; position: absolute; top: 19px; 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: 5px; right: 6px; width: 42px; height: 42px; background-color: #383838; background-color: var(--theme-color); border-radius: 50%; font-size: 0; text-indent: -999px; }
 .header-search .btnSearch::before { display: block; content: ''; width: 42px; height: 42px; background: url("../images/ico_search_white_2x.png") no-repeat center; background-size: 17px 17px; }
 .header-cart { position: relative; margin-left: 16px; }
 .header-cart span { position: absolute; top: -10px; right: -6px; display: inline-block; height: 18px; padding: 0 7px 0 6px; line-height: 17px; font-weight: bold; font-size: 11px; text-align: center; color: #FFF; letter-spacing: -1px; background-color: #383838; background-color: var(--theme-color); border-radius: 10px; }
 .header-lang { position: relative; margin-left: 16px;}

 .header-lang .lang_choice { position: absolute; top: 30px; left: 50%; transform: translateX(-50%); background: #fff; padding: 8px; border: 1px solid #d8d8d8; border-radius: 4px; display: none; flex-direction: column; }
 .header-lang .lang_choice.active { display: flex; }
 .header-lang .lang_choice span { font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: center; cursor: pointer; }
 .header-lang .lang_choice span:first-child { margin-bottom: 10px; }
 .header-lang .lang_choice span.active { color: var(--theme-color); }

 .cart-pop { display: none; position: absolute !important; top: 50px; right: 0; width: 320px; height: 92px; background: #FFF; border: 1px solid #383838; border: 1px solid var(--theme-color); box-shadow: 0px 18px 18px rgba(68, 68, 68, 0.06), 0px 0px 1px rgba(68, 68, 68, 0.31); border-radius: 8px; cursor: default; z-index: 99; }
 .cart-pop.fixed {position:fixed !important;}
 .cart-pop-box { display: flex; align-items: center; height: 90px; padding: 0 16px; }
 .cart-pop-box .prd-thumb { align-items: center; flex-shrink: 0; width: 106px; height: 59px; margin-bottom: 0; border-radius: 4px; overflow: hidden; }
 .cart-pop-box .prd-thumb img { box-shadow: 0px 3.75px 3.75px rgba(68, 68, 68, 0.1); object-fit: contain; }
 .cart-pop-box .text { flex-grow: 1; padding-left: 16px; }
 .cart-pop-box .text .name { margin-bottom: 4px; color: rgba(0, 0, 0, 0.38); font-size: 14px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; max-height: 40px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
 .cart-pop-box .text .info { color: #000; font-size: 14px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: left; }

.header .utill-menu { display: flex; align-items: center; }
.header .utill-menu { color: rgba(0, 0, 0, 0.58); font-weight: 700; font-size: 12px; }
.header .utill-menu>div { position: relative; }
.header .utill-menu>div:last-child { margin-right: 0; }
.header .utill-menu>div a { color: rgba(0, 0, 0, 0.58); font-size: 12px; font-weight: 700; line-height: 16px; letter-spacing: -0.05em; text-align: left; }
.header .utill-menu>div a.logout { display: flex; }
.header .utill-menu .login-item { position: relative; align-items: flex-start; margin-left: 16px; color: rgba(0, 0, 0, 0.58); font-size: 12px; font-weight: 700; line-height: 16px; letter-spacing: -0.05em; text-align: left; }
.header .utill-menu .login-item i { margin-left: 3px !important; margin-top: -2px; margin-right: 4px; }
.header .utill-menu .login-item.member i { margin-right: 8px; }
.header .utill-menu .login-item::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: 1px; height: 16px; background-color: #ddd; display: none; margin: auto 0; }

.header .utill-menu .login-item i.ico.header_arrow { position: absolute; top: 4px; right: 4px; display: block; }
.login-item select { width: 100%; background: url(/images/ico_arrow_bottom_2x.png) no-repeat 100% 2px; background-size: 24px 24px !important; padding: 6.5px 0px 6.5px 8px; border-bottom: 1px solid #D8D8D8; font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, .58); }


.utill-menu .childSelect { vertical-align: super; height: 32px; }
.utill-menu .childSelect { top: 1px;}
.utill-menu .childSelect select { position: relative; display: block; width: 100%; height: 30px; line-height: 18px; padding: 0 28px 0 8px; border: none; border-bottom: 1px solid #D8D8D8; border-radius: 0; background: url("/images/ico_arrow_bottom_2x.png") no-repeat right 8px center; background-size: 25px 25px; font-weight: bold; font-size: 12px; color: rgba(0, 0, 0, 0.58); }
.childSelect { width: 160px; margin: 0 0 0 8px; font-size: 12px; color: rgba(0, 0, 0, 0.58); }
.childSelect .select { height: 32px; line-height: 32px; cursor: pointer; }
.childSelect .selectOptions li a { padding: 3px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }



/* 230530 헤더 디자인 변경 */
.header .utill-menu .login-item.member { padding: 6.5px 0px 6.5px 8px; min-width: 120px; max-width: 120px; border-bottom: 1px solid #D8D8D8; cursor: pointer; }
.header .utill-menu .login-item.child { max-width: 160px; min-width: 160px; }
.header .utill-menu .login-item.child>span { position: relative; display: block; max-width: 120px; min-width: 120px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

/* 구분선 */
.header .utill-menu .login-item:nth-child(2)::after { display: none; }
.header .utill-menu .ico.login, .header .utill-menu .ico.member { position: relative; top: -1px; }
.header .utill-menu .ico.member+span { position: relative; top: -2px; }
.header .utill-menu .admin-link a { border-radius: 4px; font-size: 12px; padding: 8px 16px 8px 16px; }
.admin-link i { width: 15px; height: 15px; margin-right: 4px; background: url(/images/front/ico_admin_2x.png) no-repeat center / 15px 15px; margin-top: -1px; }
.header .utill-menu .admin-link span { }
.header .utill-menu .mtalk-link { width: 48px; height: 48px; margin-right: 0; }
.header .utill-menu .mtalk-link .message-count { position: absolute; top: 5px; left: 17px; border-radius: 10px; background-color: var(--theme-color); color: #fff; font-weight: 700; font-size: 11px; padding: 0 8px 0 6px; height: 18px; }
.header .header-wrap.rolldown { position: fixed; top: -120px; left: 0; z-index: 100 }
.header .header-wrap.rolldown.active { top: 0; }

/* 230530 header util 추가 */
.util-toggle { display: none; width: 100%; }
.header .utill-menu .member.login-item .util-toggle { position: absolute; right: 0px; top: 0px; }
.util-toggle .round-box { background: #fff; padding: 14px 8px; border-radius: 4px; width: 100%; border: 1px solid #d8d8d8; margin-top: 40px; }
.util-toggle .round-box div:first-child { margin-bottom: 7px; }
.header .utill-menu .login-item.child .util-toggle .round-box div { max-width:100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin-bottom: 7px !important; }
.header .utill-menu .login-item.child .util-toggle .round-box div:last-child { margin-bottom: 0px !important; }
.header-logo { width: 158px; }

 .childSelect { width: 160px; margin-left: 8px; font-size: 12px; color: rgba(0, 0, 0, 0.58); }
 .childSelect .select { height: 32px; line-height: 32px; cursor: pointer; }
 .childSelect .selectOptions li a { padding: 3px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

 .header-notice { position: relative; top: 2px; display: inline-block; margin-left: 35px; }
 .header-notice span { position: absolute; top: -6px; right: -8px; display: block; height: 18px; line-height: 18px; padding: 0 6px; background-color: #383838; background-color: var(--theme-color); border-radius: 10px; color: #fff; text-align: center; font-weight: bold; font-size: 12px; }

 .header-member { width: 106px; font-size: 12px; color: rgba(0, 0, 0, 0.58); }
 .header-member .select { height: 32px; line-height: 30px; padding: 0 26px 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; }

 .gnb-area { position: relative; z-index: 9; height: 64px; border-bottom: 1px solid #d8d8d8; transition: all 0.2s ease-in-out; }
 .gnb-wrap { position: relative; display: flex; align-items: center; height: 100%; }
 .gnb-wrap .categoryBtn { position: absolute; top: 20px; left: 0; display: flex; align-items: center; transition: 0.2s; }
 .gnb-wrap .categoryBtn i { display: inline-block; width: 16px; height: 8px; display: flex; justify-content: center; align-items: center }
 .gnb-wrap .categoryBtn span { margin-left: 8px; font-weight: bold; font-size: 14px; letter-spacing: -1px; color: rgba(0, 0, 0, 0.78); }
 .gnb-wrap .categoryBtn:hover i { fill: var(--theme-color) }
 .gnb-wrap .categoryBtn:hover span { color: #383838; color: var(--theme-color); }
 .gnb-wrap .orderBtn { position:relative; display: flex; justify-content: center; align-items: center; transition: 0.2s; padding-left:40px; transition: all 0.3s ease-in-out; }
 .gnb-wrap .orderBtn.active svg {fill:var(--theme-color);}
 .gnb-wrap .orderBtn:hover svg {fill:var(--theme-color);}
 .gnb-wrap .orderBtn.active svg>*:first-child { stroke: var(--theme-color) !important; }
 .gnb-wrap .orderBtn:hover svg>*:first-child { stroke: var(--theme-color) !important; }
 .gnb-wrap .orderBtn.active svg>* { stroke: #fff; }
 .gnb-wrap .orderBtn:hover svg>* { stroke: #fff; }
 .gnb-wrap .orderBtn span { margin-left: 6px; font-weight: bold; font-size: 14px; color: rgba(0, 0, 0, 0.58); }
 .gnb-wrap .orderBtn.active span { color: var(--theme-color);}
 .gnb-wrap .orderBtn:hover span { color: var(--theme-color); }
 .gnb-wrap .orderBtn:before { display: block; content: ''; position: absolute; top: 50%; left: 0; margin-top: -4px; width: 1px; height: 8px; background-color: #D8D8D8;}

 .gnb { display: block; margin-left: 110px; line-height: 64px; }
 .gnb::before { display: block; content: ''; position: absolute; top: 50%; margin-top: -4px; width: 1px; height: 8px; background-color: #D8D8D8; }
 .gnb .gnb-menu { position: relative; padding: 0 20px; z-index: 1; }

 .gnb .gnb-menu li { position: relative; display: inline-block; padding: 0px 20px; }
 .gnb .gnb-menu li a { position: relative; display: flex; justify-content: center; align-items: center; height: 100%; padding: 0 1px; font-weight: 500; text-align: center; z-index: 1; }

 .gnb .gnb-menu li a span { position: relative; z-index: 1;}
 .gnb .gnb-menu li a p { position: absolute; opacity: 0; left: 0; z-index: 1; font-weight: 700; }
 .gnb .gnb-menu li a.gnb_menu_fac:hover span { opacity: 0; }
 .gnb .gnb-menu li a:hover p { opacity: 1; }
 .gnb .gnb-menu li a.gnb_menu_fac.active span { opacity: 0; }
 .gnb .gnb-menu li a.active p { opacity: 1; }

 .gnb .gnb-menu li:hover .gnb-depth2-pos { display:block; }
 .gnb .gnb-menu .gnb-depth2-pos { position: absolute; top: 0px; left: 50%; transform: translate(-50%); display: none; min-width: 110px; padding-top: 52px;}
 .gnb .gnb-menu .gnb-depth2 { border: 1px solid #d8d8d8; background: #fff; padding: 12px; border-radius: 8px; white-space:nowrap;}
 .gnb .gnb-menu .gnb-depth2 li { position: relative; display: block; text-align: center; line-height: 1.2; padding: 0; border-radius:4px; margin-bottom:4px; overflow: hidden; }

 .gnb .gnb-menu .gnb-depth2 li a { display: flex; justify-content: flex-start;  line-height: 1.2; font-size: 13px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; padding: 8px 12px 8px 4px; min-width: 103px; }
 .gnb .gnb-menu .gnb-depth2 li a:hover { color:var(--theme-color); background: #0000000D; }
 .gnb .gnb-menu .gnb-depth2 li a::before { content: ''; position: relative; width: 4px; height: 4px; background-color: #000; border-radius: 50%; margin: 0 6px; }
 .gnb .gnb-menu .gnb-depth2 li a:hover::before{ background :var(--theme-color); }
 .gnb .gnb-menu .gnb-depth2 li a:active  { background :var(--theme-color); color: #fff; }
 .gnb .gnb-menu .gnb-depth2 li a:active::before { background: #fff; }

 .gnb .gnb-menu .gnb-depth2 li a.active { background :var(--theme-color); color: #fff; }
 .gnb .gnb-menu .gnb-depth2 li a.active::before { background: #fff; }
 .gnb-bar { display: block; position: absolute; top: 34px; width: 0; height: 10px; background-color: #383838; background-color: var(--theme-color); opacity: 0.35; transition: all 0.3s ease-in-out }

 .header-area.scrollEvent { position: absolute; top: 0; width: 100%; }
 .gnb-area.scrollEvent { position: absolute; top: -65px !important; width: 100%; }
 .gnb-area.fixed { position: fixed; top: 0; left: 0; display: block; width: 100%; background: #fff; }
 .gnb-area.fixed.ex { top: 86px !important; }

 /* } header (엠몰참조) :: 230811 */

/* side banner */
.quick-list>li { position: relative; margin-bottom: 4px; }
.quick-list>li:last-child { margin-bottom: 0; }
.quick-list>li>a { display: block; padding: 12px 0 6px; border-radius: 8px; background-color: #fff; transition: 0.2s; transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1); overflow: hidden; }
.quick-list>li>a:after { display: block; content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; border: 1px solid #D8D8D8; border-radius: 8px; }
.quick-list>li>a:hover { background-color: #f5f5f5; }
.quick-list i { display: block; margin: 0 auto 5px; }
.quick-list .quick-piggymom span { display: block; font-weight: bold; font-size: 13px; }
.quick-list .quick-piggymom span:last-child { color: rgba(0, 0, 0, 0.38); }
.quick-piggymom a i { width: 29px; height: 22px; background: url("/images/ico_quick_img1_2x.png") no-repeat center; background-size: 28px 21px; }
.quick-reservation a i { width: 26px; height: 22px; background: url("/images/ico_quick_img2.png") no-repeat center; }
.quick-bookmall a i { width: 18px; height: 23px; background: url("/images/ico_quick_img3.png") no-repeat center; }
.quick-talk i { width: 24px; height: 24px; background: url("/images/ico_quick_talk_2x.png") no-repeat center; background-size: 24px 24px; }
.quick-scholarship a i { width: 22px; height: 22px; background: url("/images/ico_quick_scholarship_2x.png") no-repeat center; background-size: 22px 22px; }
.quick-piggymall a i { width: 28px; height: 19px; background: url("/images/ico_piggy_mall_2x.png") no-repeat center / 28px 19px; }
.quick-link:not(.quick-piggymom) span { font-weight: bold; font-size: 13px; color: rgba(0, 0, 0, 0.58); }
.quick-menu .cnt { position: absolute; top: 6px; right: 40px; display: inline-block; height: 18px; line-height: 18px; padding: 0 6px; font-weight: bold; font-size: 11px; color: #FFF; text-align: center; background-color: #383838; background-color: var(--theme-color); border-radius: 10px; }
.page-top { transition: 0.2s; transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1); }
.page-top:hover button { background-color: #f5f5f5; }
.page-top button { display: block; width: 100%; height: 24px; margin: 0 auto; border: 1px solid #D8D8D8; border-radius: 8px; background-color: #fff; transition: 0.2s; transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1); }
.page-top span { padding-right: 16px; background: url("/images/ico_pageTop.png") no-repeat right center; font-weight: bold; font-size: 12px; color: rgba(0, 0, 0, 0.58); }
.quick-list>.quick-banner-last { margin-bottom: 16px; }
.quick-list>.quick-banner-last::after { display: block; content: ''; position: absolute; bottom: -9px; left: 32px; width: 64px; height: 1px; background: #eee; }
.quick-list>.quick_banner a { display: table; padding: 0; }
.quick-list>.quick_banner img { display: table-row; width: 128px; height: auto; }

/* 메인 배너 */
.main-banner { position: relative; overflow: hidden; margin: 0 auto; max-width: 1920px; }
.main-banner .inner { height: 100%; }
.main-banner .mo-banner {display: none;}
.swiper-banner { height: 100%; overflow: visible; }
.swiper-banner-wrapper { height: 100%; }
.swiper-factor { max-width: 1200px; }
.slide-factor { position: relative; display: flex; justify-content: space-between; align-items: center; height: 100%; }
.slide-factor .slide-factor-pos { position: relative; display: flex; justify-content: flex-start; align-items: center; width: 1232px; margin: 0 auto; }
.slide-factor img { object-fit: cover; width: 100%; height: 100%; position: relative; display: block; margin: 0 auto; }
.swiper-factor-left { width: 50%; padding-left: 20px; }
.swiper-factor-left span { display: inline-flex; justify-content: flex-start; align-items: center; font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: left; border: 1px solid rgba(0, 0, 0, .12); padding: 4px 8px; border-radius: 4px; margin-bottom: 8px; }
.swiper-factor-left span i.ico { margin-right: 4px; }
.swiper-factor-left h3 { font-size: 40px; font-weight: 700; line-height: 1.2; letter-spacing: -2px; text-align: left; margin-bottom: 8px; color: rgba(0, 0, 0, .78); }
.swiper-factor-left p { font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, .38); }

.main-banner-pos { position: absolute; width: 1200px; bottom: 0; left: 50%; transform: translateX(-50%); display: block; z-index: 9; }
.main-banner-btn { position:absolute; bottom: -1px; right: 16px; display: flex; justify-content: center; align-items: center; background: #fff; border: 1px solid #d8d8d8; border-bottom: none; border-radius: 16px 16px 0px 0px; padding: 8px 16px; z-index: 9; }
.main-banner-pagination { display: flex; justify-content: space-around; align-items: center; width: inherit; font-size: 14px; font-weight: 400; line-height: 22px; letter-spacing: 0px; text-align: left; }
.swiper-pagination-current { margin-right: 5px; font-style:normal; font-size: 14px; font-weight: 700; line-height: 22px; letter-spacing: -1px; text-align: left; color:rgba(0, 0, 0, 0.58); }
.swiper-pagination-total { margin-left:5px; font-style:normal; font-size: 14px; font-weight: 400; line-height: 22px; letter-spacing: 0px; text-align: left; color: rgba(0, 0, 0, .30); }
.swiper-banner-pn { display: flex; justify-content: center; align-items: center; margin: 0 20px; }
.swiper-banner-pn>a { width: 14px; height: 18px; }
.swiper-banner-pn>a>img { width: 100%; height: 100%; object-fit: contain; }
.swiper-banner-prev { position: relative; margin-right: 25px; }
.swiper-banner-prev::after { content:''; position: absolute; top: 4px; left: 26px; width: 1px; height: 10px; background: rgba(0, 0, 0, 0.2); }
.swiper-banner-stop div { width: 32px; height: 32px; background: url('/images/swiper-stop.png') no-repeat center / 24px 24px; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 8px; }
.swiper-banner-stop.swiper-banner-start div { width: 32px; height: 32px; background: url('/images/swiper-start.png') no-repeat 11px / 11px 13px; }

/* 퀵메뉴 스크롤 이벤트 */
.quick-menu.scrolldown { position: fixed; top: 32px; }
.quick-menu.scrollup { position: fixed; top: 112px; }

/* 언더라인 */
.paging .paging-num .now-num,
.paging .paging-num .last-num { display: none; }

/* 페이징 */
.paging-box { display: flex; justify-content: center; align-items: center; }
.paging-box>span { margin: 0 16px; color: rgba(0, 0, 0, 0.58); }
.paging-box span.slash { margin: 0 8px; }
.paging-box span.current { color: rgba(0, 0, 0, 0.78); font-weight: 700; }
.paging-box .btn { width: 48px; height: 48px; padding: 0; border-radius: 8px; background: url(/images/ico_arrow_prev_page_default_2x.png) no-repeat center / 9px 14px; border: 1px solid #ddd; }
.paging-box .btn.next { background-image: url(/images/ico_arrow_next_page_default_2x.png); }
.paging-box .btn.prev { background-image: url(/images/ico_arrow_prev_page_default_2x.png); }
.paging-box .btn.active { border: none; background-color: var(--theme-color); }
.paging-box .btn.active.next { background-image: url(/images/ico_arrow_next_page_active_2x.png); }
.paging-box .btn.active.prev { background-image: url(/images/ico_arrow_prev_page_active_2x.png); }

/* 페이징 스타일 */
.pagination-wrap { font-family: 'Noto Sans KR'; font-weight: normal; text-align: center; }
.paging button.first-btn { width: 30px; height: 46px; background: url("/images/ico_page2_arrow_prev_2x.png") no-repeat center; background-size: 15px 14px; opacity: 0.3; }
.paging button.prev-btn { width: 30px; height: 46px; background: url("/images/ico_page2_arrow_left_2x.png") no-repeat center; background-size: 9px 14px; }
.paging button.next-btn { width: 30px; height: 46px; background: url("/images/ico_page2_arrow_right_2x.png") no-repeat center; background-size: 9px 14px; }
.paging button.last-btn { width: 30px; height: 46px; background: url("/images/ico_page2_arrow_next_2x.png") no-repeat center; background-size: 15px 14px; opacity: 0.3; }
.paging button span { display: inline-block; font-size: 0; text-indent: -999px; }
.paging .paging-num { display: inline-block; margin: 0 12px; vertical-align: middle; }
.paging .paging-num .page { display: inline-block; width: 30px; height: 46px; line-height: 46px; font-size: 14px; color: rgba(0, 0, 0, 0.58); cursor: pointer; }
.paging .paging-num .page.active,
.paging .paging-num .page:hover { font-weight: 700; color: #383838; color: var(--theme-color); }
.paging .paging-num .page.active { position: relative; }
.paging .paging-num .page.active::after { content: ""; position: absolute; bottom: 12px; width: 9px; height: 1px; background-color: var(--theme-color); display: block; left: 50%; transform: translateX(-50%); }

/* tab */
/* tab - round type */
.tab-round .tab-list { display: flex; justify-content: center; }
.tab-round .tab-list li { display: flex; }
.tab-round .tab-list li a { text-align: center; padding: 7px 26px 9px; font-size: 16px; font-weight: 700; color: rgba(0, 0, 0, 0.3); letter-spacing: 1px; border-radius: 32px; transition: all 0.3s; }
.tab-round .tab-list li a:hover { color: var(--theme-color); }
.tab-round.square .tab-list li a.active { background:var(--theme-color); color:#fff; }
.tab-round .tab-list li a.active { border: 1px solid var(--theme-color); background:#fff; color: var(--theme-color); }
.tab-round .tab-list li a .go { display: none; margin-right: 4px; }
.tab-round .tab-list li a.active .go { display: inline-block; }

/* tab - round square type */
.tab-round.square .tab-list li a { border: 1px solid #ddd; border-radius: 0; overflow: hidden; width: 200px; letter-spacing: -1px; }
.tab-round.square .tab-list li:first-child a { border-radius: 8px 0 0 8px; border-right: none; }
.tab-round.square .tab-list li:last-child a { border-radius: 0 8px 8px 0; border-left: 0; }

/* input */
.select-box .select { height: 32px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; width: 100%; border: 1px solid #ddd; border-radius: 4px; padding: 0 8px; padding-right: 28px; line-height: 30px; background: url(/images/ico_select_arrow_2x.png) no-repeat right 8px center / 12px 8px; font-size: 13px; color: rgba(0, 0, 0, 0.78); font-weight: 700; letter-spacing: -1px; opacity: 1; }
.select-box select:focus { border: 1px solid #bbb; }
.select-box.small .select { padding-right: 22px; }
.select-box .options { margin-top: 4px; border: 1px solid #ddd; border-radius: 4px; position: absolute; padding: 4px 0; min-width: 124px; white-space: nowrap; box-shadow: 0px 0px 1px 0px rgba(68, 68, 68, 0.212), 0px 4px 12px 0px rgba(68, 68, 68, 0.122); display: none; background-color: #fff; z-index: 10; text-align: left; }
.select-box .options.small { min-width: 58px; }
.select-box .select.active+.options { display: block; }
.select-box .options:first-child a { padding-top: 0; }
.select-box .options:last-child a { padding-bottom: 0; }
.select-box .options .option a,
.select-box option { padding: 4px 8px; font-size: 13px; color: rgba(0, 0, 0, 0.58); }
input[type=text] { border-color: #ddd; }
.select-box select:disabled,
.select-box .select:disabled { color: rgba(0, 0, 0, 0.58); background-color: #f7f7f7; }

input[type=text]:disabled { background-color: #f7f7f7; }
.select.readonly { background-color: #f7f7f7; }
input[type=text]:read-only { background-color: #f7f7f7; font-size: 14px; font-weight: 700; line-height: 1.6; letter-spacing: -0.05em; }
textarea.read-only { background-color: #F5F5F5; }

.finished input[type=text]:read-only,
.finished.select.readonly,
.finished input[type=text]:disabled { background-color: transparent; }

.finished .select-box select:disabled,
.finished .select-box .select:disabled { background-color: transparent; }

/* mobile-menu */
.sideMenu-btn { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; flex-direction: column; display: none; }
.sideMenu-btn .line { width: 24px; height: 3px; border-radius: 2px; background-color: #000; margin-top: 4px; }
.sideMenu-btn .line:first-child { margin-top: 0; }

/* mobile-menu */
#sideMenu { position: fixed; right: -100%; top: 0; width: 100%; height: 100%; background-color: #fff; transition: all ease 0.5s; -webkit-transition: all ease 0.5s; -moz-transition: all ease 0.5s; overflow-y: auto; z-index: 99999; }
#sideMenu.mm-open { right: 0; }
.sideMenu-home { position: absolute; top: 23px; right: 52px; display: block; width: 28px; height: 28px; background: url("/images/ico_home_2x.png") no-repeat center; background-size: 28px 28px; font-size: 0; text-indent: -999px; }
.sideMenu-close { position: absolute; top: 25px; right: 13px; display: block; width: 28px; height: 28px; background: url("/images/ico_m_close_2x.png") no-repeat center; background-size: 28px 28px; font-size: 0; text-indent: -999px; }
.lnb-member { display: flex; padding: 24px 16px; border-bottom: 1px solid #D8D8D8; }
.lnb-member>p { display: flex; align-items: center; font-size: 14px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; }
.lnb-member>p a { font-weight: bold; border-bottom: 1px solid rgba(0, 0, 0, 0.78); font-size: 14px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; }
.lnb-member>p span { text-decoration: underline; text-underline-position : under; font-weight: 700; line-height: 1.6; letter-spacing: -1px; }
.lnb-member>a { margin-left: 4px; font-size: 12px; padding: 6px 8px; font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; }
.lnb-menu .gnb-depth1>li>a.admin-link { border-top: 10px solid #f5f5f5; position: relative; }
.lnb-menu .gnb-depth1>li>a.admin-link::after { content: ""; position: absolute; left: 0; top: -11px; width: 100%; height: 1px; background-color: #ddd; display: block; }
.lnb-menu>.gnb-depth1::after { display: block; content: ''; clear: both; }
.lnb-menu .gnb-depth1>li { position: relative; cursor: pointer; }
.lnb-menu .gnb-depth1>li .menu-tgl-button { position: absolute; top: 16px; right: 16px; width: 18px; height: 18px; background: url("/images/ico_depth1_close_2x.png") no-repeat center; background-size: 10px 7px; font-size: 0; }
.lnb-menu .gnb-depth1>li .menu-tgl-button.active { background-image: url("/images/ico_depth1_open_2x.png"); }
.lnb-menu .gnb-depth1>li>a { display: block; padding: 16px; color: rgba(0, 0, 0, 0.58); border-bottom: 1px solid #eee; font-weight: 700; }
.lnb-menu .gnb-depth1>li>a.active,
.lnb-menu .gnb-depth1>li>a:hover { color: #383838; color: var(--theme-color); }

.lnb-menu .gnb-depth2 { display: none; background: #f5f5f5; }
.lnb-menu .gnb-depth1>li a.active+.gnb-depth2 { display: block; }
.lnb-menu .gnb-depth2>li { position: relative; }
.lnb-menu .gnb-depth2>li .menu-tgl-button { position: absolute; top: 19px; right: 17px; width: 16px; height: 16px; background: url("/images/ico_depth2_close_2x.png") no-repeat center; background-size: 8px 6px; font-size: 0; }
.lnb-menu .gnb-depth2>li .menu-tgl-button.active { background-image: url("/images/ico_depth2_open_2x.png"); }
.lnb-menu .gnb-depth2>li:last-child { margin-bottom: 0; }
.lnb-menu .gnb-depth2>li>a { display: block; line-height: 22px; color: rgba(0, 0, 0, 0.78); padding: 16px }
.lnb-menu .gnb-depth2>li>a.active,
.lnb-menu .gnb-depth2>li>a:hover { color: #383838; color: var(--theme-color); }
.lnb-menu .gnb-depth2>li>a+.gnb-depth3 { margin-top: 16px; padding-left: 32px; }
.lnb-menu .gnb-depth2>li>a.active+.gnb-depth3 { display: block; }
.lnb-menu .gnb-depth3 { display: none; }
.lnb-menu .gnb-depth3.active { display: block; }
.lnb-menu .gnb-depth3>li { margin-bottom: 8px; }
.lnb-menu .gnb-depth3>li:last-child { margin-bottom: 0; }
.lnb-menu .gnb-depth2>li:last-child .gnb-depth3 { margin-bottom: 16px; }
.lnb-menu .gnb-depth3>li>a { display: block; line-height: 20px; font-size: 13px; color: rgba(0, 0, 0, 0.58); font-weight: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lnb-menu .gnb-depth3>li>a.active,
.lnb-menu .gnb-depth3>li>a:hover { color: #383838; color: var(--theme-color); font-weight: bold; }
.lnb-menu > .gnb-depth1 > li > a::after { content: ''; position: absolute; top: 25px; 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-util { padding: 16px 0px; border-bottom: 1px solid #dbdbdb; }
.lnb-util-btn { display: flex; flex-direction: row; justify-content: space-between; padding: 0 12px; }
.lnb-util-btn button { display: flex; align-items: center; justify-content: center; width: 50%; height: 54px; margin: 0 4px; font-weight: bold; border-radius: 8px; font-size: 14px; font-weight: 700; line-height: 1.6; }
.lnb-util-btn button i { margin-right: 8px; }

.lnb-my-lec { padding: 16px; }
.lnb-my-lec-btn { position: relative; display: flex; justify-content: flex-start; align-items: center; border: 2px solid #222; font-size: 14px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; width: 100%; padding: 16px; border-radius: 8px; }
.lnb-my-lec-btn::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-my-lec-btn i { margin-right: 8px; }
.lnb-my-lec-btn svg { margin-right:8px; }
.lnb-my-lec-btn:hover {border: 2px solid var(--theme-color);}
.lnb-my-lec-btn:hover .lnb-my-lec-text {color:var(--theme-color);}
.lnb-my-lec-btn:hover svg {fill:var(--theme-color);}
.lnb-my-lec-btn:hover svg>*:first-child { stroke: var(--theme-color) !important; }
.lnb-my-lec-btn:hover svg>* { stroke: #fff; }
.lnb-my-lec-btn>div {display:flex; justify-content: flex-start; align-items: center;}

.m-quick_banner { display: flex; flex-wrap: wrap; padding: 16px 12px; }
.m-quick_banner>li { margin: 0 4px 8px 4px; display: flex; }
.m-quick_banner>li>a { display: block; width: 128px; height: 64px; border: 1px solid #D8D8D8; border-radius: 8px; background-color: #fff; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.m-quick_banner>li>a i { height: 22px; }
.m-quick_banner>li>a img { width: 126px; height: auto; object-fit: cover; }
.m-quick_banner span { margin-top: 4px; }

/* 230518 추가 :: 고객센터 */
/* 페이지 컨텐츠 */
.container.page .page-inner { max-width: 1400px; margin: 0 auto; padding: 0 16px; }
.container.page .sub-cont-title { display: none; }
.container.page .inner { max-width: 1232px; padding: 0 16px; }
.container.page .inner .tab { max-width: 1232px; margin: 0 auto; overflow-x: scroll; margin-bottom: 14px; position: relative; padding: 0 16px; padding-right: 16px; }
.board-wrap.faq .inner { padding: 0; }
.container.page .inner .tab::-webkit-scrollbar { width: 1px; height: 4px; }
.container.page .inner .tab::-webkit-scrollbar-track { background-color: #f8f8f8; }
.container.page .inner .tab::-webkit-scrollbar-thumb { border-radius: 3px; background-color: var(--theme-color); }
.container.page .inner .tab::-webkit-scrollbar-button { width: 2px; height: 2px; }

/* 서브 페이지 */
.sub-cont { position: relative; }
.sub-cont-title { margin-bottom: 16px; font-weight: bold; font-size: 24px; line-height: 120%; color: #000; }
.page-view-wrap { margin-top: 16px; }

/* 1:1 문의 */
.sub-inquiry-list .tab-list-btn li { width: 50%; }
.inquiry-tab { padding-bottom: 16px; border-bottom: 2px solid #222; }
.inquiry-content { display: none; }
.inquiry-content.current { display: block; }
.inquiry-content button { font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; }
.inquiry-form .form-list>li { margin-bottom: 32px; }
.inquiry-form .form-list>li:last-child { margin-bottom: 0; }
.inquiry-form .form-list>li.marb { margin-bottom: 16px; }
.inquiry-form textarea { height: 200px; font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; resize: none; padding: 8px 14px; }
.inquiry-form textarea::placeholder { font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; }
.my-inquiry-list { margin-bottom: 16px; }
.my-inquiry-list li { border-bottom: 1px solid #eee; }
.my-inquiry-list li a { display: flex; padding: 24px 0; }
.my-inquiry-list li:hover h4 { text-decoration: underline; }
.my-inquiry-list .status { display: inline-block; font-weight: bold; font-size: 16px; line-height: 120%; color: rgba(0, 0, 0, 0.38); vertical-align: top; }
.my-inquiry-list .status.complete { color: #383838; color: var(--theme-color); }
.my-inquiry-list h4 { display: inline-block; flex:1; margin-left: 4px; font-weight: bold; font-size: 16px; line-height: 120%; vertical-align: top; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.my-inquiry-list .date { font-size: 12px; color: rgba(0, 0, 0, 0.38); }

.list-more .btn span { font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: 0em; }


/* mswitch modal */
.modal-wrap { position: fixed; top: 0; left: 0; width: 100%; height: 100%; text-align: center; background-color: rgba(0, 0, 0, 0.5); z-index: 9999; }
.modal-wrap::after { display: inline-block; content: ''; width: 0; height: 100%; vertical-align: middle; }
.modal-wrap .modal-content-box { 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; z-index: 9; cursor: default; }
.modal-wrap .modal-title { position: relative; display: flex; justify-content: space-between; align-items: center; height: 51px; border-bottom: 2px solid #222; padding-bottom: 16px; }
.modal-wrap .modal-title h2 { display: inline-block; font-weight: bold; font-size: 24px; line-height: 120%; color: #000; line-height: 51px; }
.modal-close { display: block; width: 32px; height: 32px; background: url("/images/ico_close_2x.png") no-repeat center; background-size: 16px 16px !important; }
.modal-cont textarea { width: 100%; min-height: 308px; margin-bottom: 12px; }
.modal-bg { display: none !important; position: fixed; left: 0; top: 0; bottom: 0; width: 100%; background: #000; opacity: 0.5; z-index: 9998; }
.modal-cont { position: relative; }
.modal-cont::after { display: block; content: ''; clear: both; }
.modal-cont .modal-left { position: relative; float: left; width: 50%; padding-right: 32px; }
.modal-cont .modal-right { position: relative; float: right; width: 50%; padding-left: 32px; }
.modal-cont h3 { margin-bottom: 10px; font-weight: bold; font-size: 20px; color: #000; }
.modal-cont .question-wrap { padding: 0 16px; }
.modal-inquiry .modal-content-box { max-width: 684px; }
.modal-inquiry .inquiry-question { padding: 16px 0 20px; border-bottom: 2px solid #eee; }
.modal-inquiry .inquiry-question .text { font-weight: 400; line-height: 22px; }
.modal-inquiry .inquiry-question .status { display: inline-block; font-weight: bold; font-size: 16px; line-height: 120%; color: rgba(0, 0, 0, 0.38); }
.modal-inquiry .inquiry-question .status.complete { color: #000; color: var(--theme-color); }
.modal-inquiry .inquiry-question h4 { display: inline-block; margin-left: 4px; font-weight: bold; font-size: 16px; line-height: 120%; }
.modal-inquiry .inquiry-question .date, .modal-inquiry .inquiry-answer .writer span { display: block; margin: 8px 0; font-size: 12px; color: rgba(0, 0, 0, 0.38); font-weight: 400; }
.modal-inquiry .inquiry-question .date, .modal-inquiry .inquiry-answer .text { font-weight: 400; line-height: 22px; }
.modal-inquiry .inquiry-answer { padding: 20px 0; border-bottom: 2px solid #eee; }
.modal-inquiry .inquiry-answer .writer strong { font-size: 12px; font-weight: 800; }

.modal-qr { padding: 8px 16px 42px; display: flex; flex-direction: column; align-items: center; box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, .10); border-radius: 0 0 8px 8px; }
.modal-qr>span { padding-bottom: 8px; font-size: 13px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: left; }
.modal-qr>p { font-size: 13px; font-weight: 400; line-height: 1.8; letter-spacing: -1px; margin-bottom: 16px; }
.modal-qr>strong { position: relative; display: block;color : #fa2828; text-align: center; }

.modal-pay.modal-content-box { max-width:368px; padding: 59px 0; }
.modal-pay .modal-cont { padding: 0px 16px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.modal-pay span { position: relative; display: block; font-size: 20px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; padding: 14px 0; color: rgba(0, 0, 0, .78); }
.modal-pay p { display: block; margin-bottom: 14px; font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; text-align: center; }
.modal-pay button.btn { border: 2px solid var(--theme-color); background-color: #fff; border-radius: 19px; color: var(--theme-color) !important; }
.modal-pay button.btn:hover { background-color: var(--theme-color); color: #fff !important; }

.alert-modal-wrap {position: absolute;width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,0.2); z-index: 1000; }
.alert-modal-wrap .modal-inner {position: relative;height: 100%;margin: 0 auto;}
.alert-modal-wrap .modal-content {position: absolute;top:50%;left: 0;right: 0;transform: translateY(-50%);max-width: 87%;width: 540px;height: 90%;max-height: 207px;border-radius: 18px;overflow: hidden;margin: 0 auto;background: #fff;display: flex;flex-direction: column;}
.alert-modal-wrap .modal-content .cont-area {display: flex;align-items: center;justify-content: center;text-align: center;flex-direction: column;flex-grow: 1;padding: 8px 12px;}
.alert-modal-wrap .modal-content .cont-area .sub-title {margin-bottom: 4px;font-size: 16px;}
.alert-modal-wrap .modal-content .cont-area .title {font-size: 18px;}
.alert-modal-wrap .modal-content .btn-area {height: 68px;display: flex;align-items: center;justify-content: center;text-align: center;}
.alert-modal-wrap .modal-content .btn-area button {display: block;width: 100%;height: 100%;font-size: 16px;font-weight: 700;}
.alert-modal-wrap .modal-content .btn-area .btn-contirm {position:relative;color: var(--theme-color);}
.alert-modal-wrap .modal-content .btn-area .btn-contirm::after{display:block;content:'';width:100%;height:100%;position:absolute;top:0;left:0;background: var(--theme-color);opacity:0.2;}
.alert-modal-wrap .modal-content .btn-area .btn-cancel {background-color: #f5f5f5;}


/* tab */
.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; font-size: 14px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; }
.tab-list-btn li a.on,
.tab-list-btn li a:hover { color: #fff; background: #383838; background: var(--theme-color); }

/* 개인정보수정 */
.form-list>li>div { position: relative; display: flex; justify-content: flex-start; }
.form-list>li>div.terms { position: relative; display: block; justify-content: flex-start; }
.form-list b { display: block; margin-bottom: 8px; font-weight: 700; font-size: 12px; color: rgba(0, 0, 0, 0.58); }
.form-list .mb-rank .input-text { line-height: 40px; padding-left: 0; }
.form-list .mb-rank .input-text.disabled { padding: 0 10px; color: rgba(0, 0, 0, 0.78); }
.form-list .mb-name .input-text.disabled { padding: 0 10px; color: rgba(0, 0, 0, 0.38); }
.form-list .input-text { font-weight: bold; padding-left: 8px; }
.form-list .input-text.email { padding-left: 0; }
.form-list .input-text { height: 40px; border-radius: 0; border: none; border-bottom: 1px solid #ededed; vertical-align: middle; }
.form-list .input-text[disabled],
.form-list .input-text.disabled { background: #f7f7f7; color: rgba(0, 0, 0, 0.38); }
.form-list .input-left { flex:1; margin-right: 16px; }
.form-list .phone-input { display:flex; flex: 1; margin-right: 16px; }
.form-list .phone-input::after { display: block; content: ''; clear: both; }
.form-list .phone-input .phone-write { flex:1; margin-right: 2%; }
.form-list .phone-input .phone-write input { color: rgba(0, 0, 0, .50); font-size: 14px; font-weight: 700; line-height: 22px; letter-spacing: -1px; }
.form-list .phone-input .phone-write select { flex:1; border-bottom: 1px solid #ededed; padding-left:8px; color: rgba(0, 0, 0, 0.58); }
.form-list .phone-input .phone-write:last-child { margin-right: 0; }
.form-list .selectBox-2 .select,
.form-list .selectBox .selectOptions { border-color: #ededed; border-top: 1px solid transparent; }
.form-list .selectBox .select span::after { width: 10px; height: 7px; background: url("/images/ico_arrow_bottom_2x.png") no-repeat 0 0; background-size: 10px 6.5px; }
.mb-email div input { margin-right: 16px; flex: 1; font-size: 14px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, .58); }
.mb-email div input::placeholder {color: rgba(0, 0, 0, 0.58);}

.mb-info .mb-terms .terms textarea { width: 100%; height: 225px; margin-top: 10px; padding: 15px; }
.mb-info .mb-terms .terms .privacy { margin-top: 0; }
.mb-info .mb-terms .terms .tbody { overflow-y:scroll; height:120px !important; margin-top:10px; padding:16px; border:1px solid #ddd; border-radius: 8px; display: none; }
.mb-info .mb-terms .terms .tbody.active { display: block; }
.mb-info .mb-terms .checkboxA { width: 100%; } 
.mb-info .mb-terms .checkboxA input + label::before { top: 3px; } 
.mb-info .mb-terms .checkboxA label { float: left; height: auto; } 
.mb-info .mb-terms .checkboxA label span { font-size: 14px; vertical-align: text-bottom; color: rgba(0, 0, 0, .78); } 
.mb-info .mb-terms .checkboxA label span + p { font-size: 14px; display: inline-block; color: rgba(0, 0, 0, .58); vertical-align: middle; margin-left: 4px; font-weight: 400; } 
.mb-info .mb-terms .checkboxA .right { float: right; } 
.mb-info .mb-terms .checkboxA .right .btn-open { width: 20px; height: 20px; background: url(/images/front/ico_open_default.png) no-repeat center / 10px 7px; margin-top: 4px; } 
.mb-info .mb-terms .checkboxA .right .btn-open.active { background-image: url(/images/front/ico_open_active.png); } 
.mb-info .mb-terms .terms input { width: 22px; height: 22px; border: 1px solid #c2c2c2; } 
.mb-info .mb-terms .terms label { font-size: 16px; color: #222; } 

/* skin */
.form-list b { margin-top: 24px; margin-bottom: 3px; font-size: 12px; font-weight: 700; line-height: 19px; letter-spacing: -1px; text-align: left; }

/* common */
/* component */
.selectBox-wrap::after { display: block; content: ''; clear: both; }
.selectBox-wrap>.selectBox:last-child { margin-right: 0; }
.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; }
.selectBoxA { padding: 0 24px 0 8px; border: 1px solid #D8D8D8; border-radius: 4px; background: url("/images/ico_arrowA_2x.png") no-repeat center right 6px; background-size: 12px 8px; color: rgba(0, 0, 0, 0.58); }
.selectBoxB { position: relative; display: block; height: 40px; padding: 0 12px; border: none; border-bottom: 1px solid #D8D8D8; border-radius: 0; font-weight: bold; font-size: 14px; background: url('/images/ico_arrow_bottom_select_2x.png') no-repeat right 7px center; background-size: 11px 7px !important; }
select { cursor: pointer; }

/* form */
.frm-nm { margin-bottom: 3px; font-weight: bold; font-size: 12px; color: rgba(0, 0, 0, 0.58); }
.frm-input { width: 100%; height: 40px; box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.07); }
.frm-input.underLine { border: none; border-radius: 0; }
.checkboxA { position: relative; display: inline-block; }
.checkboxA input { display: none; }
.checkboxA input + label::before { content: ''; position: absolute; left: 0; top: 0; display: inline-block; width: 20px; height: 21px; 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; }
.checkboxA input:checked + label::before { background-image: url('/images/ico_check_2x.png'); background-size: 12.5px 11px; background-color: #383838; background-color: var(--theme-color); background-position: center; }
.checkboxA input[disabled] + label::before { background-color: #F5F5F5; }
.checkboxA label { position: relative; display: block; height: 20px; line-height: 20px; cursor: pointer; }
.checkboxA label span { margin-left: 28px; 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: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 input[disabled] + label::before { background-color: #F5F5F5; }
.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); }

.nodata { position: relative; display: block; border-top: 2px solid #222; padding-top: 40px; padding-bottom: 70px; border-bottom: 1px solid #D8D8D8; }
.nodata i.ico { position: relative; display: block; width: 80px; height: 80px; margin: 0 auto; }
.nodata p { text-align: center; font-size: 14px; font-weight: 500; line-height: 1.4; color: rgba(0, 0, 0, 0.58); word-break: keep-all; }
.selectBoxB:focus,
.selectBoxC:focus { outline: none; }

/* 테이블 게시판(커뮤니티) */
.flag { display: inline-block; vertical-align: middle; }
.flag.new { width: 16px; height: 16px; margin-left: 4px; 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_new_2x.png") no-repeat 0 0; background-size: 18px 18px; border-radius: 2px; }
.flag.notice { display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; padding: 0px 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; }

.htable-wrap { margin-top: 16px; 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: 12%; }
.htable-wrap .thead>ul>li.cell-subject { flex-grow: 1; justify-content: center; width: auto; }
.htable-wrap .thead>ul>li.cell-name { width: 10%; }
.htable-wrap .thead>ul>li.cell-date { width: 10%; }
.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; padding: 14px 0; 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-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: 12%; }
.htable-wrap .tbody>ul>li.cell-cate .cate { word-break: keep-all; }
.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; padding-left: 4px; }
.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: 10%; }
.htable-wrap .tbody>ul>li.cell-name span { }
.htable-wrap .tbody>ul>li.cell-date { flex-shrink: 0; width: 10%; }
.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%; }
.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); }

.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; }

.board-element-wrap { display: flex; flex-direction: column; }
.board-element-wrap .write-box+.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; 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 { height: 32px; margin-right: 6px; padding: 0 30px 0 12px; background-color: #fff; color: rgba(0, 0, 0, 0.78); background-position: center right 10px; }
.input-searchBox { position: relative; width: 320px; height: 36px; background: #FFF; border: 1px solid #D8D8D8; border-radius: 4px; }
.input-searchBox input { width: 100%; height: 36px; padding-right: 60px; border: none; font-weight: normal; }
.input-searchBox button { position: absolute; top: 4px; right: 3px; width: 54px; height: 22px; line-height: 20px; background: #FFF; border: 1px solid #999CA2; border-radius: 4px; font-weight: bold; font-size: 12px; color: #40454E; }

/* 공지사항 게시판 */
.sub-notice-list .sub-cont-title { display: none; }
.board-list-type5 .htable-wrap .thead { display: none; }
.board-list-type5 .htable-wrap .tbody>ul>li.cell-no { width: 0%; display: none; }
.board-list-type5 .htable-wrap .tbody>.bo-notice>li.cell-no { width: inherit; display: block; margin-left: 16px; margin-right: 0; }
.board-list-type5 .htable-wrap .tbody>ul>li.cell-subject { font-size: 16px; }
.board-list-type5 .htable-wrap .tbody>ul>li.cell-subject a { font-size:14px; font-weight: 700; padding-left: 14px; font-weight: 700; line-height: 1.2; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; max-width: 92%; margin-right: 16px; color: rgba(0, 0, 0, .58); }
.board-list-type5 .htable-wrap .tbody>ul:not(.bo-notice)>li.cell-subject a { padding-left: 16px; }
.board-list-type5 .htable-wrap .tbody>ul>li.cell-subject .flag.new { width: 20px; height: 20px; margin-left: 2px; margin-top: -2px; }
.board-list-type5 .htable-wrap .tbody>ul>li.cell-subject a+.flag.new { margin-left: 8px; margin-top: 4px; }
.htable-wrap .tbody>ul>li.cell-date { font-size: 13px; color: rgba(0, 0, 0, 0.38); width: 86px; }
.htable-wrap .tbody>ul>li.cell-date span { display: block; font-size: 13px; font-weight: 400; line-height: 1.5; letter-spacing: -1px; text-align: center; color: rgba(0, 0, 0, .58); }
.htable-wrap .tbody>ul.bo-notice::before { background: #fff; }

/* 공지/이벤트 게시판 */
.sub-notice-event .mirae-brand-sort .search-box { margin-right: 16px; width: 100%; }
.sub-notice-event .sub-cont-title { display: none; }
.sub-notice-event .htable-wrap .tbody>ul:not(.bo-notice)>li.cell-subject a { padding-top: 0; }

/* 마이페이지 및 고객센터 너비 600px */
.sub-inquiry-list,
.sub-member-info,
.sub-notice-list { width: 588px; margin: 0 auto; }
.sub-inquiry-list { margin-top: 24px; }

/* board 더 보기 버튼 */
.board-more-btn { position: relative; display: block; padding-top: 17px; }
.board-more-btn>a { display: flex; justify-content: center; align-items: center; margin: 0 auto; width: 600px; height: 44px; border: 1px solid #D8D8D8; border-radius: 8px; }
.board-more-btn>a>span { font-size: 16px; font-weight: 700; line-height: 1.4; margin-right: 22px; }
.board-more-btn>a>img { width: 12px; height: 7px; }

/* 게시글 없음 */
.fail-masage-box { border-bottom: none; border-bottom: 1px solid #ddd; }
.img-no-post { width: 80px; height: 80px; display: none; }
.ul-table .tbody li.data-none { display: block; height: auto; }

/* 게시판 공통 */
.flag.new { width: 16px; height: 16px; background: url(/images/ico_new_2x.png) no-repeat center; background-size: 8px 10px; background-color: #383838; background-color: var(--theme-color); }
.board-search-wrap { background-color: transparent; border: none; padding: 0; padding-top: 8px; margin-top: 16px; border-top: 1px solid #222; }
.board-search { border-bottom: 1px solid #eee; padding-bottom: 16px; padding-left: 16px; padding-right: 16px; }
.board-search .input-searchBox { background-color: transparent; }
.board-search select { min-width: 82px; line-height: 33px; font-size: 14px; }
.input-searchBox input { height: 27px; }
.input-searchBox input::placeholder { font-size: 14px; }
.input-searchBox button { height: 26px; top: 2px; right: 2px; font-size: 13px; font: we; ight: 400; line-height: 28px; width: 57px; }
.write-box .write-btn-2 { font-weight: 400; line-height: 50px; }

/* 고객센터 */
/* faq common */
.faq-contents { margin: 8px 0 16px; }
.faq-list { background: #FFF; border: 1px solid #EEE; box-shadow: 0px 1px 1px rgba(68, 68, 68, 0.2), 0px 0px 1px rgba(38, 62, 43, 0.21); border-radius: 12px; overflow: hidden; margin-bottom: 32px; }
.faq-list li { display: block; }
.faq-list li:last-child .question { border-bottom: none; }
.faq-list .question { position: relative; display: flex !important; justify-content: flex-start; align-items: center; padding: 24px; border-bottom: 1px solid #eee; background: url("/images/ico_faq_open_2x.png") no-repeat right 33px center; background-size: 20px 11.5px; }
.faq-list .question::before { display: inline-block; content: 'Q.'; font-weight: bold; font-size: 16px; line-height: 120%; color: #383838; color: var(--theme-color); margin-top: -3px; }
.faq-list .question::after { content: ''; position: absolute; top: 41px; display: block; width: 14px; height: 1px; background-color: #383838; background-color: var(--theme-color); }
.faq-list>li.on .question { background: url("/images/ico_faq_close_2x.png") no-repeat right 33px center; background-size: 20px 11.5px; }
.faq-list>li.on .question span,
.faq-list>li:hover .question span { text-decoration: underline; }
.faq-list .question span { display: inline-block; padding: 0 50px 0 22px; font-weight: bold; font-size: 16px; line-height: 120%; color: rgba(0, 0, 0, 0.78); }
.faq-list .answer { position: relative; padding: 24px; background: #F5F5F5; }
.faq-list .answer .text::before { position: absolute; display: inline-block; content: 'A.'; font-weight: bold; font-size: 16px; line-height: 120%; color: #383838; color: var(--theme-color); }
.faq-list .answer .text { display:block; }
.faq-list .answer .text p { position: relative; display: block; padding-left: 32px; }
.faq-list .answer .text p>img { height: initial !important; object-fit: contain; }
.faq-list .t-question,
.faq-list .t-answer { font-weight: bold; font-size: 16px; line-height: 120%; color: #383838; color: var(--theme-color); }
.faq-list .t-question { margin-right: 6px; display: inline-block; vertical-align: middle; }
.faq-list .t-answer { position: absolute; top: 24px; left: 24px; }
.accordion-list .accordion-title { cursor: pointer; }
.accordion-list .accordion-body { display: none; }

/* faq */
.faq-list .answer .text { font-Weight: 400; font-size: 14px; line-height: 1.4; letter-spacing: -1px; color: rgba(0, 0, 0, .58); letter-spacing: 0; }
.faq-list .question::after { top: 39px; left: 25px; width: 16px; background-color: #188D98; display: none; }
.faq-list>li.on .question span { text-decoration: none; position: relative; font-Weight: 700; font-size: 16px; line-height: 1.2; letter-spacing: -1px; }
.faq-list .question span { padding-left: 16px; }
.faq-list>li.on .question { background-size: 18px 9px; }
.faq-list .question { background-size: 18px 9px; position: relative; display: block; }

/* common */
.fail-masage-box { text-align: center; border-bottom: 1px solid #D8D8D8; padding: 60px 0 40px 0; }
.fail-masage-box img { display: inline-block; }
.fail-masage-box p { font-family: 'Noto Sans KR', sans-serif; font-size: 14px; margin-top: 16px; font-weight: 400; color: rgba(0, 0, 0, 0.58); letter-spacing: -1px; }

/* 게시글 없음 */
.fail-masage-box { border-bottom: none; border-bottom: 1px solid #ddd; }
.img-no-post { width: 80px; height: 80px; display: none; }
.img-no-qna { width: 44px; height: 40px; }
.ul-table .tbody li.data-none { display: block; height: auto; }

.tab { max-width: 1232px; margin: 0 auto; overflow-x: scroll; margin-bottom: 14px; position: relative; padding: 0 16px; padding-right: 16px; border-top: 2px solid #222; padding-top: 14px; margin-top: 16px; padding-right:0; }
.tab-type3 { -ms-overflow-style: none; scrollbar-width: none; display: flex; justify-content: flex-start; margin-bottom: 8px; overflow-x: auto; margin-left: -16px; padding-bottom: 8px; }

/* 메뉴 */
.set-menu { margin-top: 46px; }
.set-menu .depth-wrap ul { display: flex; }
.set-menu .depth-wrap ul li { }
.set-menu .depth2-wrap { background-color: #fff; margin-bottom: 32px; }
.set-menu .depth2-wrap ul li { width: 100%; border-bottom: 1px solid #d9d9d9; }
.set-menu .depth2-wrap ul li a { font-size: 14px; line-height: 1.4; font-weight: 700; position: relative; color: rgba(0, 0, 0, 0.30); /* transition: all 0.3s; */
 text-align: center; }
.set-menu .depth2-wrap ul li a span { position: relative; display: inline-block; padding-bottom: 10px; width: 100%; }
.set-menu .depth2-wrap ul li a.active,
.set-menu .depth2-wrap ul li:hover a { font-weight: 700; color: #4B80B0; border-bottom: 3px solid var(--theme-color); }

/* 밑줄 */
.set-menu .depth2-wrap.depth-mini ul li a.active span::after { width: 148px; }

/* 2차메뉴 활성화 */
.set-menu .depth2-wrap .scroll.sticky { position: fixed; left: 0; top: 0; width: 100%; z-index: 100; box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.12); z-index: 100; transition: all 0.3s; background-color: #fff; }
.set-menu .depth2-wrap .scroll.sticky .sticky-inner { max-width: 1232px; padding: 0 16px; margin: 0 auto; position: relative; }
.set-menu .depth2-wrap .scroll.sticky ul { }
.set-menu .depth2-wrap .scroll.sticky ul li { border-bottom: none; }
.set-menu .depth2-wrap .scroll.sticky ul li a { padding-top: 24px; height: 64px; }
.set-menu .depth2-wrap .scroll.sticky.scrollup { top: 71px; }
.set-menu .depth2-wrap .scroll.sticky .gnb-bar { top: 60px; }
.set-menu .depth3-wrap ul { display: flex; flex-wrap: wrap; margin-top: 16px; }
.set-menu .depth3-wrap ul li { margin-right: 16px; margin-bottom: 16px; }
.set-menu .depth3-wrap ul li a { font-size: 14px; line-height: 1.6; display: flex; justify-content: center; align-items: center; padding: 12px 28px; border-radius: 8px; font-weight: 400; color: rgba(0, 0, 0, 0.38); transition: all 0.3s; position: relative; overflow: hidden; border: 1px solid #ddd; }
.set-menu .depth3-wrap ul li a::before { content: ""; position: absolute; display: none; right: 0; top: 0; width: 10px; height: 10px; background-color: #F5F5F5; border-radius: 50%; transition: transform 1.2s, opacity 0.3s; opacity: 0; }

/* 호버 요소 */
.set-menu .depth3-wrap ul li a.active::before { display: none; }
.set-menu .depth3-wrap ul li a.active { background-color: #47C2CB; border: 1px solid #47C2CB; color: #fff; font-weight: 700; letter-spacing: -1px; }
.set-menu .depth3-wrap ul li a:hover::before { /* width: 300px; height: 300px; */
 transform: scale(100); opacity: 1; }
.set-menu .depth3-wrap ul li a span { position: relative; z-index: 10; }
.tab-type3 { -ms-overflow-style: none; /* IE and Edge */
 scrollbar-width: none; overflow-x: auto; display: flex; }

/* Firefox */
.tab::-webkit-scrollbar { display: none; }
.tab-type3>li { margin-right: 4px; margin-bottom: 4px; flex: none; }
.tab-type3>li:last-child { margin-right: 0; }
.tab-type3>li>a { display: block; height: 46px; padding: 12px 28px; font-size: 14px; font-weight: 500; color: rgba(0, 0, 0, 0.38); border: 1px solid #DDD; border-radius: 8px; }
.tab-type3>li>a.active,
.tab-type3>li>a:hover { background-color: #383838; background-color: var(--theme-color); color: #fff; -webkit-text-stroke: 0.2px white; border: 1px solid #383838; border: 1px solid var(--theme-color); }

/* 게시판 상세 */
.board-view-wrap { margin-top: 16px; border-top: 2px solid #444; }
.board-view-wrap .board-header { display: flex; align-items: center; justify-content: space-between; padding: 32px 0; border-bottom: 1px solid #eee; }
.board-title .notice { margin-right: 6px; color: #383838; color: var(--theme-color); font-weight: bold; }
.board-title .notice.notice-ws {margin-top:-8px; padding-left:0;}
.board-title .notice::before { content: "["; }
.board-title .notice::after { content: "]"; }
.board-title .classify { margin-right: 6px; font-weight: bold; color: rgba(0, 0, 0, 0.58); }
.board-title .date { font-weight: normal; font-size: 13px; color: rgba(0, 0, 0, 0.38); }
.board-title .subject { margin: 4px 0; line-height: 25px; flex-grow: 1; }
.board-title .subject strong { display: inline; margin-right: 4px; font-size: 18px; }
.board-title .subject .new { margin-top: -2px; }
.board-title .write-info .name { display: inline-block; }
.board-title .write-info .center,
.board-title .write-info .grade { color: rgba(0, 0, 0, 0.38); }
.board-header .board-title { width: 100%; }
.board-header .board-metoo { flex-shrink: 0; }
.board-header .writer { display: flex; justify-content: space-between; align-items: center; }
.board-cont { padding-top: 24px; }
.board-cont .view-cont { padding: 16px; font-size: 16px; line-height: 180%; color: #1a1818; font-weight: normal; }
.board-cont .view-cont a { color: #0782C1; text-decoration: underline; }
.board-cont .view-cont img { display: block; height: auto !important; margin-top: 10px; }
.board-cont .view-cont ol { display: block; list-style-type: decimal; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px;}
.board-cont .view-cont ul { display: block; list-style-type: none; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; }
.board-cont .view-cont blockquote { margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 40px; margin-inline-end: 40px; font-style: italic; font-family: Georgia, Times, "Times New Roman", serif; padding: 2px 0; border-style: solid; border-color: #ccc; border-width: 0; padding-left: 20px; padding-right: 8px; border-left-width: 5px; }
.board-cont .view-cont a,
.board-cont .view-cont em,
.board-cont .view-cont strong,
.board-cont .view-cont i { display: inline-block; }
.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 { 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-header .board-metoo { display: flex; width: 100%; justify-content: right; }
.board-header .writer .write-info+.board-metoo { width: auto; }

.board-cont .view-file { margin-bottom: 24px; }
.sub-cont .view-file { margin-top: 16px; }
.commentWriter { position: relative; margin-top: 24px; 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; }

.board-user-btn { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 24px; border-top: 1px solid #dbdbdb; }
.board-user-btn>div { margin-top: 16px; }
.board-user-btn .user-btn button { height: 32px; line-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 { flex-shrink: 0; text-align: right; }
.board-prev-next button { position: relative; height: 32px; line-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-prev-next button:first-child { margin-left: 0; }

/* file */
.view-file>span { position: relative; display: block; font-size: 13px; font-weight: 700; line-height: 18px; letter-spacing: -1px; color: rgba(0, 0, 0, .78); padding-bottom:8px; }
.view-file-hide { display: none; }
.fileList li { position: relative; display: inline-block; margin-right: 8px; margin-bottom: 8px; padding: 8px 16px; background: #FFF; border: 1px solid #dbdbdb; border-radius: 8px; cursor: pointer; }
.fileList li a { display: inline-block; vertical-align: middle; font-weight: bold; font-size: 12px; color: rgba(0, 0, 0, 0.58); }
.fileList li button { 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: 160px; padding-left: 26px; 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; font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; }
.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; }
.file-all { background: url("/images/ico_file_all_2x.png") no-repeat left center; background-size: 24px 24px; }
.fileList-xs li { position: relative; display: inline-block; margin-right: 12px; margin-top: 4px; padding: 1px 12px; background: #f9f9f9; border: 1px solid #eee; 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 button { 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 .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; }
.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; }


/* 공통 */

.qest-form .fields { margin-top: 32px; width: 588px; margin: 0 auto; }
.board-view-wrap .board-title .subject .new { width: 16px; height: 16px; margin-top: 0px; }
.board-view-wrap .subject .cnt,
.board-view-wrap .board-title .subject .new { position: relative; top: -1px; }
.board-view-wrap .board-header { padding: 24px 0 20px 0; }
.board-title .notice { font-weight: 700; font-size: 16px; line-height: 1.4; background-color: #fff; padding: 1px 6px 0 4px; border-radius: 4px; display: inline-block; align-items: center; vertical-align: middle; margin-right: 4px;}
.board-title .classify { font-weight: 400; }
.board-title .subject { width: 87%; line-height: 1; margin-top: 0; }
.board-title .date { font-size: 12px; font-weight: 400; line-height: 1.8; letter-spacing: -1px; }
.board-title .subject strong { display: inline-block; font-weight: 700; font-size: 16px; width: 100%; line-height: 1.4; color: rgba(0, 0, 0, 0.78); }
.board-header .writer { justify-content: left; flex-wrap: wrap; align-items: baseline; }
.board-header .board-metoo { margin-left: auto; }
.board-header .heartBtn i.heart { margin-top: 1px; }
.board-cont { padding-top: 16px; }
.board-cont .fileList { /*border-bottom: 1px solid #eee; padding-bottom: 16px;*/ }
.board-cont .fileList:empty { padding-bottom: 0; border-bottom: none; }
.file-input-wrap .inputBtn { width: 78px; }
.file-input-wrap .inputBtn i.file { width: 20px; height: 20px; background-size: 14px 14px !important; }
.cmt-secret .checkboxA input+label::before { top: -1px; }
.board-prev-next { overflow: hidden; width: 100%; }
.board-prev-next button { float: left; }
.board-prev-next .btn_board_list { float: right; border: 1px solid #d8d8d8; background: #fff; font-size: 13px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; color: rgba(0, 0, 0, 0.58); }
.board-user-btn .user-btn button,
.board-prev-next button { height: inherit; line-height: 1.6; border-radius: 8px; padding-top: 12px; padding-bottom: 12px; padding-left: 24px; padding-right: 24px; }
.board-prev-next .prevBtn+.nextBtn::before { left: -9px; }


/* 로그인 */
.login-wrapper { text-align: center; }
.memeber-login { margin: 60px auto 0 !important; padding: 28px 4px; }
.memeber-login h1 { font-weight: 700; font-size: 24px; text-align: center; }
.memeber-login .login-info-txt { font-size: 14px; font-weight: 400; color: rgba(0, 0, 0, 0.58); margin-top: 4px; border-bottom: 2px solid #000; text-align: center; padding-bottom: 12px; }
.login-form { padding-top: 20px; text-align: left; }
.login-form .input-form { padding-bottom: 32px; }
.input-wrap .input-form:last-child { padding-bottom: 0; }
.login-option { margin: 20px 0 17px; }
.login-form .loginBtn,
.login-form .joinBtn { height: 51px; font-size: 16px; }
.login-form .btn { border-radius: 8px; }
.login-btn-menu { margin: 28px 0 24px; padding-bottom: 26px; text-align: center; border-bottom: 1px solid #ddd; }
.login-btn-menu li { position: relative; display: inline-block; margin: 0 16px; }
.login-btn-menu li::after { position: absolute; right: -16px; top: 7px; display: inline-block; content: ''; width: 1px; height: 8px; background: #C4C4C4; }
.login-btn-menu li:last-child:after { display: none; }
.login-btn-menu li a { font-weight: bold; color: rgba(0, 0, 0, 0.58); }
.login-menu { margin: 28px 0 24px; padding-bottom: 26px; text-align: center; border-bottom: 1px solid #ddd; }
.login-menu li { position: relative; margin-top: 8px; font-weight: 700; font-size: 14px; color: rgba(0, 0, 0, 0.58); }
.login-menu li:last-child:after { margin-top: 0px; }
.login-menu li span { color: var(--theme-color); margin-left: 8px; }


/* 개인정보 수정 */
.member-info-wrap { max-width: 588px; display: block; margin: 0 auto; margin-top: 24px; }
.mb-info-top { position: relative; padding: 16px 0; border-top: 2px solid #222; border-bottom: 1px solid #D8D8D8; }
.mb-info-top .profile-img-wrap { display: block; text-align: center; }
.profile-img-box { position: relative; display: inline-block; vertical-align: middle; }
.profile-img-box .profile-img { width: 80px; height: 80px; }
.profile-img { position: relative; display: inline-block; margin-top: 0; border: 1px solid #eee; border-radius: 50%; background-color: #fff; box-shadow: 0px 10px 10px rgb(68 68 68 / 6%), 0px 0px 1px rgb(68 68 68 / 21%); overflow: hidden;}
.profile-img-box .profile-no-img::before { 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%; }
.profile-img-box .profile-no-img span { position: relative; display: block; line-height: 76px; font-weight: bold; color: #FFF; text-align: center; z-index: 1; }
.profile-img-box .img-input { position: absolute; bottom: 0; right: 0; z-index: 2; }
.profile-img-box .img-input input { width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1; }
.profile-img-box .img-input label { display: inline-block; width: 24px; height: 24px; background: #FFF; border-radius: 50%; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.08); overflow: hidden; cursor: pointer; }
.profile-img-box .img-input label span { display: block; width: 100%; height: 100%; background: url("/images/ico_profile_input_2x.png") no-repeat center; background-size: 8.5px 8.5px; }
.profile-img img { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; object-fit: cover; transform: translate(-50%, -50%);}

.mb-info-top .mb-name { display: inline-block; padding-left: 12px; vertical-align: middle; }
.mb-info-top .mb-name strong { display: inline-block; font-size: 16px; line-height: 120%; color: #40454E; }
.mb-info-top .mb-name .other_mem { margin-left: 8px; padding: 2px 4px 3px 3px; vertical-align: middle; font-size: 12px; color: #383838; color: var(--theme-color); border: 1px solid #383838; border: 1px solid var(--theme-color); border-radius: 4px; }
.mb-info { padding: 0 20px; }
.mb-info .info-list { margin-bottom: 32px; }
.mb-info .info-list > li { position: relative; margin-bottom: 32px; }
.mb-info .info-list button { padding: 7px 0px 9px; font-size: 12px; width:90px; border-radius: 8px; }
.mb-marketing > div { display: flex; flex-wrap: wrap; }
.mb-marketing > div > span { padding-right:4px; display: flex; flex: none; margin-bottom: 4px; align-items: center; }
.mb-marketing > div > span > label { padding-right:4px; margin-left:8px; }
.mb-marketing > div > span label:first-of-type { margin-left: 1px; }
.mb-marketing > div > span > label span { margin-left: 25px; }
.sub-member-secession { margin-top: 135px; background: #F5F5F5; border-top: 1px solid #D8D8D8; }
.mb-secession { padding: 19px 0 76px; text-align: right; }
.mb-secession a { display: inline-block; }
.mb-secession a span { position: relative; display: inline-block; margin-right: 10px; font-weight: bold; line-height: 140%; color: #000; border-bottom: 1px solid #000; }
.mb-secession a i { display: inline-block; width: 9.5px; height: 10px; background: url("/images/ico_triangle_round_2x.png") no-repeat right center; background-size: 9.5px 10px; }


/* 강의 영역 공통 (메인페이지 및 강의 목록) { */
.main_area { margin-top: 16px; }
.main_banner { margin-bottom: 25px; }
.common_info { display: flex; justify-content: space-between; align-items: center; }

.lec_title { font-size: 24px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; padding-bottom: 15.5px; }
.lec_content { position:relative; display: block; padding-bottom: 55px; padding-top: 8px; }
.sub_lec_content { padding-bottom: 119px; }
.lec_content_box { position:relative; display: block; margin-bottom: 64px; }
.lecList::after { display: block; content: ''; clear: both; }
.lecList { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; margin-bottom: 20px; }
.lecList li { position: relative; width: calc(25% - 18px); margin-right: 24px; margin-bottom: 24px; }
.lecList li:nth-child(4n) { margin-right: 0; }
.lecList li:nth-child(n+9) { margin-bottom: 0; }
.lec-box { position: relative; border: 1px solid #D8D8D8; border-radius: 8px; overflow: hidden; transition: border-color .2s ease, box-shadow .2s ease; cursor: pointer; }
.lec-box > div.over { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; transition: opacity .4s ease; }
.lec-thumb { width: 100%; height: 157px; position: relative; border-bottom: 1px solid #d8d8d8; }
.lec-thumb img { width: 100%; height: 100%; 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) */
 object-fit: cover;
 backface-visibility: hidden;
 transform: translateZ(0);
 }
.lec-info { padding: 24px 32px 48px; }
.over .lec-info { padding: 24px; }
.lec-info .lec-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; color: rgba(0, 0, 0, .78); }
.lec-info .lec-brand { margin-top: 4px; font-weight: 400; font-size: 14px; color: rgba(0, 0, 0, 0.38); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 27px; }
.lec-info .lec-price .price-del { font-size: 12px; color: rgba(0, 0, 0, 0.38); text-decoration: line-through; }
.lec-info .lec-price .price { font-weight: bold; font-size: 12px; color: #000; }
.lec-info .lec-price .price span { margin-right: 3px; font-size: 20px; line-height: 120%; color: #383838; color: var(--theme-color); }
.lec-info .mark.member { position: absolute; right: 14px; bottom: 20px; }
.lec-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); }
.lec-box .on { opacity: 1; }
.lec-box:hover .on { opacity: 0; }
.lec-box:hover .over { opacity: 1; }
.lec-box .over { opacity: 0; }
.lec-box .over > a { display: block; width: 100%; height: 100%; }
.lec-box .over .lec-info .lec-brand { padding-bottom: 0; }
.lec-box .over .lec-info .lec-price { position: inherit; margin-top: 3px; }
.lec-box .over .lec-info div.tac {display:flex; justify-content: center; align-items: center; padding-top:32px;}
.lec-box .over .lec-info .mark { display: inline-block; transition: background-color .2s ease; border-radius: 4px; font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; border: 1px solid #D8D8D8; padding: 8px 16px; }
.lec-box .over .lec-info .mark:hover { background-color: #f5f5f5; }
.lec-box .lec-button { position: absolute; bottom: 0; left: 0; display: flex; width: 100%; z-index: 99; }
.lec-box .lec-button button { width: 50%; color: #fff; font-weight: bold; font-size: 14px; line-height: 1.4; letter-spacing: -1px; padding: 14px 0; }
.lec-box .lec-button .btn_add_cart { background-color: #484848; }
.lec-box .lec-button .btn_buy { background-color: #383838; background-color: var(--theme-color); }


.sort-tab { padding: 20px 0; }
.sort-tab .m-sort-select { display: none; padding: 5px 32px 5px 8px; background: url("/images/select_arrow_2x.png") no-repeat right 10px center; background-size: 16px 16px; font-size: 13px; font-weight: bold; color: rgba(0, 0, 0, 0.58); cursor: pointer; }
.sort-tab ul { display: block; height: 18px; }
.sort-tab ul.active { display: block !important; }
.sort-tab ul li { display: inline-block; }
.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; }

.common_info { position: relative; } 
.common_info>span { margin-left: 8px; padding-top: 4px; padding-bottom: 15.5px; flex: 1; font-size: 16px; font-weight: 700; line-height: 1.6px; letter-spacing: -0.05em; text-align: left; } 
.common_info>span>strong { color: var(--theme-color); } 
.lec_list { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; }
.lec_list li { margin-right: 16px; margin-bottom: 16px; width: 24%; }
.lec_list li:nth-child(4n) { margin-right: 0; }

.lec-progress { position: relative; display: block; }
.lec-progress-date { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.lec-progress-date span { font-size: 12px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; color: #000; }
.lec-progress-date p { font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: center; color: #000; }
.lec-progress-date p strong { font-size: 20px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; color: var(--theme-color); margin-right: 2px; }

.lec-progress-view { display: flex; justify-content: flex-start; align-items: center; padding: 8px 16px; background: #f5f5f5; border: 1px solid #d8d8d8; border-radius: 8px;}
.lec-progress-view span { font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: left; margin-right: 8px; color: rgba(0, 0, 0, .78); }
.lec-progress-view strong { font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: center; margin-right: 8px; color: var(--theme-color); }
.lec-progress-view .lec-progress-bar { flex: 1; height: 8px; background: #DDDDDD; border-radius: 100px; position: relative; overflow: hidden; }
.lec-progress-view .lec-progress-bar .ani { position: relative; background: var(--theme-color); position: absolute; top: 0; left: 0; height: 100%; border-radius: 100px; transition: all 0.3s ease-in-out; }
.lec-thumb strong { position: absolute; top: 142px; left: 32px; display: block; padding: 8px 9px 8px 8px; border-radius: 4px; font-size: 13px; font-weight: 700; line-height: 1.3; letter-spacing: -1px; text-align: left; background: var(--theme-color); color: #fff; }

.lec_complete .lec-thumb strong { background: #a1a1a1; color: #fff; }
.lec_complete .lec-progress-view strong { color: #a1a1a1; }
.lec_complete .lec-progress-view .lec-progress-bar .ani { background-color: #A1A1A1; }
.lec_complete .lec-progress-date p strong { color: #a1a1a1; }
.lec_complete .lec_my_detail_info>li>div p strong { color: #a1a1a1; }

.my-lec-list .lec-info .lec-brand { color: rgba(0, 0, 0, .58); }

/* } 강의 영역 공통 */

/* 서브페이지 네비게이션 */
.location { line-height: normal; padding-top: 16px; border-bottom: none; }
.location .inner { display: flex; justify-content: flex-start; align-items: center; }
.location .inner>* { margin-right: 4px; }
.location .loc-home { position: relative; display: inline-block; width: 15px; height: 14px; background: url('/images/ico_location_home_2x.png') no-repeat center; background-size: 15px 14px; }
.location .loc-nav { font-size: 13px; font-weight: 700; line-height: 18px; letter-spacing: -1px; }
.location .loc-nav::before { width: 5px; height: 6px; margin-right: 10px; background: url(/images/skin/mirae/ico_location_arrow_2x.png) no-repeat center; background-size: 5px 6px; margin-top: -1px; }
.location .loc-nav.depth2 { color: rgba(0, 0, 0, .38); }

/* 서브 메뉴 */
.sub_area { margin-top: 16px; }
.sub_menu_pos { display: flex; justify-content: center; align-items: center; }
.sub_menu { position: relative; padding: 8px 16px; padding-right: 16px; padding-bottom: 2px; padding-top: 14px; max-width: 800px; }
.sub_menu_list { display: flex; justify-content: center; flex-wrap: wrap; }
.sub_menu_list li { margin:0 8px; margin-bottom: 8px; position: relative; display: block; }
.sub_menu_list li a { position: relative; font-size: 14px; font-weight: 700; line-height: 1.6; color: rgba(0, 0, 0, .38); border : 1px solid #F5F5F5; background : #F5F5F5; transition: all 0.3s ease-in-out; padding: 8px 20px; border-radius: 100px; word-break: keep-all; display: block; white-space: nowrap; }
.sub_menu_list li a:hover { color: rgba(0,0,0,.78); background : #fff; border : 1px solid #d8d8d8;}
.sub_menu_list li a.active { color: #fff; background: #000000C7; border : 1px solid #000000C7;}
 

/* 강의 상세 */
.lec_detail_pos { display: flex; position:relative; justify-content: space-between; align-items: unset; padding-top: 32px; }
.lec_detail_div {width:calc(100% - 260px); }
.lec_detail { position: relative; margin-right: 24px; width:87%; }
.lec_detail_box { display: flex; justify-content: space-between; align-items: unset; margin-bottom: 24px; }
.lec_detail_thumb { width: 376px; overflow: hidden; }
.lec_detail_thumb>img { object-fit: contain; width: 100%; border-radius: 11px; }

.lec_detail_info { flex:1; }
.lec_detail_info .location { padding-top: 0; padding-bottom: 16px; }
.lec_detail_info h4 { font-size: 24px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, .78); margin-bottom: 16px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.lec_detail_info_list { padding-bottom: 16px; }
.lec_detail_info_list>li>span { margin-right: 10px; font-size: 13px; font-weight: 400; line-height: 1.5; letter-spacing: -1px; text-align: center; color: rgba(0, 0, 0, .78); }
.lec_detail_info_list>li>span.cate { margin-right: 10px; font-weight: 700; width: 66px; position: relative; display: inline-block; text-align: left; }
.lec_detail_info_list.en>li>span.cate { width: 166px; }
.lec_detail_info_list.ko>li>span.cate { width: 66px; }
.lec_detail_info .view-file {border-top: 1px solid #d8d8d8; padding-top:16px;}
.lec_detail_info .fileList li a {display: flex; align-items: center; }
.lec_detail_info .fileList li span { color : rgba(0, 0, 0, 0.78); line-height: 20px; }


.lec_tab_btn { display:flex; justify-content: flex-start; align-items: center; margin-bottom: 16px; }
.lec_tab_btn li { display: flex; justify-content: center; align-items: center; width: 50%; }
.lec_tab_btn li a { padding: 16px 0; background: #F5F5F5; border: 2px solid #f5f5f5; font-size: 14px; font-weight: 700; line-height: 1.6; color: rgba(0, 0, 0, .30); width: 100%; text-align: center; }
.lec_tab_btn li a.active { background: #fff; color: var(--theme-color); border: 2px solid var(--theme-color); font-weight: 700; }

.lec_intro { padding: 32px; border: 1px solid #EEEEEE; border-top: 1px solid #484848; margin-bottom: 24px; }
.lec_intro h5 { font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; color: rgba(0, 0, 0, .58); margin-bottom:20px; }
.lec_intro p { font-size: 16px; font-weight: 400; line-height: 1.8; letter-spacing: 0.3px; color: #383838; text-rendering: optimizeLegibility; }
.lec_intro img {object-fit: contain; height: initial !important;}

.lec_tab_content { position: relative; display: block; }
.lec_index li { border-bottom: 1px solid #EEEEEE; }
.lec_index>li:first-child {border-top: 1px solid #484848;}
.lec_index li { display: flex; justify-content: flex-start; align-items: center; }
.lec_index li>span { position: relative; padding: 0 44px 0 28px; font-size: 14px; font-weight: 700; line-height: 1.4; letter-spacing: 0em; text-align: left; min-width: 126px; display: flex; justify-content: flex-start; align-items: center; }
.lec_index li>span>svg { display:block; margin-left: 12px; margin-top: 2px; }
.lec_index li>span>svg.active>circle { stroke: var(--theme-color); }
.lec_index li>span>svg.active>path { fill: var(--theme-color); }
.lec_index li>span>svg>g>path.c { fill : #D8D8D8; }
.lec_index li>span>svg.active>g>path.c { fill : var(--theme-color); }
.lec_index li div.lec_index_info { flex: 1; padding: 20px 10px; }
.lec_index li div.lec_index_info .fileList li { margin-top: 4px; }
.lec_index_info>span { display: inline-block; font-size: 13px; font-weight: 600; line-height: 1.4; padding: 3px 7px; border-radius: 4px; margin-bottom: 4px; }
.lec_index_info>span.demo { color: var(--theme-color); background-color: #F5F5F5; border: 1px solid #EEEEEE; }
.lec_index_info>span.offline { color: #fff; background-color: #555555; border: 1px solid #555; }
.lec_index_info>span.live { color: #fff; background-color: var(--theme-color); border: 1px solid var(--theme-color); font-weight: 800; text-align: center;}
.lec_index_info>span.online { border: 2px solid var(--theme-color); color: var(--theme-color); }
.lec_index_info a { font-size: 14px; font-weight: 700; line-height: 1.6; color: rgba(0, 0, 0, .78); max-height:45px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-right: 4px; }
.lec_my_index .lec_index_info a { margin-right: 16px; }
.lec_index_info a:hover { text-decoration: underline; }
.lec_index_info b { font-size: 13px; font-weight: 400; line-height: 1.4; color: rgba(0, 0, 0, .38); }
.lec_index_info>* { position: relative; display: block; color: rgba(0, 0, 0, .38); }
.lec_index_info>*:last-child { margin-bottom: -0px; }
.fileList li:hover { background: #f5f5f5; transition: all 0.3s ease-in-out; }
.lec_index_info .fileList li:hover { background: #fff; transition: all 0.3s ease-in-out; }

.lec_tab_content .lec_index li:hover {background: #f7f7f7;}
.lec_tab_content .lec_index li .lec_index_info a:hover { text-decoration: none; cursor: default; }
.lec_tab_content .lec_index li.active .lec_index_info a:hover { text-decoration: underline; cursor: pointer; }
.lec_tab_content .lec_index .fileList li { cursor: default; }
.lec_tab_content .lec_index .fileList li button { cursor: default; }
.lec_index .fileList li { display: inline-flex; }
.lec_tab_content>a { position: relative; display: block; max-width: 160px; margin: 0 auto; margin-top: 32px; padding: 14px 0; text-align: center; font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; color: rgba(0, 0, 0, .78); border: 1px solid #222; border-radius: 8px; }

.lec_search_res .lec_index li { border: 1px solid #d8d8d8; padding: 10px; padding-bottom: 20px; margin-bottom: 8px; border-radius: 16px; cursor: pointer;} 
.lec_search_res .lec_index_info .fileList li { border-radius: 8px; margin-bottom: 0; padding-bottom: 10px; margin-right: 0; } 
.lec_search_res .lec_index li div.lec_index_info { padding: 10px; padding-bottom: 2px; } 
.lec_search_res .lec_index li:hover { border: 1px solid var(--theme-color); } 
.lec_search_res .lec_index_info a { max-height: 24px; -webkit-line-clamp: 1; font-size: 16px; margin-right: 12px;} 
.lec_search_res .lec_index_info .s-title{margin: 8px 0;font-size: 14px;font-weight: bold;}

.lec_tit_box {display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
.lec_tit_box>* {margin-bottom: 4px;}

.lec_index_info span.lec_status { font-size: 13px; font-weight: 500; line-height: 1.2; letter-spacing: -0.3px; text-align: center; padding: 3px 6px; border-radius :4px; margin-right: 4px !important; }
.lec_index_info span.support_none { color: #A60028 !important; border: 1px solid #A600287A; background: #A600280D; }
.lec_index_info span.support_complete { color: #00A660  !important; background: #00A6600D; border: 1px solid #00A6607A; }
.lec_index_info span.eval_complete {color: #002EA6  !important; border: 1px solid #002EA67A; background: #002EA60D; }
.lec_index_info em.lec_status { display: flex; justify-content: center; align-items: center; background: #F5F5F5; padding: 4px 5px; font-size: 13px; font-weight: 500; line-height: 1.2; letter-spacing: -0.3px; text-align: center; border-radius: 4px; color: rgba(0, 0, 0, 0.78); }
.lec_index_info em b { font-size: 13px; font-weight: 700; line-height: 1.2; letter-spacing: -0.3px; text-align: center; color: var(--theme-color); margin-left: 0 !important; }

.lec_content_box .lec_index li .fileList span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; max-height: 44px; overflow: hidden; text-overflow: ellipsis; } 

.fileList li button span.file-work { display: flex; justify-content: flex-start; align-items: center; max-width:100%; font-size: 12px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; padding-left: 20px; text-align: left;  }
.file-work { background: url(/images/ico_file_work_lg_2x.png) no-repeat left top; background-size: 16px 15px; background-position: 0px 2px; }

.lec_payment {position: absolute; width: 260px; max-width:260px; right:0;}
.lec_payment.fixed { position: fixed;}
.lec_payment_view { border-top: 2px solid #222; }
.lec_payment_view h4 { padding: 24px 0; font-size: 16px; border-bottom: 1px solid #d8d8d8; }
.lec_payment_view .prd-option { padding: 24px 0; border-bottom: 1px solid #eee; }
.lec_payment_view .prd-option dl { display: flex; align-items: center; margin-bottom: 16px; }
.lec_payment_view .prd-option dl:last-child { margin-bottom: 0; }
.lec_payment_view .prd-option dl dt { flex-shrink: 0; width: 80px; }
.lec_payment_view .prd-option dl dd { flex-grow: 1; text-align: right; font-size: 12px; color: #000; }
.lec_payment_view .prd-option dl dd span { margin-right: 4px; font-weight: bold; font-size: 16px; color: rgba(0, 0, 0, 0.78); }
.lec_payment_view .prd-option dl.price dd span { color: #383838; color: var(--theme-color); }
.lec_payment_view .price-sum { padding: 32px 0 16px; }
.lec_payment_view .price-sum dl { display: flex; align-items: center; }
.lec_payment_view .price-sum dl dt { flex-shrink: 0; font-size: 14px; font-weight: 400; line-height: 20px; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, .78); margin-right:8px; }
.lec_payment_view .price-sum dl dd { flex-grow: 1; text-align: right; font-size: 12px; color: #000; }
.lec_payment_view .price-sum dl dd span { margin-right: 4px; font-weight: bold; font-size: 28px; color: #383838; color: var(--theme-color); }
.lec_payment_view .buy-btn-wrap button { display: block; width: 100%; height: 50px; margin-bottom: 8px; border-radius: 8px; font-weight: bold; font-size: 16px; border-width: 2px; }
.lec_payment_view .buy-btn-wrap button:last-child { margin-bottom: 0; }

/* 나의 강의실 상세 */
.lec_my_detail { width: 100%; }
.lec_my_index strong { position: relative; display: block; font-size: 24px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: left; padding: 16px 0; }
.lec_my_index>a { position: relative; display: block; max-width: 160px; margin: 0 auto; margin-top: 32px; padding: 14px 0; text-align: center; font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; color: rgba(0, 0, 0, .78); border: 1px solid #222; border-radius: 8px; }
.lec_my_detail_info { display: flex; justify-content: flex-start; align-items: center; padding-bottom: 16px; }
.lec_my_detail_info li { position: relative; }
.lec_my_detail_info li:nth-child(1) { padding-right: 24px; }
.lec_my_detail_info li:nth-child(2){ padding-left: 24px; }
.lec_my_detail_info li:nth-child(2)::after { position: absolute; content: ''; top: 0; left: 0; width: 1px; height: 100%; background-color: #EEEEEE; }
.lec_my_detail_info>li>div { display: flex; justify-content: flex-start; align-items: center; }
.lec_my_detail_info>li>div.flex-sb { display: flex; justify-content: space-between; align-items: center; }
.lec_my_detail_info>li>div>span:first-child { font-size: 13px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; padding-right: 10px; color: rgba(0, 0, 0, .78); }
.lec_my_detail_info>li>div>span:last-child { font-family: Noto Sans; font-size: 13px; font-weight: 400; line-height: 21px; letter-spacing: -1px; color: rgba(0, 0, 0, .78); }
.lec_my_detail_info>li>div p strong { font-size: 20px; font-weight: 700; line-height: 24px; letter-spacing: -1px; text-align: center; color:var(--theme-color); }
.lec_my_detail .lec_detail_info h4 { font-size: 20px; }
.lec_my_detail .lec_index_info div { display: flex; justify-content: flex-start; align-items: center; font-size: 13px; font-weight: 400; line-height: 1.4; letter-spacing: 0em; text-align: left; }
.lec_my_detail .lec_index_info div em { margin-right: 8px; font-weight: 700; text-align: left; color: var(--theme-color); }
.lec_my_detail .lec_index_info div b { margin-left: 8px; }
.lec_my_detail .lec_index_info div span { margin-right: 8px; font-size: 13px; font-weight: 700; line-height: 1.5; letter-spacing: 0em; text-align: left; color: var(--theme-color); }
.lec_my_detail .lec_index_info div strong { display: flex; align-items: center; padding: 0; font-size: 13px; font-weight: 400; line-height: 1.5; letter-spacing: 0em; text-align: left; color: rgba(0, 0, 0, 0.58); }
.lec_my_detail .lec_index_info div strong::after { margin-left: 6px; margin-right: 6px; margin-top: 3px; content:''; position:relative; display: block; width:1px; height: 10px; background-color: rgba(0, 0, 0, 0.58);}
.lec_my_detail .fileList li button { display: flex; justify-content: flex-start; align-items: baseline; }
.lec_my_detail .fileList li button b { font-size: 11px; font-weight: 800; line-height: 15px; letter-spacing: -1px; text-align: center; padding: 2px 5px; border: 1px solid #D8D8D8; border-radius: 8px; color: rgba(0, 0, 0, .58); word-break: keep-all; }
.lec_my_detail .fileList li button em { display: flex; justify-content: flex-start; align-items: center; background-color: #F3F5FA; border-radius: 8px; padding: 2px 11.5px; font-size: 10px; font-weight: 800; line-height: 1.4; letter-spacing: -1px; text-align: center; }
.lec_my_detail .fileList li button em strong { color: var(--theme-color); font-size: 11px; font-weight: 800; line-height: 1.5; letter-spacing: 0px; padding: 0; }
.lec_my_detail .fileList li button>* { margin-right: 8px; }
.lec_my_detail .fileList li button>*:last-child { margin-right: 0px; }
.lec_my_detail .lec-progress-view span { font-size: 13px; }
.lec_my_detail .lec-progress-view strong { font-size: 16px; }
.lec_my_detail_mr { margin-right: 32px; }
.lec_my_index .lec_index>li:hover {backgruond:#f7f7f7;}
.fileList li button b.bdg_required { border: 1px solid #ff421d !important; color: #ff421d !important; font-weight: 500 !important; }

/* 강의 영상 */
.lec_grid { display: grid; grid-template-columns: repeat(12, 1fr); grid-template-rows: 57px auto 0; height: 100%; overflow: hidden; }
.video { position: relative; display: block; }
.only-1024-flex { display: none; }
.lec_video_tab { grid-column: 1 / 11; grid-row: 1 / 2; display: flex; justify-content: flex-start; align-items: center; border-bottom: 2px solid #D8D8D8; border-right: 1px solid #ddd; background: #F5F5F5; }
.lec_video_tab li { display: flex; justify-content: center; align-items: center; }
.lec_video_tab li a { height: 57px; padding: 17px 0 16px; width: 120px; text-align: center; min-width: 172px; font-size: 14px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; color: rgba(0, 0, 0, .30); }
.lec_video_tab li a.active { color: var(--theme-color); font-weight: 700; border-bottom: 3px solid var(--theme-color); background-color: #fff; }
.lec_video_tab li:first-child a { position:relative; background: #000; color: #fff; border-bottom: 3px solid #000; }
.lec_video_tab li:first-child a i.ico.lec_arrow { position:absolute; left: 8px; top: 50%; transform:translateY(-50%); background: url('/images/ico_lec_arrow_2x.png') no-repeat center / contain; width: 24px; height: 24px; margin-right: 8px; }
.lec_video_pos { position: relative; grid-column: 1 / 11; grid-row: 2 / 3; height: calc(100vh - 57px); background-color: #000; border-right: 1px	 solid #ddd; }
.lec_tab_area { position: absolute; top: 0; left: 0; width: 100%; height:100%; display: none; }
.lec_tab_area.current { display: block !important; }
.lec_video_area .video { width: 100%; height: 100%; }
.video_err { position: absolute; display: block; height: 100%; background-color: #F5F5F5; top: 0; width: 100%; }
.video_err>p { position: absolute; top: 46%; left: 50%; width: 100%; display: flex; transform: translate(-50%, -50%); text-align: center; justify-content: center; align-items: center; flex-direction: column; font-size: 24px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; color: rgba(0, 0, 0, .58); }

/* 온라인 평가 */
.lec_online .lec_notice { display: flex; justify-content: center; flex-direction: column; padding: 40px 48px; border-radius: 16px; border: 1px solid #d8d8d8; max-width: 560px; box-shadow: 0px 0px 1px 0px #44444436; box-shadow: 0px 10px 10px 0px #4444440F; margin: 60px auto; }

.lec_online .lec_notice .lec_notice_text { display: flex; justify-content: center; align-items: center; flex-direction: column; margin-bottom: 24px; border-bottom: 2px solid #000; }
.lec_online .lec_notice .lec_notice_text span { font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: center; border: 2px solid var(--theme-color); padding: 4px 16px; margin-bottom: 16px; border-radius: 100px; color: var(--theme-color); }
.lec_online .lec_notice .lec_notice_text .status { display: flex; justify-content: center; align-items: center; font-size: 40px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; margin-bottom: 16px; }
.lec_online .lec_notice .lec_notice_text .status i.clap { width: 40px; height: 40px; background: url('/images/icon_clap_2x.png') no-repeat center / contain; margin-left: 8px; } 

.lec_online .lec_notice .lec_notice_text .text { position: relative; display: block; font-size: 13px; font-weight: 700; line-height: 1.4; text-align: center; border: 1px solid #d8d8d8; border-radius: 4px; margin-bottom: 24px; padding: 8px 16px; color: var(--theme-color); }
.lec_online .lec_notice .lec_notice_text .text::before {content: ''; position: absolute; width: 100%; height: 100%; background: var(--theme-color); opacity: 0.07; top: 0; left: 0; }

.lec_online .lec_notice .lec_notice_info { display: flex; justify-content: center; flex-direction: column; align-items: center; }
.lec_online .lec_notice .lec_notice_info .lec_name { font-size: 24px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; padding-bottom: 24px; }

.lec_online .lec_notice .lec_notice_info .score_box { display: flex; justify-content: center; align-items: center; margin-bottom: 24px; }
.lec_online .lec_notice .lec_notice_info .score_box span { font-size: 40px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; }
.lec_online .lec_notice .lec_notice_info .score_box span.my_score { color: var(--theme-color); }
.lec_online .lec_notice .lec_notice_info .score_box span b { font-size: 18px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: center; color: rgba(0, 0, 0, 0.78); }
.lec_online .lec_notice .lec_notice_info .score_box .bar { position: relative; display: block; background: url('/images/slash_bar_2x.png') no-repeat center / contain; width: 17px; height: 48px; margin: 0 16px; }

.lec_online .lec_notice .lec_notice_info .box { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; background: #F5F5F5; border: 1px solid #d8d8d8; border-radius: 100px; padding: 24px 0; max-width: 400px; margin-bottom: 24px; }
.lec_online .lec_notice .lec_notice_info .box .lec_box_pos { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; }
.lec_online .lec_notice .lec_notice_info .box .lec_box_pos>div {display: flex; justify-content: space-between; align-items: center; width: 133px; margin-bottom: 8px; }
.lec_online .lec_notice .lec_notice_info .box .lec_box_pos>div.score { margin-right: 24px; }
.lec_online .lec_notice .lec_notice_info .box .lec_box_pos>div.num { width: 290px; margin-bottom: 0; }
.lec_online .lec_notice .lec_notice_info .box .lec_box_pos>div.limit { margin-right: 158px; }
.lec_online .lec_notice .lec_notice_info .box .lec_box_pos>div span { display: flex; justify-content: flex-start; align-items: center; font-size: 16px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; text-align: left; }
.lec_online .lec_notice .lec_notice_info .box .lec_box_pos>div:not(.num) span::after {content:''; position: relative; display: block; width: 1px; height: 11px; background: #ddd; margin: 0 16px; }
.lec_online .lec_notice .lec_notice_info .box .lec_box_pos>div strong { font-size: 18px; font-weight: 400; line-height: 1.2; letter-spacing: -1px; text-align: left;}
.lec_online .lec_notice .lec_notice_info .box .lec_box_pos>div.num strong { color: rgba(0, 0, 0, 0.58); }
.lec_online .lec_notice .lec_notice_info .box .lec_box_pos>div strong.m-color { font-size: 18px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: left; color: var(--theme-color); }

.lec_online .lec_notice .lec_notice_info button { position: relative;  display: flex; justify-content: center; align-items: center; padding: 28px 0; border-radius: 8px; min-width: 220px; max-width: 220px; }
.lec_online .lec_notice .lec_notice_info button.supporting { background: var(--theme-color); border-radius: 8px; }
.lec_online .lec_notice .lec_notice_info button.supporting::after {content: ''; transition: all 0.3s ease-in-out; opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0px 4px 12px 0px var(--theme-color); border-radius: 8px; }
.lec_online .lec_notice .lec_notice_info button.supporting:hover::after { opacity: 0.5; }
.lec_online .lec_notice .lec_notice_info button.supporting:active::after { background: #000; box-shadow: none; opacity: 0.1; }

.lec_online .lec_notice .lec_notice_info button span { font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: left; }
.lec_online .lec_notice .lec_notice_info button.supporting { border-radius: 8px; }
.lec_online .lec_notice .lec_notice_info button.supporting span { color: #fff;}
.lec_online .lec_notice .lec_notice_info button.supporting i { margin-right: 8px; }

.lec_online .lec_notice .lec_notice_info button b { font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: left; }
.lec_online .lec_notice .lec_notice_info button.scoring { overflow: hidden; border: 1px solid var(--theme-color); }
.lec_online .lec_notice .lec_notice_info button.scoring b {color: var(--theme-color);}
.lec_online .lec_notice .lec_notice_info button.scoring::before{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--theme-color); opacity: 0.1; }

.lec_online .lec_notice .lec_notice_info button b { font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: left; }
.lec_online .lec_notice .lec_notice_info button .dot { margin-left: 16px; display: flex; justify-content: center; align-items: center; }
.lec_online .lec_notice .lec_notice_info button .dot span {position: relative; display: block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; }
.lec_online .lec_notice .lec_notice_info button .dot span:last-child { margin-right: 0; }

.dot span { width: 8px; height: 8px; border-radius: 50%; margin: 0 3px; background-color: var(--theme-color); animation-name: dotani; animation-duration: 1.5s; animation-iteration-count: infinite; animation-fill-mode: forwards; }
.dot span:nth-child(2) { animation-delay: 0.5s; }
.dot span:nth-child(3) { animation-delay: 1s; }

@keyframes dotani { 33% { opacity: 1; }
 66% { opacity: 0.5; }
 100% { opacity: 0.2; }
}

/* 온라인평가 엠스위치 */
/* 온라인 평가 230615 */

 .online_evaluation { position: relative; display: block; padding: 8px; height: 100%; } 

 /* begin :: 온라인 평가 헤더 */
 /* 온라인 평가 사용자 정보 */
 .oe_header { display: grid; grid-template-rows: repeat(2, minmax(37px, auto)); grid-template-columns: repeat(2, 1fr); height: 100px; border-radius: 8px; box-shadow: 0px 10px 10px 0px rgba(68, 68, 68, 0.1); margin-bottom: 16px; border: 1px solid #EEEEEE; } 
 .oe_header_top { position: relative; display: flex; justify-content: flex-start; align-items: center; grid-column: 1 / 3; grid-row: 1 / 2; padding : 12px 24px 12px; border-bottom: 1px solid #EEEEEE; } 
 .oe_header_name { margin-right: 16px; font-size: 14px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; } 
 .oe_header_name strong { margin-right: 4px; } 
 .oe_header_tit { } 
 .oe_header_tit span { font-size: 14px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; } 
 .oe_header_btn { position: absolute; top: 50%; right: 7px; transform: translate(-50%, -50%); } 
 .oe_header_btn img { display: block; width: 18px; height: 18px; } 

 /* 온라인 평가 타이머 */
 .oe_header_timeout { display: flex; justify-content: flex-start; align-items: center; grid-column: 1 / 2; grid-row: 2 / 3; padding : 12px 24px 12px; } 
 .oe_header_timeout_icon { background: url('/images/icon_online_timer_2x.png') no-repeat center / contain; width: 32px; height: 32px; margin-right: 8px; } 
 .oe_header_timer { font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; margin-right: 8px; min-width:45px; } 
 .oe_header_timer.warning { color: #D23040; } 
 .oe_header_timeout_bar { position: relative; display: block; height: 4px; width: 64px; } 
 .oe_header_timeout_bar .anima_bar { position: absolute; top: 50%; transform: translateY(-50%); right:0; width: 100%; background: var(--theme-color); height: 100%; border-radius: 4px; } 
 .oe_header_timeout_bar .anima_bar.timeout { background: #D23040; } 
 .oe_header_timeout_bar progress { position:absolute; top:0; left:0; width:64px; height: 4px; transform: rotate( 180deg ); appearance: none; } 
 .oe_header_timeout_bar progress::-webkit-progress-bar { background:#eee; border-radius:4px; } 
 .oe_header_timeout_bar progress::-webkit-progress-value { border-radius:4px; background: var(--theme-color); } 
 .oe_header_timeout_bar progress.timeout::-webkit-progress-value { background: #D23040; } 

 /* 온라인 평가 옵션버튼 */
 .oe_header_option { position: relative; grid-column: 2 / 3; grid-row: 2 / 3; padding : 12px 24px 12px; } 
 .oe_header_scroll { display: flex; justify-content: flex-end; align-items: center; overflow: visible; min-width: 348px; } 
 .oe_header_option_list { position: relative; display: flex; justify-content: flex-start; align-items: center; padding: 0 8px; } 
 .oe_header_option_list::after { content:''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); display: block; width: 1px; height: 16px; background-color: #D8D8D8; } 
 .oe_option_refresh { padding-right: 0 !important; } 
 .oe_option_refresh::after { display:none !important; } 
 .oe_header_option_list li { } 
 .oe_header_option_list li button { position: relative; margin: 0 8px; width: 32px; height: 32px; display: flex; justify-content: center; align-items: center; overflow: hidden; } 

 .oe_header_option_list li button div.oe_move { background: url('/images/icon_online_move_2x.png') no-repeat center / contain; width: 30px; height: 30px; } 
 .oe_header_option_list li button div.oe_pencil { background: url('/images/icon_online_pencil_2x.png') no-repeat center / contain; width: 30px; height: 30px; } 
 .oe_header_option_list li button div.oe_eraser { background: url('/images/icon_online_eraser_2x.png') no-repeat center / contain; width: 30px; height: 30px; } 
 .oe_header_option_list li button div.oe_curve { background: url('/images/icon_online_curve_2x.png') no-repeat center / contain; width: 30px; height: 30px; } 
 .oe_header_option_list li button div.oe_red { width: 16px; height: 16px; border-radius: 50%; background-color: #ff0000; } 
 .oe_header_option_list li button div.oe_green { width: 16px; height: 16px; border-radius: 50%; background-color: #38AF71; } 
 .oe_header_option_list li button div.oe_black { width: 16px; height: 16px; border-radius: 50%; background-color: #383838; } 
 .oe_header_option_list li button div.oe_blue { width: 16px; height: 16px; border-radius: 50%; background-color: #004aff; } 
 .oe_header_option_list li button div.oe_colorpick { background: url('/images/icon_online_colorpick_2x.png') no-repeat center / contain; width: 16px; height: 16px; } 
 .oe_header_option_list li button div.oe_prev { background: url('/images/icon_online_prev_2x.png') no-repeat center / contain; width: 30px; height: 30px; } 
 .oe_header_option_list li button div.oe_next { background: url('/images/icon_online_next_2x.png') no-repeat center / contain; width: 30px; height: 30px; } 
 .oe_header_option_list li button div.oe_refresh { background: url('/images/icon_online_refresh_2x.png') no-repeat center / contain; width: 30px; height: 30px; margin-right: 0; } 
 .oe_header_option_list li button.normal_btn.active { background-color: #eee; border:1px solid #d8d8d8; box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.25); border-radius: 4px; overflow: hidden; } 
 .oe_header_option_list li button.normal_btn.on div { opacity: 1; } 
 .oe_header_option_list li button.oe_color_btn { width: 24px; height: 24px; border-radius: 50%; } 
 .oe_header_option_list li button.oe_color_btn:hover { background: #d8d8d8; } 
 .oe_header_option_list li button.oe_color_btn.active { background: #d8d8d8; } 
 .oe_header_option_list li button.oe_color_btn div { border: 1px solid #ddd; box-sizing: content-box; } 
 .oe_header_option_list li button.btn_focus div { opacity: 1; } 
 .oe_header_option_list li button.btn_focus.disabled div { opacity: 0.4; } 
 .oe_header_option_list li button span { position: absolute; top: 23px; left: 22px; display: none; width: 100%; height: 100%; background: #000; transform: rotate(45deg); } 
 .oe_header_option_list li button.click span { display: block; } 
 
 /* end :: 온라인 평가 헤더 */
 /* begin :: 온라인 평가 문제 */

 .oe_body { display: grid; grid-template-rows: repeat(10, 1fr); grid-template-columns: repeat(11, 1fr); border-top: 2px solid #222; border-bottom: 2px solid #222; height:calc(100% - 116px); } 
 .oe_problem { position: relative; grid-column: 1 / 10; grid-row: 1 / 11; border-right: 2px solid #222; /*margin: 0 0 0 18px; padding: 0; */background: #fff; overflow: hidden; } 
 .oe_problem_list { /*position: relative; overflow: auto; */ width: 100%; height: 100%; } 
 .oe_problem_list::-webkit-scrollbar { display: none; } 
 .oe_problem_list li { /*position : absolute; top: 16px; */ width: 100%; height: auto; background:#fff; display: flex; justify-content: flex-start; align-items: flex-start; } 
 .oe_problem_list li.add_space { padding-top: 16px; padding-right: 16px; padding-left: 18px; } 
 .oe_problem .oe_problem_num { display: flex; justify-content: center; align-items: center; border-radius: 8px; background: #000; min-width: 64px; height: 64px; margin-right: 16px; } 
 .oe_problem .oe_problem_num span { font-family: Noto Sans; font-size: 20px; font-weight: 700; line-height: 1; letter-spacing: -1px; text-align: center; color: #fff; } 
 .oe_problem .oe_problem_content { position: relative; flex-grow: 1; max-width: 80%; } 
 .oe_problem .oe_problem_content img { /*max-width: 100%; */ } 
 .oe_problem .oe_problem_notice { position:fixed; bottom:5vw; left: 50%; transform:translateX(-50%); display: flex; justify-content: center; align-items: center; border: 2px solid #D23040; padding: 25px 104px; border-radius: 8px; background: #fff; z-index: 9; box-shadow: 0px 10px 10px 0px rgba(68, 68, 68,0.06); } 
 .oe_problem .oe_problem_notice .ic_oe_problem_notice { background: url('/images/icon_problem_notice_2x.png') no-repeat center / contain; width: 26px; height: 26px; } 
 .oe_problem .oe_problem_notice strong { position: relative; display: block; font-size: 14px; font-weight: 700; line-height: 22px; letter-spacing: -1px; color: #D23040; word-break: keep-all; } 
 .oe_problem_notice.save { bottom: 6vw; padding: 6px 104px; border: 2px solid var(--theme-color); min-width: 160px; } 
 .oe_problem_notice.save strong { text-align: center; color: var(--theme-color); } 
 
 .exam_wrap { width: 100%; height: 100%; padding-left: 18px; overflow-y: auto; overflow-x: auto; } 
 .exam_wrap::-webkit-scrollbar { width: 15px; height:15px; } 
 .exam_wrap::-webkit-scrollbar-thumb { background-color: #d8d8d8; border-radius: 10px; background-clip: padding-box; border: 2px solid transparent; } 
 .exam_wrap::-webkit-scrollbar-track { background-color: #eee; border-radius: 10px; } 
 .exam_wrap .scr_space { display:none; position: absolute; background: #eee; z-index: 1; } 
 .exam_wrap .scr_space.x_space { height: 32px; } 
 .exam_wrap .scr_space.y_space { width: 32px; } 

 .exam_wrap .canvas_area { /*width: 100% !important; */ } 

 /* 온라인 평가 답안 */
 .oe_answer { grid-column: 10 / 12; grid-row: 1 / 10; min-width:240px; overflow: auto; } 
 .oe_answer::-webkit-scrollbar { display: none; } 
 .oe_answer_tit { border-bottom: 1px solid #9A9EA0; padding: 4px 0; text-align: center; font-size: 13px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; } 
 .oe_answer_tit span { } 

 /* 온라인 평가 마킹 */
 .oe_answer_marking::-webkit-scrollbar { display: none; } 
 .oe_answer_marking li a { position: relative; display: flex; justify-content: flex-start; align-items: center; } 
 .oe_answer_marking_bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff; z-index: -1; } 
 .oe_answer_marking li.current a { } 
 .oe_answer_marking li.current a .oe_answer_marking_bg { background-color: var(--theme-color); opacity: 0.07; } 
 .oe_answer_marking li.current a div.oe_answer_num::before { content: ''; position: relative; width: 0px; height: 0px; border-right: 7px solid transparent; border-left: 7px solid transparent; border-bottom: 11px solid var(--theme-color); margin-right: 14px; transform: rotate(90deg); } 

 .oe_answer_marking li div { padding: 8px 0; border-bottom: 1px solid #EEEEEE; min-height:44px; } 
 .oe_answer_marking li div.oe_answer_num { min-width: 56px; display: flex; justify-content: flex-end; align-items: center; padding-right: 13px; margin-right: 2px; } 
 .oe_answer_marking li div.oe_answer_check { flex:1; display: flex; justify-content: space-around; align-items: center; } 
 .oe_answer_marking li div span { font-size: 13px; font-weight: 700; line-height: 21px; letter-spacing: -1px; color: rgba(0, 0, 0, 78%); } 

 .oe_answer_marking li div label span { font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; margin-top: -2px; color: rgba(0, 0, 0, 0.3); } 
 .oe_answer_marking li div label.active span { color: #fff;; } 
 .oe_answer_marking li div.oe_answer_check input[type="radio"] { display: none; } 
 .oe_answer_marking li div.oe_answer_check input[type="radio"] + label { display: flex; justify-content: center; align-items: center; width: 18px; height: 25px; background: #fff; border-radius: 8px; text-align: center; color: rgba(0, 0, 0, 0.3); border: 1px solid #ddd; text-indent: -1px; cursor: pointer; } 
 .oe_answer_marking li div.oe_answer_check input[type="radio"]:checked + label { background: var(--theme-color); border: 1px solid var(--theme-color); } 
 .oe_answer_marking li div.oe_answer_check input[type="radio"]:checked + label span { color: #fff; } 
 .oe_answer_marking li div.oe_answer_check input[type="checkbox"] { display: none; } 
 .oe_answer_marking li div.oe_answer_check input[type="checkbox"] + label { position: relative; display: flex; justify-content: center; align-items: center; width: 18px; height: 25px; background: #fff; border-radius: 8px; text-align: center; color: rgba(0, 0, 0, 0.3); border: 1px solid #ddd; text-indent: -1px; cursor: pointer; overflow:hidden; } 
 .oe_answer_marking li div.oe_answer_check input[type="checkbox"] + label.cover:hover::before { content : ''; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background-color :var(--theme-color); opacity: 0.12; } 
 .oe_answer_marking li div.oe_answer_check input[type="checkbox"]:checked + label { background: var(--theme-color); border: 1px solid var(--theme-color); } 
 .oe_answer_marking li div.oe_answer_check input[type="checkbox"]:checked + label span { color: #fff; } 

 .oe_answer_marking li div.oe_answer_input input { width: 73%; border-radius: 8px; } 
 .oe_answer_marking li.oe_answer_short div { min-height:57px; } 
 .oe_answer_input { display: flex; justify-content: center; align-items: center; width: 100%; } 

 /* 온라인 평가 페이징 */

 .oe_paging { grid-column: 10 / 12; border-top: 1px solid #D8D8D8; background: #fff; display: flex; justify-content: center; flex-direction: column; min-height: 152px; filter: drop-shadow(0px -10px 10px rgba(68, 68, 68, 0.06)) drop-shadow(0px 0px 1px rgba(68, 68, 68, 0.21)); } 
 .oe_paging_fraction { display: flex; justify-content: center; align-items: center; padding: 9.5px 0; } 
 .oe_paging_fraction .current { font-family: Noto Sans; font-size: 14px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, 0.78); } 
 .oe_paging_fraction img { width: 13px; height: 13px; object-fit: contain; margin: 0 2px 0 3px; } 
 .oe_paging_fraction .all { font-family: Noto Sans; font-size: 14px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, 0.2); } 

 .oe_paging_pn { position: relative; display: flex; justify-content: center; align-items: center; border-bottom: 1px solid #fff; } 
 /* .oe_paging_pn::after { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 1px; height: 100%; background: #fff; } */
 .oe_paging_prev { border-right: 1px solid #fff; } 
 .oe_paging_pn a { position: relative; width: 50%; background-color: rgba(0, 0, 0, 0.2); padding: 17px 0; display: flex; justify-content: center; align-items: center; font-size: 14px; font-weight: 700; line-height: 22px; letter-spacing: -1px; color: #fff; } 
 .oe_paging_pn div.cover { position: absolute; top: 0; left: 0; display:block; width: 100%; height: 100%; background: transparent; } 

 .oe_paging_pn span { position: relative; z-index: 9; } 
 .oe_paging_pn a:hover .cover { background-color: rgba(0, 0, 0, 0.08); } 
 .oe_paging_pn div.cover.click { background-color : rgba(0, 0, 0, 0.16) !important; } 
 
 .oe_paging_pn .oe_paging_prev.active { background-color: var(--theme-color); } 
 .oe_paging_pn .oe_paging_next.active { background-color: var(--theme-color); } 
 .oe_paging_pn .oe_paging_prev img, .oe_paging_pn .oe_paging_next img { width: 16px; height: 16px; object-fit: contain; } 

 .oe_paging_submit { display: flex; justify-content: center; align-items: center; } 
 .oe_paging_submit button { width: 50%; height: 100%; padding: 18px 0; display: flex; justify-content: center; align-items: center } 
 .oe_paging_submit .oe_save { position: relative; border-right: 1px solid #fff; background: #EEEFEC; } 
 .oe_paging_submit .oe_save:hover { background : #fff; } 
 .oe_paging_submit .oe_save:hover span { color : rgba(0, 0, 0, 0.78) !important; } 
 .oe_paging_submit .oe_save .cover { position: absolute; top: 0; left: 0; display: none; width: 100%; height: 100%; background: var(--theme-color); opacity: 0.16; } 
 .oe_paging_submit .oe_submit { background: rgba(0, 0, 0, 0.78); } 
 .oe_paging_submit .oe_submit:hover { background: #000; } 
 .oe_paging_submit .oe_submit.click { background : var(--theme-color); } 
 .oe_paging_submit .oe_submit:hover svg path { stroke : #fff; } 
 .oe_paging_submit .oe_submit.warning { background: #D23040; } 
 .oe_paging_submit button span { font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; } 
 .oe_paging_submit .oe_save span { margin-left: 4px; color: rgba(0, 0, 0 , 0.78); } 
 .oe_paging_submit .oe_submit span { margin-left: 4px; color: #fff; } 

 /* end :: 온라인 평가 문제 */
 
 /* 굴기 조절 ui */
 .oe_curve_pos { position: absolute; justify-content: space-between; align-items: center; top: 48px; left: -32%; height: 40px; border: 1px solid #D8D8D8; border-radius: 8px; padding: 10px 19px; background: #fff; z-index: 9; display: none; box-shadow: 0px 10px 10px 0px rgba(63,63,63,0.06); } 
 .oe_curve_pos span { width: 23px; font-size: 12px; font-weight: 700; line-height: 19px; letter-spacing: -1px; text-align: center; } 
 input[type=range] { -webkit-appearance: none; background-color: rgba(0, 0, 0, 0.12); height: 4px; margin: 0 7px; border-radius: 4px; } 
 input[type=range]::-ms-track { background-color: var(--theme-color); } 
 input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; background: #ffffff; cursor: pointer; border: 3px solid var(--theme-color); height: 16px; width: 16px; border-radius: 50%; left: 0; } 
 .oe_curve_box { position: relative; display: block; flex-grow: 1; } 

 /* 230619 시작 전 */
 .online { position: relative; display: block; max-width: 1024px; padding: 0 16px; margin: 0 auto; } 
 .online_header { margin-top: 80px; padding-top: 16px; border-top: 2px solid #222; } 
 .oh_pos { display: flex; justify-content: space-between; align-items: center; } 
 .oh_logo { display: flex; justify-content: flex-start; align-items: center; } 
 .oh_logo a { position: relative; width: 112px; height: 64px; } 
 .oh_logo a img { position: absolute; top: 50%; transform: translateY(-50%); width: 100%; } 
 .oh_logo span { font-size: 13px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: left; margin-left: 34px; position: relative; display: block; /*padding-top: 28px; */ } 
 .oh_logo span::before { content: ''; position: absolute; bottom: 2px; left: -17px; display: block; width: 2px; height: 16px; background: #222; } 

 .oh_info { position: relative; display: flex; justify-content: center; align-items: center; border: 1px solid #222; border-radius: 6px; } 
 .oh_info div { position: relative; display: flex; flex-direction: column; align-items: center; padding: 16px 24px; } 
 .oh_info div span { font-family: Noto Sans; font-size: 40px; font-weight: 700; line-height: 1; letter-spacing: -1px; text-align: center; color: var(--theme-color); } 
 .oh_info div strong { } 
 .oh_info_time::after { content: ''; position: absolute; top: 0; left: 0; width: 1px; height: 100%; background-color: #222; } 

 .online_body { min-height: 400px; } 
 .ob_info { position: relative; display: block; text-align: center; margin-top: 16px; margin-bottom: 40px; } 

 .ob_info .ob_tit { position: relative; display: inline-block; font-size: 38px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; word-break: keep-all; width: 480px; margin-bottom: 16px; } 
 .online_body .ob_taker { margin-bottom: 60px; } 
 .online_body .ob_taker li { display: flex; justify-content: flex-start; align-items: center; max-width: 512px; padding: 10px 0; margin: 0 auto; border: 2px solid #222; margin-bottom: 8px; border-radius: 8px; padding-right: 16px; } 
 .online_body .ob_taker li span { font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; color: rgba(0, 0, 0, 0.78); border-right: 1px solid #222; min-width: 100px; text-align: center; } 
 .online_body .ob_taker li strong { flex-grow: 1; margin-left: 32px; font-size: 16px; font-weight: 400; line-height: 1.2; letter-spacing: -1px; } 
 .online_test_start { display: block; text-align: center; padding-bottom: 48px; } 
 .online_test_start a { position: relative; display: inline-block; padding: 30px 56px; background: var(--theme-color); border-radius: 8px; margin: 0px 3px 8px; } 
 .online_test_start a.disabled { background: rgba(0, 0, 0, 0.3); } 
 .online_test_start a:last-child { margin-bottom:0px; } 
 .online_test_start a span { font-size: 16px; font-weight: 500; line-height: 1.2; letter-spacing: -1px; color: #fff; text-align: center; } 

 .online_footer { display: flex; justify-content: flex-start; align-items: flex-start; border-bottom: 1px solid #45546B; } 
 .of_caution { min-width: 280px; display: flex; justify-content: flex-start; align-items: center; padding-top: 24px; border-top: 1px solid #45546B; } 
 .of_caution span { margin-top: -7px; font-size: 14px; font-weight: 700; line-height: 1.6; } 
 .of_caution svg { display: block; background:url('/images/icon_online_caution_2x.png') no-repeat top / contain; width: 28px; height: 29px; margin-right: 6px; } 
 .of_caution_list { flex-grow: 1; padding-top: 16px; border-top: 1px solid #D8D8D8; } 
 .of_caution_list li { display:flex; justify-content: flex-start; align-items: start; font-weight: 400; line-height: 22px; letter-spacing: -0.05em; text-align: left; margin-bottom: 8px; margin-left: 24px; } 
 .of_caution_list li:last-child { margin-bottom: 60px; } 
 .of_caution_list li::before { content: ''; width: 3px; height: 3px; background-color: var(--theme-color); margin-right: 6px; margin-top: 10px; } 

 /* 온라인 평가 종료 */
 .ob_tit_end { padding-top: 32px; } 
 .ob_tit_end i { background: url(/images/good_hand_2x.png) no-repeat center; width: 24px; height: 29px; margin-left: 4px; display: inline-block; background-size: contain !important; } 
 .ob_info_end { border-bottom: 2px solid #222; } 
 .ob_notice { position: relative; display: block; width: 100%; margin-bottom: 60px; margin-top: 32px; position: relative; display: block; overflow: hidden; } 
 .ob_score { position: relative; display: block; font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; color: #40454E; padding: 20px 0; background: rgba(56, 175, 113, 0.07); border-radius: 8px; max-width:142px; width: 100%; text-align: center; margin: 0 auto; } 
 .ob_score_pos { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; width: 100%; height: 100%; background-color: var(--theme-color); opacity: 0.07; } 
 .ob_score b { display: inline-block; color: var(--theme-color); margin-left: 10px; } 
 .ob_text { } 
 .ob_text span { position: relative; display: block; font-size: 14px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; text-align: center; white-space: pre-line; color: rgba(0, 0, 0, 0.78); } 
 .ob_timer { display: inline-block; font-family: Noto Sans; font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, 0.78); border-bottom: 2px solid #222; padding: 16px 24px; margin-bottom: 80px; } 
 .ob_timer b { display: inline-block; color: var(--theme-color); margin-left: 10px; } 
 .online_test_result { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-bottom: 96px; width: 100%; } 
 .online_test_result a { background: rgba(0, 0, 0, 0.78); border-radius: 8px; height: 56px; max-width: 320px; width: 90%; border-radius: 8px; display: flex; justify-content: center; align-items: center; } 
 .online_test_result a.active { background: var(--theme-color); margin-bottom: 8px; } 
 .online_test_result a span { font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; color: #fff; } 

 .add_canvas_size { justify-content: center; align-items: center; padding-bottom: 16px; } 
 .add_canvas_size span { display: flex; justify-content: center; align-items: center; margin-right: 4px; border: 1px dashed #999999; border-radius: 0 0 80px 80px; width: 100%; height: 100%; padding: 8px 0; } 
 .add_canvas_size span:hover { background-color: #FFFFFF !important; } 
 .add_canvas_size span p { color : rgba(0, 0, 0, 0.58); font-size: 14px; font-weight: 400; line-height: 1.2; letter-spacing: -1px; text-align: center; } 
 .add_canvas_size span div { width: 24px; height: 24px; } 
 .add_canvas_size span img { position: relative; display: block; width: 100%; height: 100%; object-fit :contain; } 
 .add_canvas_size span.click_ev { box-shadow: 0px 3px 6px 6px rgba(66, 66, 66, 0.04) } 
 
 @media (hover: hover){
 .oe_header_option_list li button.normal_btn:not(.disabled):hover { background-color: #F7F7F7; border:1px solid #d8d8d8; box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.25); border-radius: 4px; overflow: hidden; opacity: 1; } 
 }



/* 강의 영상 플레이어 목록 */
.lec_video_list { grid-column: 11 / 13; grid-row: 1 / 2; min-width:400px; height: 100%; }

.lec_video_list_top { height: 57px;padding: 4px 0px 3px 16px; display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid #d8d8d8; }
.lec_video_current { display: flex; justify-content: flex-start; align-items: baseline; font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; color: rgba(0, 0, 0, .78); }
.lec_video_current>strong { font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; color: rgba(0, 0, 0, .78); margin-right: 1px; }
.lec_video_current>span { font-size: 13px; font-weight: 400; line-height: 1.2; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, .58); margin-left: 1px; }
.lec_video_list_index { height: calc(100vh - 57px); position: relative; display: block; }
.lec_video_list_index>li { padding: 0; border-bottom: 1px solid #ddd; display: flex; justify-content: space-between; align-items: center; transition: all 0.3s ease-in-out; }
.lec_video_list_index>li:first-child {border-top:0;}
.lec_video_list_index>li.current { background-color: #F5F5F5; }
.lec_video_list_index>li>span { padding: 0 10px; font-size: 14px; font-weight: 700; line-height: 1.4; letter-spacing: 0em; text-align: left; min-width: 57px; }
.lec_video_list_index>li button { display: flex; justify-content: flex-start; align-items: baseline; flex-wrap: wrap; }
.lec_video_list_index>li button span { display: inline !important; line-height: 1.8 !important; }
.lec_video_list_index>li button span>* { margin-left: 4px; }
.lec_video_list_index .fileList li { margin-bottom: 0; margin-right: 0; border-bottom : 1px solid #dbdbdb; margin-top: 4px; }
.lec_video_list_index .fileList li button b { font-size: 11px; font-weight: 800; line-height: 15px; letter-spacing: -1px; text-align: center; padding: 1px 5px; border: 1px solid #D8D8D8; border-radius: 8px; color: rgba(0, 0, 0, .58); word-break: keep-all; }
.lec_video_list_index .fileList li button b:first-child {margin-left:19px;}
.lec_video_list_index .fileList li button em { display: inline-flex; justify-content: flex-start; align-items: center; background-color: #F3F5FA; border-radius: 8px; padding: 2px 11.5px; font-size: 10px; font-weight: 800; line-height: 1.4; letter-spacing: -1px; text-align: center; }
.lec_video_list_index .fileList li button em strong { color: var(--theme-color); font-size: 11px; font-weight: 800; line-height: 1.5; letter-spacing: 0px; padding: 0; }
.lec_video_list_index .fileList li button>* { margin-right: 8px; }
.lec_video_list_index .fileList li button>*:last-child { margin-right: 0px; }
.lec_video_list_index .lec_index_info div em { margin-right: 8px; font-weight: 700; text-align: left; color: var(--theme-color); }
.lec_video_list_index .lec_index_info div b { margin-left: 8px; }

.lec_video_title { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; }
.lec_video_title span { width: 100%; margin-bottom: 2px; }
.lec_video_ic { display: flex; justify-content: flex-start; align-items: center; }
.lec_video_ic i { width: 32px; height: 32px; background: #ddd; position: relative; display: block; margin-left: 8px; }
.lec_offline_info { position: absolute; top: 0; left: 0; width: 100%;height: 100%; background-color: #fff; }
.lec_video_reference { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; width: 100%; }
.lec_video_reference button { border: 1px solid #ddd; border-radius: 4px; padding: 3px 6px; margin-right: 4px; margin-bottom: 4px; font-size: 11px; font-weight: 500; line-height: 1.2; color: #333; }
.lec_video_reference>*:last-child { margin-right: 0; }
.lec_video_list_top>a.close { background: url('/images/ico_lec_close_2x.png') no-repeat center / contain; width: 48px; height: 48px; }

.file_ref { position: relative; display: block; }
.file_ref.active { display: block; }
.file_ref>a { display: inline-flex; justify-content: flex-start; align-items: center; min-width: 100px; }
.file_ref>a:hover { text-decoration: none; }
.file_ref>a span { font-size: 13px; font-weight: 700; line-height: 24px; letter-spacing: -1px; text-align: left; margin-right: 16px; word-break: keep-all; }

.file_ref_pos { position: relative; display: block; grid-column: 11 / 13; grid-row: 3 / 3; }
.file_ref_list_wrap { position: absolute; bottom: -320px; width:100%; display: block; border-top: 1px solid #ddd; background: #fff; z-index: 999; border-radius: 16px 16px 0 0; box-shadow: 0px -4px 4px 0px rgba(0, 0, 0, .10); transition: all 0.3s ease-in-out; }
/* .file_ref_list_wrap.ready { bottom: -283px; } */
.file_ref_list_wrap.active { bottom: 0px; }
.file_ref_list { max-height: 284px; overflow-y: auto; }
.file_ref_list::-webkit-scrollbar { width: 10px; height: 10px; }
.file_ref_list::-webkit-scrollbar-thumb { background-color: #d1d1d1; border-radius: 10px; background-clip: padding-box; border: 3px solid transparent; }
.file_ref_list::-webkit-scrollbar-corner { display: none; }

.file_ref_list_close { display: flex; justify-content: center; align-items: center; padding: 12px 0; }
.file_ref_list_close div { width: 24px; height: 4px; border-radius: 40px; background: #ddd; }
.file_ref_list.active { display: block; }
.file_ref_list li { border-bottom: 0px; }
.file_ref_list li:first-child a { display: flex; justify-content: center; align-items: center; padding: 12px 0; width: 100%; }
.file_ref_list li:first-child span { padding-left: 4px; padding-right: 4px; text-decoration: underline; }
.file_ref_list a { position: relative; display: block; width: 100%; padding: 12px 10px; text-align: left; }
.file_ref_list a:hover { text-decoration: none; }
.file_ref_list a span { position: relative; display: block; font-size: 12px; font-weight: 700; line-height: 24px; letter-spacing: -1px; text-align: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 100%; padding: 0 4px; padding-left: 26px; }



.lec_offline_info .title span { font-size: 14px; font-weight: 700; line-height: 20px; letter-spacing: 0em; text-align: left; }
.lec_offline_info .title { margin-bottom: 8px; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column; }
.lec_offline_info .info { position: relative; display: block; margin-bottom: 32px; font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; padding: 8px 0; border: 1px solid #EEEEEE; border-left: 0; border-right: 0; color: rgba(0, 0, 0, .78); }
.lec_offline_info .info p { position: relative; padding-left: 10px; margin-bottom: 8px; font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, .78); }
.lec_offline_info .info p::after { content: ''; position: absolute; top: 9px; left: 0; display: block; width: 3px; height: 3px; background: var(--theme-color); border-radius: 50%; }
.lec_offline_info .info p:last-child { margin-bottom: 0; }
.lec_offline_info .content { border: 1px solid #EEEEEE; border-top: 1px solid #222; padding: 12px 19px; max-height: 346px; overflow-y: scroll; }
.lec_offline_info .content p { font-size: 13px; font-weight: 400; line-height: 21px; letter-spacing: -1px; text-align: left; min-height: 148px; white-space:pre-line; }

/* 영상플레이어 과제 */
.lec_area { background-color: #fff; }
.lec_area .common { position: relative; display: block; padding: 16px; padding-top: 32px; padding-bottom: 48px; max-width: 777px; margin: 0 auto; }
.lec_work_title { margin-bottom: 8px; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column; }
.lec_work_title h5 { color: rgba(0, 0, 0, .78); margin-bottom: 8px; font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; }
.lec_work_title span { font-weight: 700; color: rgba(0, 0, 0, .78); font-size: 14px; font-weight: 700; line-height: 1.4; }
.work_content { margin-bottom: 24px; font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; padding: 8px 0; border: 1px solid #EEEEEE; border-left: 0; border-right: 0; color: rgba(0, 0, 0, .78); white-space:pre-line;}

.lec_work_subtitle { margin-bottom: 8px; display: flex; justify-content: flex-start; align-items: center; }
.lec_work_subtitle span { font-size: 14px; font-weight: 700; line-height: 20px; letter-spacing: 0em; color: rgba(0, 0, 0, .78); }
.lec_work_status b { margin-left: 8px; font-size: 11px; font-weight: 800; line-height: 1.5; letter-spacing: -1px; text-align: center; border: 1px solid #D8D8D8; padding: 2px 8px; border-radius: 8px; color: rgba(0, 0, 0, .58); }
.lec_work_submit textarea { resize: none; padding: 8px 18px; height: 180px; font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; margin-bottom: 12px; }
.lec_work_submit textarea::placeholder { font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; color: rgba(0, 0, 0, .38); }

.work_reference { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 32px; }
.work_reference .fileList li { padding: 5px 16px 8px; }
.work_reference .fileList li:first-child { position: relative; border: 2px solid #222; padding: 3px 16px 4px; margin-right: 17px; }
.work_reference .fileList li:first-child span { color: #222; line-height: 2; }
.work_reference .fileList li:first-child::after { content: ''; position: absolute; top: 50%; right: -12px; display: block; transform: translate(-50%, -50%); width: 1px; height: 20px; background: #d8d8d8; }

.work_reference button { margin-right: 8px; border: 1px solid #ddd; padding: 5px 12px; border-radius: 4px; }
.work_submit { border-bottom: 1px solid #DDDDDD; padding-bottom: 20px; }
.work_submit .fileList { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; margin-bottom: -8px; }
.work_submit .fileList li { padding: 0 6px 0 0; padding-right: 8px; display: flex; justify-content: flex-start; align-items: center; }
.work_submit .fileList li > div {padding: 9px 0 11px 16px;}
.work_submit .fileList li button { border: 1px solid #ddd; padding: 4px; border-radius: 8px; margin-right: 0; margin-left: 4px; }
.work_submit .fileList li.work_submit_input { border: 0; background: none; padding: 0; }
.work_submit .work_evaluation { padding: 8px 28px 11px 16px; border-radius: 4px; background: #f5f5f5; display: flex; justify-content: space-between; align-items: center; margin-top: 12px; }
.work_submit .work_evaluation .score { display: flex; justify-content: flex-start; align-items: center; }
.work_submit .work_evaluation .score span { font-size: 15px; font-weight: 800; line-height: 1.4; letter-spacing: -1px; text-align: left; color: #40454E; margin-right: 10px; }
.work_submit .work_evaluation .score b { font-size: 15px; font-weight: 800; line-height: 1.4; letter-spacing: -1px; text-align: left; color: var(--theme-color); }
.work_submit .work_evaluation .text { position: relative; display: block; }
.work_submit .work_evaluation .text span { position: relative; display: block; font-size: 12px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; color: rgba(0, 0, 0, .38); margin-bottom: 4px; }
.work_submit .work_evaluation .text b { position: relative; display: block; font-family: Noto Sans; font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; color: rgba(0, 0, 0, .78); }

.work_submit_btn { background-color: var(--theme-color); width: 100%; padding: 14px 0; position: relative; display: block; border-radius: 8px; font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: center; color: #fff; margin-top: 10px; }
.submit_input_custom { display: none; border: 0; background: none; height: inherit; }
.submit_label { display: flex; align-items: center; justify-content: center; background: #fff; border: 2px solid #222; border-radius: 8px; cursor: pointer; font-size: 13px; font-weight: 800; line-height: 1.4; letter-spacing: -1px; padding: 10px 21px 9px; }
.submit_label i { margin-right: 8px; }
.work_reference>*:last-child { margin-right: 0px; margin-bottom: -8px; }

/* live 강의실 */
.lec_video_area .common { position: relative; width: 100%; height: 100%; background: #fff; padding: 56px 16px 68px; } 
.lec_video_area .common .live { position: relative; display: block; padding: 40px 48px; margin: 0 auto; max-width: 696px; border-radius: 16px; border: 1px solid #d8d8d8; box-shadow: 0px 0px 1px 0px rgba(68, 68, 68, 0.12); text-align: center; } 
.lec_video_area .common .live h4 { display: block; width: 80%; margin: 0 auto; font-size: 38px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; color: rgba(0, 0, 0, 0.78); } 

.lec_video_area .common .live .profile-img-wrap { position:relatvie; display:block; text-align: center; padding-top: 24px; padding-bottom: 24px; } 
.lec_video_area .common .live .profile-img-wrap .profile-img-box { padding-bottom: 10px; } 
.lec_video_area .common .live .profile-img-wrap .profile-img-box .profile-img img { width: 74px; height: 74px; } 
.lec_video_area .common .live .profile-img-wrap .profile-img-box .profile-img .overlay { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); width:74px; height: 74px; background: var(--theme-color); border-radius: 50%; opacity: 0.58; } 
.lec_video_area .common .live .profile-img-wrap .mb-name { font-size: 16px; font-weight: 700; line-height: 1.6; letter-spacing: 0em; text-align: center; } 

.lec_video_area .common .live>span { position: relative; display: inline-block; text-align: center; font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: center; color: var(--theme-color); padding: 4px 16px; border-radius: 100px; border: 2px solid var(--theme-color); padding-bottom: 3px; margin-bottom: 8px; } 
.lec_video_area .common .live .live_date { display: flex; justify-content: center; align-items: center; padding-bottom: 16px; } 
.lec_video_area .common .live .live_date b { font-size: 16px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; text-align: left; } 
.lec_video_area .common .live .live_date span { display:flex; justify-content: flex-start; align-items: center; font-size: 18px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: left; color: var(--theme-color); } 
.lec_video_area .common .live .live_date span::before { content:''; position: relative; display:block; width: 2px; height: 11px; background-color: var(--theme-color); margin-left: 8px; margin-right: 5px; } 
.lec_video_area .common .live>strong { position: relative; padding: 8px 16px; margin-bottom: 48px; display: inline-flex; justify-content: flex-start; align-items: center; font-size: 13px; font-weight: 700; line-height: 1.5; letter-spacing: 0em; text-align: left; color: var(--theme-color); border: 1px solid #D8D8D8; border-radius: 8px; overflow:hidden; } 
.lec_video_area .common .live>strong::before { margin-right: 8px; content:''; position:relative; display:block; width: 3px; height: 3px; background-color: var(--theme-color); } 
.lec_video_area .common .live>strong::after { content:''; position: absolute; top:0; left:0; width: 100%; height: 100%; background-color: var(--theme-color); opacity: 0.07; } 

.lec_video_area .common .live_content { text-align: left; margin-bottom: 24px; } 
.lec_video_area .common .live_content span { font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; margin-bottom: 12px; display: block; position: relative; text-align: left; color: #555; } 
.lec_video_area .common .live_content p { border-top: 1px solid #222; border-bottom: 1px solid #d8d8d8; padding: 11px 0; max-height: 86px; font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; text-align: left; } 
.lec_video_area .common .live a.live_btn { display: inline-flex; justify-content: center; align-items: center; font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; padding: 30.5px 56px; border-radius: 8px; background-color: var(--theme-color); color: #fff; } 

.live_end { position: absolute; top: 50%; left: 50%; display: block; transform: translate(-50%, -50%); width: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; } 
.live_end span { font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: center; border: 2px solid #555; color: #555555; padding: 4px 16px; border-radius: 100px; margin-bottom: 40px; } 
.live_end h4 { font-size: 38px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; width: 500px; margin-bottom: 40px; } 
.live_end h4 img { } 
.live_end b { padding: 16px 24px; border-bottom: 2px solid #222222; margin-bottom: 40px; font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: left; } 
.live_end b strong { color: var(--theme-color); margin-left: 8px; margin-right: 2px; } 
.live_end a.live_end_btn { font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: -1px; text-align: center; padding: 18.5px 0; max-width: 320px; width: 100%; background-color: #000; border-radius: 8px; color: #fff; } 

/* 고객센터 표 */
.custom_table { position: relative; display: block; }
.custom_table_common { position: relative; display: flex; justify-content: flex-start; align-items: stretch; }
.custom_table_header { border-top: 2px solid var(--theme-color); }
.custom_table_header { font-weight: 700; }
.custom_table_header li { border-bottom: 1px solid #d1d1d1 !important; }
.custom_table_common li { flex: 1; display: flex; justify-content: center; align-items: center; border-bottom: 1px solid #f2f2f2; margin-right: 8px; }
.custom_table_common li span { padding: 11px 0; }
.custom_table_common li:last-child { margin-right: 0%; }
.custom_table_common.certificate li:nth-child(2) { flex: 4; justify-content: flex-start; }
.custom_table_common.certificate li:nth-child(3) { flex: 2; }
.custom_table_common.certificate li:nth-child(4) { flex: 1; }
.custom_table_common.certificate li:nth-child(5) { flex: 1; }
.custom_table_common.custom_table_header.lecture li:nth-child(3) { justify-content: center !important; }
.custom_table_common.lecture li:nth-child(3) { flex: 4; justify-content: flex-start; }
.custom_table_common.lecture li:nth-child(4) { flex: 2; }
.custom_table_common.lecture li:nth-child(5) { flex: 2.5; }
.custom_table_common.custom_table_header.certificate li:nth-child(2) { justify-content: center !important; }
.custom_table_common.certificate button { padding: 3px 12px; border: 1px solid #eee; border-radius: 4px; }


/* sub page */
.sub-header { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; margin-bottom: 16px; }
.sub-header.payment-history { margin-top: 32px; justify-content: flex-start; margin-bottom: 0; padding-bottom: 16px; border-bottom: 2px solid #222; }
.sub-header-com { margin-top: 68px; }
.sub-header.line { border-bottom: 2px solid #222; padding-bottom: 16px; }
.sub-header.jcLeft { justify-content: flex-start; }
.sub-title { font-size: 20px; line-height: 1.4; }
.sub-header.payment-history .sub-title { margin-right: 32px; }
.payment-history-btn .btn { border-radius: 8px; margin-top: 14px; }


/* table */
.btable tr { height: 52px; }
.btable tr th { text-align: left; font-weight: bold; }
.btable tr td { color: rgba(0, 0, 0, 0.58); }
.htable { }
.htable thead tr { height: 52px; }
.htable tbody tr { height: 70px; }
.htable tr th { border-top: 2px solid #000; border-bottom: 1px solid #dbdbdb; font-size: 13px; }
.htable tr td { border-bottom: 1px solid #eee; text-align: center; color: rgba(0, 0, 0, 0.58); }
.htable tr td a { color: rgba(0, 0, 0, 0.58); }
.ul-btable { border-top: 2px solid #222; border-bottom: 1px solid #dbdbdb; }
.ul-btable .tbody li { display: flex; padding: 16px 0; }
.ul-btable .tbody li > span { flex-shrink: 0; width: 160px; font-weight: bold; }
.ul-btable .tbody li > div { flex-grow: 1; padding-left: 16px; color: rgba(0, 0, 0, 0.58); }
.ul-htable .thead { border-top: 2px solid #222; border-bottom: 1px solid #dbdbdb; }
.ul-htable .thead li { display: flex; align-items: center; height: 50px; }
.ul-htable .thead li span { font-weight: bold; font-size: 13px; font-size: 13px; font-weight: 700; line-height: 1.3; letter-spacing: -1px; text-align: center; }
.ul-htable .tbody li { display: flex; align-items: center; padding: 25px 16px 25px 0; border-bottom: 1px solid #eee; }

/* 장바구니 */
.cart-cont-wrap { padding-top: 13px; }
.cart-cont-wrap .btn-select-del { padding: 5px 7px; font-size: 13px; border-radius: 4px; }
.cart-item-box { display: flex; align-items: center; }
.cart-item-box .cart-info { display: flex; justify-content: flex-start; align-items: center; flex: 1; }
.cart-item-box .cprd-chk { flex-shrink: 0; position: relative; width: 52px; height: 120px; padding: 0 16px; }
.cart-item-box .cprd-chk .checkboxA { position: absolute; top: 0; left: 16px; width: 20px; height: 20px; }
.cart-item-box .cprd-img { flex-shrink: 0; width: 213px; }
.cart-item-box .cprd-img img { max-width: 100%; border-radius: 8px; image-rendering: -webkit-optimize-contrast; /* Webkit (non-standard naming) */
 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) */
 object-fit: cover;
 backface-visibility: hidden;
 transform: translateZ(0);}
.cart-item-box .cprd-info { flex-grow: 1; padding-left: 48px; }
.cart-item-box .cprd-info .item-name .t-sel { position: relative; top: -1px; display: inline-flex; justify-content: center; align-items: center; width: 30px; height: 21px; margin-right: 8px; line-height: 21px; text-align: center; font-weight: bold; font-size: 12px; color: #383838; color: var(--theme-color); border: 1px solid #383838; border: 1px solid var(--theme-color); border-radius: 4px; }
.cart-item-box .cprd-info .item-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; max-height: 44px; overflow: hidden; text-overflow: ellipsis; font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: left; }
.cart-item-box .cprd-info .brand-name { margin-bottom: 4px; font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, .38); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.cart-item-box .cprd-info .status { position: relative; display: inline-block; margin-bottom: 12px; line-height: 17px; font-weight: bold; font-size: 12px; color: #383838; color: var(--theme-color); }
.cart-item-box .cprd-info .statusBox { position: relative; display: inline-block; margin-bottom: 12px; padding: 2px 4px; line-height: 17px; font-weight: bold; font-size: 12px; color: #383838; color: var(--theme-color); }
.cart-item-box .cprd-info .statusBox::after { display: inline-block; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 1px solid #383838; border: 1px solid var(--theme-color); opacity: 0.6; border-radius: 4px; }
.cart-item-box .cprd-price { flex-shrink: 0; width: 120px; text-align: right; }
.cart-item-box .cprd-price .price { font-weight: bold; font-size: 12px; color: #000; }
.cart-item-box .cprd-price .price span { margin-right: 4px; font-weight: bold; font-size: 16px; color: var(--theme-color); }
.cart-item-box .cprd-del { flex-shrink: 0; width: 120px; text-align: center; }
.cart-item-box .cprd-del .item-del { width: 24px; height: 24px; background: url("/images/ico_delete_2x.png") no-repeat 0 0; background-size: 24px 24px; }
.cart-item-box .cprd-qprice { flex-shrink: 0; width: 152px; text-align: center; }
.cart-item-box .cprd-qprice .qty { position: relative; display: inline-block; margin-right: 18px; font-size: 13px; color: rgba(0, 0, 0, 0.58); }
.cart-item-box .cprd-qprice .qty::after { display: inline-block; content: ''; position: absolute; top: 9px; right: -13px; width: 3px; height: 3px; background-color: #C4C4C4; border-radius: 50%; }
.cart-item-box .cprd-qprice .price { display: inline-block; font-weight: bold; font-size: 12px; color: #000; }
.cart-item-box .cprd-qprice .price span { margin-right: 4px; font-weight: bold; font-size: 16px; color: rgba(0, 0, 0, 0.78); }
.cart-item-box .cprd-price .price { display: inline-block; }
.cart-total-price { position: relative; display: flex; justify-content: space-between; align-items: center; height: 60px; padding: 16px; }
.cart-total-price::after { display: block; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 60px; background-color: #383838; background-color: var(--theme-color); opacity: 0.1; z-index: -1; }
.cart-total-price .text { font-weight: bold; }
.cart-total-price .total-price { font-weight: bold; font-size: 12px; color: #000; }
.cart-total-price .total-price span { margin-right: 4px; font-size: 20px; color: #383838; color: var(--theme-color); }
.cart-btn-wrap { padding: 20px 0; display: flex; justify-content: center; align-items: center; }
.cart-btn-wrap a { border-width: 2px; padding: 14.5px 0 13.5px; width: 216px; margin: 0 4px; text-align: center; }
.ul-htable .cart-group-info li .col1 { flex-shrink: 0; width: 112px; }
.ul-htable .cart-group-info li .col1 .checkboxA label span { margin-left: 30px; font-weight: normal; }
.ul-htable .cart-group-info li .col2 { flex-grow: 1; }
.ul-htable .cart-group-info li .col3 { flex-shrink: 0; width: 120px; }
.ul-htable .cart-group-info li .col4 { flex-shrink: 0; width: 120px; }
.ul-htable .cart-group-info li .col5 { flex-shrink: 0; width: 120px; }
.ul-htable .cart-group-info li span { text-align: center; }

/* 주문/결제 */
.order-cont-wrap { position: relative; display: block; padding-top: 7px; }
.order-cont-wrap .order-view-wrap { display: flex; justify-content: space-between; align-items: flex-start; }
.order-info-box { margin: 16px 0 64px; }
.order-info-box.payment-history { margin-bottom: 32px; }
.order>div.order-info-box:last-child { margin-bottom: 78px; }
.order-info-box .box-title { display: flex; align-items: center; margin-bottom: 16px; }
.order-info-box .box-title h3 { margin-right: 10px; font-size: 16px; }
.order-payer-info .ul-btable .tbody li.row4 { align-items: center; }
.order-payer-info .memo { width: 548px; }
.order-payer-info .ul-btable .tbody li > div b { font-weight: 700; margin-right: 4px; }
.order-product-info .ul-htable .thead li > span { text-align: center; }
.order-product-info .ul-htable .thead .col1 { flex-grow: 1; }
.order-product-info .ul-htable .thead .col2 { flex-shrink: 0; width: 120px; }
.order-product-info .ul-htable .thead .col3 { flex-shrink: 0; width: 120px; }
.order-product-info .ul-htable .thead .col4 { flex-shrink: 0; width: 120px; }
.order-product-info .ul-htable .thead .col5 { flex-shrink: 0; width: 120px; }
.order-product-info .ul-htable .thead .col6 { flex-shrink: 0; width: 120px; }
.order-product-info .ul-htable .tbody .col1 { flex-grow: 1; }
.order-product-info .ul-htable .tbody .col2 { flex-shrink: 0; width: 120px; text-align: center; }
.order-product-info .ul-htable .tbody .col3 { flex-shrink: 0; width: 120px; text-align: center; }
.order-product-info .ul-htable .tbody .col4 { flex-shrink: 0; width: 120px; text-align: center; }
.order-product-info .ul-htable .tbody .col5 { flex-shrink: 0; width: 120px; text-align: center; }
.order-product-info .ul-htable .tbody .col6 { flex-shrink: 0; width: 120px; text-align: center; }
.order-product-info .htable .price,.order-product-info .htable .qty { font-size: 12px; color: #000; }
.order-product-info .htable .price span, .order-product-info .htable .qty span { margin-right: 4px; font-size: 16px; color: rgba(0, 0, 0, 0.78); }

.order-view-wrap .order { width:810px; margin-right: 32px; }
.ul-htable .thead li { padding: 0 16px; }
.ul-htable .order-group-info li .col2 { flex-grow: 1; text-align: center; }
.ul-htable .order-group-info li .col3 { flex-shrink: 0; width: 120px; text-align: center; }
.ul-htable .order-group-info li .col4 { flex-shrink: 0; width: 120px; text-align: center; }
.ul-htable .order-group-info li .col5 { flex-shrink: 0; width: 120px; text-align: center; }
.order-item-box { justify-content: flex-start; }
.order-item-box .odrer-item-info { flex: 1; font-size: 14px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; }
.order-item-box p { flex-shrink: 0; width: 120px; text-align: center; font-size: 12px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; }
.order-item-box .quantity { flex-shrink: 0; width: 120px; text-align: center; font-size: 13px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; text-align: center; }
.order-item-box .price span { flex-shrink: 0; width: 120px; text-align: right; font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: center; margin-right: 4px; }
.order-item-box .refund span { flex-shrink: 0; width: 120px; text-align: right; font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: center; margin-right: 4px; }

.order-item-box span { font-weight: 700; font-size: 16px; }

.order-view-wrap .order_payment { padding-top: 56px; }
.order_payment { min-width: 260px; }
.order_payment_view { border-top: 2px solid #222; }
.order_payment_view h4 { padding: 24px 0; font-size: 16px; border-bottom: 1px solid #d8d8d8; font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; }
.order_payment_view .prd-option { padding: 24px 0; border-bottom: 1px solid #eee; }
.order_payment .price-each dl { display: flex; align-items: center; margin-bottom: 16px; }
.order_payment .price-each>*:last-child { margin-bottom: 0; }
.order_payment_view .prd-option dl:last-child { margin-bottom: 0; }
.order_payment .price-each dl dt { flex-shrink: 0; font-size: 14px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, .78); }
.order_payment .price-each dl dd { flex-grow: 1; text-align: right; color: #000; font-size: 12px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; }
.order_payment .price-each dl dd span { margin-right: 4px; font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: center; color: rgba(0, 0, 0, .78) }
.order_payment_view .prd-option dl.price dd span { color: #383838; color: var(--theme-color); }
.order_payment .price-sum { padding: 24px 0 16px; }
.order_payment_view .price-sum dl { display: flex; align-items: center; }
.order_payment_view .price-sum dl dt { flex-shrink: 0; font-size: 14px; font-weight: 400; line-height: 20px; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, .78); }
.order_payment_view .price-sum dl dd { flex-grow: 1; text-align: right; font-size: 12px; color: #000; }
.order_payment .price-sum dl dd span { margin-right: 4px; font-weight: bold; font-size: 28px; color: var(--theme-color); }
.order_payment .order-btn-wrap button span em { font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; }
.order_payment_view .order-btn-wrap button { display: block; width: 100%; height: 50px; margin-bottom: 8px; border-radius: 8px; font-weight: bold; font-size: 16px; border-width: 2px; }
.order_payment_view .order-btn-wrap button:last-child { margin-bottom: 0; }
.order_payment .price-each { padding: 24px 0; border-bottom: 1px solid #D8D8D8; }

/* 주문내역 */
.payment-history-sort { display: flex; justify-content: flex-start; align-items: center; }
.payment-history-sort li { margin: 0 8px; position: relative; display: block; }
.payment-history-sort li input { display: none; }
.payment-history-sort li input + label { position: relative; font-size: 14px; font-weight: 400; line-height: 1.6; color: rgba(0, 0, 0, .58); padding: 8px 32px; border-radius: 100px; word-break: keep-all; display: block; cursor: pointer; border: 2px solid transparent; }
.payment-history-sort li input + label:hover { font-weight: bold; color: rgba(0, 0, 0, 0.78); }
.payment-history-sort li input:checked + label { border: 2px solid #484848; color: rgba(0, 0, 0, .78); font-weight: 700; }
.payment-history-sort li::after { content: ''; position: absolute; display: block; top: 50%; right: -10px; width: 1px; height: 8px; background-color: #D8D8D8; transform: translateY(-50%); }
.payment-history-sort li:last-child::after { display: none; }

.payment-item.ul-htable .thead { border-bottom: 0; margin-bottom: 8px; padding-top: 36px; }
.payment-item-list.tbody { border: 1px solid #d8d8d8; border-radius: 8px; margin-bottom: 32px; }
.payment-item.ul-htable .tbody li { padding: 24px; border-bottom: 1px solid #eee; }
.payment-item.ul-htable .tbody li:last-child { border-bottom: 0; }
.payment-item-list .cart-item-box .cprd-info .brand-name { margin-bottom: 12px; }

.payment-info { display: flex; justify-content: space-between; align-items: center; padding-top: 32px; padding-bottom: 8px; }
.payment-info-box { display: flex; justify-content: flex-start; align-items: center; }
.payment-info-box span.payment-info-date { display: block; margin-right: 8px; font-size: 14px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; text-align: left; }
.payment-info-box span.playment-info-number { display: flex; margin-right: 16px; font-size: 13px; font-weight: 400; line-height: 1.7; letter-spacing: -1px; text-align: left; }
.payment-info-box span.playment-info-number b { display: flex; margin-left: 4px; font-size: 13px; font-weight: 700; letter-spacing: -1px; color: rgba(0, 0, 0, .58); }
.payment-info-btn { display: flex; justify-content: flex-start; align-items: center; }
.payment-info-cancel { padding: 4px 8px; color: #fff; background-color: var(--theme-color); font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: center; border-radius: 4px; word-break: keep-all; }

/* 증명서 리스트 */
.certification { letter-spacing: 0; }
.certification-list { padding-top: 8px; letter-spacing: 0; }

.ul-htable.certification-table .thead li { display: flex; justify-content: space-between; align-items: center; height: inherit; }
.ul-htable.certification-table .thead li span { margin: 14px 8px; text-align: center; width: 161px; }
.ul-htable.certification-table .thead li span:first-child { margin-left: 0px; width: 35px; }
.ul-htable.certification-table .thead li span:last-child { margin-right: 0px; }
.ul-htable.certification-table .thead li span.col2 { flex: 1; }

.ul-htable.certification-table .tbody { padding: 0px; margin-bottom: 28px; }
.ul-htable.certification-table .tbody li { padding: 5.5px 16px; min-height:52.5px; }
.ul-htable.certification-table .tbody li>* { width: 161px; margin: 0 8px; font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; text-align: center; color: rgba(0, 0, 0, .58); }
.ul-htable.certification-table .tbody li>*:first-child { width: 35px; margin-left: 0; font-weight: 700; }
.ul-htable.certification-table .tbody li>*.cer_btn { width: 161px; margin-right: 0; display: inline-block; }
.ul-htable.certification-table .tbody li>*.cer_btn>a { border-radius: 8px; padding: 8px 21px; }
.ul-htable.certification-table .tbody li>*.name { flex: 1; text-align: left; font-weight: 700; cursor:pointer; }
.ul-htable.certification-table .tbody li:hover .name { text-decoration: underline; }
.ul-htable.certification-table .tbody li>*.progress span { display: none; }

/* 증명서 */
.certification { padding: 48px 80px; display: flex; justify-content: flex-start; align-items: center; flex-direction: column; width: 100%; font-family: 'Noto Serif KR', serif !important; }
.cer_logo { position: relative; display: flex; justify-content: space-between; align-items: center; margin-bottom: 70px; width: 100%; }
.cer_logo>span { position: absolute; top: -6px; right: 0; font-size: 11px; font-weight: 700; line-height: 1.7; letter-spacing: 0em; color: #000; }
.line_deco { display: flex; justify-content: center; align-items: center; flex-direction: column; }
.cer_logo .line_deco { width: calc(50% - 86px); }
.line_deco>div { border-radius: 100px; width: 100%; background: #000; }
.line_deco>div:first-child { height: 2px; margin-bottom: 4px; }
.line_deco>div:nth-child(2) { height: 1px; }
.cer_logo_img { display: flex; justify-content: center; align-items: center; height:40px; max-width: 132px; }
.cer_logo_img>img { width: 100%; object-fit: contain; }
.cer_logo_img p { font-size: 18px; font-weight: 700; line-height: 1.4; color: #000; width:100%; text-align: center; word-break: keep-all;}
.cer_title { font-size: 48px; font-weight: 700; line-height: 1.4; text-align: center; color: #000; }
.cer_title_eng { font-size: 18px; font-weight: 700; line-height: 1.6; margin-bottom: 48px; color: #000; }
.cer_program_info { color: #000; font-size: 18px; font-weight: 700; line-height: 1.4; text-align: center; margin-bottom: 16px; padding: 8px 16px; border-bottom: 1px solid #000; }
.cer_period { display: flex; justify-content: center; align-items: center; margin-bottom: 100px; }
.cer_period>span { font-size: 12px; font-weight: 700; line-height: 1.6; margin-right: 4px; color: rgba(0, 0, 0, 0.58); }
.cer_period>span>strong { font-size: 12px; font-weight: 700; line-height: 1.6; color: #000; }
.cer_custom_info { display: flex; justify-content: center; align-items: center; flex-direction: column; width: 100%; }
.cer_custom_info>span { font-size: 28px; font-weight: 700; line-height: 1.3; text-align: center; }
.cer_custom_info>div>span { font-size: 12px; font-weight: 500; line-height: 1.6; margin-right: 4px; color: rgba(0, 0, 0, 0.58); }
.cer_custom_info>div>span>strong { font-size: 12px; font-weight: 500; line-height: 1.6; color: #000; }
.cer_custom_info>div { margin-bottom: 32px; }
.cer_custom_info>div.line_deco { width: 100%; height: 2px; background: #000; border-radius: 100px; }
.cer_contents { font-size: 28px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; text-align: center; margin-bottom: 114px; }
.cer_date { font-size: 16px; font-weight: 400; line-height: 1.6; letter-spacing: -0.05em; }
.cer_aca { font-size: 24px; font-weight: 700; line-height: 1.6; letter-spacing: -0.05em; margin-bottom: 72px; }
.cer_bot { width: 100%; }
.cer_bot>.line_deco>div:first-child { height: 1px; }
.cer_bot>.line_deco>div:nth-child(2) { height: 2px; margin-bottom: 4px; }

/* 결과 페이지 */
.result-cont { padding: 64px 0; text-align: center; }
.result-cont .theme-icon svg circle { stroke: #383838; stroke: var(--theme-color); }
.result-cont .theme-icon svg path { fill: #383838; fill: var(--theme-color); stroke: #383838; stroke: var(--theme-color); }
.result-cont .text { margin: 32px 0 36px; }
.result-cont .text strong { display: block; margin-bottom: 10px; line-height: 29px; font-size: 24px; }
.result-cont .text p { color: rgba(0, 0, 0, 0.58); font-size: 14px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; text-align: center; }
.result-cont .btn-wrap { display: flex; justify-content: center; }
.result-cont .btn-wrap .btn { margin: 0 4px; border-radius: 8px; }

/* 증명서 인쇄 */
.print-container { max-width: 793px; margin: 0 auto; display: block; border: 1px solid #D8D8D8; margin-top: 32px; }
.print-btn { position: relative; display: block; text-align: center; margin: 40px 0 32px; }
.print-btn a.btn { position: relative; text-align: center; line-height: 47px; }

@media print { @page { size: auto; margin: 0; }
 html, body { padding:0; page-break-after: avoid; page-break-before: avoid; }
 .print-container { min-width: 745px; margin-top: 0; }
 * { -webkit-print-color-adjust: exact !important; color-adjust: exact !important; }
 .print-common .print-page-button { display: none; }
 .print-scroll { overflow: visible; }
 .print-btn { display: none; }
 }

/* footer (티클 참조) */
.footer { position: relative; width: 100%; background-color: #fff; z-index: 9; }
.footer-inner { max-width: 1232px; margin: 0 auto; padding: 0 16px; }
.footer-wrap { display: flex; justify-content: space-between; padding: 60px 0 89px; }
.ft-info { flex-grow: 1 }
.ft-menu { margin-bottom: 27px; }
.ft-menu-list { display: inline-block; }
.ft-menu-list li { display: inline-block; margin-right: 16px; }
.ft-menu-list li span { font-size: 14px; font-weight: 700; line-height: 1.6; letter-spacing: -1px; }
.ft-menu-list li a { font-weight: bold; }
.ft-menu-list li a.ft_compInfo { }
.ft-menu-list li a.ft_compInfo::after { display: inline-block; content: ''; width: 2px; height: 12px; margin-left: 16px; background: #D8D8D8; }
.ft-menu .aca-search { position: relative; display: inline-block; margin: 0 16px; padding: 2px 16px; border: 1px solid #D8D8D8; border-radius: 4px; font-weight: bold; font-size: 14px; font-weight: 700; line-height: 22px; letter-spacing: -1px; text-align: left; }
.ft-menu .aca-search::after { display: inline-block; content: ''; position: absolute; left: -18px; top: 50%; margin-top: -6px; width: 2px; height: 12px; background: #D8D8D8; }
.ft-sns { display: inline-block; }
.ft-sns::before { display: inline-block; content: ''; width: 2px; height: 12px; margin-right: 16px; background: #D8D8D8; }
.ft-sns li { display: inline-block; }
.ft-sns li:last-child { margin-right: 0; }
.ft-sns li a i { transition: 0.2s; transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1); }
.ft-addres-copy h2 { margin-bottom: 10px; font-weight: bold; font-size: 18px; line-height: 120%; color: rgba(0, 0, 0, 0.78); }
.ft-addres-copy .address { margin-bottom: 10px; color: rgba(0, 0, 0, 0.58); }
.ft-addres-copy .copy { font-size: 12px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; color: rgba(0, 0, 0, 0.30); }
.ft-app { position: relative; padding-left: 16px; }
.ft-app::before { position: absolute; top: 0; left: 0; display: inline-block; content: ''; width: 1px; height: 161px; background: #D8D8D8; opacity: 0.4; }
.ft-app h3 { margin-bottom: 24px; font-weight: bold; font-size: 18px; line-height: 120%; }
.ft-app ul li { width: 145px; height: 40px; line-height: 37px; border: 1px solid rgba(216, 216, 216, 0.5); box-sizing: border-box; border-radius: 8px; }
.ft-app ul li.google { margin-bottom: 8px; background: url("/images/front/ico_google_2x.png") no-repeat left 20px center; background-size: 17.5px 21px; }
.ft-app ul li.apple { background: url("/images/front/ico_apple_2x.png") no-repeat left 20px top 5px; background-size: 22px 26px; }
.ft-app ul li a { display: block; font-weight: bold; font-size: 14px; color: rgba(0, 0, 0, 0.58); text-align: center; }
.ft-app ul li.google a { padding-left: 28px; }
.ft-app ul li.apple a { padding-left: 25px; }

.address li span { padding-left: 7px; font-size: 14px; font-weight: 400; line-height: 1.6; letter-spacing: -1px; }
.address li span b { position: relative; display: inline-block; margin: 0 8px; height: 12px; width: 2px; background: #D8D8D8; }
.address li i.addr { margin-top: -2px; width:11px; height: 16px; background: url("/images/ico_location_2x.png") no-repeat left center; background-size: 11px 16px !important; }
.address li i.business { margin-top: -2px; width:11px; height: 16px; background: url("/images/ico_info_2x.png") no-repeat left center; background-size: 10px 16px !important; }

/* 푸터 공지 */
.footer .notice-wrap { border-bottom: 11px solid #F5F5F5; border-top: 1px solid #ddd; background-color: #fff; }
.footer .notice-wrap .notice-box { width: 1232px; margin: 0 auto; padding: 0 16px; }
.footer .notice-slide { color: rgba(0, 0, 0, 0.78); height: 86px; cursor: pointer; }
.footer .notice-slide .swiper-slide { height: 86px; width: 100%; display: flex; align-items: center; }
.footer .notice-slide .content-area,
.footer .notice-slide .side-area { display: flex; align-items: center; }
.footer .notice-slide .content-area { font-size: 14px; width: calc(100% - 120px); }
.footer .notice-slide .type { font-weight: 700; flex: none; }
.footer .notice-slide .subject { max-width: calc(100% - 90px); display: inline-block; }
.footer .notice-slide .type+.subject { margin-left: 16px; font-weight: 400; }
.footer .notice-slide .type+.subject p {display:flex; justify-content: flex-start; align-items: center;}

.footer .notice-slide .subject strong { font-weight: 400; display: block; }
.footer .notice-slide .subject strong:hover { text-decoration: underline; }
.footer .notice-slide .side-area { flex: none; margin-left: auto; }
.footer .notice-slide .date { color: rgba(0, 0, 0, 0.58); font-size: 13px; letter-spacing: -0.5px; line-height: 1.6; display: block; }
.footer .notice-slide .btn-more { font-size: 13px; font-weight: 700; margin-left: 24px; margin-top: -3px; line-height: 1.6; padding-right: 1px; }
.footer .notice-slide .type+.subject .flag.notice { border: 2px solid var(--theme-color); color: var(--theme-color); margin-right: 8px; }

/* 에러페이지 */
#error { background-color:#fff; }
.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; }
.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 { margin-right: 4px; }
.error-cont .btn { width: 152px; height: 42px; background-color: #fff; border-radius: 19px; border-width: 2px; font-weight: bold; color: #000 !important; border: 1px solid #000; transition: inherit; cursor: pointer; }
.error-cont .btn.btn-theme:hover { background-color: #000; color:#fff !important; }
.page-error svg circle { stroke: #000; }
.page-error svg path { fill: #000; }




/* 게시판 관련 */
.line1 {height: 1px;background-color: #000;}
.line2 {height: 1px;background-color: #ddd;}
.line3 {height: 2px;background-color: #000;}
.line4 {height: 2px;background-color: #ddd;}

/* 게시글 작성의 분류박스 */
.board-w-option .board-type { display: inline-block; margin: 0; margin-left: 8px; }
.board-w-option .board-type select { height: initial; border: 1px solid #d4d4d4; border-radius: 4px; margin-bottom: -1px; /*font-family: 'NanumSquareRound', sans-serif; */ height: 32px; }

.board-type { text-align: right; margin-bottom: 8px; }
.board-type select { height: 32px; padding: 5px 30px 5px 5px; background: url(/images/ico_arrow_bottm_sm_2x.png) no-repeat right 10px center / 10px 7px; border: 1px solid rgba(153, 153, 153, 1); padding-left: 12px; font-family: 'Noto Sans KR', sans-serif; font-weight: 400; font-size: 14px; }
.board-type option { width: 80px; }
.write-box { text-align: right; margin-top: 24px; }
.write-box .write-btn { display: inline-block; text-align: center; font-size: 16px; font-weight: 800; width: 120px; height: 54px; line-height: 52px; }
.write-box .write-btn-2 { display: inline-block; height: 48px; line-height: 46px; padding: 0 24px 0 52px; font-size: 14px; font-weight: bold; color: #40454E; background:url("/images/ico_write_black_2x.png") no-repeat left 24px center; background-size: 19px 19px; background-color: #fff; border: 1px solid #dbdbdb; border-radius: 8px; transition: background-color 0.2s, color 0.2s, border-color 0.2s; }
.write-box .write-btn-2:hover { background-color:#f5f5f5; }

/* tab style */
.tab-type1 { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; overflow-x: auto; display: flex; } /* Firefox */
.tab-type1::-webkit-scrollbar { display: none; }
.tab-type1 > li { margin-right: 4px; margin-bottom: 4px; flex: none; }
.tab-type1 > li:last-child { margin-right: 0; }
.tab-type1 > li > a { display: block; height: 46px; line-height: 46px; padding: 0 20px; font-size: 16px; }
.tab-type1 > li > a.active { background-color: #383838; background-color: var(--theme-color); border-radius: 40px; color: #fff; }

.tab-type2 { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; overflow-x: auto; display: flex; } /* Firefox */
.tab-type2::-webkit-scrollbar { display: none; }
.tab-type2 > li { margin-right: 4px; margin-bottom: 4px; flex: none; }
.tab-type2 > li:last-child { margin-right: 0; }
.tab-type2 > li > a { display: block; height: 46px; line-height: 46px; padding: 0 20px; font-size: 16px; }
.tab-type2 > li > a.active { background-color: #ECEEF6; border-radius: 40px; color: rgba(0, 0, 0, 0.78); }

.tab-type3 { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; overflow-x: auto; display: flex; } /* Firefox */
.tab-type3::-webkit-scrollbar { display: none; }
.tab-type3 > li { margin-right: 4px; margin-bottom: 4px; flex: none; }
.tab-type3 > li:last-child { margin-right: 0; }
.tab-type3 > li > a { display: block; height: 46px; padding:12px 28px; font-size: 14px; color: rgba(0, 0, 0, 0.38); border: 1px solid #DDD; border-radius: 8px; }
.tab-type3 > li > a.active, .tab-type3 > li > a:hover { background-color: #383838; background-color: var(--theme-color); color: #fff; -webkit-text-stroke: 0.2px white; border: 1px solid #383838; border: 1px solid var(--theme-color); }


/* 리스트형 게시판 type1 : 기본 */
.board-list-type1 { }
.board-list-type1 > li { border-bottom: 1px solid #eee; }
.board-list-type1 .board-box { }
.board-list-type1 .board-box > a { position: relative; display: block; padding: 32px; }
.board-list-type1 .board-box > a::after { display: block; content: ''; position: absolute; top: 50%; right: 32px; width: 48px; height: 48px; margin-top: -24px; background: url("/images/ico_page_arrow_default_2x.png") no-repeat; background-size: 48px 48px; }
.board-list-type1 .notice, .board-list-type1 .type { color: #383838; color: var(--theme-color); display: inline-block; }
.board-list-type1 .notice + .date, .board-list-type1 .type + .date { margin-left: 8px; display: inline-block; }
.board-list-type1 .date { font-size: 13px; color: rgba(0, 0, 0, 0.38); }
.board-wrap.fap .board-list-type1 .date { display:none }
.board-list-type1 .subject { margin-top: 4px; display: flex; align-items: center; }
.board-list-type1 .subject > * { margin-right: 8px; }
.board-list-type1 .subject strong { font-weight: normal; /* min-width: 92%; */ }
.board-list-type1 > li.bo-notice .subject strong { font-weight: bold; }
.board-list-type1 > li:hover { background: #F9F9F9; }
.board-list-type1 > li:hover .board-box > a::after { background-image: url("/images/ico_page_arrow_hover_2x.png"); background-color: #383838; background-color: var(--theme-color); }
.board-list-type1 > li:hover .subject strong { font-weight: bold; }

/* 리스트형 게시판 type1 : 토글방식 */
.board-list-type1.toggle .board-box > * { position: relative; display: block; padding: 32px; }
.board-list-type1.toggle .board-box > a::after { display: block; content: ''; position: absolute; top: 50%; right: 32px; width: 48px; height: 48px; margin-top: -24px; background: url("/images/ico_page_arrowB_default_2x.png") no-repeat; background-size: 48px 48px; }
.board-list-type1.toggle .board-box > .a-box { display: flex; height: 0; padding: 0 32px; overflow: hidden; background-color: #fff; transition: all 0.3s; font-weight: 300; line-height: 22px; color: rgba(0, 0, 0, 0.58); transition: all 0.3s; }
.board-list-type1.toggle .board-box > .a-box .a { margin-right: 16px; font-weight: 800; }
.board-list-type1 > li:hover .board-box > a::after { background-image: url("/images/ico_page_arrow_hover_2x.png"); background-color: var(--theme-color); }

.board-list-type1.toggle > li:hover .board-box > a::after { background-color: transparent; background-image: url("/images/ico_page_arrowB_default_2x.png"); }
.board-list-type1.toggle > li .board-box.active > .q-box .subject strong { font-weight: 800; }
.board-list-type1.toggle .subject { margin-top: 10px; font-size: 18px; align-items: start; }
.board-list-type1.toggle .subject strong { overflow: visible; text-overflow: initial; white-space: normal; min-width: auto; max-width: 92%; line-height: 1.5; }
.board-list-type1.toggle > li:hover .subject strong { font-weight: 300; }
.board-list-type1.toggle .q, .board-list-type1.toggle .a { font-size: 18px; color: #C1C3CF; }
.board-list-type1.toggle > li .board-box.active > .a-box { height: auto; padding: 32px; border-top: 1px solid #ddd; }
.board-list-type1.toggle > li .board-box.active > a::after { background-image: url("/images/ico_page_arrowT_active_2x.png"); }
.board-list-type1.toggle > li .board-box.active > a { background-color: #F9F9F9; }
.board-list-type1.toggle > li:hover .board-box > a::after { }

/* 리스트형 게시판 type2 : 공지사항 */
.board-list-type2 { }
.board-list-type2 li { border-bottom: 1px solid #eee; }
.board-list-type2 li a { position: relative; display: block; padding: 24px 0 23px; }
.board-list-type2 li a:hover strong { text-decoration: underline; }
.board-list-type2 li a::after { display: block; content: ''; clear: both; }
.board-list-type2 li .subject { padding-right: 80px; font-weight: bold; font-size: 16px; line-height: 120%; }
.board-list-type2 li .subject span { color: #383838; color: var(--theme-color); margin-right: 8px; vertical-align: middle; }
.board-list-type2 li .subject span + strong { max-width: 80%; padding-right: 2px; }
.board-list-type2 li .subject strong { display: inline-block; max-width: 90%; color: rgba(0, 0, 0, 0.78); vertical-align: text-bottom; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.board-list-type2 li .subject i.new { margin-left:4px; }
.board-list-type2 li .date { position: absolute; top: 50%; right: 0; transform: translateY(-50%); font-size: 12px; color: rgba(0, 0, 0, 0.38); letter-spacing: -1px; }

/* 리스트형 게시판 type3 : 시간표 */
.board-list-type3 { }
.board-list-type3 li { border-bottom: 1px solid #eee; }
.board-list-type3 li a { position: relative; display: block; padding: 24px 0 23px; }
.board-list-type3 li a:hover strong { text-decoration: underline; }
.board-list-type3 li a::after { display: block; content: ''; clear: both; }
.board-list-type3 li .subject { padding-right: 80px; font-weight: bold; font-size: 16px; line-height: 120%; }
.board-list-type3 li .subject { padding-right:0; }
.board-list-type3 li .subject .sub { display: inline-block; padding: 1px 3px; border-radius: 4px; font-size: 12px; color: #383838; color: var(--theme-color); }
.board-list-type3 li .subject .sub-1 { margin-right:4px; border: 1px solid #383838; border: 1px solid var(--theme-color); }
.board-list-type3 li .subject .sub-2 { margin-right:8px; color: #999CA2; border: 1px solid #999CA2; }
.board-list-type3 li .subject span + strong { max-width: 80%; padding-right: 2px; }
.board-list-type3 li .subject strong { display: inline-block; max-width: 90%; color: rgba(0, 0, 0, 0.78); vertical-align: text-bottom; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.board-list-type3 li .subject i.new { margin-left:4px; }
.board-list-type3 li .date { position: absolute; top: 50%; right: 0; transform: translateY(-50%); font-size: 12px; color: rgba(0, 0, 0, 0.38); }

.board-list-type4  .htable-wrap .tbody > ul > li b {display: none;}

/* 테이블 게시판(커뮤니티) */
.flag { display: inline-block; vertical-align: middle; }
.flag.new { width: 16px; height: 16px; margin-left: 4px; 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_new_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; }

.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: 12%; }
.htable-wrap .thead > ul > li.cell-subject { flex-grow: 1; justify-content: center; width: auto; }
.htable-wrap .thead > ul > li.cell-name { width: 10%; }
.htable-wrap .thead > ul > li.cell-date { width: 10%; }
.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; 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: 12%; }
.htable-wrap .tbody > ul > li.cell-cate .cate { word-break: keep-all; }
.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; padding-left: 4px; }
.htable-wrap .tbody > ul > li.cell-subject .cnt { }
.htable-wrap .tbody > ul > li.cell-subject .flag.new { margin-top: 2px; }
.htable-wrap .tbody > ul > li.cell-name { flex-shrink: 0; width: 10%; }
.htable-wrap .tbody > ul > li.cell-name span { }
.htable-wrap .tbody > ul > li.cell-date { flex-shrink: 0; width: 10%; }
.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%; }
.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: #f7f7f7; 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); }

.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; }


.board-element-wrap { display: flex; flex-direction: column; }
.board-element-wrap .write-box + .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; 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 { height: 36px; margin-right: 6px; padding: 0 30px 0 12px; background-color: #fff; color: rgba(0, 0, 0, 0.78); background-position: center right 10px; }
.input-searchBox { position: relative; width: 320px; height: 36px; background: #FFF; border: 1px solid #D8D8D8; border-radius: 4px; }
.input-searchBox input { width: 100%; height: 100%; padding-right: 60px; border: none; font-weight: normal; }
.input-searchBox button { position: absolute; top: 4px; right: 3px; width: 54px; height: 26px; line-height: 20px; background: #FFF; border: 1px solid #999CA2; border-radius: 4px; font-weight: bold; font-size: 12px; color: #40454E; }



/* 갤러리형 게시판 type1 */
.board-gallery-type1 { display: flex; flex-wrap: wrap; margin-left: -14px; }
.board-gallery-type1::after { display: block; content: ''; clear: both; }
.board-gallery-type1 > li { float: left; width: 25%; padding-left: 14px; padding-bottom: 16px; }
.board-gallery-type1 .board-box { }
.board-gallery-type1 .board-box > a { }
.board-gallery-type1 .gall-thumb { width: 100%; height: 0; padding-bottom: 99%; background-color: #f5f5f5; border: 1px solid #dbdbdb; border-radius: 8px; overflow: hidden; }
.board-gallery-type1 .gall-thumb span { display: block; width: 100%; height: 100%; padding-bottom: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; }
.board-gallery-type1 .gall-thumb.no-img span { background-image: url("/images/no_img_2x.png"); background-size: 92px 113px; }
.board-gallery-type1 .gall-cont { position: relative; margin-top: 8px; margin-bottom: 16px; }
.board-gallery-type1 .gall-cont .notice { display:block; color: #383838; color: var(--theme-color); font-size:13px; font-weight: bold; vertical-align: middle; }
.board-gallery-type1 .gall-cont .subject { height: 44px; }
.board-gallery-type1 .gall-cont .subject strong { display: inline; vertical-align: middle; font-weight: bold; color: rgba(0, 0, 0, 0.58); }
.board-gallery-type1 .gall-cont .name { margin-top: 8px; font-weight: normal; font-size: 12px; color: rgba(0, 0, 0, 0.38); letter-spacing: -1px; }
.board-gallery-type1 .gall-cont .date { margin-top: 8px; font-weight: bold; font-size: 13px; color: rgba(0, 0, 0, 0.38); letter-spacing: -1px; }
.board-gallery-type1 .gall-cont .view { position: absolute; bottom: 0; right: 0; font-size: 13px; color: rgba(0, 0, 0, 0.38); letter-spacing: -1px; }
.board-gallery-type1 > li.bo-notice .subject strong { font-weight: bold; color: rgba(0, 0, 0, 0.78); }
.board-gallery-type1 > li:hover .subject strong { text-decoration: underline; }


/* 게시판 상세 */
.board-view-wrap { margin-top: 16px; border-top: 2px solid #444; }
.board-view-wrap .board-header { display: flex; align-items: center; justify-content: space-between; padding: 32px 0; border-bottom: 1px solid #eee; }
.board-title .notice { margin-right: 0px; color: #383838; color: var(--theme-color); font-weight: bold; }
.board-title .notice::before { content:"["; }
.board-title .notice::after { content:"]"; }

.board-title .classify { margin-right: 6px; font-weight: bold; color: rgba(0, 0, 0, 0.58); }
.board-title .date { font-weight: normal; font-size: 13px; color: rgba(0, 0, 0, 0.38); }
.board-title .subject { margin: 4px 0; line-height: 25px; }
.board-title .subject strong { display: inline; margin-right: 4px; font-size: 18px; }
.board-title .subject .new { margin-top: -2px; }
.board-title .write-info .name { display: inline-block; }
.board-title .write-info .center, .board-title .write-info .grade { color: rgba(0, 0, 0, 0.38); }
.board-header .board-title { width:100%; }
.board-header .board-metoo { flex-shrink: 0; }
.board-header .writer { display:flex; justify-content: space-between; align-items: center; }
.board-cont { padding-top: 24px; }
.board-cont .view-cont { padding: 16px; font-size: 16px; line-height: 180%; color: #1a1818; font-weight: normal; }
.board-cont .view-cont a { color: #0782C1; text-decoration: underline; }
.board-cont .view-cont img { display: block; height: auto !important; margin-top: 10px; }
.board-cont .view-cont ol { display: block; list-style-type: decimal; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px;}
.board-cont .view-cont ul { display: block; list-style-type: none; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px;}
.board-cont .view-cont blockquote { margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 40px; margin-inline-end: 40px; font-style: italic; font-family: Georgia, Times, "Times New Roman", serif; padding: 2px 0; border-style: solid; border-color: #ccc; border-width: 0; padding-left: 20px; padding-right: 8px; border-left-width: 5px; }
.board-cont .view-cont a, .board-cont .view-cont em, .board-cont .view-cont strong, .board-cont .view-cont i { display: inline-block; }
.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 { 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-header .board-metoo { display:flex; width:100%; justify-content: right; }
.board-header .writer .write-info + .board-metoo { width: auto; }


.board-cont .view-file { margin-bottom: 24px; }
.sub-cont .view-file { margin-top: 16px; }
.commentWriter { position: relative; margin-top: 24px; 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: 12px; line-height: 30px; }
.writer-info .name { display: inline-block; margin-right: 2px; font-size: 16px; }
.writer-info .center { margin-right: 2px; font-size: 13px; color: rgba(0, 0, 0, 0.58); }
.writer-info .grade { margin-right: 8px; font-size: 13px; color: rgba(0, 0, 0, 0.58); }
.writer-info .date { font-size: 12px; 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: 14px; 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; flex-wrap: wrap; }
.file-input-wrap .inputBtn { flex-shrink: 0; width: 78px; margin: 2px 8px 0 0; }

/* 게시판 상세 댓글 */
.board-comment-wrap { margin-top: 64px; }
.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 { padding-bottom: 16px; }
.commentBox::before { display: block; content: ''; width: 100%; height: 2px; margin: 16px 0 21px; 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 { margin-bottom: 12px; padding: 8px 0; font-size: 14px; color: #383838; font-weight: normal; }
.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 { margin-bottom: 4px; }
.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-bottom:16px; padding: 0 16px; }
.cmtReplyList + .commentBox { margin-top: 32px; }
.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: 24px; border-top:1px solid #dbdbdb; }
.board-user-btn > div { margin-top: 16px; }
.board-user-btn .user-btn button { height: 32px; line-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 { flex-shrink: 0; text-align: right; }
.board-prev-next button { position: relative; height: 32px; line-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-prev-next button:first-child { margin-left: 0; }


/* 게시판 댓글 모달 */
.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; margin-top: 16px;}
.modal_writer .writer-box textarea { height: 160px;min-height: auto; }
.modal_writer .writer-box button { width: 100%; height: 54px; margin-top: 12px; margin-left: 0; }


/* 게시글 작성 */
.board-write-form { padding-top: 12px; border-top: 1px solid #000; }
.board-w-group { margin-bottom: 8px; }
.board-w-group select { height: 32px; 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: 80px; 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); font-weight: normal; }
.board-w-option .notice-date input { display: inline-block; }
.editor-content { border-top: 1px solid #dbdbdb; border-bottom: 1px solid #eee; }
.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 .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 .fileList-wrap > p { color: rgba(0, 0, 0, 0.58); }
.board-w-file .fileList-wrap .fileList li:last-child { margin-right: 0px; margin-bottom: 16px; }
.board-w-btn { margin-top: 12px; text-align: right; }
.board-w-btn button { width: 97px; height: 46px; margin-left: 6px; border-radius: 8px; }
.cke_editor_contents { width: auto !important; }

.heartBtn { display: inline-block; line-height: 24px; }
.heartBtn i.heart { width: 24px; height: 24px; margin-right: 4px; vertical-align: top; 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 { display: inline-block; margin-left: 4px; line-height: 24px; font-weight: bold; color: #383838; color: var(--theme-color); }
.likeBtn { display: inline-block; }
.likeBtn i.like { position: relative; width: 18px; height: 18px; margin-right: 4px; overflow: hidden; }
.likeBtn i.like::before { display: block; content: ''; position: absolute; top: 1px; left: 1px; width: 16px; height: 16px; background-color: rgba(0, 0, 0, 0.3); border-radius: 50%; }
.likeBtn.active i.like::before { background-color: #383838; background-color: var(--theme-color); }
.likeBtn i.like::after { display: block; content: ''; position: absolute; top: 0; left: 0; width: 18px; height: 18px; background: url("/images/ico_like_2x.png") no-repeat center; background-size: 18px 18px; z-index: 1; }
.likeBtn span { display: inline-block; vertical-align: middle; font-weight: normal; }
.likeBtn b { display: inline-block; vertical-align: bottom; 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; font-weight: normal; }
.commentBtn b { display: inline-block; vertical-align: bottom; 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; display: flex; justify-content: flex-start; align-items: center; }
.inputBtn label span { display: inline-block; margin-left: 8px; color: rgba(0, 0, 0, 0.58); white-space: nowrap; }
.moreBtn { width: 100%; height: 44px; line-height: 44px; margin-top: 16px; 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/common/ico_arrow_bottm_2x.png") no-repeat right center; background-size: 12px 8px }
i.file { width: 14px; height: 14px; background: url("/images/ico_file_2x.png") no-repeat center; background-size: 14px 14px; }
i.lock { width: 12px; height: 16px; background: url("/images/ico_lock_2x.png") no-repeat center; background-size: 12px 16px; display: none; }
i.lockOpen { width: 16px; height: 16px; background: url("/images/ico_lock_open_2x.png") no-repeat center; background-size: 16px 16px; }


/* 검색기능 추가 */
.header_search_pos {flex: 1;}
.header_search { width: 424px; z-index: 999; display: flex; justify-content: space-between; align-items: center; border-radius: 100px; background: #fafafa; border: 1px solid #d8d8d8; padding: 6px 6px 6px 26px; margin-left: 48px; }
.header_search input { flex: 1; background: transparent; border: none; margin-right: 8px;}
.header_search input::placeholder { font-size: 13px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; text-align: left;}
.header_search button {height: 42px; }
.lnb_search_pos {display: none;}

/* 교육기관 툴팁 */
.edu_tooltip {position: relative; display: block; background:var(--theme-color); border-radius: 4px; padding: 12px; margin-top: 10px; width: fit-content;}
.edu_tooltip>svg {position:absolute; top:-10px; left:50%; transform: translateX(-50%)}
.edu_tooltip>span { white-space: nowrap; display:flex; justify-content: flex-start; align-items: center; font-size: 12px; font-weight: 700; line-height: 1.2; letter-spacing: -0.05em; text-align: left; color: #fff;}
.edu_tooltip>span>a {margin-left: 6px;}


/* 검색결과 페이지 */
.lec_search_box { position: relative; display: flex; justify-content: flex-start; flex-direction: column; align-items: center; border-radius: 16px; border: 1px solid #ddd; padding: 40px 0px 32px; margin-bottom: 24px; } 
.lec_search_pos { position: relative; display: block; width: 100%; margin-bottom: 8px; padding: 0 16px; } 
.lec_search { max-width: 800px; width: 100%; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; border-radius: 100px; background: #fafafa; border: 1px solid #d8d8d8; padding: 6px 6px 6px 26px; caret-color: var(--theme-color) } 
.lec_search>input { flex: 1; border: 0; background: transparent; } 
.lec_search>input::placeholder { font-size: 13px; font-weight: 400; line-height: 1.4; letter-spacing: -1px; text-align: left; color: rgba(0, 0, 0, .30); } 
.lec_search>a { height: 42px; } 

.lec_search_fac_wrap { position: relative; display: none; width: 100%; border-top: 1px solid #ddd; margin-top: 8px; padding: 0 16px; } 
.lec_search_fac_wrap.active {display: block;}
.lec_search_factor { position: relative; display: flex; justify-content: flex-start; align-items: center; max-width: 800px; padding-top: 16px; width: 100%; flex-wrap: wrap; margin: 0 auto; } 
.lec_search_factor>li { display: flex; justify-content: center; align-items: center; background-color: var(--theme-color); border: 2px solid var(--theme-color); padding: 8px 8px 10px 16px; margin-right: 8px; border-radius: 100px; margin-bottom: 8px; } 
.lec_search_factor>li>span { color: #fff; font-size: 14px; font-weight: 700; line-height: 1; letter-spacing: 0em; text-align: left; cursor: pointer; } 
.lec_search_factor>li>a>i { margin-left: 4px; } 
.lec_search_factor>a { padding: 12px 8px 10px 16px; border-radius: 100px; border: 2px solid #444; font-size: 14px; font-weight: 700; line-height: 1; letter-spacing: 0em; text-align: left; color: rgba(0, 0, 0, .78); margin-bottom: 8px; } 
.lec_search_factor>a>i { margin-left: 4px; } 

.certify_bg { background-color: #F1EFE3; } 
.certification-rene { position: relative; display: block; margin: 0 auto; width: 100%; height: calc(100vh - 80px); overflow: hidden; } 
.certification-rene::before { content: ''; position: absolute; left: -60px; top: 0; background: url('/images/certify/certify_deco_text.png') no-repeat center / contain; height: 809px; width: 677px; } 

.certification-rene .code { position: absolute; top: 40px; right: 32px; font-family: 'S-CoreDream-3Light'; font-size: 12px; font-weight: 700; line-height: 1.2; text-align: right; } 
.certification-rene .edu_class { position: absolute; top: 50%; left: 50%; max-width: 872px; width: 100%; transform: translate(-50%, -50%); display: flex; justify-content: center; align-items: center; flex-direction: column; } 
.certification-rene .edu_class>* { margin-bottom: 39px; object-fit: contain; font-family: 'S-CoreDream-3Light'; font-size: 24px; font-weight: 500; line-height: 1; text-align: center; } 
.certification-rene .edu_class span { padding: 0 20px; padding-bottom: 8px; border-bottom: 2px solid #000; } 
.certification-rene .edu_class>*:first-child { margin-bottom: 46px; } 

.certification-rene .edu_class>*.certify_logo { width: 96px; height: 94px; } 
.certification-rene .edu_class>*.certify_text_01 { width: 280px; height: 24px; } 
.certification-rene .edu_class>*.certify_text_02 { width: 280px; height: 24px; } 
.certification-rene .edu_class>*.certify_text_03 { width: 727px; height: 48px; } 
.certification-rene .edu_class>*.certify_text_04 { width: 280px; height: 24px; } 

.certification-rene .date { position: absolute; left: 32px; bottom: 27px; display: flex; flex-direction: column; align-items: flex-start; } 
.certification-rene .date img { object-fit: contain; width: 42px; height: 14px; } 
.certification-rene .date span { font-family: 'S-CoreDream-3Light'; font-size: 16px; font-weight: 500; line-height: 1.2; text-align: left; padding-bottom: 4px; margin-bottom: 8px; width: 280px; border-bottom: 2px solid #000000; } 
.certification-rene .certify_logo_timeEdu { position: absolute; bottom: 56px; right: 32px; width: 189px; height: 41px; } 
 
.rene.print { position: relative; background-color: #E0DED3; display: flex; justify-content: center; align-items: center; height: 80px; } 
.rene.print a { position: relative; padding: 16px 48px; background-color: #000000; font-size: 18px; font-weight: 700; line-height: 1.4; letter-spacing: -1px; text-align: center; color: #fff; } 

/* 사고력 연산 지도사 과정 수료증 */
.certify_think, .certify_think * { font-family: 'Noto Serif KR', serif !important; color: #000; letter-spacing: 1.1px; }
.certify_bg.certify_think { position: relative; padding: 28px; margin: 0 auto; margin-bottom: 80px; max-width: 850px; min-width: 850px; background-color: #fff; }
.certify_bg.certify_think img { width: 100%; height: auto; }
.certify_bg.certify_think .certification-rene::before { display: none; }
.certify_bg.certify_think .certification-rene { position: absolute; top: calc(50% - 32px); left: 50%; transform: translate(-50%, -50%); width: 75%; height: 75%; max-width: 740px; min-width: 640px; }
@media screen and (max-width: 850px) {
    .certify_bg.certify_think .certification-rene { min-width: 640px; left: 0; transform: translate(110px, -50%); }
}
.certify_think.rene.print { position: fixed; bottom: 0; left: 0; width: 100%; background-color: #e9e9e960; backdrop-filter: blur(10px);}
.certify_think .code { position: relative; top: unset; right: unset; font-size: 18px; font-weight: bold; }
.certify_think .certification-rene .edu_class span { padding: 0; border: 0; }

.certify_think h1 { padding-bottom: 56px; }
.certify_think h1 b { padding-bottom: 10px; font-size: 64px; font-weight: bold; line-height: 140%; }
.certify_think h1 p { font-size: 23px; font-weight: bold; line-height: 160%; }
.certify_think .certify_title { font-size: 24px; padding-bottom: 16px; font-weight: bold; }
.certify_think .certify_name { padding-bottom: 56px; font-size: 32px; font-weight: bold; }
.certify_think .certify_title ,.certify_think .certify_name { width: 100%; text-align: right; }
.certify_think .certify_desc { padding-bottom: 66px; font-size: 28px; font-weight: normal; line-height: 200%; word-break: keep-all; }
.certify_think .certify_date { padding-bottom: 66px; font-size: 30px; font-weight: normal; }
.certify_think .certify_ceo { position: relative; }
.certify_think .certify_ceo * { font-weight: bold; line-height: 50px; }
.certify_think .certify_ceo p { font-size: 26px; }
.certify_think .certify_ceo b { padding-right: 6px; font-size: 32px; }
.certify_think .certify_ceo > img { position: absolute; top: 50%; right: -40px; transform: translateY(-50%); max-width: 90px; height: auto; z-index: 0; mix-blend-mode: multiply; }
.certify_think .certification-rene .certify_logo_timeEdu { position: relative; bottom: unset; right: unset; margin-top: 24px; width: 213px; height: 46px; }
.certify_think .certification-rene .edu_class { top: calc(50% + 36px); }
.certify_think .certification-rene .edu_class>* { margin-bottom: 0; }

@page { size: A4; margin: 0cm; margin-top: 0; margin-bottom: 0; } 
@media print { /**/
 .certify_bg.certify_think, .certify_bg.certify_think .certification-rene { max-width: none; min-width: none; height: 100%; }
 .certify_think .certification-rene .edu_class { width: 90%; }
 .certification-rene .edu_class {height: 16px;}
 .certify_think .code { top: 160px; left: 20px; }
 .certify_bg { background-color: #F1EFE3; -webkit-print-color-adjust: exact; } 
 /* .certification-rene { height: calc(100vh - 64px); }  */
 .rene.print { display: none; } 
 .certify_bg.certify_think { margin: 0 }

 .body, .certify_bg { margin-top:-1px }
 .certify_bg.certify_think { padding: 50px; overflow:hidden; width: 210mm; height: 297mm; page-break-before: always; transform: translate(-29px, -29px) !important; }
 .certify_bg.certify_think:nth-of-type(1) { page-break-before: avoid; page-break-inside: avoid }
 .certify_bg.certify_think img.ctf_bg_img { position:relative; transform: scale(0.93); }
 .certify_think .certify_desc { font-size: 24px; }
}

/* 엠플레이 수강 추가인증 */
.certification_wrap { min-height: 100vh; }
.cert_wrap_top { text-align: right; border-bottom: 1px solid #D8D8D8 }
.cert_wrap_top a { display: inline-block; width: 48px; height: 48px; background: url('/images/ico_lec_close_2x.png') center no-repeat; background-size: 100%; vertical-align: middle; }
.cert_wrap_cont { margin: 0 auto; margin-top: 80px; padding: 48px; max-width: 648px; border: 1px solid #D8D8D8; border-radius: 16px; box-shadow: 0 10px 10px #4444440F; }
.cert_wrap_cont h2 { margin-bottom: 24px; padding-bottom: 10px; font-size: 20px; line-height: 24px; border-bottom: 2px solid #000; }
.cert_wrap_cont .text_wrap { margin-bottom: 24px; padding: 6px 12px; height: 180px; background: #fff; font-size: 13px; border: 1px solid #ddd; border-radius: 8px; overflow-y: auto; }
.cert_wrap_cont > p { margin-bottom: 24px; padding: 24px 0 12px; border-bottom: 2px solid #000; font-size: 16px; line-height: 22px; text-align: center; font-weight: 700; }
.cert_wrap_cont .input-form:nth-child(1) { margin-bottom: 32px; }
.cert_wrap_cont button { margin-top: 24px; }



/* 과정수첩 */
.mycourse-notebook-list .tit { border-top: 1px solid #000; border-bottom: 1px solid #eee; }
.mycourse-notebook-list ul { display: grid; grid-template-columns: repeat(5, 1fr); gap: 40px 0; padding: 48px 0; }
.mycourse-notebook-list ul li { position: relative; display: flex; justify-content: center; align-items: center; margin: 0 auto; width: 172px; height: 172px; border-radius: 200px; background: #F5F5F5; box-shadow: 0px 1px 1px 0px #44444433; }
.mycourse-notebook-list ul li::after { content: ''; position: absolute; right: 0; bottom: 0; width: 88px; height: 83px; background: url('/images/img_badge_bg_right.png') no-repeat center / 100%; }
.mycourse-notebook-list ul li > div { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 160px; height: 160px; border-radius: 200px; color: #fff; }
.mycourse-notebook-list ul li > div::before { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 142px; height: 142px; border-radius: 200px; border: 1px dashed #FFFFFF }
.mycourse-notebook-list ul li > div::after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 154px; height: 154px; border-radius: 200px; border: 3px solid #FFFFFF }
.mycourse-notebook-list ul li > div p { max-width: 110px; font-size: 14px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.mycourse-notebook-list ul li > div .date { font-size: 12px; }
@media screen and (max-width: 1000px) {
.mycourse-notebook-list ul { grid-template-columns: repeat(3, 1fr); }
}
@media screen and (max-width: 580px) {
.mycourse-notebook-list ul { grid-template-columns: repeat(2, 1fr); gap: 12px 0; }
.mycourse-notebook-list ul li { zoom: 0.85; }
}




/* 설문조사 */
.lec_grid_typeB { grid-template-rows: 57px auto 0 !important; }
.inner_746 { max-width: calc(746px + 32px); }
.lec_grid_typeB .lec_video_tab { grid-column: 1 / 13; background: #fff; border-right: 0; }
.lec_grid_typeB .lec_research_tab { position: relative; grid-column: 1 / 13; grid-row: 2 / 3; height: calc(100vh - 57px); background: #F5F5F5; overflow: auto; scrollbar-width: thin; }
.lec_research_header h2 { font-size: 24px; }
.lec_research_box { margin-bottom: 32px; padding: 24px; border: 1px solid #D8D8D8; border-radius: 4px; box-shadow: 0px 1px 0px 0px #00000012; background: #fff; }
.lec_research_box .tit { display: flex; gap: 16px; padding: 16px; border-top: 2px solid var(--theme-color); border-bottom: 1px solid #444444; font-size: 16px; }
.sel_desc { display: flex; align-items: center; gap: 4px; padding-top: 4px; color: var(--theme-color); font-size: 12px; font-weight: 700; }
.select_area_box { position:relative; padding: 16px; border-bottom: 1px solid #DDDDDD; }
.select_area_box:hover { background: #F5F5F5; }
.select_area_box:active { background: #F1F1F1; }
.select_area_box.on::after { content: ''; position: absolute; left:0; top: 0; width: 100%; height: 100%; background: var(--theme-color); opacity: 0.08; pointer-events: none; }
.lec_grid_typeB .checkboxA, .lec_grid_typeB .radioA { width: 100%; }
.lec_grid_typeB .checkboxA label span { display: inline-block; }
.lec_grid_typeB .radioA input:checked + label::after { top: 10px; }
.lec_grid_typeB .btn-wrap button { max-width: 160px; }
.lec_grid_typeB .radioA input:checked + label span, .lec_grid_typeB .checkboxA input:checked + label span  { color: var(--theme-color); font-weight: 700; }
.lec_grid_typeB textarea { position: relative; z-index: 1; }
.research-modal-wrap .modal-title { border-width: 1px !important; }
.research-modal-wrap h2 { font-size: 24px; font-weight: 700; }
.research-modal-wrap ul { padding-top: 16px; border-top: 2px solid #000000; }
.research-modal-wrap ul li { margin-top: 8px; border: 1px solid #D8D8D8; border-radius: 8px; }
.research-modal-wrap ul li:hover { box-shadow: 0px 10px 10px 0px #4444440F; }
.research-modal-wrap ul li:active { box-shadow: unset; background: #F1F1F1; }
.research-modal-wrap ul li a { display: flex; gap: 8px; justify-content: space-between; align-items: center; padding: 16px; width: 100%; vertical-align: middle; }
.research-modal-wrap ul li a > p { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 16px; }
.research-modal-wrap .file-etc { width: 13px; height: 16px; margin-bottom: 3px; margin-right: 8px; opacity: 0.4; vertical-align: middle; }
.recvdo-modal-wrap .modal-content-box { padding: 0 !important; border-radius: 32px !important; border: 0 !important; }
.recvdo-modal-wrap .modal-header { padding: 60px 0; }
.recvdo-modal-wrap .emoji { font-size: 48px; }
.recvdo-modal-wrap .tit { font-size: 24px; font-weight: 700; }
.recvdo-modal-wrap .btn-wrap button { position: relative; flex: 1; height: 64px; color: var(--theme-color); font-size: 18px; font-weight: 700; }
.recvdo-modal-wrap .btn-wrap button::before { content:''; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: var(--theme-color); opacity: 0.3; pointer-events: none; }
.recvdo-modal-wrap .btn-wrap button.btn_retry { border-left: 2px solid #fff; }
.recvdo-modal-wrap .btn-wrap button span { position: relative; z-index: 2; }

@media screen and (max-width: 1024px) {
    .select_area_box:hover { background: unset; }
    .select_area_box:active { background: unset; }
    .research-modal-wrap ul li:hover { box-shadow: unset; }
    .research-modal-wrap ul li:active { background: unset; }
}