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

/* Common */
.mobile_bg {display: none; position: fixed; width: 100%; height: 100%;  left: 0; top: 0; background: #000; z-index:400}
.clear_fix::after{content: ""; display: block; clear: both}
.hide{display: none}
.hidden{overflow:hidden; height:0; width:0; line-height:0; font-size:0; text-indent:-9999999px}

/* Layout */
#wrap {position: relative; width: 100%; min-width: 320px; overflow: auto}
#content {position: relative}
h3.tit {font-size:1.231em; font-weight:400; color:#000; font-family:'jalnan'}

/* basic */
img, li img, dd img {vertical-align: middle}

/*더보기버튼 공통*/
#content .btn_more {position: absolute}
#content .btn_more a {display: block; transition: all .3s; text-align: center}
#content .btn_more img {width:12px; height:12px; transition: all .3s; vertical-align:top}
#content .btn_more a:hover img {transform: rotate(180deg)}


.gen_link a {display:inline-block; padding:0 25px 0 10px; line-height:30px; font-size:0.923em; font-weight:500; background:#fff url(../images/main/btn_gen_arr.png) no-repeat right 5px top 50%}
.gen_link span {display:block; position:relative; padding-left:30px; background:url(../images/main/blt_gengo.png) no-repeat 0 50%}
/*.gen_link span:after {content:""; display:block; position:absolute; top:50%; right:50px; width:48px; height:20px; margin-top:-10px; line-height:20px; background:rgba(0,0,0,0.3); border-radius:50px; text-align: center; color:#fff; transition:.3s}*/
.gen_link:hover span:after {background:#fff; color:#000}

/* 로고 영역 */
.logo a {display:flex}
.logo a .logo_txt {display: flex; overflow:hidden; white-space: nowrap; animation:blink 1.4s infinite}
.logo a .logo_txt span {display:inline;; font-size:12px; letter-spacing:0.5px}
.headerwrap {height:80px; width:100%; background:#fff}
.header_top {position:relative; height:30px}
.header_top .logo{position: absolute; top:6px; left:10px}
.header_top .logo a{display: block}
.header_btn {position:relative; height:50px; border-top:1px solid #d9d9d9 }

.qmu_wrap {position:absolute; top:-30px; right:0}
.qmu_wrap .qmu_btn {transition:.3s}
.qmu_wrap .qmu_popup {height:30px;}
.qmu_wrap .qmu_popup a {display:flex; justify-content: space-between;  align-items: center; height:30px; padding:0 10px; background:#3395f1; color:#fff}
.qmu_wrap .qmu_popup a .ptit {padding:2px 10px 2px 18px; background: url(../images/main/blt_popup.png) no-repeat 0 50%}
.qmu_wrap .qmu_popup a .pnum {display:block; width:20px; height:20px;line-height:20px; background:#fff; border-radius:50%; text-align: center; color:#000}
.qmenu .btn_all {position:absolute; top:10px; right:10px}
.qmenu .btn_all a {display:block; width:30px; height:30px; background:url(../images/main/btn_allmn_m.png) no-repeat 50% 50%; font-size:0}


/* 레이어 팝업 */
.mpop_top {display:flex; width:528px; margin:0 auto 15px; align-items: center; justify-content:center}
.mpop_bg {position: fixed; top: 0;left: 0; width: 100%;height: 100%; background-color: #000; opacity: 0.7; z-index:110}
.mpopup_box {display:none}
.mpopup_box.on {display:block}
.mpop_lstwrap {position:fixed; top:150px; left:50%; margin-left:-279px; z-index:111; text-align: center}
.mpop_tit {display:block; text-align: center}
.mpop_tit span {padding:3px 0 3px 34px; background:url(../images/main/blt_laypop_tit.png) no-repeat 0 50%;  font-size:24px; color:#fff; font-family: 'jalnan'}
.mpop_lstwrap .mpop_tb {width:526px}
.mpop_list {position:relative}
.mpop_layer {flex: 0 0 100%; max-width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; margin:0 5px}
.mpop_layer a {display:block}
.mpop_layer a.mpop_img {overflow: hidden; display:block; max-width:100%; width:528px; height:284px; background:#eee; box-shadow:0 2px 5px rgba(0,0,0,0.1); border-radius:13px; border:1px solid rgba(255,255,255,0.1); box-sizing: border-box}
.mpop_layer a.mpop_txt {display:flex; justify-content: center; width:100%; text-align: center; color:#fff; font-size:17px; font-weight:600; padding:15px 0; white-space: nowrap}
.mpop_layer img {width:526px; height:282px}
.mpop_lstwrap .slick-arrow {position: absolute; top:120px; width:49px; height:49px; font-size:0}
.mpop_lstwrap .slick-prev {left:-60px; background:url(../images/main/btn_laypop_prev.png) no-repeat 50% 50%}
.mpop_lstwrap .slick-next {right:-60px; background:url(../images/main/btn_laypop_next.png) no-repeat 50% 50%}
.mpop_closebox {display: flex; justify-content: space-between; gap:5px}
.mpop_closebox li {width:calc(100% /2)}
.mpop_closebox li a {display:block; height:40px; line-height:38px; font-size:1.077em; border:1px solid #bdbdbd; border-radius:5px; padding:0 10px; box-sizing: border-box; color:#fff; text-align: left; font-weight:600}
.btn_poptoday a span {display:block; background:url(../images/main/blt_laypop_close.png) no-repeat right 5px top 50%}
.btn_popclose a span {display:block; background:url(../images/main/blt_laypop_close.png) no-repeat right 5px top 50%}

/* Visual */
.visual {position:relative; overflow:hidden}
.visual .visual_wrap {position:relative; width: 100%; margin: 0 auto}
.visual_wrap .slick-arrow {display:none !important}
.visual_wrap .slick-dots li button, .visual_wrap .btn_visual li button {border:none; background:none; font-size:0}
.visual_wrap .visual_item {position:relative; display: block; width:100%; height:245px}
.visual_wrap .visual_item > a {position: relative; display:block; height:245px}
.visual_wrap .visual_item > a:focus-visible {height:241px; outline:2px solid #000}
.visual .item1 {background:url(../images/main/v_m01.jpg) no-repeat center top} /* 메인1 */
.visual .item2 {background:url(../images/main/v_m02.jpg) no-repeat center top} /* 메인2 */
.visual .item3 {background:url(../images/main/v_m03.jpg) no-repeat center top} /* 메인3 */
.visual_item span.vbg_txt {font-size:0}
.visual_item p.vbg_bigtxt {font-size:0}
.ctrl_wrap {display:none}

/* 비주얼 퀵 */
.visual_quick ul {overflow: hidden; display:flex; justify-content: space-between; border-radius:10px; border:2px solid rgba(255,255,255,0.3)}
.visual_quick ul li {display:flex; width:100%; background:#fff}
.visual_quick ul li a {display: flex; justify-content: space-between; align-items: center; width:100%; padding:0 12px 0 10px; margin:8px 0; box-sizing: border-box; font-size:1.077em; font-weight:600}
.visual_quick ul li:hover a {text-decoration: underline; transition: .3s}
.visual_quick ul li:first-child a {border-right:1px solid #d9d9d9}

/* 퀵메뉴  */
.main_quick {display: flex; justify-content: space-between; flex-wrap: wrap}
.main_quick .mquick_box a {overflow:hidden; position:relative; display:flex;  justify-content: space-between; padding:11px; background:#fff; border-radius:15px; transition: .4s; box-sizing: border-box}
.main_quick .mq_engtit {color:#bebebe; font-size:0.938em; font-weight:500}
.main_quick .mq_qtit {padding:5px 0 15px; font-size:1.154em; font-family:'jalnan'; color:#919191}
.main_quick .mq_qtit span {color:#2d2d2d; transition:.4s}
.main_quick .mq_go {display:inline-block; padding:5px 10px; border-radius:50px; text-align: center; color:#fff; font-family:'jalnan'}
.main_quick .mq_ico {position:absolute; bottom:0; right:0; width:68px; text-align: center}
.main_quick .mq_ico:before {content:""; display: block; position: absolute; bottom:0; right:0; width:68px; height:34px; border-radius:68px 68px 0 0}
.main_quick .mq_ico img {position: relative}
.mq_box01 .mq_ico:before {background:#dcf2f1}
.mq_box02 .mq_ico:before {background:#e3eaff}
.mq_box03 .mq_ico:before {background:#eeeafe}
.mq_box04 .mq_ico:before {background:#fef2db}
.mq_box01 .mq_go {background:#59c3bb}
.mq_box02 .mq_go {background:#7b9dff}
.mq_box03 .mq_go {background:#b09bfb}
.mq_box04 .mq_go {background:#fac255}

.mq_box01 a:hover .mq_qtit span {color:#59c3bb}
.mq_box02 a:hover .mq_qtit span {color:#7b9dff}
.mq_box03 a:hover .mq_qtit span {color:#b09bfb}
.mq_box04 a:hover .mq_qtit span {color:#fac255}

.main_quick .mquick_box a:hover {box-shadow:0 1px 10px rgba(0,0,0,0.2)}
.main_quick .mquick_box a:hover img {animation:effect 2s linear alternate infinite}
.main_quick .mquick_box a:hover .mq_qtit {color:#2d2d2d; transition: .4s}

/***************** Layout ******************/
/***Content  Common***/

/* notice */
#main_notice {margin-top:20px}
.notice_box {position:relative}
.notice_box:before {content:""; display: block; position: absolute; top:45px; left:0; width:100%; height:1px; background:#bdbdbd}
.notice_box h3 {position:absolute; top:0; width:108px}
.notice_box h3 a {overflow:hidden; position:relative; display:block; width:100%; height:46px; line-height:46px; margin:0 auto; font-size:1.231em; font-weight:500; font-family:'jalnan'; color:#8d8d8c; transition: all .3s; text-align: center; border-radius:15px 15px 0 0; box-sizing: border-box; z-index:1}
.notice_box h3.on a {color:#000; border:1px solid #bdbdbd; border-bottom:0; background:#fff}
.notice_box h3.on a:after {content:""; display:block; position: absolute; top:9px; right:13px; width:7px; height:7px; background:#f67162; border-radius:50%}
.notice_box .noticetab01 {left:0}
.notice_box .noticetab02 {left:108px}
.notice_box .notice_tb {overflow: hidden; position:relative; height:193px; padding-top:45px}
.notice_box .notice_tb ul {overflow:hidden; margin-top:64px; height:127px; border-radius:10px; border:1px solid #d2d2d2}
.notice_box .notice_tb ul li {position:relative; min-height:43px; line-height:160%; padding:11px 60px 10px 20px; transition:.3s; box-sizing: border-box; cursor: pointer; border-bottom:1px solid #d2d2d2}
.notice_box .notice_tb ul li:after {content:""; display: block; position:absolute; top:18px; left:10px; width:4px; height:4px; background:#000; border-radius:50%}
.notice_box .notice_tb ul li .tit {width:auto; margin:0}
.notice_box .notice_tb ul li .tit a {display:block; overflow:hidden; width:95%; text-overflow:ellipsis; white-space:nowrap; color:#262626; font-size:1em;  font-weight:500}
.notice_box .notice_tb ul li .date {position:absolute; bottom:11px; right:10px; width:58px; height:20px; line-height:20px; text-align:right; font-family: 'NSK';font-weight:300; font-size: 1em; color: #979797}

.notice_box .notice_tb ul li.first_list {position:absolute; top:45px; left:0; width:100%; min-height:64px; padding:8px 64px 8px 56px; box-sizing: border-box; border:0}
.notice_box .notice_tb ul li.first_list:after {content:""; display: block; position: absolute; top:50%; left:0; width:48px; height:48px; margin-top:-24px; background:#ffd178 url(../images/main/bg_notice_first.gif) no-repeat 50% 50%; border-radius:50%}
.notice_box .notice_tb ul li.first_list .tit {height:20px; line-height:20px; padding-top:5px}
.notice_box .notice_tb ul li.first_list .tit a {display:block; width:100%; color:#000; font-size:1.077em; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.notice_box .notice_tb ul li.first_list .txt {overflow:hidden; width:90%; height:22px; line-height:22px; font-size:1em; font-weight:400; text-overflow:ellipsis; white-space:nowrap; color: #3a3a3a}
.notice_box .notice_tb ul li.first_list .date {bottom:10px}
.notice_box .btn_more {top:10px; right:0}
.notice_box .btn_more a {display:flex; align-content: center; width:24px; height:24px; background: #6f7878; border-radius: 50%; box-sizing: border-box}

/* 팝업 고정 영역 */
.main_fixpop {position: relative; margin-top:20px}
.main_fixpop .cont_toparea {margin-bottom:10px}
.main_fixpop h3.tit {padding:4px 100px 4px 0}
.main_fixpop h3.tit span {color:#3395f1}
.main_fixpop .btn_more {top:0; right:0}
.main_fixpop .btn_more a {display:flex; align-content: center; width:24px; height:24px; background: #fff; border:1px solid #b6b6b6; border-radius: 50%; box-sizing: border-box}
.popup_wrap {position: relative}
.main_fixpop .popup_layer_wrap {position:relative; min-height:140px}
.main_fixpop .popup_layer_wrap:before {content:""; display: block; position: absolute; top:0; left:50%; margin-left:-150px; width:300px; height:140px; border-radius:10px; border:1px solid #bdbdbd; background:#eff4fe url(../images/main/bg_popup_prefer.gif) no-repeat 50% 50%}
.main_fixpop .popup_layer{position: relative; box-sizing: border-box}
.main_fixpop .popup_imgsize {overflow:hidden; max-width:320px; height:140px; margin: 0 auto; border-radius:10px; border:1px solid #bdbdbd; }
.main_fixpop .popup_imgsize a {display:block}
.main_fixpop .popup_imgsize img {max-width:320px; height:140px}
.popup_layer_wrap button.slick-arrow {display:none !important}
.main_fixpop .popup_tittxt {width:100%; min-height:54px}
.main_fixpop .popup_tittxt a {display:block; padding:18px 114px 18px 40px; background: url(../images/main/blt_popup_tit.gif) no-repeat 5px 50%; font-size:1.385em; text-overflow: ellipsis; white-space: nowrap; overflow: hidden}

.popup_layer_wrap button.slick-arrow {display:none !important}
.pop_zone {position:absolute; top:-30px; right:30px; display:flex; justify-content: space-between; align-items: center; padding:0 5px}
.pop_count {display:flex; font-size:1.154em; font-weight:500; color:#8d8d8c}
.pop_count .custom_paging {position:relative}
.pop_count .custom_paging + .custom_paging{display:none !important;}
.pop_count .custom_paging li {position:absolute; width:100%; left:24px; top:-7px; opacity:0; font-weight:500; color:#787878}
.pop_count .custom_paging li.slick-active {opacity:1}
.pop_count .custom_paging li span {display:inline}
.pop_count .custom_paging li span.num {color:#000; font-weight:700}
.pop_zone .btn_slide {display: flex; justify-content: space-between; width:75px}
.pop_zone .btn_slide li button {display:block; width:9px; height:14px; line-height:14px; text-align: center; background:#fff}
.pop_zone .btn_slide li button img {vertical-align: middle}
.pop_ctrl_dots { display:flex !important}


/* 자주묻는 질문 */
.main_faq {position:relative; margin-top:20px; background:#ebf0ff; border-radius:10px; padding-bottom:7px}
.main_faq .cont_toparea {padding:13px 10px 0}
.main_faq h3.tit {padding:5px 0 5px 34px; color:#1e2a4e; background:url(../images/main/blt_faq_tit.png) no-repeat 0 50%}
.faq_box a {display:block; position:relative; padding:10px 38px 10px 0; border-radius:10px; background:#fff; margin-top:10px; box-shadow:0 1px 6px rgba(0,0,0,0.07); transition:.3s}
.faq_box a:before {content:""; display:block; position: absolute; top:6px; right:6px; width:22px; height:calc(100% - 12px); background:#eee url(../images/main/btn_faq_arr.png) no-repeat 50% 50%; border-radius:10px; transition:.3s}
.faq_box .faq_tit {overflow: hidden; text-overflow:ellipsis; white-space: nowrap; display:block; position:relative; padding:6px 0 6px 38px; font-weight:600}
.faq_box .faq_txt {overflow: hidden; text-overflow:ellipsis; white-space: nowrap; display:block; position:relative; padding:6px 0 6px 38px}
.faq_box .faq_tit:after {content:"Q"; display:block; position: absolute; top:50%; left:10px; width:23px; height:23px; line-height:23px; background:#6f7878; border-radius:50%; text-align: center; margin-top:-12px; color:#fff}
.faq_box .faq_txt:after {content:"A"; display:block; position: absolute; top:50%; left:10px; width:23px; height:23px; line-height:23px; background:#acacac; border-radius:50%; text-align: center; margin-top:-12px; color:#fff}
.faq_box a:hover:before {background-color:#aab8df}
.faq_boxarea {overflow: hidden; height:158px; padding:12px 10px 0}
.faq_box:first-child a {margin-top:0}
.main_faq .btn_more {top:13px; right:12px}
.main_faq .btn_more a {display:flex; align-content: center; width:24px; height:24px; background:rgba(0,0,0,0.1); border-radius: 50%; box-sizing: border-box}

/* 고객센터 */
.main_cs {margin-top:20px; border-top:1px solid #bccbf8}
.main_cs h3.tit {padding:12px 0 12px 30px; background:url(../images/main/blt_cs_tit.png) no-repeat 0 50%}
.main_cs h3.tit span {color:#3395f1}
.cs_txt {padding:0 5px; color:#1e2a4e; font-weight:500}
.cs_search {position:relative; margin:11px 0}
input.srchform {width:100%; height:33px; border:2px solid #d5d5d5; border-radius:50px; padding:8px 30px 8px 8px; box-sizing: border-box}
.btn_cssrch {position:absolute; top:0; right:0; width:40px; height:100%; background:url(../images/main/btn_cs_srch.png) no-repeat 50% 50%; font-size:0}
.cs_wrap {padding:13px; border-radius:10px; background:linear-gradient(135deg, #d5cefc, #9fdfea)}
.cs_box a {position:relative; display:block; padding:15px 17px; background:#fff; border-radius:10px; transition:.3s}
.cs_box a:after {content:""; display: block; position: absolute; top:50%; right:10px; width:45px; height:45px; margin-top:-22px; border-radius:50%; transition:.3s}
.cs_box .cs_boxtit {font-size:1.154em; font-family:'jalnan'; color:#1e2a4e; transition:.3s}
.cs_box .cs_boxtxt {margin-top:10px; font-weight:500}
.call_box {margin-top:9px}
.qna_box a:after {background:#d5d5d5 url(../images/main/btn_qna_go.png) no-repeat 50% 50%}
.call_box a:after {background:#d5d5d5 url(../images/main/btn_call_go.png) no-repeat 50% 50%}
.qna_box a:hover {box-shadow:0 2px 10px rgba(0,0,0,0.1)}
.qna_box a:hover:after {background:#917efd url(../images/main/btn_qna_go.png) no-repeat 50% 50%}
.call_box a:hover:after {background:#28c1d3 url(../images/main/btn_call_go.png) no-repeat 50% 50%}
.qna_box a:hover .cs_boxtit {color:#917efd}
.call_box a:hover .cs_boxtit {color:#28c1d3}

/* banner */
#main_banner {margin-top:20px; box-sizing: border-box}
.banner_wrap {position:relative}
.banner_wrap .cont_toparea {display: flex; justify-content: space-between}
.banner_wrap .cont_toparea .tit {color:#b0b0af}
.banner_wrap .cont_toparea .tit span {color:#252525}
.ban_item a {overflow:hidden; display:block; width:100%; max-width:200px; height:58px; margin:12px auto 26px; border:1px solid #dedede; background:#fff url(../images/main/bg_nobanner.gif) no-repeat 50% 50%; box-sizing: border-box; border-radius:10px; box-shadow:0 1px 5px rgba(0,0,0,0.1)}
.ban_item img {width:100%; height:100%; margin: 0 auto; transition: .3s ease-in-out}
.ban_item:hover a img {transform:scale(1.08)}
.ban_item a:hover {border-color:#b0b0b0}
.banner_wrap .btn_more {top:1px; left:80px}
.banner_wrap .btns {display: flex; justify-content: space-between}
.banner_wrap .btns li {text-align:center; height:14px}
.banner_wrap .btns li button  {display:block; width:14px; height:14px; line-height:14px; margin:0 0 0 5px; text-align: center; cursor: pointer; box-sizing: border-box; text-align: center; background:none}
.banner_wrap .btns li button img {vertical-align:text-bottom}
.ban_area {min-height:55px}

/* 유관기관 */
#footwrap .fm_site {position:relative; background:#efefef}
#footwrap .fm_site > ul {display: flex; justify-content: space-between; flex-wrap:wrap}
#footwrap .fm_site > ul > li {position: relative; width:calc(100% / 2) ; box-sizing: border-box; border-left:1px solid #d5d5d5; border-top:1px solid #d5d5d5}
#footwrap .fm_site > ul > li:nth-child(1) {border-top:0; border-left:0}
#footwrap .fm_site > ul > li:nth-child(2) {border-top:0}
#footwrap .fm_site > ul > li:nth-child(3) {border-left:0}

.fm_site .site_tit {position: relative; width:100%; height:32px; line-height:32px; margin: 0 auto; box-sizing: border-box}
.fm_site .site_tit a { display:block; height:32px; padding-left:10px; padding-right:30px; box-sizing:border-box; font-weight:500; color:#000}
.fm_site .site_tit .fm_arr {display: block; content: " "; clear: both; position:absolute; top:0; right:5px; width:12px; height:12px; margin-top:0; text-align: center; box-sizing: border-box}
.fm_site .site_tit .fm_arr img {transition:.3s ease-in-out; width:12px; height:12px; vertical-align: inherit}
.fm_site .site_tit.active .fm_arr img {transform: rotate(180deg)}
.fm_site .site_tit.active a {background:#fff; border-radius:0 0 5px 5px}
.fm_site .site_lst {overflow:hidden; display:none; position: absolute; height: 0; width:100%; background:#fff; box-sizing:border-box; border-radius:5px 5px 0 0}
.fm_site .site_lst ul {overflow-y:auto; height:100px; padding:5px}
.fm_site .site_lst ul li {padding:4px 0; border-bottom:1px solid #ccc}
.fm_site .site_lst ul li:last-child{padding-bottom: 0; border-bottom: none}
.fm_site .site_lst ul li a {position:relative;  display:block; overflow:hidden; width:100%; padding:7px 28px 7px 10px; text-overflow:ellipsis;  white-space:nowrap; font-weight:400; color:#000;  box-sizing: border-box}
.fm_site .site_lst ul li a:after {content:"GO"; display:block; position:absolute; top:50%; right:0; width:26px; height:20px; line-height:20px; margin-top:-10px; background:#222;border-radius:5px; text-align: center; color:#fff; font-size: 11px}
.fm_site .site_lst {display: block; bottom:calc(100%); left:0}
.fm_site .site_lst ul li:hover a {color:#000; font-weight:400}
.fm_site .site_lst ul li:hover a:after {background:#3782df; font-weight:500; transition:all .3s}

/* footer */
.foot_wrap {display:flex; justify-content:center; position: relative; background:#222}
.mb_menu {border:1px solid #d5d5d5; border-left:0; border-right:0}
#footwrap .ftit {display: inline-block; padding:0 10px; margin-right:4px; background:#71787e; text-align: center}
#footwrap .fadmin {display:none}
#footwrap address {word-break: keep-all}
#footwrap .add_wrap {padding:15px 10px; text-align: center; color:rgba(255,255,255,0.5); line-height:140%; word-break: keep-all; font-weight:300}
.add_info {padding:15px 0}
#footwrap .copy {line-height:120%; padding:10px; text-align: center; color:#999; font-size:13px; border-top:1px solid rgba(255,255,255,0.2)}
.count_box {display: none}




/*************** MOBILE LAYOUT ***************/
@media only screen and (max-width:1024px) {
/* Common */
.skip_navi .pc_skip{display:none}

/* Layout */
#mainheader {position: relative; z-index:100}
.fixed .headerwrap {position:fixed; box-shadow:0 2px 6px rgba(0,0,0,0.07)}
#content {border-bottom:0}
	
/* 로고영역 */
.logo a img {width:220px}
.qmenu .qmu_log {position:absolute; top:40px; right:45px}
.qmenu .qmu_log a {display:block; width:30px; height:30px; background:url(../images/main/btn_login_m.png) no-repeat 50% 50%; font-size:0}
.qmenu .qmu_logout {position:absolute; top:40px; right:45px}
.qmenu .qmu_logout a {display:block; width:30px; height:30px; background:url(../images/main/btn_logout_m.png) no-repeat 50% 50%; font-size:0}
    
/* 교육청 링크 */
.gen_link span {background-size:19px auto; padding-left:23px}

/* GNB */
.mobile_bg{z-index: 500 !important}
#gnb {display: none; position:fixed; top:0; right:0; width: 250px; height:100%; min-height:100%; background:#fff; z-index:1000; overflow-y:auto; box-sizing:border-box}
#gnb p.mb_gnbtit {display: block; height:54px; line-height:54px; padding-top:4px; text-align: center; font-family:'jalnan'; font-size:18px; background:#3d4e69 url(../images/main/bg_allmn_tit.gif) no-repeat 50% 50%}
#gnb p.mb_gnbtit span {color:#fff; font-weight:600}
/* GNB_상단 */
#gnb .allbtnclose .closebtn {display:block; position:absolute; top:17px; right:14px; width:26px; height:26px; overflow: hidden; background:url(../images/main/btn_allmn_close.gif) no-repeat 50% 50%; line-height:0; text-indent:-9999px}
    
/*GNB_메뉴버튼*/
#gnb .mbl_area {padding:6px 10px; box-sizing: border-box; background:#3d4e69}
#gnb .mbl_area ul {display: flex; justify-content: space-between; align-items: center; gap:5px}
#gnb .mbl_area li {width:calc(100% / 2)}
#gnb .mbl_area li a {display:block; color:#000; font-size: 13px; font-weight:500; text-align:center; background:#d8dee9; padding:8px 10px 7px; box-sizing: border-box; border-radius:5px}
#gnb .mbl_area li:first-child a {background: #fff} 
  
/* GNB_메뉴타이틀 */
#gnb .gnb_list .depth1 {border-bottom:1px solid #d9d9d9; padding:5px 0}
#gnb .gnb_list .depth1 h2 > a {position:relative; display:block; line-height: 130%; margin:4px; min-height:32px; padding:14px 15px 13px 12px; margin:0 40px 0 0; width:auto;  font-size:1.231em; font-weight:500; color: #000; transition: all .3s; box-sizing: border-box; word-break:keep-all}
#gnb .gnb_list .depth1 h2 > a:hover, #gnb .gnb_list .depth1.act h2 > a {position:relative; font-weight:600; text-decoration:none; background:#e7e7e7; border-radius:0 50px 50px 0}
#gnb .gnb_list .depth1 h2 > a:after {content:""; display:block; position:absolute; top:50%; right:-35px; width:46px; height:46px; margin-top:-23px; border-radius:50%; background:#fff url(../images/main/btn_mn_off.gif) no-repeat 50% 50%; border:2px solid #fff; box-sizing: border-box}
#gnb .gnb_list .depth1 h2 > a:hover:after, #gnb .gnb_list .depth1.act h2 > a:after {content:""; display:block; position:absolute; top:50%; right:-35px; width:46px; height:46px; margin-top:-23px; border-radius:50%; background:#fff url(../images/main/btn_mn_on.gif) no-repeat 50% 50%; border:2px solid #e7e7e7; box-sizing: border-box}
    
/*GNB_메뉴세부*/
#gnb .gnb_list .depth1 .navi_sub {display:none; position: relative; box-sizing: border-box; padding:10px 10px 5px}
#gnb .gnb_list .depth1 .navi_sub ul > li {margin-bottom:4px}
#gnb .gnb_list .depth1 .navi_sub ul > li > a {display:block; margin-top:4px; padding:5px 5px 5px 20px; font-weight:400; background:url(../images/main/blt_subleft_off.gif) no-repeat 0 7px; word-break:keep-all}
#gnb .gnb_list .depth1 .navi_sub ul > li:first-child a {margin-top:0}
#gnb .gnb_list .depth1 .navi_sub ul > li.third_on a , #gnb .gnb_list .depth1 .navi_sub ul > li:hover > a{background:url(../images/main/blt_subleft_on.gif) no-repeat 0 7px; color:#1f3a64; font-weight:600}

/********************************************* Layout **********************************************/
/***Content  Common***/   
.mb_none{display: none}

.content_area {padding:0 10px}
.content01 {padding:0}
    
/* popup */
    
/* content */
.main_quick {padding:0 10px 10px}
.main_quick .mquick_box {width:calc(100% / 2 - 5px); margin-top:10px}
.mq_tit {position: relative; padding-bottom:20px}
.mq_tit .mq_go {position: absolute; bottom:0; left:0}
.main_quick .mq_ico img {height:50px}

/* 비주얼 퀵 영역 */
.line_color01 .visual_quick {background:#3395f1}
.line_color02 .visual_quick {background:#1aa68d}
.line_color03 .visual_quick {background:#9386eb}
.visual_quick {padding:10px 10px 0}
    
/* 퀵메뉴 */
.line_color01 .main_quick {background:#3395f1}
.line_color02 .main_quick {background:#1aa68d}
.line_color03 .main_quick {background:#9386eb}

/* notice */
.notice_box .notice_tb ul li.first_list:after {background-size:26px auto}

/* 자주묻는 질문 */
.main_faq h3.tit {background-size:24px auto}
    
/* 고객센터 */
.main_cs h3.tit {background-size:24px auto}
.btn_cssrch {background-size:14px auto}

/* 팝업 영역 */
.main_fixpop .popup_tittxt a {padding:17px 100px 17px 35px; font-size:1.154em; background-size:22px auto}
.main_fixpop .btn_more a img {margin-top:1px; width:10px !important; height:10px !important}
.main_fixpop .popup_imgsize {background-size:120px auto}
.main_fixpop .popup_layer_wrap:before {background-size:120px auto}

/* 하단 */
.foot_wrap {display: block}
#footwrap .foot_menu .mb_menu {position: relative; display:flex; justify-content: center; align-items: center; margin:0 auto; text-align: center; background:#fff}
#footwrap .foot_menu .mb_menu li {padding:0 10px 0 10px; margin:0; height:32px; line-height:30px; background:url(../images/main/blt_foot_bar.gif) no-repeat right center}
#footwrap .foot_menu .mb_menu li:last-child {background: none}
#footwrap .foot_menu .mb_menu li a {display:block; font-weight: 400}
/*PC버튼*/
#footwrap .pc_menu {display:flex; justify-content:space-between; flex-wrap:wrap; text-align:center; background:#fff; font-weight:400; border-bottom:1px solid #d5d5d5}
#footwrap .pc_menu li {width:100%}
#footwrap .pc_menu li a {display: block; padding:10px 0}
#footwrap .pc_menu li.li_1 a {box-sizing: border-box; color:#0057a8; font-weight:600}
#footwrap .pc_menu li.li_2 {border-left:1px solid #d5d5d5}
#footwrap .pc_menu li.li_3 {width:100%; border-top:1px solid #fff}
#footwrap .add_telinfo {margin:0 auto}
/*주소*/
.flogo img {width:220px}
#footwrap address {width:auto; line-height:140%; font-size: 13px; text-align: center}

    
}

/******** PC LAYOUT ********/
@media only screen and (min-width:1025px) {
/* Common */
.skip_navi .mb_skip{display:none}

/* Layout */
#wrap {min-width:1420px}
.headerwrap {height:124px; border:0}
.header_top {position: relative; margin:0 auto; height:124px}
.header_top:before {content:""; display:block; position: absolute; top:0; left:0; width:100%; height:40px; background:#f2f2f2; border-bottom:1px solid #d9d9d9}
.header_top .logo {top:19px; left:0}
.header_btn {width:1400px; height:84px; margin:0 auto; border-top:0}

/* 교육청 링크 */
.gen_link {position:relative; width:1400px; margin:0 auto}
.gen_link a {width:295px; height:40px; line-height:38px; box-sizing: border-box; border-left:1px solid #d9d9d9; border-right:1px solid #d9d9d9; font-size:1.077em; font-weight:500; background-position:right 10px top 50%}

/* qmenu */
.qmu_wrap {position:absolute; top:-40px; right:0; display:flex; justify-content: space-between}
.qmenu .btn_srch {position:absolute; top:25px; right:50px}
.qmenu .btn_srch a {display:block; width:32px; height:32px; background:url(../images/main/btn_srch.png) no-repeat 50% 50%; font-size:0}
.qmenu .btn_all {top:25px}
.qmenu .btn_all a {width:32px; height:32px; background:url(../images/main/btn_allmn.png) no-repeat 50% 50%}
.qmu_wrap .qmu_popup a {height:40px; line-height:40px}
.qmu_wrap .qmu_popup a .pnum {width:24px; height:24px; line-height:24px; font-weight:500}
.qmu_wrap .qmu_popup a .ptit {padding:0 10px 0 20px}
.qmu_wrap .qmu_btn a {display: block; height:40px; line-height:40px; padding:0 25px; background:#fff; border-right:1px solid #d9d9d9; font-size:1.077em; transition: .3s}
.qmu_wrap .qmu_btn:hover a {background:#f2f2f2} 
    
/* GNB */
/*.gnb_box {max-width:1300px; margin: 0 auto; padding:0 7rem 0 6rem; box-sizing: border-box}*/
.gnb_box {max-width:1400px; margin:-84px auto 0; padding:0 100px 0 420px; box-sizing: border-box}
.gnb_list {display: flex; justify-content:center}
#gnb .allbtnclose, #gnb .mbl_area, #gnb .navi_sub {display: none}
#gnb .mb_gnbtit, #gnb p.gnb_mbtxt {display: none}
#gnb .depth1 {position: relative; float:left; width:20%; text-align: center; font-weight:500}
#gnb .depth1 h2 a {display:block; padding:32px 0; text-align: center; font-size:20px; font-weight:500; color:#000}
#gnb .depth1.active h2 a {font-weight:600; color: #2286c5}
#gnb .navi_sub {display:none; position: absolute; left: 0; top:74px; width:100%; z-index: 100; font-size:15px; background:#fff; border:3px solid #2286c5; border-radius:15px; box-shadow:0 1px 10px rgba(0,0,0,0.2)}
#gnb .navi_sub ul {overflow: hidden}
#gnb .navi_sub li {display: block; line-height: 180%; width:calc(100% - 10px); padding:5px; text-align: center; border-top:1px solid #c5cfd6}
#gnb .navi_sub li:first-child {border:0} 
#gnb .navi_sub a:hover {background:linear-gradient(90deg, #eeebfe, #d6f2f7); border-radius:10px; color:#000; font-weight: 600}
#gnb .navi_sub li a {display: block; line-height: 130%; padding:7px 5px; text-align: center; font-size:14px; font-weight:500; letter-spacing:-0.3px; word-break:keep-all; color:#4d4d4d}
#gnb .depth1.active .navi_sub {display: block}
#gnb .depth1.active .navi_sub li:hover a {transition:.3s}
.gnb_bg {overflow:hidden; width: 100%; height:400px; position: absolute; left: 0; top:131px;  background:#f5f5f5; box-shadow: 0 4px 8px rgba(0, 0, 0, .2); z-index: 99}

/* visual */
.visual .visual_wrap {max-width:1980px}
.visual .visual_item {height:507px}
.visual .visual_item > a {height:507px}
.visual .item1 a:focus-visible{height:503px; outline:2px solid #000}
.visual .item1 {background:#fff url(../images/main/v_pc01.jpg) no-repeat 50% 0}
.visual .item2 {background:#fff url(../images/main/v_pc02.jpg) no-repeat 50% 0}
.visual .item3 {background:#fff url(../images/main/v_pc03.jpg) no-repeat 50% 0}
    
/* 비주얼 */
/*재생,일시정지*/
.ctrl_wrap {display:flex; justify-content: space-between; position:absolute; top:220px; left:50%; width:100px; height:21px; margin:0 0 0 -685px; box-sizing: border-box}
.visual_wrap .btn_visual button {width:12px; height:12px; margin: 0 0 0 -28px; cursor:pointer; box-sizing: border-box; text-align: center}
.visual_wrap .btn_visual button.vbtn_play {background:url(../images/main/vbtn_play.png) no-repeat 50% 50%}
.visual_wrap .btn_visual .vbtn02 button.vbtn_pause{background:url(../images/main/vbtn_pause.png) no-repeat 50% 50%}
/*비주얼 이동 블릿*/
.visual_wrap .slick-dots {display:flex !important; gap:5px}
.visual_wrap .slick-dots li button {width:10px; height:10px; box-sizing: border-box; border-radius:50px; background:rgba(111,120,120,0.3)}
.visual_wrap .slick-dots li.slick-active button {width:32px; background: #6f7878}

    
/********************************************* Layout **********************************************/
/***Content Common***/   
.pc_none{display:none}

/* content layer */
h3.tit {font-size:1.538em}
#content .btn_more img {width:12px; height:12px}
    
/* content */
.content01 {position:relative; margin-top:-78px}
.content02 {display: flex; justify-content: space-between; max-width:1400px; margin:50px auto; box-sizing: border-box}
.content03 {display: flex; justify-content: space-between; max-width:1400px; margin:0 auto; box-sizing: border-box}
    
/* 비주얼 퀵 */
.visual_quick {position: absolute; top:268px; left:50%; margin-left:-700px}
.visual_quick ul {overflow: inherit; width:500px; border-radius: 15px; background:#fff}
.visual_quick ul li {background:none}
.visual_quick ul li a {position:relative; margin:9px 0; font-size:1.231em; padding:11px 22px; transition:.3s}

.line_color01 .visual_quick ul {border-color:#b3d7fa}
.line_color02 .visual_quick ul {border-color:#abe3d5}
.line_color03 .visual_quick ul {border-color:#d5cff7}

.visual_quick ul li a:after {content:""; display:block; position: absolute; top:-26px; right:15px; width:44px; height:40px}
.line_color01 .visual_quick ul li:hover a:after {background:url(../images/main/btn_vquick01_go.png) no-repeat 0 0}
.line_color02 .visual_quick ul li:hover a:after {background:url(../images/main/btn_vquick02_go.png) no-repeat 0 0}
.line_color03 .visual_quick ul li:hover a:after {background:url(../images/main/btn_vquick03_go.png) no-repeat 0 0}

/* 퀵메뉴 */
.main_quick {max-width:1400px; margin:0 auto; gap:20px}
.main_quick .mquick_box {width:calc(100% / 4 - 20px)}
.main_quick .mquick_box a {padding:24px 32px 53px; box-shadow:0 1px 11px rgba(0,0,0,0.1)}
.main_quick .mq_qtit {padding:8px 0 14px; font-size:1.462em}
.main_quick .mq_engtit {font-size:1em}
.main_quick .mq_ico {width:140px}
.main_quick .mq_ico:before {width:140px; height:70px; border-radius:140px 140px 0 0}
.main_quick .mq_go {padding:7px 16px; font-size:1.077em}
  
/* notice */
#main_notice {margin:0 40px 0 0}
.notice_box {width:750px}
.notice_box h3 {width:150px}
.notice_box h3 a {height:60px; line-height:60px; font-size:1.385em}
.notice_box h3.on a {font-size:1.538em}
.notice_box .notice_tb {padding-top:60px; height:268px}
.notice_box .btn_more a {width:32px; height:32px}
.notice_box:before {top:59px}
.notice_box .notice_tb ul li.first_list {top:60px; padding:34px 72px 34px 82px}
.notice_box .noticetab02 {left:150px}
.notice_box h3.on a:after {top:13px; right:20px}
.notice_box .notice_tb ul {margin-top:121px; height:145px; border-radius:15px}
.notice_box .notice_tb ul li {min-height:49px; padding:13px 70px 14px 26px; transition:.3s}
.notice_box .notice_tb ul li:hover {background:#eee}
.notice_box .notice_tb ul li .tit a {font-size:1.154em}
.notice_box .notice_tb ul li .date {bottom:16px; right:15px; font-size:1.077em}
.notice_box .notice_tb ul li:after {top:21px; left:12px; width:5px; height:5px}
.notice_box .notice_tb ul li.first_list {min-height:121px}
.notice_box .notice_tb ul li.first_list:after {width:74px; height:74px; margin-top:-37px}
.notice_box .notice_tb ul li.first_list:hover {background:#fff}
.notice_box .notice_tb ul li.first_list .tit {padding:5px 0}
.notice_box .notice_tb ul li.first_list .tit a {font-size:1.231em; font-weight:600}
.notice_box .notice_tb ul li.first_list .txt {font-size:1.154em; font-weight:300}
.notice_box .notice_tb ul li.first_list .date {bottom:38px}
    
/* 메인 팝업 영역 */
.main_fixpop {margin:0; width:610px; height:327px}
.main_fixpop .cont_toparea {margin:0}
.main_fixpop h3.tit {padding:17px 155px 23px 5px}
.main_fixpop .popup_imgsize {max-width:612px; height:266px; border-radius:15px}
.main_fixpop .popup_imgsize a {width:610px}
.main_fixpop .popup_imgsize img {max-width:610px; height:266px}
.main_fixpop .btn_more {top:12px}
.main_fixpop .btn_more a {width:32px; height:32px}
.main_fixpop .btn_more img {width:12px!important; height:11px !important}
.pop_zone {top:-40px; right:50px}
.pop_zone .btn_slide {width:90px}
.pop_count {font-size:1.385em}
.pop_count .custom_paging li {left:30px}

.main_fixpop .popup_layer_wrap:before {width:610px; height:266px; margin:0; left:0; border-radius:15px; box-sizing:border-box}
 
    
/* faq */
.main_faq {width:750px; height:336px; margin-top: 0; border-radius:15px; padding:0}
.main_faq .cont_toparea {padding:0 20px}
.main_faq h3.tit {padding:23px 0 23px 40px}
.faq_boxarea {height:242px; padding:0 20px 20px}
.main_faq .btn_more {top:18px; right:20px}
.main_faq .btn_more a {width:32px; height:32px}
.faq_box a {font-size:1.077em; margin-top:17px; padding:10px 50px 10px 0}
.faq_box a:before {top:8px; right:8px; width:34px; height:calc(100% - 16px)}

/* 고객센터 */
.main_cs {position:relative; width:610px; margin-top: 0}
.main_cs:after {content:""; display: block; position: absolute; top:55px; right:10px; width:198px; height:146px; background:url(../images/main/bg_callcenter.png) no-repeat 100% 100%}    
.main_cs h3.tit {padding:24px 20px 22px 40px}
.cs_txt {font-size:1.154em}
.cs_search {width:396px; margin:23px 0 27px}
input.srchform {height:54px; padding:15px 40px 15px 15px}
.btn_cssrch {width:60px}
.cs_wrap {display:flex; justify-content: space-between; border-radius:20px; padding:21px 24px}
.cs_wrap .cs_box {width:calc(100% / 2 - 10px); margin:0}  
.cs_box a {padding:21px 28px 40px}
.cs_box .cs_boxtit {font-size:1.308em}
.cs_box .cs_boxtxt {margin-top:15px; font-size:1.154em; font-weight:400; color:#414141}
.cs_box a:after {top:inherit; bottom:12px; right:20px; margin-top:0}

/* banner */
#main_banner {margin:50px 0}
.banner_wrap {max-width:1380px; margin:0 auto; border:0; padding:0}
.banner_wrap .cont_toparea {position: absolute; top:16px; left:0; width:100%}
.ban_area {padding:0 100px 0 150px} 
.banner_wrap .btn_more {top:19px; left:102px}
.banner_wrap .btns {align-items: center}
.banner_wrap .btns li {width:30px}
.banner_wrap .btns li button {margin:0 auto}
.ban_item a {margin:0 auto}
.banner_wrap .btns li button img {vertical-align:middle}
    
/* Footer */
.foot_wrap {display: block; padding:0; max-width:1920px; margin:0 auto}
/*#footwrap .foot_area {position:relative; display:flex; justify-content: space-between; max-width:1400px; margin:0 auto}*/
.foot_menu {display:none}
.pc_footarea {background:#fff; border-top:1px solid #d8d8d8}
.pc_footarea .pc_farea {position:relative; display:flex; justify-content: space-between; max-width:1400px; margin:0 auto; font-size:1.077em}
.flogo {display: inline-block}
    
#footwrap .fm_site {width:100%}
#footwrap .fm_site > ul {flex-wrap:nowrap}
#footwrap .fm_site > ul > li {border-top:0; border-left:0; border-right:1px solid #d8d8d8; width:100%}
.fm_site .site_tit {height:50px; line-height:50px}
.fm_site .site_tit a {height:50px; padding-right:35px; padding-left:15px}
.fm_site .site_tit .fm_arr {top:50%; right:15px; margin-top:-8px}
.fm_site .site_tit .fm_arr img {width:15px; height:15px; vertical-align:top}
#footwrap .fm_site > ul > li:nth-child(1) {border-left:1px solid #d8d8d8}

#footwrap .mb_menu {display:none; border:0}
#footwrap .pc_menu {display: flex}
#footwrap .pc_menu li {width:235px; height:50px; line-height:50px; text-align: center; border-left:1px solid #d8d8d8}
#footwrap .pc_menu li:first-child {background: none; padding-left:0}
#footwrap .pc_menu li a {display:block; font-weight:400}
#footwrap .pc_menu li.li_1 a {font-weight:500; color:#0057a8}
#footwrap .pc_menu li a:hover{font-weight:600}
/*Admin*/
#footwrap .fadmin {display: block; position:absolute; top:74px; right:470px; z-index:1}
#footwrap .fadmin a {align-content: center; display:block; background:#fff; width:100px; height:46px; border-radius:5px; background:rgba(255,255,255,0.2);text-align: center; color:#fff; font-weight:500; transition: .3s}
#footwrap .fadmin a span {display: inline-block; padding:5px 0 5px 26px; background:url(../images/main/blt_admin.png) no-repeat 0 50%}    
#footwrap .fadmin a:hover {background:rgba(255,255,255,0.3)}
    
.add_info {padding:20px 0 30px}
.add_telinfo {padding-top:5px}
.add_telinfo {padding-top:5px}
#footwrap .add_wrap {position: relative; max-width:1400px; margin:0 auto; padding:24px 0 0; text-align:left; font-size:1.077em; box-sizing: border-box}
#footwrap .ftit {font-weight:500}
#footwrap .copy {padding:13px 0; font-size:1em; text-align: left}
#footwrap .copy p {max-width:1400px;  margin:0 auto; font-size:1.077em}
#footwrap .count_box {display:block; overflow: hidden; position:absolute; top:24px; right:0}
#footwrap .count_box h3 {display:none}
#footwrap .count_box ul {display: flex; justify-content: space-between; ; border:1px solid rgba(255,255,255,0.25); border-radius:5px}
#footwrap .count_box ul li {width:230px; height:44px; padding:8px 0; font-weight:500; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center; box-sizing: border-box; color:#fff; text-align: center; border-left:1px solid rgba(255,255,255,0.25)}
#footwrap .count_box ul li:first-child {border:0}
#footwrap .count_box ul li .tit {display:block; width:90px; margin-right:6px; color:rgba(255,255,255,0.5)}
#footwrap .count_box ul li .num {display: inline-block; width:calc(100% - 96px); text-align:right; font-weight:400; font-size:14px; padding:0 13px; color:rgba(255,255,255,0.5)}
#footwrap .count_box ul li.today .tit {color:#fff}
#footwrap .count_box ul li.today .num {color:#fff}

    
}

/**** LOWSET FIX ****/
@media only screen and (min-width:1025px) and (max-width:1299px) {
}
@media only screen and (min-width:1380px) {
/* Menu FIX */
.fixed {position:fixed; top:0; left:0; width:100%; padding-left:0; background:rgba(255,255,255,1); box-shadow:0 5px 10px rgba(0, 0, 0, 0.1); transition: 0.6s}
.fixed .headerwrap {background:none}
    
}
/********* TABLET LAYOUT[중간사이즈 조정관련] *********/
@media only screen and (min-width:1025px) and (max-width:1500px) {
    
}

@media only screen and (min-width:768px) and (max-width:1024px) {
/* 메인 퀵 */
    .main_quick {flex-wrap:nowrap; gap:10px}
    .main_quick .mquick_box {width:100%}
    
}

@media only screen and (max-width:767px) {
	/* popup 레이어 */
    .mpop_tit span {padding:5px 0 5px 30px; font-size:18px}
    .mpop_top {width:312px}
    .mpop_bg {opacity:0.8}
	.mpop_lstwrap {top:100px; margin-left:-155px}
	.mpop_lstwrap .mpop_tb {width:320px}
	
    .mpop_layer {width:320px}
    .mpop_layer a.mpop_img {width:310px; height:166px}
    .mpop_layer a.mpop_txt {font-size:15px}
	.mpop_layer img {width:310px; height:166px}
	.mpop_closebox {flex-direction: column; border-radius:5px}
    .mpop_closebox li {width:100%}
    .mpop_closebox li a {height:30px; line-height:28px; font-size:1em; padding:0}
    .mpop_closebox li a span {padding:0 12px; background-position:right 10px top 50%}
    .mpop_lstwrap .slick-arrow {top:-38px; width:28px; height:28px; background-size:auto 28px}
    .mpop_lstwrap .slick-prev {left:0}
    .mpop_lstwrap .slick-next {right:0}
}



@keyframes effect{
    0%,40%,100% {transform:translateY(0)}
    20%,60% {transform:translateY(-5px)}
}