@charset "utf-8";
/* CSS Document */
/* com2zoa design  publishing kjh 2025.09.02 */
/* ※아래 적용된 스타일은 기본레이아웃 구성이므로 각 학교에 맞게 전반적 수정해야함 */

/* Common */
.basics_font {font-size:1.154em /*기준폰트 15px*/}
.clear_fix::after{content: ''; display: block; clear: both}

/* Layout */
#subpage .basics_font{font-weight:400}
#sub_left {display: none}
#subpage {min-height:350px; line-height:150%; margin:0 10px 50px 20px; font-weight:400}
.qmu_popup{display: none}

/* Subtop */
#subtop {position:relative}
#subtop h3 {position:relative}
#subtop h3 span{display:inline-block; font-weight:500; color:#333; position:relative; padding:24px 20px; font-size:19px; font-weight:600; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block}

/* Guide */
#sub_guide{z-index:10}
#sub_guide .btn_home {display: none}
#sub_guide .submn {display: none}
#sub_guide .guide_wrap {position: relative}

/* Visual */
.subvisual {position:relative; overflow:hidden}
.visual_wrap .visual_item {display:block !important; position:relative; padding-top:103px; box-sizing: border-box}
.visual_wrap .visual_item > a {height:inherit}
.visual_wrap .visual_item > a:focus-visible{outline:2px solid #000}
.visual_wrap .visual_item span.vbg_txt{height:0; width:0; line-height:0; font-size:0;text-indent:-9999999px}

/*퀵메뉴 */
.vquick_wrap {display:none}
.main_quick {display: none}
/* 탑버튼 */
.btn_top a {position:relative; display: block; width:55px; height:55px; padding:28px 0 0; text-align: center; background:url(../images/sub/btn_top_arr.png) no-repeat center 12px rgba(0,0,0,0.2); box-sizing: border-box}
.btn_top a span {position: relative; display: inline-block; padding:2px; color:#fff; font-size:16px}

/* Tab01 */
.tabnavi01 {margin:20px 0}
.tabnavi01 ul {display: flex; flex-wrap :wrap ; gap:10px}
.tabnavi01 ul li:first-child {margin-left:0}
.tabnavi01 ul li a {position:relative; display: block; height:auto; line-height:140%; padding:12px 60px 12px 16px; border-radius:5px 5px 15px 15px; font-weight:500; font-size: 16px; color:#4b4b4b; transition: all .3s; border:1px solid #dbdbdb}
.tabnavi01 ul li.on a, .tabnavi01 ul li a:hover {border-color:#5a5a5a; background:#5a5a5a; color:#fff}
.tabnavi01 ul li a:after {content: ""; position: absolute; width:23px; height:23px; border-radius:3px 3px 12px 12px; background:#eceeef url(../images/sub/bg_tabnavi01_off.gif) no-repeat 50% 50%; top:50%; right:10px; margin-top:-12px; transition: .2s; box-sizing: border-box} 
.tabnavi01 ul li.on a:after, .tabnavi01 ul li:hover a:after {background:#fff url(../images/sub/bg_tabnavi01_on.gif) no-repeat 50% 50%}

/* Tab02, boardTab */
.tabnavi02, .boardTab {margin:20px 0}
.tabnavi02 ul, .boardTab ul {overflow:hidden; display:flex; flex-wrap:wrap; border:1px solid #e9e9e9; border-radius:5px; background:#e9e9e9}
.tabnavi02 ul:after, .boardTab ul:after {content:""; clear:both; display:block; height:0; font-size:0; line-height:0}
.tabnavi02 ul li, .boardTab ul li {width:calc(100% / 5); box-sizing: border-box}
.tabnavi02 ul li a, .boardTab ul li a {display: block; padding:15px; background:#fff; font-weight: 500; font-size:15px; color:#111; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; transition:.3s; text-align: center; border-right:1px solid #e9e9e9; border-top:1px solid #e9e9e9}
.tabnavi02 ul li.on a, .tabnavi02 ul li:hover a, .boardTab ul li.on a, .boardTab ul li:hover a {background:#ff6554; color:#fff}

/********************************************* SUB content **********************************************/
/* content Common */
/* 페이지 준비중 */
.sub_loding{min-height: 450px; background: url(../images/sub/page_loding.gif) no-repeat center center; font-size:0}

/****TIT****/
h4.sub_tit4 {line-height:140%; padding:2px 0 2px 36px; margin:8px 0; background:url(../images/sub/subtit4.png) no-repeat left 2px; font-size:1.267em; font-weight:500; color:#000}
h5.sub_tit5 {line-height:140%; padding:0 0 0 25px; margin:10px 10px; background:url(../images/sub/subtit5.png) no-repeat 0 4px; font-size:1.2em; font-weight:500; color:#434343}

/* common 수정 */
.basics_font .col_red {color:#ff5b61}
.basics_font .col_blue {color:#1388ea}
.basics_font .col_org {color:#ff7733}
.basics_font .col_grn {color:#17b511}
.basics_font .col_pur {color:#8f51ff}

/* 공통 상단 */
.cont_toparea {margin:10px 0; text-align: center}
.cont_toparea .cont_commtop {position: relative; display:inline-block; min-width:270px; margin:0 auto; background:url(../images/sub/bg_commtop_bar.gif) repeat-x 0 50%}
.cont_toparea .cont_commtop:before {content:""; display: block; position: absolute; top:50%; left:0; width:7px; height:7px; margin-top:-3px; background:#4ea0ed; border-radius:50%}
.cont_toparea .cont_commtop:after {content:""; display: block; position: absolute; top:50%; right:0; width:7px; height:7px; margin-top:-3px; background:#936cfb; border-radius:50%}
.cont_toparea .cont_commtop p {display:inline-block; padding:5px 5px 0; background:#fff; font-family:'Gmarket Sans'; font-size:1.2em; font-weight:600; letter-spacing:1px}
.cont_toparea .cont_commtop p .tcol1 {color:#ffb8ba}
.cont_toparea .cont_commtop p .tcol2 {color:#ffccb2}
.cont_toparea .cont_commtop p .tcol3 {color:#ace0aa}
.cont_toparea .cont_commtop p .tcol4 {color:#b5ccf3}
.cont_toparea .cont_tit {padding:15px 0; text-align: center; font-size:1.6em; font-weight:700; word-break: keep-all}

/* 공통 블릿 리스트 텍스트박스 */
.cont_bltlst {padding:20px 22px; border:1px solid #c9c9c9; border-radius:5px; margin-bottom:25px}
.cont_bltlst ul li {display:flex; justify-content:flex-start; align-items:flex-start; line-height:150%; margin-top:8px}
.cont_bltlst ul li:first-child {margin-top:0}
.cont_bltlst ul li span.blt_mark {display:inline-block; padding:0 5px; margin-right:8px; flex-shrink:0; border-radius:5px; background:#949494; color:#fff}
.cont_bltlst ul li:nth-of-type(odd) span.blt_mark{background:#3d3d3d}

/* 공통 사진 포함 텍스트 박스  */
.cont_commbox {position: relative; padding-bottom:34px; margin-bottom:25px}
.cont_commbox .cont_cbtit {border-radius:10px 10px 0 0; padding:24px 28px; color:#fff; font-weight:700; font-size:1.467em}
.cont_commbox .cont_cbtxt {line-height:140%; min-height:40px; padding:24px 28px; word-break: keep-all; font-size:1.071em}
.cont_commbox:before {content:"Gwangju Cheomdan Global Center"; display: block; position:absolute; bottom:0; left:0; width:100%; height:34px; line-height:34px; padding-left:28px; background:#e3eaed; color:rgba(0,0,0,0.15); font-weight:800; font-size:1.071em; box-sizing: border-box}
.contimg {position: absolute;bottom:0; right:15px}
.cont_commbox .cont_cbtxt.cont_cbtxtimg {padding-right:300px}

/* 인사말 */
.gcgc_greet {background:url(../images/sub/bg_greet_global.png) no-repeat right 0 bottom 15px}
.greet_top {padding:20px 0 35px; text-align: center; background:url(../images/sub/bg_greettop_left.png) no-repeat left 10px bottom 0, url(../images/sub/bg_greettop_right.png) no-repeat right 10px bottom 0}
.greet_toptxt {position:relative; display:inline-block; padding:12px 35px 10px; border-bottom:1px solid #d7d7d7; font-size:1.133em; background:url(../images/sub/bg_quotes_left.png) no-repeat left 5px top 0, url(../images/sub/bg_quotes_right.png) no-repeat right 5px top 0}
.greet_toptxt:before {content:""; display: block; position: absolute; bottom:-3px; left:0; width:6px; height:6px; background:#d7d7d7; border-radius:50%}
.greet_toptxt:after {content:""; display: block; position: absolute; bottom:-3px; right:0; width:6px; height:6px; background:#d7d7d7; border-radius:50%}
.greet_toptxt p {display:inline-block; font-size:1.176em; font-weight:700}
.greet_toptit {font-family:'Gmarket Sans'}
.greet_toptit .greet_engtit {display:block; width:266px; margin:15px auto 25px; font-size:28px; border-radius:8px; padding:3px; background:linear-gradient(90deg, #dbf3fe, #f0e5ff)}
.greet_toptit .greet_engtit span {display: block; line-height:40px; background:#fff; border-radius:8px}
.greet_toptit .greet_tit {font-size:34px; font-weight:800}
.greet_toptit .col01 {color:#ff5b61}
.greet_toptit .col02 {color:#ff9148}
.greet_toptit .col03 {color:#32bf29}
.greet_engtxt {display:block; padding:7px 10px; text-align: center; border-radius:5px; font-weight:800; background:#e3eaed; color:rgba(0,0,0,0.1); font-size:1.2em}
.greet_con {margin:25px 30px; line-height:150%; font-size:1.071em}
.greet_con span {font-weight:500}
.greet_sign {text-align: right}

/* 센터소개 */
.gcgc_center .cont_bltlst {padding-right:340px; background:url(../images/sub/bg_centerinfo.png) no-repeat right -15px bottom 0}
.gcgc_center .cont_bltlst ul li:nth-of-type(odd) span.blt_mark {background:#1b86aa}
.gcgc_center .cont_commbox .cont_cbtit {background:#1b86aa}
.cttop_edutit {padding-top:120px; background:url(../images/sub/bg_globalimg01.png) no-repeat 50% 0}
.cttop_edutit p {max-width:630px; margin:0 auto; padding:25px 35px; border:2px solid #e3eaed; border-radius:80px; font-size:1.333em; font-weight:600; text-align: center}
.ctcon_edulst {display:flex; justify-content: space-between; gap:10px; padding-top:58px; padding-bottom:133px; background:url(../images/sub/bg_eduline01.gif) no-repeat 50% 0, url(../images/sub/bg_eduline02.gif) no-repeat 50% 100%}
.ctcon_edulst .edulst_box {position:relative; width:calc(100% / 4 - 5px);  padding:2px; background:linear-gradient(0, #555, #eee); border-radius:50px 50px 10px 10px; box-sizing: border-box}
.ctcon_edulst .edulst_box .edulst_line {overflow:hidden; height:100%; border-radius:48px 48px 8px 8px; background:#fff}
.edulst_tit {margin:0 10px; font-size:1.333em; font-weight:700; text-align: center; border-bottom:1px solid #e5e5e5}
.edulst_tit span {display:block; padding:80px 0 15px}
.edulst_txt {padding:16px 10px; line-height:130%; text-align: center; font-size:1.071em; font-weight:600}
.edulst_lst {height:calc(100% - 180px); padding:15px; box-sizing: border-box}
.edulst_lst li {position:relative; line-height:130%; padding-left:12px; margin-top:6px; word-break: keep-all}
.edulst_lst li:first-child {margin-top:0}
.edulst_lst li:after {content:""; display:block; position:absolute; top:5px; left:0; width:5px; height:5px; background:#fff; border-radius:50%}
.ctcon_edulst .el_box01 {background:linear-gradient(0, #ff7878, #ffd3d3)}
.ctcon_edulst .el_box01 .edulst_tit span {background:url(../images/sub/ico_centerinfo01.gif) no-repeat 50% 8px; color:#ef6250}
.ctcon_edulst .el_box01 .edulst_lst {background:#ffeaea}
.ctcon_edulst .el_box01 .edulst_lst li:after {background:#ff7777}
.ctcon_edulst .el_box02 {background:linear-gradient(0, #ffa944, #ffe5ca)}
.ctcon_edulst .el_box02 .edulst_tit span {background:url(../images/sub/ico_centerinfo02.gif) no-repeat 50% 8px; color:#ffa943}
.ctcon_edulst .el_box02 .edulst_lst {background:#fff2e4}
.ctcon_edulst .el_box02 .edulst_lst li:after {background:#ffac4b}
.ctcon_edulst .el_box03 {background:linear-gradient(0, #84c553, #dff4cd)}
.ctcon_edulst .el_box03 .edulst_tit span {background:url(../images/sub/ico_centerinfo03.gif) no-repeat 50% 8px; color:#9fd279}
.ctcon_edulst .el_box03 .edulst_lst {background:#edf6e5}
.ctcon_edulst .el_box03 .edulst_lst li:after {background:#83c552}
.ctcon_edulst .el_box04 {background:linear-gradient(0, #5392e7, #d0e3fa)}
.ctcon_edulst .el_box04 .edulst_tit span {background:url(../images/sub/ico_centerinfo04.gif) no-repeat 50% 8px; color:#5291e7}
.ctcon_edulst .el_box04 .edulst_lst {background:#e5effb}
.ctcon_edulst .el_box04 .edulst_lst li:after {background:#5291e7}
.ctbot_edutit {position:relative; margin-top:-116px; padding-top:116px; background:url(../images/sub/bg_globalimg02.png) no-repeat 50% 0}
.ctbot_edutit p {max-width:630px; margin:0 auto; padding:25px 35px; background:#e3eaed; border-radius:80px; font-size:1.333em; font-weight:600; text-align: center}

/* 오시는길 */
.gcgc_map {font-family:SCdream}
.gcgc_map .map_wrap .map_box {border: 1px solid #c7c7c7; box-sizing: border-box; overflow: hidden;border-radius:10px}
.gcgc_map .root_daum_roughmap{width: 100%;}
.gcgc_map .root_daum_roughmap .wrap_map{height: 450px;}
.gcgc_map .map_wrap .map_border {border:none !important; background:none !important}

.mapinfo_box {position:relative; margin:15px 0}
.mapinfo_box .map_address dt {display:block; width:174px; height:34px; line-height:32px; background:#4ea0ed; border-radius:30px 30px 0 0; text-align: center}
.mapinfo_box .map_address dt span {display:inline-block; padding:1px 0 1px 20px; background:url(../images/sub/blt_map_add.png) no-repeat 0 50%; color:#fff; font-weight:600; font-size: 1.071em}
.mapinfo_box .map_address dd {padding:20px 180px 20px 20px; border-top:1px solid #dbdbdb; color:#000; font-weight:500}
.mapinfo_box .map_address > span {display: inline-block; padding:8px 0 8px 34px; background: url(../images/sub/blt_map_add.png) no-repeat left top; font-size:1.071em; font-weight: 600; text-align: left}
.map_engtxt {background:#e3eaed; border-radius:5px; padding:8px 20px; color:rgba(0,0,0,0.15); font-weight:600}

.map_view {position:absolute; bottom:45px; right:0; display:block}
.map_view a {position:relative; display:block; padding:10px 15px; margin:0 0 0 auto; background:#f1cc3c; box-sizing: border-box; color:#2f2708; font-weight:500; border-radius:5px; text-align: center; transition:.3s}
.map_view a:hover {background:#4ea0ed; color:#fff}
.map_view a span {padding-left:30px; background:url(../images/sub/blt_kakaomap.png) no-repeat 0 50%}
.map_traffic {margin:25px 0}
.map_type {display:flex; margin-top:10px; padding-top:10px; border-top:1px solid #ddd; gap:18px}
.map_type:first-child {border-top:0; margin-top:0; padding-top:0}
.map_type .traffic_tit {display: flex; align-items: center; justify-content: center; width:168px; border:2px solid #e1e1e1; border-radius:5px; color:#000; font-weight:700; font-size:1.2em}
.map_type .traffic_tit span {display:inline-block; padding:42px 15px 0; margin:15px 0}
.map_type .traffic_line {padding:10px 0; width:calc(100% - 180px); display:flex; align-content:center; flex-wrap:wrap; box-sizing: border-box; gap:0}
.map_type.map_bus .traffic_tit span {background:url(../images/sub/bg_map_bus.png) no-repeat 50% 0}
.map_type.map_car .traffic_tit span {background:url(../images/sub/bg_map_car.png) no-repeat 50% 0}
.map_type.map_bus .traffic_line > li {width:100%; display:flex; align-items: flex-start; margin-bottom:5px}

.map_type.map_bus .traffic_line > li span.bus_typetit {display:block; width:44px; height:20px; line-height:18px; border-radius:5px; text-align: center; padding:1px 5px; font-weight:600; flex-shrink: 0}
.map_type.map_bus .traffic_line ul {display: flex; justify-content: flex-start; }
.map_type.map_bus .traffic_line ul li {padding:0 12px; background:url(../images/sub/bg_map_bar.gif) no-repeat 100% 50%}
.map_type.map_bus .traffic_line ul li:last-child {background:none; margin-bottom:0}

.bus_type1 .bus_typetit {background:#d4d9fc; color:#3e53e2}
.bus_type2 .bus_typetit {background:#cde6c3; color:#348c11}
.bus_type3 .bus_typetit {background:#fdd3cc; color:#e8472a}
.bus_type4 .bus_typetit {background:#cde6c3; color:#3c8f1c}

/* 프로그램 안내 공통 */
.cont_protop {position:relative; overflow:hidden; padding:0 10px; margin-bottom:20px; border-bottom:1px solid #e3e3e3; border-radius:30px 30px 0 0}
.cont_protop:before {content:""; display:block; position:absolute; top:0; left:0; width:100%; height:95px; background:#ccc}
.cont_protit {position:relative; height:50px; line-height:48px; color:rgba(255,255,255,0.3); text-align: center; font-size:1.467em; font-weight:600}
.cont_protxt {position:relative; display:flex; justify-content:space-between; padding:12px; border-radius:10px 10px 0 0; background:#fff}
.cont_protxt p {line-height:150%; min-height:54px; padding:10px 20px 10px 90px; font-size:1.071em; word-break: keep-all}
.cont_proimg {flex-shrink:0}
.cont_proimg img {vertical-align: middle}

.detail_planwrap {display:flex; justify-content: space-between; gap:18px; margin-bottom:35px}
.detail_planwrap .dplan_box {position:relative; overflow:hidden; width:calc(100% / 3); border-radius:30px 30px 5px 5px; box-sizing: border-box; border:1px solid #c9c9c9; background:#eee}
.dplan_btit {font-size:1.2em; font-weight:800; text-align: center; background:#fff}
.dplan_btit span {display:block; padding:85px 0 15px}
.dplan_btxt {height:calc(100% - 180px); padding:15px; box-sizing: border-box}
.dplan_btxt li {position:relative; line-height:130%; padding:1px 0 1px 25px; margin-top:5px; word-break: keep-all}
.dplan_btxt li:first-child {margin-top:0}
.dplan_btxt li .blt_mark {position:absolute; top:0; left:0; width:20px; height:20px;  background:#fff; border-radius:3px; border:1px solid #c9c9c9; box-sizing: border-box; text-align: center}
.detail_planwrap .dplan_box1 .dplan_btit span {background:url(../images/sub/ico_prodetail01.gif) no-repeat 50% 12px}
.detail_planwrap .dplan_box2 .dplan_btit span {background:url(../images/sub/ico_prodetail02.gif) no-repeat 50% 12px}
.detail_planwrap .dplan_box3 .dplan_btit span {background:url(../images/sub/ico_prodetail03.gif) no-repeat 50% 12px}
.detail_lstwrap .dlst_box {display:flex; justify-content:space-between; margin-top:13px; padding-top:13px; border-top:1px solid #e3e3e3}
.detail_lstwrap .dlst_btit {display: flex; align-items: center; justify-content: center; flex-shrink: 0; width:168px; text-align: center; font-size:1.071em; font-weight:700; text-shadow:0 2px 5px rgba(0,0,0,0.1); background:#eee; border-radius:5px}
.detail_lstwrap .dlst_btit span {display:inline-block; padding:54px 15px 0; margin:10px 0; color:#fff}
.detail_lstwrap .dlst_box:first-child {border-top:0; margin-top:0; padding-top:0}
.dlst_box ul {padding:10px 0; width:calc(100% - 195px); display:flex; align-content:center; flex-wrap:wrap; box-sizing: border-box; gap:0}
.dlst_box ul li {width:100%; line-height: 130%; margin-top:6px}
.dlst_box ul li:first-child {margin-top:0}
.dlst_box1 .dlst_btit {background:#ffb643}
.dlst_box1 .dlst_btit span {background:url(../images/sub/img_contpro01.gif) no-repeat 50% 0 }
.dlst_box2 .dlst_btit {background:#27c590}
.dlst_box2 .dlst_btit span {background:url(../images/sub/img_contpro02.gif) no-repeat 50% 0 }
.dlst_box3 .dlst_btit {background:#fb7d6d}
.dlst_box3 .dlst_btit span {background:url(../images/sub/img_contpro03.gif) no-repeat 50% 0 }
.dlst_box4 .dlst_btit {background:#7c88fb}
.dlst_box4 .dlst_btit span {background:url(../images/sub/img_contpro04.gif) no-repeat 50% 0 }

/* 2일 오전프로그램 */
.pro_morning .cont_bltlst ul li:nth-of-type(odd) span.blt_mark {background:#3a91f1}
.pro_morning .cont_protop:before {background:linear-gradient(90deg, #398ff0, #47b6fc)}
.pro_morning .cont_protxt p  {background:url(../images/sub/bg_pro_morning.gif) no-repeat 5px 5px}

/* 첨단초 오전프로그램 */
.pro_cheomdan .cont_protop:before {background:linear-gradient(90deg, #08a0b2, #06dbd3)}
.pro_cheomdan .cont_protxt p  {background:url(../images/sub/bg_pro_cheomdan.gif) no-repeat 5px 5px}
.pro_cheomdan .cont_bltlst ul li:nth-of-type(odd) span.blt_mark {background:#08a2b3}

/* 방학 중 캠프 */
.pro_vacation .cont_protop:before {background:linear-gradient(90deg, #8455ff, #b67bff)}
.pro_vacation .cont_protxt p {background:url(../images/sub/bg_pro_vacation.gif) no-repeat 5px 5px}
.pro_vacation .cont_bltlst ul li:nth-of-type(odd) span.blt_mark {background:#8455ff}

/* =====늘봄프로그램===== */
/* 영어 1~2학년 */
.neulbom_info {display:flex; justify-content:space-between; padding:20px; margin-bottom:35px; border:2px solid #e4e4e4; border-radius:0 100px 0 0}
.neulbom_info ul {width:100%; margin-right:36px}
.neulbom_info ul li {display:flex; width:100%; border-top:1px solid #dbdbdb; padding:7px 0}
.neulbom_info ul li:first-child {border-top:0; padding-top:0}
.neulbom_info ul li:last-child {padding-bottom:0}
.neulbom_info ul li .ninfo_tit {width:162px; font-size:1.133em; font-weight:700; color:#000}
.neulbom_info ul li .ninfo_tit span {display:block; padding:12px 0 12px 60px; text-align:left; background:url(../images/sub/blt_neulbom_lst01.png) no-repeat 0 50%}
.neulbom_info ul li .ninfo_txt {display:flex; align-items:center; flex-wrap:wrap; width:calc(100% - 162px); padding:10px 0; font-size:1.067em}
.neulbom_info ul li .ninfo_txt .font_sizedw {font-size:0.935em}
.neulbom_info ul li:nth-child(2) .ninfo_tit span {background:url(../images/sub/blt_neulbom_lst02.png) no-repeat 0 50%}
.neulbom_info ul li:nth-child(3) .ninfo_tit span {background:url(../images/sub/blt_neulbom_lst03.png) no-repeat 0 50%}
.neulbom_info ul li:nth-child(4) .ninfo_tit span {background:url(../images/sub/blt_neulbom_lst04.png) no-repeat 0 50%}
.neulbom_info ul li:nth-child(5) .ninfo_tit span {background:url(../images/sub/blt_neulbom_lst05.png) no-repeat 0 50%}
.neulbom_img {border-radius:80px 80px 0 0; overflow: hidden; flex-shrink:0}
.neulbom_img img {vertical-align: middle}
.pro_neulbom .cont_commbox .cont_cbtit {position:relative; padding:24px 280px 24px 28px}
.pro_neulbom .cont_commbox .cont_cbtit span {position:absolute; bottom:9px; right:280px; font-size:32px; font-weight:800; color:rgba(255,255,255,0.2) }
.pro_neulbom .cont_commbox .contimg {bottom:10px}
.cont_commbox.cont_neulbom1 .cont_cbtit {background:#608be6}
.cont_commbox.cont_neulbom2 .cont_cbtit {background:#41ce83}
.cont_commbox.cont_neulbom3 .cont_cbtit {background:#fe7d8c}

.pro_neulbom .cont_tit p {display: inline-block; padding:6px 12px; border-radius:50px; text-align: center; color:#fff}
.pro_neulbom .cont_tit1 p {background:#ffcd06}
.pro_neulbom .cont_tit2 p {background:#3ed1e5}
.pro_neulbom .cont_tit3 p {background:#ff90b3}

/* 수강신청 안내 */
.cont_tit span {display:block; margin-bottom:10px; font-size:0.792em; color:#ff6554}
.process_box {padding-bottom:36px; background:url(../images/sub/bg_process_arr.gif) no-repeat 50% 100%}
.process_box .proc_tit {display:block; width:285px; padding:10px; background:#3fccdf; box-sizing: border-box; border-radius:25px 25px 0 0; text-align: center; font-size:1.2em; font-weight:600; background:#eee; color:#fff}
.process_box .proc_txt {padding:20px 90px 20px 25px; background:#eceeef; min-height:40px}
.process_box .proc_txt .proc_lst > li {margin-top:6px; line-height:140%; font-size:1.067em}
.process_box .proc_txt .proc_lst > li:first-child {margin-top:0}
.process_box .proc_txt .proc_lst > li > .proc_lst2 li {margin-top:4px; font-size:0.935em; word-break: keep-all}
.process_box .proc_txt .proc_lst a {text-decoration: underline}
.process_box:last-child {background:none}

.probox01 .proc_tit {background:#3fccdf}
.probox02 .proc_tit {background:#3ca2dd}
.probox03 .proc_tit {background:#536ea7}
.probox04 .proc_tit {background:#6863ef}

.probox01 .proc_txt {background:#eceeef url(../images/sub/bg_produce_ico01.gif) no-repeat right 15px top 50%}
.probox02 .proc_txt {background:#eceeef url(../images/sub/bg_produce_ico02.gif) no-repeat right 15px top 50%}
.probox03 .proc_txt {background:#eceeef url(../images/sub/bg_produce_ico03.gif) no-repeat right 15px top 50%}
.probox04 .proc_txt {background:#eceeef url(../images/sub/bg_produce_ico04.gif) no-repeat right 15px top 50%}

.proc_subtit {position:relative; padding-left:120px}
.proc_subtit span {display:inline-block; position:absolute; top:0; left:0; min-width:112px; background:#fff; border-radius:50px; text-align: center; border:1px solid #ccc; box-sizing: border-box}
.proc_emphas {padding-left:22px; background:url(../images/sub/blt_proc_empha.png) no-repeat left 0 top 1px}

.library_wrap {min-height:226px; margin-bottom:18px; padding:60px 520px 30px 44px; background:#e3eaed url(../images/sub/bg_library_eng.jpg) no-repeat right bottom; box-sizing: border-box; border-radius:30px 30px 0 0; word-break: keep-all}
.library_tit {margin-bottom:20px; font-size:1.733em; font-weight:800}
.library_txt {line-height:120%; font-size:1.067em}
.btn_library a {display:flex; justify-content: space-between; padding:8px 10px 8px 15px; border:2px solid #e0e0e0; border-radius:5px; transition:.3s}
.btn_library .libr_link {padding:10px 10px 10px 40px; background:url(../images/sub/blt_library_ico.gif) no-repeat 0 50%}
.btn_library .libr_barogo {position: relative; overflow: hidden; display:flex; align-items: center; border-radius:5px; color:#fff; font-weight:600; font-size:1.067em; flex-shrink:0; transition: all 0.3s ease-in-out}
.btn_library a:hover {border-color:#b5b5b5}
.btn_library .libr_barogo::before, .btn_library .libr_barogo::after {content: ""; position: absolute; inset: 0; border-radius: 5px;transition: opacity 0.3s ease-in-out}
.btn_library .libr_barogo::before {background: linear-gradient(90deg, #0780cc, #23b7fd);opacity: 1}
.btn_library .libr_barogo::after {background: linear-gradient(180deg, #0780cc, #23b7fd);opacity: 0}
.btn_library a:hover .libr_barogo::before { opacity: 0}
.btn_library a:hover .libr_barogo::after { opacity: 1}
.btn_library .libr_barogo span {position: relative; z-index:1; min-width:160px; background:url(../images/sub/btn_library_arr.png) no-repeat right 12px top 50%; padding:10px 15px; }

.library_jp .library_wrap {padding:30px 380px 20px 44px; background:#ffe8dd url(../images/sub/bg_librarynew_jp.jpg) no-repeat right bottom}
.library_jp .library_wrap .library_tit {padding-top:80px; background:url(../images/sub/ico_library_jp.png) no-repeat 18px 0}
.library_jp .btn_library .libr_barogo::before {background: linear-gradient(90deg, #ff634e, #ff955b);opacity: 1}
.library_jp .btn_library .libr_barogo::after {background: linear-gradient(180deg, #ff634e, #ff955b);opacity: 0}

.library_online .library_wrap {padding:60px 380px 30px 44px; background:#f0eafb url(../images/sub/bg_librarynew_online.jpg) no-repeat right bottom}
.library_online .btn_library .libr_barogo::before {background: linear-gradient(90deg, #826efa, #ba59ff);opacity: 1}
.library_online .btn_library .libr_barogo::after {background: linear-gradient(180deg, #826efa, #ba59ff);opacity: 0}

/* 센터 둘러보기 new */
.facility_map {padding:10px; margin-bottom:20px; border:1px solid #c9c9c9; border-radius:5px; text-align: center}
.facility_mapimg {padding:10px 10px 0}
.facility_map img {margin:0 auto; width:100%; height:100%; max-width:810px}
.fac_lstwrap {text-align: left}
.fac_lstwrap .fac_etctxt {text-align: right; word-break: keep-all}
.fac_lstwrap ul.fac_txtlst {display: flex; justify-content:flex-start; flex-wrap: wrap; background:#eceeef; border-radius:5px; margin-top:10px; padding:18px 20px; gap:7px 5px}
.fac_lstwrap ul.fac_txtlst li {display:flex; align-items: center; width:calc(100% / 5 - 5px); gap:10px}
.fac_lstwrap ul.fac_txtlst.fac_txtlst li a {display: flex; justify-content: flex-start; align-items: center; gap:10px; font-size:1.071em; font-weight:600; color:#333; line-height:120%}
.fac_lstwrap ul.fac_txtlst li .alphabet {display:inline-block; width:28px; height:28px; line-height:28px; border-radius:50%; text-align: center; background:#fff; font-weight:800; flex-shrink:0}

.fac_lstwrap ul.fac_txtlst li:nth-child(4n + 1) .alphabet {color:#ff2626}
.fac_lstwrap ul.fac_txtlst li:nth-child(4n + 2) .alphabet {color:#ff9148}
.fac_lstwrap ul.fac_txtlst li:nth-child(4n + 3) .alphabet {color:#32bf29}
.fac_lstwrap ul.fac_txtlst li:nth-child(4n + 4) .alphabet {color:#5291e7}
.fac_lstwrap ul.fac_txtlst li:nth-child(4n + 1).on .alphabet {background:#ff2626; color:#fff}
.fac_lstwrap ul.fac_txtlst li:nth-child(4n + 2).on .alphabet {background:#ff9148; color:#fff}
.fac_lstwrap ul.fac_txtlst li:nth-child(4n + 3).on .alphabet {background:#32bf29; color:#fff}
.fac_lstwrap ul.fac_txtlst li:nth-child(4n + 4).on .alphabet {background:#5291e7; color:#fff}

.fac_view {display: none; padding:0 0 35px; border-bottom:1px solid #ccc}
.fac_view.on {display: block}
.fac_view .fac_viewtit {display:flex; align-items: center; border-radius:15px 15px 0 0 ; padding:15px; gap:10px; font-size:1.467em; font-weight:600; color:#fff}
.fac_view .fac_viewtit span {display: inline-block; width:30px; height:30px; line-height:26px; background:#fff; border-radius: 50%; text-align: center; color:#000}
.fac_view:nth-child(4n + 1) .fac_viewtit {background:#ff4747}
.fac_view:nth-child(4n + 2) .fac_viewtit {background:#ff8e15}
.fac_view:nth-child(4n + 3) .fac_viewtit {background:#32bf29}
.fac_view:nth-child(4n + 4) .fac_viewtit {background:#5291e7}

.fac_click li:nth-child(4n + 1) a {color:#ff2626}
.fac_click li:nth-child(4n + 2) a {color:#ff9148}
.fac_click li:nth-child(4n + 3) a {color:#32bf29}
.fac_click li:nth-child(4n + 4) a {color:#5291e7}
.fac_click li:hover {transition:.3s}
.fac_click li:hover a, .fac_click li.on a {color:#fff}
.fac_click li:nth-child(4n + 1):hover, .fac_click li:nth-child(4n + 1).on {background:#ff2626; border-color:#ff2626}
.fac_click li:nth-child(4n + 2):hover, .fac_click li:nth-child(4n + 2).on {background:#ff9148; border-color:#ff9148}
.fac_click li:nth-child(4n + 3):hover, .fac_click li:nth-child(4n + 3).on {background:#32bf29; border-color:#32bf29}
.fac_click li:nth-child(4n + 4):hover, .fac_click li:nth-child(4n + 4).on {background:#5291e7; border-color:#5291e7}

.fac_mapwrap {position: relative; width:100%; max-width:810px; aspect-ratio: 810 / 490; margin:0 auto}
.fac_click li.view_txt {position: absolute; width:4.2%; height:6.9%; border:2px solid #d5d5d5; border-radius:50%; text-align: center; box-sizing: border-box; font-weight:700; font-size:1.4em; background:#fff}
.fac_click li.view_txt a {display: block; height:100%; line-height:140%}
.fac_click li.view_txt1  {top: 27.1%; left: 14.6%; }
.fac_click li.view_txt2  {top: 1.8%;  left: 31.9%; }
.fac_click li.view_txt3  {top: 9.8%;  left: 48.5%; }
.fac_click li.view_txt4  {top: 9.8%;  left: 54.9%; }
.fac_click li.view_txt5  {top: 9.8%;  right: 33.3%; }
.fac_click li.view_txt6  {top: 9.8%;  right: 25.7%; }
.fac_click li.view_txt7  {top: 17.5%; right: 12.3%; }
.fac_click li.view_txt8  {bottom: 18.7%; left: 48.9%; }
.fac_click li.view_txt9  {bottom: 18.7%; right: 34.2%; }
.fac_click li.view_txt10 {bottom: 18.7%; right: 24.3%; }
.fac_click li.view_txt11 {bottom: 18.7%; right: 17.1%; }
.fac_click li.view_txt12 {bottom: 18.7%; right: 10.4%; }
.fac_click li.view_txt13 {bottom: 18.7%; right: 4.0%; }

.fac_viewcon p {line-height:140%; padding:20px; font-size:1.067em; word-break: keep-all}
.fac_vphoto {display: flex; justify-content: center; align-items: center; gap:20px}
.fac_vphoto li a {overflow:hidden; display: block; max-width:430px; height:320px; border:1px solid #d5d5d5; border-radius:15px}
.fac_vphoto li img {height:100%}

/********* MOBILE LAYOUT *********/
@media only screen and (max-width:1024px) {
.basics_font {font-size: 1.077em/*기준폰트 14px*/}
/* 상단 */
.header_top .logo {top:10px}
.top_btn_area {top:30px}

/* Layout */
.subconbox {position:relative; margin:-62px 10px 0; background:#fff; border-radius:10px 10px 0 0}
#subright{position: relative}
#subright.nomargin {margin-top:0 !important}
#subtop {padding-bottom:36px}
#subtop h3 {height:62px; color:#000; font-weight: 600; margin:0 10px; text-align: center}
#subtop h3 span {padding:23px 0; font-size:1.308em; font-weight:600}
#subpage {margin:20px 0 30px}

/* Visual*/
.subvisual .visual_wrap {height:135px} 
.subvisual .visual_item {padding-top:135px}
.subvisual .visual_item .vm_wrap {display: none}
.visual_wrap .slick-arrow {display:none !important}
.visual_wrap .slick-dots {display:none !important}
.visual_wrap .btn_visual {display: none}

/* 서브 컨텐츠 영역 */

/* MB guide */
#sub_guide {position:absolute; top:62px; left:0; width:100%; font-size: 13px; z-index:15; background:#ececec; border-radius:0 0 15px 15px}
#sub_guide .navi_area {padding:0 0 0 34px}
#sub_guide .navi_area > ul > li.nav_home {display:none}
#sub_guide .navi_area .btn_home {display: block}
#sub_guide .navi_area .btn_home a {display: block; width:34px; height:36px; position:absolute; top:0; left:0; text-indent:-99999px; background:url(../images/sub/btn_home.gif) no-repeat 50% 50%}
#sub_guide .navi_area .btn_home span{overflow:hidden; height:0; width:0; line-height:0; font-size:0; text-indent:-9999999px}
#sub_guide .navi_area .btn_home img {display: none}
#sub_guide .navi_area > ul {box-sizing: border-box}
#sub_guide .navi_area > ul > li{position: relative; float: left; width: 33.3%}
#sub_guide .navi_area > ul > li > a {display: block; height:35px; line-height:37px; padding:0 20px 0 8px; font-weight: 500; font-size:1.077em; background:url(../images/sub/bg_submn_arr.gif) no-repeat right 8px center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; border-left:1px solid #dadada; box-shadow: -1px 0 0 0 #fff}
#sub_guide .submn {overflow: hidden; position: absolute; left: 0; top: 100%; width:100%;  margin: 0 auto; background: #fff; border:1px solid #353535;border-bottom-width:2px; border-radius:4px 4px 10px 10px; z-index: 10}
#sub_guide .submn ul { padding: 0 6px}
#sub_guide .submn li {padding: 8px 0 8px 5px; border-bottom: 1px solid #ccc; z-index: 150}
#sub_guide .submn li:last-child{border:none}
#sub_guide .submn li a {display: block; line-height: 140%; color: #404040; font-weight: 500}
#sub_guide .submn li a:hover{color:#4792cb; font-weight: 600}

/* 탭 */
.tabnavi01 {margin:11px 0}
.tabnavi01 ul {gap:6px}
.tabnavi01 ul li a {padding:5px 50px 5px 8px; font-size:13px; border-radius:3px 3px 10px 10px}
.tabnavi01 ul li a:after {width:20px; height:18px; right:6px; margin-top:-9px}

.tabnavi02, .boardTab {margin:11px 0}
.tabnavi02 ul li, .boardTab ul li {width:calc(100% / 3)}
.tabnavi02 ul li:nth-child(3n) a, .boardTab ul li:nth-child(3n) a {border-right:0}
.tabnavi02 ul li:nth-child(-n+3) a, .boardTab ul li:nth-child(-n+3) a {border-top:0}
.tabnavi02 ul li a, .boardTab ul li a {padding:5px 10px; font-size:13px}
    
/* 탑 버튼 */
#quick02 {display: block; position:absolute; top:680px; right:5px; z-index:1}
.btn_top a {width:48px; height:38px; padding-top:16px; background-position:center 5px}
.btn_top a span {font-size:14px}

/********************************************* SUB content **********************************************/
/* content Common */
/* 페이지 준비중 */
.sub_loding{background: url(../images/sub/page_loding_m.gif) no-repeat center center}
/* 테이블 스크롤 텍스트 */
.scroll_txt{display: none}
/*MB에서 필요 없을때 선언*/
.mb_none{display: none}
    
/* 타이틀 */
h4.sub_tit4 {font-size:1.214em; background-position:0 2px; background-size:auto 25px; padding-left:30px}
h5.sub_tit5 {font-size:1.143em; background-position:0 3px; padding-left:24px; margin:5px}
    
/* -------------------컨텐츠 시작 -------------------*/

/* 공통 상단 */
.cont_toparea .cont_tit  {padding:7px 0; font-size:1.429em}
.cont_engtit {padding:7px 0 3px}
.cont_engtit span {font-size:0.938em}
.cont_infotit p {padding:15px 40px 10px; font-size:1.071em}
.cont_infotit p:before {top:8px; width:24px; height:16px; background-size:24px auto}
.cont_infotit p:after {top:8px; width:24px; height:16px; background-size:24px auto}

/* 공통 블릿 리스트 텍스트박스 */
.cont_bltlst {padding:10px}
.cont_bltlst ul li {margin-top:4px}
    
/* 공통 사진 포함 텍스트 박스  */
.cont_commbox .cont_cbtit {padding:15px 20px}
.contimg img {width:200px}
.cont_commbox .cont_cbtxt {padding:15px 20px}
.cont_commbox .cont_cbtxt.cont_cbtxtimg {padding-right:250px}

/* 프로그램 안내 공통 */
.cont_protop {padding:0 8px; margin-bottom:20px; border-radius:20px 20px 0 0}
.cont_protop:before {height:82px}
.cont_protit {height:42px; line-height:40px; font-size:1.286em}
.cont_protxt {display:block}
.cont_protxt p {padding:0; margin-bottom:10px; background:none !important; font-size:1em}
.cont_proimg {text-align: center}
.cont_proimg img {max-width:250px}

/* 인사말 */
.greet_top {padding:10px 0 20px; background-size:auto 110px}
.greet_engtxt {padding:5px 10px; font-size:1.071em}
.greet_con {margin:20px 15px; font-size:1em}
.greet_con br {display:none}
.greet_toptit .greet_engtit {margin:10px auto 20px; font-size:22px}
.greet_toptit .greet_tit {font-size:28px}

/* 센터소개 */
.gcgc_center .cont_bltlst {padding-right:10px; background:none}

/* 2일 오전프로그램 */
.detail_planwrap {gap:10px}
.dplan_btxt {height:100%}
    
/* 영어늘봄 프로그램 */
.neulbom_info {align-items:flex-start; padding:10px}
.neulbom_img {width:180px; height:180px; border-radius:50% 50%}
.neulbom_img img {width:200px}
.neulbom_info ul {margin-right:20px}
    
.pro_neulbom .cont_commbox .cont_cbtit {padding:15px 20px}
.pro_neulbom .cont_commbox .cont_cbtit span {right:220px}
.pro_neulbom .cont_commbox:before {padding-left:20px}
    
/* 수강신청 안내 */
.process_box {padding-bottom:28px; background-size:42px auto; background-position:left 50% bottom 6px}
.process_box .proc_tit {width:100%; font-size:1.143em}
.process_box .proc_txt {padding:12px 55px 12px 15px; background-size:50px auto; background-position:right 6px bottom 6px}
.process_box .proc_txt .proc_lst > li {font-size:1em}
.proc_subtit {padding-left:105px}
.proc_subtit span {min-width:100px}
    
/* 도서관 */
.library_wrap {min-height:140px; padding:40px 250px 40px 30px; background-size:auto 180px}
.library_tit {font-size:1.429em}
.library_jp .library_wrap {padding:20px 166px 30px 30px; background-size:auto 180px}
.library_jp .library_wrap .library_tit {padding-top:50px; margin-bottom:10px; background-size:68px auto}
.library_online .library_wrap {padding:40px 250px 40px 30px; background-size:auto 180px}
    

/* 센터 둘러보기 */
.fac_lstwrap ul.fac_txtlst li {width:calc(100% / 3 - 5px)}
.fac_view .fac_viewtit {padding:10px}
.fac_view .fac_viewtit span {line-height:26px}
.fac_vphoto {flex-wrap:wrap}
.fac_vphoto li a {height:200px; max-width:300px}
.fac_viewcon p {padding:15px}


}

/* PC LAYOUT */
@media only screen and (min-width:1025px) {
/* Layout */
#subcontainer{position: relative}
.subconwrap{position: relative}
.subconwrap:before {content:""; display: block; position: absolute; top:18px; left:0; width:100%; height:31px; background:#f5f5f5}
.subconbox {position: relative; width: 1300px; margin:0 auto; padding-top:28px; z-index: 1}
#sub_left {position: relative; display: block; float: left; margin-bottom:20px}
#subright {position: relative; float: right; width:1040px; padding-left:26px; box-sizing: border-box}
#subpage{margin:25px 0 70px; min-height:400px}
    
/* Visual */
.subvisual .visual_wrap {position: relative; width: 100%; margin: 0 auto}
.subvisual .visual_item {width:auto; height:445px}
.subvisual .visual_item .vm_wrap {height:342px; border-radius:0 40px 40px 0}
.subvisual .visual_item:before {height:156px}
.subvisual .item1 .vm_wrap {background: url(../images/sub/subv_pc01.jpg) no-repeat  center top, linear-gradient(90deg, #ceefff, #e5d5fc)}
.subvisual .item2 .vm_wrap {background: url(../images/sub/subv_pc02.jpg) no-repeat  center top, linear-gradient(90deg, #d5fff5, #d9f6fe)}
.subvisual .item3 .vm_wrap {background: url(../images/sub/subv_pc03.jpg) no-repeat  center top, linear-gradient(90deg, #dbffe5, #d0f9ff)}

.visual_wrap .slick-dots {top:268px}
.visual_wrap .btn_visual {top:268px}

/* 비주얼 퀵메뉴 */
.vquick_wrap {display: block; margin:-128px auto 0; padding-bottom:28px}
.vquick_wrap ul li a {width:160px; height:100px; font-size:1.231em; border-radius:15px}
.vquick_wrap ul li span {padding:20px 18px; background-size:auto 34px !important}
.vquick_wrap ul li.vq02 span {background-size: auto 30px !important; background-position:right 12px bottom 15px}
.vquick_wrap ul li a:after {top:20px}

/*오른쪽 퀵메뉴 */
.main_quick {display: block; top:156px; box-shadow:0 2px 6px rgba(0, 0, 0, 0.08)}

/* Subleft */
#sub_left {overflow:hidden; width:260px; margin-bottom:20px; border-radius:15px; box-shadow:0 2px 6px rgba(0,0,0,0.1); border:1px solid #eee; box-sizing: border-box}
.left_tit {position: relative; height:90px; padding:26px 0;text-align: center; background: url(../images/sub/bg_leftmn_tit.gif) no-repeat 50% 0, linear-gradient(90deg, #0179a1, #1b86aa); box-sizing: border-box}
.left_tit h2 {padding:3px 0; font-size:22px; font-weight:600; color:#fff}
.left_tit .eng_tit {display:block}
.left_tit .eng_tit span {font-weight:600; font-size:1.231em; font-family:'Gmarket Sans'; color:rgba(255,255,255,0.2)}    
.leftmn {position: relative; padding:0 14px; box-sizing: border-box}
.leftmn > ul > li {border-bottom:1px solid #dbdbdb}
.leftmn > ul > li > a {position:relative; display: block; line-height: 130%; padding:15px 34px 15px 15px; font-size:1.231em; font-weight:500; color: #5d5d5d; transition: all .3s; box-sizing: border-box; word-break:keep-all}
.leftmn > ul > li > a:after {content:""; display:block; position: absolute; top:50%; right:6px; margin-top:-11px; width:23px; height:23px; background:#eceeef url(../images/sub/blt_submn_off.png) no-repeat 55% 50%; border-radius:5px; transition:.3s}
.leftmn ul > li:last-child a {margin-bottom: 0}
.leftmn ul > li > a:hover, .leftmn .leftmenuover > a {text-decoration:none; color:#000; font-weight:700}
.leftmn ul > li > a:hover:after, .leftmn .leftmenuover > a:after {background:#1b86aa url(../images/sub/blt_submn_on.png) no-repeat 55% 50%; transition:.3s}

/* third*/
.leftmn .third {position: relative; overflow:hidden; margin:0 0 6px; box-sizing: border-box; background:#eceeef; border-radius:5px}
.leftmn .third li {border-top:1px solid #fff}
.leftmn .third li:first-child {border-top:0}    
.leftmn .third li a {display: block; line-height: 130%; padding:8px 10px 8px 24px; margin-bottom: 0;  background:url(../images/sub/blt_thirdmn_off.gif) no-repeat 10px 14px; font-weight:500; color:#3d3d3d; font-size:1.154em; transition:.4s}
.leftmn .third li:hover, .leftmn .third li.on {transition:.3s}
.leftmn .third li:hover a, .leftmn .third .on a, .leftmn .third .third_on a {background:#fadc66 url(../images/sub/blt_thirdmn_on.gif) no-repeat 10px 14px}
/*Subtop TIT */
#subtop {height:94px}
#subtop h3 {border-bottom:1px solid #eee}
#subtop h3 span {display:block; padding:48px 22px 27px}
    
/* PC guide*/
#sub_guide {position: absolute; top:-10px; left:20px}
#sub_guide:after {content:""; clear:both; display:block; height:0; font-size:0; line-height:0}
#sub_guide .navi_area {height:31px; line-height:30px}
#sub_guide .navi_area li {display: inline-block; width:auto !important}
#sub_guide .navi_area li a {display: block; padding:0 8px 0 12px; line-height:20px; background: url(../images/sub/bg_navi_arr.gif) 0 5px no-repeat; color:#a2a2a2; font-weight:400}
#sub_guide .navi_area li:first-child a {background: none; padding-left: 0}
#sub_guide .navi_area li.m_menu {display: none}
#sub_guide .navi_area li.page_on a {color:#767676; font-weight:500}
#sub_guide .navi_area > ul > li.nav_home a {width:16px; height:14px; padding:0 6px 0 0}
#sub_guide .navi_area > ul > li.nav_home a img {vertical-align:-3px}
/* subtop_btn */
.subtop_btn {display:flex; justify-content: space-between; align-items:center; overflow:hidden; width:260px; margin-top:22px; padding:10px 20px; background:#e3eaed; box-sizing: border-box}
.subtop_btn dl.font {display:flex; align-items: center; box-sizing: border-box}
.subtop_btn dl.font > dt {line-height:16px; font-size:15px; font-weight:600; color:rgba(0,0,0,0.25)}
.subtop_btn dl.font > dd {display:flex; justify-content: space-between; margin-left:14px}
.subtop_btn dl.font > dd a {display: block; width:16px; height:16px; line-height:16px; box-sizing: border-box; transition: all .3s; text-align: center}
.subtop_btn dl.font > dd a img {vertical-align: middle}
.subtop_btn dl.font > dd a:hover{transition:.3s}
.subtop_btn .btn_print {width:30px; text-align: center}
.subtop_btn .btn_print a {display:block; height:21px; line-height:22px; margin:0 auto; transition: all .3s}
.subtop_btn .btn_print a img {vertical-align: middle}

/* 탑버튼 */
#quick02 {display:block}
.btn_top {position:absolute; bottom:0; right:0; z-index:1}
    
/* 탭메뉴 */
.tabnavi01 ul li a {min-width:120px; box-sizing: border-box}
.tabnavi02 ul li:nth-child(-n+5) a, .boardTab ul li:nth-child(-n+5) a {border-top:0}
.tabnavi02 ul li:first-child a, .boardTab ul li:first-child a {border-right:0} 
.tabnavi02 ul li:nth-child(5n) a, .boardTab ul li:nth-child(5n) a {border-right:0} 

/********************************************* SUB content **********************************************/
/* content Common */
/*PC에서 br 필요 없을때 선언*/
br.pcbr_none{display: none}
/*PC에서 필요 없을때 선언*/
.pc_none{display: none}

/* -------------------컨텐츠 스타일 시작 -------------------*/


}

/**** LOWSET FIX ****/
/* 프린트관련 */
.printBG .gnb_box {display:none}
.printBG #subright{margin-top:0}
.printBG #subright .tabnavi01, .printBG #subright .tabnavi02{display:none}
.printBG .subconbox {margin-top:0}
.printBG .subconbox #subtop {padding-bottom:15px}
.printBG .subconbox #subtop  h3 {border-bottom:1px solid #ececec}
/*.printBG .subconbox {margin:0}*/
@media print {
.printBG #subright{-webkit-print-color-adjust:exact}
.printBG .subtop_btn{display:none}
}
/********* TABLET LAYOUT[중간사이즈 조정관련] *********/


@media only screen and (max-width:767px) {
    /* 공통 사진 포함 텍스트 박스  */
    .cont_commbox {padding-bottom:30px}
    .cont_commbox .cont_cbtit {padding:10px 20px; font-size:1.286em}
    .contimg {position:inherit; bottom:inherit; right:inherit; text-align: center}
    .contimg img {position:relative; ; margin:20px auto -30px}
    .cont_commbox .cont_cbtxt {padding:15px 20px}
    .cont_commbox .cont_cbtxt.cont_cbtxtimg {padding:15px; font-size:1em}
    .cont_commbox:before {padding:0; text-align: center; font-size:1em}
    .cttop_edutit {padding-top:90px; background-size:auto 90px}
    .cttop_edutit p {max-width:inherit; padding:15px 20px; font-size:1.214em; word-break: keep-all}
    .ctcon_edulst {padding-top:28px; padding-bottom:40px; background:url(../images/sub/bg_eduline01_m.gif) no-repeat 50% 0, url(../images/sub/bg_eduline02_m.gif) no-repeat 50% 100%; flex-wrap:wrap}
    .ctcon_edulst .edulst_box {width:calc(100% / 2 - 5px)}
    .ctbot_edutit {background-size:auto 80px; margin-top:-18px; padding-top:80px}
    .ctbot_edutit p {max-width:inherit; padding:15px 20px; font-size:1.214em; word-break: keep-all}

    /* 인사말 */
    .gcgc_greet {padding-bottom:80px;background-size:auto 100px; background-position:left 50% bottom 0}
    .greet_top {padding:10px 0 100px; background:url(../images/sub/bg_greettop_mimg.png) no-repeat left 50% bottom 0}
    .greet_toptit .greet_engtit {margin:10px auto 15px}
    .greet_toptit .greet_engtit span {line-height:34px}
    .greet_toptit .greet_tit {line-height:1em}
    .greet_con {margin:15px 10px}
    .greet_engtxt {line-height:120%}
    .greet_sign {text-align: center}
    .greet_sign img {height:30px}
    
    /* 센터소개 */
    .edulst_tit {font-size:1.214em}
    .edulst_tit span {display:inline-block; padding:15px 10px 15px 50px; background-size:40px auto !important; background-position:0 50% !important}
    .edulst_lst {height:100%}
    .ctcon_edulst .edulst_box {border-radius:30px 30px 5px 5px}
    .ctcon_edulst .edulst_box .edulst_line {border-radius:28px 28px 4px 4px}
    .ctcon_edulst .el_box03, .ctcon_edulst .el_box04 {border-radius:5px 5px 30px 30px}
    .ctcon_edulst .el_box03 .edulst_line, .ctcon_edulst .el_box04 .edulst_line {border-radius:5px 5px 30px 30px}
    
    /* 오시는 길 */
    .gcgc_map .root_daum_roughmap {height:250px}
    .mapinfo_box .map_address  {text-align: center}
    .mapinfo_box .map_address dt {margin:0 auto}
    .mapinfo_box .map_address dd {padding:10px}
    .map_view {position:inherit; bottom:inherit; right:inherit; margin-bottom:10px}
    .map_view a {padding:5px 10px}
    .map_engtxt {text-align: center}
    .map_type {display: block; margin:0; padding:0; border:none}
    .map_type .traffic_tit {width:100%}
    .map_type .traffic_tit span {padding:6px 10px 6px 40px; margin:5px 0; background-size:30px auto !important; background-position:0 50% !important}
    .map_type .traffic_line {width:100%}
    .map_type.map_bus .traffic_line ul {flex-wrap:wrap}
    
    /* 2일 오전프로그램 */
    .detail_planwrap {flex-wrap:wrap; margin-bottom:25px}
    .detail_planwrap .dplan_box {width:100%; border-radius:20px 20px 5px 5px}
    .dplan_btit {font-size:1.143em}
    .dplan_btit span {display:inline-block; padding:14px 10px 14px 42px; background-size:35px auto !important; background-position:0 50% !important}
    .detail_lstwrap .dlst_box {flex-wrap:wrap; width:100%; padding-top:7px; margin-top:0}
    .detail_lstwrap .dlst_box ul {width:100%; padding:10px; box-sizing: border-box}
    .detail_lstwrap .dlst_btit {width:100%}
    .detail_lstwrap .dlst_btit span {display:inline-block; padding:10px 10px 10px 42px; margin:5px 0; background-size:36px auto !important; background-position:0 50% !important}
    .dlst_box3 .dlst_btit span br {display:none}
        
    /* 영어늘봄 프로그램 */
    .pro_neulbom .contimg img {margin:15px auto -22px}
    .pro_neulbom .cont_commbox .cont_cbtit span {bottom:5px; right:5px; font-size:26px}
    .neulbom_info {border-radius:0; margin-bottom:25px}
    .neulbom_info ul {margin:0}
    .neulbom_info ul li .ninfo_tit {width:140px; font-size:1.071em}
    .neulbom_info ul li .ninfo_tit span {padding:12px 0 12px 50px}
    .neulbom_info ul li .ninfo_txt {width:calc(100% - 140px); font-size:1em}
    .neulbom_img {display:none}
    
    /* 전자도서관 안내 */ 
    .btn_library a {flex-wrap: wrap; padding:8px }
    .btn_library .libr_link {width:100%; margin-bottom:5px; background-position:0 3px}
    .btn_library .libr_barogo {width:100%}
    .btn_library .libr_barogo span {min-width:inherit; width:100%}
    
    /*  시설구성도 */
    .facility_map {padding:10px}
    .facility_mapimg {padding:0}
    .fac_lstwrap ul {gap:5px; padding:15px 10px}
    .fac_lstwrap ul li {width:calc(100% / 2 - 5px)}
    .fac_lstwrap ul li a {font-size:1em}
    .fac_lstwrap .fac_etctxt {text-align: center; font-size:1em}
    .fac_lstwrap ul li .alphabet {width:22px; height:22px; line-height: 22px}
    .fac_lstwrap ul.fac_txtlst li {width:calc(100% / 2 - 3px); gap:3px}
    
    .fac_click li.view_txt {width:5%; height:8%; font-size:1.143em; border-width: 1.5px}
    .fac_click li.view_txt a {line-height:4vw}
    .fac_click li.view_txt1  {top: 25.5%; left: 13.5%; }
    .fac_click li.view_txt2  {top: 0;  left: 31.2%; }
    .fac_click li.view_txt3  {top: 8%;  left: 48.5%; }
    .fac_click li.view_txt4  {top: 8%;  left: 54.9%; }
    .fac_click li.view_txt5  {top: 8%;  right: 32.5%; }
    .fac_click li.view_txt6  {top: 8%;  right: 24.7%; }
    .fac_click li.view_txt7  {top: 15.5%; right: 11.3%; }
    .fac_click li.view_txt8  {bottom: 18.7%; left: 48.9%; }
    .fac_click li.view_txt9  {bottom: 18.7%; right: 33.2%; }
    .fac_click li.view_txt10 {bottom: 18.7%; right: 23.3%; }
    .fac_click li.view_txt11 {bottom: 18.7%; right: 16.1%; }
    .fac_click li.view_txt12 {bottom: 18.7%; right: 9.4%; }
    .fac_click li.view_txt13 {bottom: 18.7%; right: 2.0%; }
    
}



@media only screen and (max-width:550px) {
    .tabnavi02 ul li, .boardTab ul li {width:calc(100% / 2)}
    .tabnavi02 ul li:nth-child(3n) a, .boardTab ul li:nth-child(3n) a {border-right:1px solid #e9e9e9}
    .tabnavi02 ul li:nth-child(2n) a, .boardTab ul li:nth-child(2n) a {border-right:0}
    .tabnavi02 ul li:nth-child(-n+3) a, .boardTab ul li:nth-child(-n+3) a {border-top:1px solid #e9e9e9}
    .tabnavi02 ul li:nth-child(-n+2) a, .boardTab ul li:nth-child(-n+2) a {border-top:0}

    /* 센터소개 */
    .ctcon_edulst .edulst_box {width:100%; border-radius:15px 15px 5px 5px}
    .ctcon_edulst .edulst_box .edulst_line {border-radius:13px 13px 3px 3px}
    .edulst_txt {padding:10px 5px; font-size:1em}
    
    /* 전자도서관 안내 */
    .library_wrap {padding:40px 15px 80px; border-radius:15px;  background-color:rgba(227, 234, 237, 0.8); background:linear-gradient(rgba(227, 234, 237, 0.9), rgba(227, 234, 237, 0.9)), url(../images/sub/bg_library_eng.jpg) no-repeat right bottom; background-size:cover; text-align: center}
    .library_jp .library_wrap {padding:40px 15px 80px; background-color:rgba(255, 233, 222, 0.9); background:linear-gradient(
      rgba(255, 233, 222, 0.9), rgba(255, 233, 222, 0.9)), url(../images/sub/bg_librarynew_jp.jpg) no-repeat right bottom; background-size:cover}
    .library_jp .library_wrap .library_tit {padding:0; background:none}
    .library_online .library_wrap {padding:40px 15px 80px; background-color:rgba(255, 233, 222, 0.9); background:linear-gradient(
      rgba(240, 234, 251, 0.9), rgba(240, 234, 251, 0.9)), url(../images/sub/bg_librarynew_online.jpg) no-repeat right bottom; background-size:cover}
    
       
}
@media only screen and (max-width:500px) {
    /*  시설구성도 */
    .fac_click li.view_txt {width:8%; height:13%}
    .fac_click li.view_txt a {line-height:5.8vw}
    .fac_lstwrap ul {padding:10px}
    .fac_click li.view_txt1  {top: 22.8%; left: 12%; }
    .fac_click li.view_txt2  {top: -2%;  left: 31.2%; }
    .fac_click li.view_txt3  {top: 6%;  left: 44.5%; }
    .fac_click li.view_txt4  {top: 6%;  left: 52.5%; }
    .fac_click li.view_txt5  {top: 6%;  right: 31.8%; }
    .fac_click li.view_txt6  {top: 6%;  right: 21.7%; }
    .fac_click li.view_txt7  {top: 13.5%; right: 11.3%; }
    .fac_click li.view_txt8  {bottom: 17%; left: 48.9%; }
    .fac_click li.view_txt9  {bottom: 17%; right: 33.2%; }
    .fac_click li.view_txt10 {bottom: 17%; right: 25.5%; }
    .fac_click li.view_txt11 {bottom: 17%; right: 18.1%; }
    .fac_click li.view_txt12 {bottom: 17%; right: 10.4%; }
    .fac_click li.view_txt13 {bottom: 17%; right: 3.0%; }
    
    
}
@media only screen and (max-width:450px) {
    /* 영어늘봄 프로그램 */
    .neulbom_info ul li {flex-wrap:wrap}
    .neulbom_info ul li .ninfo_tit {width:100%}
    .neulbom_info ul li .ninfo_tit span {padding:7px 0 7px 40px; background-size:32px auto !important}
    .neulbom_info ul li .ninfo_txt {width:100%; padding:5px 0}
    
    /* 수강신청 안내 */ 
    .process_box .proc_txt {background-image:none; padding:12px 15px}
    
    /*  시설구성도 */
    .fac_lstwrap ul {padding:7px; gap:5px}
    .fac_lstwrap ul.fac_txtlst {padding:10px; gap:5px}
    .fac_lstwrap ul.fac_txtlst li .alphabet {width:22px; height:22px; line-height:20px}    
    .fac_lstwrap ul.fac_txtlst li {width:100%; align-items: flex-start; font-size:0.935em}
}