@font-face {
    font-family: 'GongGothicMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'GongGothicLight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

* {box-sizing: border-box;}
html, body {background-color: #eff2f6;}
.main_wrap {}
.fonts_l {font-family: 'GongGothicLight'; font-weight: 300}
.fonts_m {font-family: 'GongGothicMedium'; font-weight: 300}
.fonts_b {font-family: 'GongGothicMedium'; font-weight: 400}
.fonts_eb {font-family: 'GongGothicMedium'; font-weight: 700}
.links {cursor: pointer;}

/* 상단 { */
.top_wrap {position: fixed; width:100%; padding:20px 30px 20px 30px; background-color: #fff; box-shadow: 0px 0px 20px rgba(0,0,0,0.1); z-index: 98}
.top_wrap_ul1 {float:left; width: 60%;}
.top_wrap_ul1 img {height:32px;}
.top_wrap_ul2 {float:right;}
/* } */

/* 메인 { */
.body_wrap {padding: 103px 30px 30px 30px; padding-bottom: 104px; background-color: #fff;}
.body_wrap1 {padding: 103px 30px 30px 30px; padding-bottom: 104px; background-color: #fff;}
.box_est {padding: 30px; box-sizing: border-box; border-radius: 10px; box-shadow: 0px 0px 10px rgba(0,0,0,0.1); background-color: #fff;}
.box_est2 {padding: 20px; box-sizing: border-box; border-radius: 10px; box-shadow: 0px 0px 10px rgba(0,0,0,0.1); background-color: #fff;}
.info_box_tit {font-size: 18px; color:#777;}
.info_point {margin-top: 20px;}
.info_point_li1 {color:#48ad48; font-size: 28px; float:left;}
.info_point_li2 {float:right; background-color: #48ad48; color:#fff; padding: 12px 20px 12px 20px; border-radius: 50px; margin-top: -5px;}
.info_btn {margin-top: 20px;}
.point_list_btn {background-color: #48ad48; color:#fff; font-size: 16px; text-align: center; height: 50px; border-radius: 10px; border:0px; width: 100%;}
.main_title {display: block; margin-top: 40px; color:#777; margin-bottom: 15px;}
.ss_title {display: block; color:#777; margin-bottom: 15px;}
.main_bn_box {background-image: url('../image/main_bn_bg.png'); background-repeat: no-repeat; background-position: center right 20px; color:#777; line-height: 130%;}

.q_gnb {margin-top: 20px;}
.q_gnb_btn {background-color: #fff; text-align: center; width: 48%; box-shadow: 0px 0px 10px rgba(0,0,0,0.1); border-radius: 10px; border:0px; font-size: 16px; height:160px; word-break: keep-all;}
.q_gnb_btn img {height:60px;}
.q_gnb_btn dd:first-child {margin-bottom: 10px;}
.q_gnb_btn1 {float:left;}
.q_gnb_btn2 {float:right;}

/* } */

/* 로그인 { */
.login_wrap {padding: 30px; top: 50%; transform: translateY(-50%); position: absolute; width: 100%;}
.login_ci {text-align: center;}
.login_ci img {width: 80%;}
.login_inp {margin-top: 100px;}
.login_inp_li {margin-bottom: 20px;}
.login_inp_li label {display: block; font-size: 18px; margin-bottom: 10px;}
.inp {height: 60px; border-radius: 10px; width: 100%; border:0px; padding-left: 20px; padding-right: 20px; background-color: #f9f9f9; font-size: 16px;}
.inp:focus {border:1px solid #48ad48}
.login_inp_li_a {text-align: center;}
.login_inp_li_a a {margin-left: 10px; padding-left: 10px; font-size: 14px; border-left: 1px solid #ccc;}
.login_inp_li_a a:first-child {border-left: 0px; margin-left: 0px; padding-left: 0px;}
.login_btn {background-color: #48ad48; color:#fff; font-size: 18px; border-radius: 10px; height:70px; width: 100%; border:0px; margin-top: 20px;}
/* } */

/* 회원가입 { */
.join_wrap {padding: 30px;}
.join_top {position:relative; text-align: center;}
.top_left_btn {background-color: transparent; border:0px; position: absolute; top:5px; left: 0px; padding: 0px;}
.join_tit {font-size: 24px; line-height: 100%;}
.join_body {margin-top: 50px;}
.join_inp_tit_li1 {font-size: 20px; word-break: keep-all;}
.join_inp_tit_li2 {color:#666; margin-top: 7px;}

.switch {position: relative; display: block; height:70px; width: 100%; box-sizing: border-box; margin-top: 20px;}
.switch input {opacity: 0; width: 0; height: 0;} /* input 숨김 */
        
.toggle_btn {
    padding-left: 20px; padding-right: 20px;
    transition: all 350ms cubic-bezier(0.87, 1, 0.07, 1);
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #f1f1f1;
    width: 100%;
    font-size: 16px;
    color: #999;
    padding-top: 24px;
    padding-bottom: 20px;
    border-radius: 10px;
}

.toggle_btn svg circle {stroke:#999;}
.toggle_btn svg path {stroke:#999;}

.toggle_btn svg {float:left; margin-top: -2px;}
.toggle_btn p {float:left; margin-left: 15px; margin-top: 2px; margin-bottom: 0px;}
.toggle_btn a {float:right; border-bottom:1px solid #000; margin-right: 1px;}

input:checked + .toggle_btn {background-color: #48ad48; color:#fff; opacity: 1;}
input:checked + .toggle_btn svg circle {stroke:#fff;}
input:checked + .toggle_btn svg path {stroke:#fff;}

.join_inp_btn {margin-top: 30px;}
.agree_off_btn {background-color: #f1f1f1; color:#666; font-size: 18px; border-radius: 10px; height:70px; width: 100%; border:0px; margin-top: 20px;}
.join_inps {margin-top: 20px;}
.inp:read-only {background-color: #eeeeee;} 
.subs_btn {background-color: #fff; color:#48ad48; border:2px solid #eee; font-size: 16px; border-radius: 10px; height:60px; width: 100%; margin-top: 5px;}

.borders {border-top:1px solid #000; margin-top: 30px; height:30px; display: block;}
.inp::placeholder {color:#999;}
/* } */

/* 다중팝업 CSS */
.d_popup{display:none;position:fixed;left:0;top:0;width:100%;height:100%;z-index:1000}
.d_popup.on{display:block}
.d_popup .bg{position:absolute;width:100%;height:100%;background:rgba(0,0,0,0.6);}
.d_popup .wins{display:none;position:absolute;width:100%;top:0;left:0; height:100%;background:#f9f9f9; overflow-y: scroll;}
.d_popup .wins.on{display:block}
.d_popup .wins .wins_tit {padding: 30px; position:fixed; width: 100%; background-color: #f9f9f9; padding-bottom: 30px; padding-top: 30px; border-bottom: 1px solid #eee;}
.d_popup .wins .wins_con {padding: 30px; font-size: 14px; color:#777; word-break: keep-all; line-height: 150%; text-align:left; padding-top: 114px;}
.d_popup .wins .wins_tit .top_left_btn {top:28px; right: 25px; left: auto;}
.d_popup .wins .wins_tit .join_tit {text-align: left;}
/* } */

/* 탭 { */
.tabs_gnb {margin-left: -10px; margin-right: -10px;}
.contabroll dl {display: none;width: 100%;height: auto;border: 0px;margin-top: 20px;box-sizing: border-box; background-color: #fff; padding: 20px; border-radius: 10px; box-shadow: 0px 0px 10px rgba(0,0,0,0.1);}
.contabroll dl.on {display: block;}
.contabroll dd {float: left;margin: 0px;font-size: 14px;cursor: pointer;box-sizing: border-box;color:#777; width: 20%; text-align: center; padding-top: 10px; padding-bottom: 10px;}
.contabroll dd:nth-child(1) {box-sizing: border-box;}
.contabroll dd:nth-child(5) {box-sizing: border-box;}
.contabroll dd.on {color:#fff; background-color: #48ad48; border-radius: 40px;}
.tab_cont_area {padding: 30px;box-sizing: border-box;background-color: #f9f9f9;border-radius: 10px;margin-top: 40px;line-height: 150%;word-break: keep-all;}
.dot1 {background-color: #2764ef; width: 10px; height:10px; border-radius: 50%; display: block; top: 50%; transform: translateY(-50%); position: absolute;}
.dot2 {background-color: #ef2755; width: 10px; height:10px; border-radius: 50%; display: block; top: 50%; transform: translateY(-50%); position: absolute;}
.dot3 {background-color: #91ba2c; width: 10px; height:10px; border-radius: 50%; display: block; top: 50%; transform: translateY(-50%); position: absolute;}

.c1 {color:#2764ef;}
.c2 {color:#ef2755;}
.c3 {color:#91ba2c;}
.tabs_list_box {margin-bottom: 15px;}
.tabs_list_box_ul1 {float:left; position: relative; height:35px;}
.tabs_list_box_ul2 {float:left; width: 70%; padding-left: 25px;}
.tabs_list_box_ul3 {float:right; width: 20%; text-align: right; font-size: 12px;}

.tabs_tit {font-size: 14px; color:#777;}
.tabs_sub {font-size: 12px; color:#999; margin-top: 5px;}
.no_data {display: block; padding-top: 20px; padding-bottom: 20px; text-align: center; color:#999;}
/* } */

/* 매거진 { */
.swiper-slide-mg {border-radius: 10px; position: relative; height:133px !important; background-repeat: no-repeat; background-size: cover; background-position: center center;}
.swiper-slide-mg img {border-radius: 10px;}
.swiper-slide-mg .mg_bg {display: block; position: absolute; width:100%; height:100%; background-color: rgba(0,0,0,0.4); top:0px; left: 0px; border-radius: 10px;}
.swiper-slide-mg a {top: 50%; transform: translateY(-50%); position: absolute; width: 100%; color:#fff; padding-left: 20px; padding-right: 20px; text-align: center;}
/* } */

/* 하단 fixed 메뉴 { */
.btm_gnb {position: fixed; bottom:0px; left: 0px; width: 100%; padding: 20px 30px 20px 30px; box-shadow: 0px 0px 10px rgba(0,0,0,0.1); background-color: #fff; z-index: 98;}
.btm_gnb a {float:left; width: 50%; text-align: center; margin-left: 0px; margin-right: 0px;}
.btm_gnb a.on svg g path {fill:#4c5968;}
.btm_gnb a:hover svg g path {fill:#4c5968;}
/* } */

/* 캡챠 { */
#captcha {display:inline-block;position:relative; background-color: #fff; width: 100%; border-radius: 10px; padding-top: 5px; padding-bottom: 5px; text-align: center; border:1px solid #eee;}
#captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
#captcha #captcha_img {height:50px;border:0px;vertical-align:top;padding:0;margin:0; padding-top: 7px;}
#captcha #captcha_mp3 {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../../../img/captcha2.png') no-repeat;text-indent:-999px;border-radius:3px}
#captcha #captcha_reload {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('') no-repeat 0 -40px;text-indent:0;border-radius:3px; color:#000; margin-top: 5px;}
#captcha #captcha_key {margin:3px 0 0 3px;padding:0 5px;width:90px;height:43px;background:#fff;font-size:16px;font-weight:bold;text-align:center;border-radius:3px;vertical-align:top; color:#000; border:1px solid #eee;}
#captcha #captcha_key::placeholder {color:#999; font-size:16px}
#captcha #captcha_info {display:block;margin:5px 0 0;font-size:0.95em;letter-spacing:-0.1em}
.captcha label {display: none;}
/* } */

/* 캡챠 { */
#captcha.m_captcha {display:inline-block;position:relative; background-color: #fff; width: 100%; border-radius: 10px; padding-top: 5px; padding-bottom: 5px; text-align: center; border:1px solid #eee;}
#captcha.m_captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
#captcha.m_captcha #captcha_img {height:50px;border:0px;vertical-align:top;padding:0;margin:0; padding-top: 7px; width: 115px; display: inherit;}
#captcha.m_captcha #captcha_mp3 {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../../../img/captcha2.png') no-repeat;text-indent:-999px;border-radius:3px}
#captcha.m_captcha #captcha_reload {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('') no-repeat 0 -40px;text-indent:0;border-radius:3px; color:#000; margin-top: 5px;}
#captcha.m_captcha #captcha_key {margin:3px 0 0 3px;padding:0 5px;width:90px;height:43px;background:#fff;font-size:16px;font-weight:bold;text-align:center;border-radius:3px;vertical-align:top; color:#000; border:1px solid #eee;}
#captcha.m_captcha #captcha_key::placeholder {color:#999; font-size:16px}
#captcha.m_captcha #captcha_info {display:block;margin:5px 0 0;font-size:0.95em;letter-spacing:-0.1em}
.captcha.m_captcha label {display: none;}
/* } */


/* 히든 슬라이더 { */
.sh-side-options {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 9999;
    padding: 0 0;
    width: 100%;
    transform: translateX(100%);
    transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
    letter-spacing: -0.5px;
    background-color: #fff;
}

.sh-side-options.open {transform: translateX(0px);transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);}

.sh-side-demos-container {
    top: 0;
    left: 0;
    right: 0px;
    bottom: 0;
    position: absolute;
    overflow-y: hidden;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: right top;
    padding: 0px;
    padding-bottom: 0px;
}

.close_r {
    position: absolute;
    top: 30px;
    right: 70px;
    cursor: pointer;
    z-index: 99;
}

.r_prof_div {padding: 30px 40px 30px 40px; height: 100%;}
.left_info {font-size: 18px; color:#777; margin-top: 4px; padding-left: 25px;}
.left_info span {font-size: 22px;}
.sh-side-demos-loop {height:100%;}
.sh-side-demos-loop-container {position: relative; margin: 0 0px;margin-top: 0px; height: 100%;}
.bgs {background-color: rgba(0,0,0,0.7); position: fixed; top:0px; left:0px; width: 100%; height:100%; display: none; z-index: 999;}
.left_logout_btn {border:0px; background-color: transparent; color:#48ad48; position: absolute; bottom:50px; left: 65px;}
.left_logout_btn i {float:left;}
.left_logout_btn span {float:left; margin-left: 5px; margin-top: 5px; font-size: 16px;}
.left_logout_btn1 {border:0px; background-color: transparent; color:#48ad48; position: absolute; bottom:50px; left: 275px;}
.left_logout_btn1 i {float:left;}
.left_logout_btn1 span {float:left; margin-left: 5px; margin-top: 5px; font-size: 16px;}
/* } */

/* 메뉴 { */
#DB_navi42{position:relative;width:100%; letter-spacing: 0px; margin-top: 30px;}
#DB_navi42 a{text-decoration:none;display:block;}

#DB_navi42 .DB_1D{position:relative;width:100%;background:#fff;text-align:left}
#DB_navi42 .DB_1D a{font-size:20px;color:#777;height:55px;line-height:55px; padding-left: 25px; padding-right: 25px; border-radius: 10px;}
#DB_navi42 .DB_1D a:hover{color:#fff; background-color: #48ad48;}
#DB_navi42 .DB_1D.DB_select a{color:#fff; background-color: #48ad48;}

#DB_navi42 .DB_1D .DB_2D_wrap{display:none;text-align:left; padding-bottom: 20px;}
#DB_navi42 .DB_1D .DB_2D_wrap .DB_2D{position:relative;}
#DB_navi42 .DB_1D .DB_2D_wrap .DB_2D a{font-size:14px;color:#999;height:30px;line-height:30px;text-indent:0px;}
#DB_navi42 .DB_1D .DB_2D_wrap .DB_2D a:hover{color:#000}
#DB_navi42 .DB_1D .DB_2D_wrap .DB_2D.DB_select a{color:#000}

#DB_navi42 .DB_1D .DB_2D_wrap .DB_2D .DB_3D_wrap{display:none;position:relative;background:#f1f1f1;left:0px;top:0px;text-align:left;padding:15px 0px 15px 0px; border-bottom: 1px solid #eee;}
#DB_navi42 .DB_1D .DB_2D_wrap .DB_2D .DB_3D_wrap .DB_3D{}
#DB_navi42 .DB_1D .DB_2D_wrap .DB_2D .DB_3D_wrap .DB_3D a{font-size:13px;color:#666;background:#f1f1f1;height:30px;line-height:30px;text-indent:25px}
#DB_navi42 .DB_1D .DB_2D_wrap .DB_2D .DB_3D_wrap .DB_3D a:hover{color:#000;}
#DB_navi42 .DB_1D .DB_2D_wrap .DB_2D .DB_3D_wrap .DB_3D.DB_select a{color:#000;}
/* } */

/* 게시판 커스텀 { */
.btn_top {position: absolute; top:94px; right: 18px;}
.btn_more_opt {background-color: transparent; border:0px; padding-top: 2px;}
.btn_more_opt:hover {background-color: transparent;}
.more_opt {width: 70px; right:2px;}
.more_opt.is_list_btn {width: 100px; right:2px;}

#bo_cate ul {background-color: transparent; border-bottom: 0px;}
#bo_cate #bo_cate_on {color:#fff; background-color: #48ad48; border-radius: 50px;}
#bo_cate #bo_cate_on:after {background:none}
#bo_cate a {line-height: 36px; padding: 0px; padding-left: 15px; padding-right: 15px; color:#777;}
.po_chk {position: absolute; top:6px; right: 20px;}
#bo_cate {margin-bottom: 20px;}
.gall_li_tit {font-size: 18px; line-height: 130%; word-break: keep-all;}
#bo_gall .gall_li_tit {font-weight: normal;}
#bo_gall .gall_info {color:#777;}
.sv_member {color:#777;}
#bo_gall .gall_li .gall_img img, #bo_gall .gall_li .gall_img video {border-radius: 10px;}
.btn_submit {background-color: #48ad48; color:#fff; border-radius: 10px !important; font-family: 'GongGothicLight'; font-weight: 300}
.btn_submit:hover {background-color: #48ad48;}
.bo_vc_w .btn_submit {font-weight: normal}
.bo_v_cate {background-color: #48ad48; color:#fff; font-weight: normal; padding: 5px 10px 5px 10px; border-radius: 30px;}
#bo_v_con {font-size: 16px;}
#bo_v_file a:focus, #bo_v_file li:hover a, #bo_v_file a:active {text-decoration:none;color:#000}
#bo_v_link a:focus, #bo_v_link li:hover a, #bo_v_link a:active {text-decoration:none;color:#000}
#bo_vc h2 span {color:#48ad48}
.bo_vl_opt button {border:0px;}
.bo_vl_opt button:hover {background-color: transparent;}
.bo_vc_w textarea {padding: 20px;}
#bo_w {padding: 0px;}
#bo_w .bo_w_select select {border:0px;}
#bo_w .bo_w_select select:focus {outline: none;}
.bbs_inp {height: 60px; border-radius: 10px; width: 100%; border:0px; padding-left: 20px; padding-right: 20px; background-color: #fff; font-size: 16px;}
.bbs_inp:focus {border:1px solid #48ad48}
.cke_sc {display: none;}
.write_div {margin-bottom: 10px;}
.file_del {padding-top: 10px; display: block;}
.filebox .btn_file {
    border: 1px solid #eee;
    width: 70px;
    height: 40px;
    color: #999;
    line-height: 40px;
    font-weight: normal;
}
#bo_v {background-color: transparent; padding: 0px;}
#bo_v>header {padding: 0px;}
#bo_v_atc {padding: 0px;}
#bo_v_file {padding: 0px}
#bo_v_link {padding: 0px;}
#bo_vc {background-color: transparent; padding: 0px;}
.bo_vc_w {padding: 0px;background-color: transparent; margin-top: 10px;}
.bo_vc_w textarea {border:0px; resize: none;}
.bo_vc_w textarea:focus {border:1px solid #48ad48}
#bo_v_file a {color:#777;}
#bo_v_link a {color:#777;}
#bo_w .btn_cancel {
    width: 49%;
    line-height: 50px;
    height: 50px;
    padding: 0 30px;
    font-weight: normal;
    font-size: 1.083em;
    background: #ddd;
    border-radius: 10px;
    border: 0;
    color:#777;
}
#bo_w .btn_submit {font-weight: normal; height:50px;}
.bo_cmt {color:#48ad48;}

/* } */

/* 포인트 { */
.tabs_list_box_ul2 {text-align: left;}
.info_point_inner {margin-top:0px;}
.box_est_inner {padding-top: 20px; padding-bottom: 15px; margin-bottom: 20px;}
#point .tabs_list_box {border-bottom: 1px solid #ddd; padding-bottom: 15px;}
.ser_point_box {text-align: left; border-bottom: 1px solid #aaa; margin-bottom: 15px;}
.ser_p_btn1 {background-color: transparent; border:0px; height:50px; padding-left: 20px; padding-right: 20px; margin-left: 0px; margin-right: 0px; font-size: 16px; margin-bottom: -2px; color:#000;}
.ser_p_btn1.on {border-bottom: 3px solid #48ad48;}
.ser_p_btn2 {float: right; border:0px; background-color: transparent; margin-top: 12px;}

.modal {
    background: #fff;
    width: 100%;
    height: 250px;
    margin: 0;
    padding: 0;
    transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
    bottom: -250px;
    position: fixed;
    left: 0;
    text-align: left;
    z-index: 100;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    padding: 30px;
}

.modal_bg {background-color: rgba(0,0,0,0.5); width: 100%; height:100%; position: fixed; left: 0px; z-index: 99; display: none;top:0px;}
.modal-block {display: block;}
.filter_wrap.modal-open .modal {bottom: 0px;}
.modal_tit {font-size: 20px;}
.modal_sub {font-size: 14px; color:#888; margin-top: 10px;}
.modal_close {position: absolute; top:25px; right: 20px; color:#48ad48; border:0px; background-color: transparent;}
.modal_input {margin-top: 20px;}
.modal_inp {background-color: #f9f9f9; border:0px; border-radius: 10px; height:50px; width: 100%; text-align: center; font-size: 16px;}
.modal_input_t1 {float:left;width: 45%;}
.modal_input_t2 {float:left;width: 10%; text-align: center; margin-top: 15px; font-size: 18px;}
.modal_input_t3 {float:left;width: 45%;}

.modal_confirm {margin-top: 20px;}
.modal_confirm_btn {background-color: #48ad48; color:#fff; font-size: 16px; text-align: center; height: 50px; border-radius: 10px; border:0px; width: 100%;}
/* } */


