@charset "utf-8";
/* com2zoa design KJH 20210210 */

@keyframes vtxt1 {
  0% {opacity: 0; transform: translateX(-50%);}
  10% {opacity: 1; transform: translateY(0);}
  65% {opacity: 1; transform: translateY(0);}
  75% {opacity: 0; transform: translateX(-50%);}
}
@keyframes vtxt2 {
  3% {opacity: 0; transform: translateY(70%);}
  13% {opacity: 1; transform: translateY(0);}
  68% {opacity: 1; transform: translateY(0);}
  78% {opacity: 0; transform: translateY(-70%);}
}
@keyframes vtxt3 {
  6% {opacity: 0; transform: translateY(50%);}
  16% {opacity: 1; transform: translateY(0);}
  71% {opacity: 1; transform: translateY(0);}
  81% {opacity: 0; transform: translateY(-50%);}
}

/* Common */
.clear_fix:after {content: ""; display: block; clear: both}
.no_txt {font-size:0; overflow:hidden; text-indent:-9999px; line-height:0}
.mobile_bg {display:none}

/* Layout */
#wrap {width: 100%; min-width:350px}
#mainheader {position:relative; z-index:100}
.headerwrap {min-width:350px; box-sizing:border-box}

/* 로고 */
.logo_top {display:inline-block}
.logo_top a {display:inline-block}
.logo_pc {display:none}

/* 상단 */
.top_area {position:absolute; top:0; left:0; width:100%; padding-top:52px}
.top_wrap {height:56px; background:#fff; box-shadow:0 2px 3px 3px rgba(0,0,0,0.1)}
.top_menu {position:absolute; top:0; right:0; text-align:right}
.btn_qmn {display:inline-block; margin-left:2px}
.btn_qmn a {display:block; text-align:center; color:#000; font-weight:300}
.top_menu .btn_all {position:absolute; top:63px; right:8px}
.top_menu .btn_all a {display:block; width:33px; height:33px; padding:0; margin:0; border:0; font-size:0; background:url(../images/main/btn_allmn.gif) no-repeat 50% 50%}

.qmn_wrap {padding:2px 4px; background:rgba(255,255,255,0.7); border-radius:50px 50px}
.qmn_wrap .btn_qmn {float:left}
.qmn_wrap .btn_qmn a {padding:11px 8px}
.qmn_wrap .btn_login a {width:35px; height:35px; padding:0; margin:0; border:0; font-size:0; background:url(../images/main/btn_login.png) no-repeat 50% 50%}
.qmn_wrap .btn_logout a {background:url(../images/main/btn_logout.png) no-repeat 50% 50%}
.qmn_wrap .btn_srch a {width:35px; height:35px; padding:0; margin:0; border:0; font-size:0; background:url(../images/main/btn_srch.png) no-repeat 50% 50%}

/* 바로가기 상단 퀵 */
.btn_barogagi {position:absolute}
.btn_barogagi .btn_smartstu a {display:block; width:110px; height:40px; padding:13px 5px 0 40px; background:#ffc436 url(../images/main/btn_smartstu_m.png) no-repeat 0 50%; border-radius:50px 50px; box-sizing: border-box; color:#543c01; font-weight:500}

/* popup */
.popup_wrap {width: 100%; position:absolute; top:0; right:0; z-index:99}
.popup_pc .popup_on {display:none; position: absolute; top:50px; right:0; overflow:hidden; width: 100%; height:305px; margin: 0 auto; background:#fff; text-align: center; border-radius:10px; box-shadow:0 2px 6px 4px rgba(0,0,0,0.1)}
.popup_pc .popup_layer_wrap {overflow: hidden; position: relative; padding-top:15px}
.popup_pc .slick-prev {position: absolute; bottom:14px; left:18px; width:15px; height:23px; background:url(../images/main/btn_popup_prev.png) 0 0 no-repeat}
.popup_pc .slick-next {position: absolute; bottom:14px; right:18px; width:15px; height:23px; background:url(../images/main/btn_popup_next.png) 100% 0 no-repeat}
.popup_pc button {overflow:hidden; line-height:0; font-size:0; text-indent:-9999px; z-index:50}
.popup_pc .popup_imgsize {width: 100%; height:241px}
.popup_pc .popup_imgsize img {width:271px; height:241px; margin:0 auto; box-sizing:border-box; border:1px solid #c0c0c0; border-radius:10px}
.popup_pc .popup_layer .popup_tit {display:block;padding:10px 40px; margin:6px 0; font-size:1.231em; font-weight:400; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.popup_pc .popup_layer .popup_tit a {color:#2e2e2e}
.popup_pc .popup_layer .popup_tit:hover a {text-decoration:underline}
.popup_wrap .popup_on.active {display:block}

/* Visual */
.visual {z-index:0}
.visual .visual_wrap {width:100%}
.visual .slick-arrow {display:none}
.visual .slick-dots {position:absolute; bottom:13px; right:10px}
.visual .slick-dots li {float:left; margin:0 0 0 6px}
.visual .slick-dots li button {overflow:hidden; width:14px; height:14px; line-height:0; text-indent:-9999px; font-size:0; border:4px solid #fff; background:none; box-shadow:0 2px 2px 1px rgba(0,0,0,0.15), inset 0 2px 2px 1px rgba(0,0,0,0.15); border-radius:4px; box-sizing: border-box}
.visual .slick-dots li.slick-active button {background:#2288cf; border:0; box-shadow:0 2px 2px 1px rgba(0,0,0,0.15)}

/* 컨텐츠 시작 */
.content01 {overflow:hidden; position:relative; background:#fff2d0; z-index:10}
.content02 {position:relative}

/* 공통 스타일 */
#content .btn_more {position:absolute}
#content .btn_more a {display:block; text-align:center}
#content .btn_more img {vertical-align: middle}
#content h3.tit {font-size:1.308em; font-weight:500; color:#1a1a1a}

/* 메인 퀵메뉴 */
.main_quick {position:relative; padding-bottom:38px}
.main_quick .mquick_wrap {padding:14px 10px; background:#fff; border-radius:0 0 10px 10px; box-shadow:0 2px 3px 2px rgba(0,0,0,0.1) ; transition:.3s}
.btn_mquick {display:block}
.btn_mquick a {display:block; position:absolute; bottom:0; right:25px; width:78px; height:38px; background:#fff url(../images/main/btn_mquick_on.gif) no-repeat 50% 50%; border-radius:0 0 38px 38px; box-shadow:0 4px 6px 0 rgba(0,0,0,0.1)}
.mq_left li {float:left; width:50%; margin-bottom:8px}
.mq_left li a {display:block; margin-left:10px; border-radius:5px; border:3px solid #e8e8e8; background:#e8e8e7; font-size:1.077em; font-weight:400}
.mq_left li:hover a {border-color:#ffc436; background:#ffc435; transition:.3s}
.mq_left li span {display:block; background:#fff}
.mq_left li:first-child a {background:#e8e8e7 url(../images/main/bg_mquick01.png) no-repeat 50% 18%}
.mq_left li:nth-child(2) a {background:#e8e8e7 url(../images/main/bg_mquick02.png) no-repeat 50% 18%}
.mq_left li:nth-child(3) a {background:#e8e8e7 url(../images/main/bg_mquick03.png) no-repeat 50% 18%}
.mq_left li:nth-child(4) a {background:#e8e8e7 url(../images/main/bg_mquick04.png) no-repeat 50% 16%}
.mq_left li:first-child:hover a {background:#ffc435 url(../images/main/bg_mquick01_a.png) no-repeat 50% 18%}
.mq_left li:nth-child(2):hover a {background:#ffc435 url(../images/main/bg_mquick02_a.png) no-repeat 50% 18%}
.mq_left li:nth-child(3):hover a {background:#ffc435 url(../images/main/bg_mquick03_a.png) no-repeat 50% 18%}
.mq_left li:nth-child(4):hover a {background:#ffc435 url(../images/main/bg_mquick04_a.png) no-repeat 50% 16%}

.mquick_wrap .btn_quick li {position:absolute; top:50%; margin-top:-13px}
.mquick_wrap .btn_quick01 {left:0}
.mquick_wrap .btn_quick02 {right:0}
.mquick_wrap .quick_box {position:relative; padding:12px 0 5px}
.mquick_wrap .quickmenu {padding:0 45px}
.quick_item a {display:block; text-align:center}
.quick_item .qmn_ico {position:relative; overflow:hidden; display:block; background:#fff; width:85px; height:85px; margin:0 auto 6px; border-radius:50% 50%; text-align: center}
.quick_item span {font-weight:400; font-size:1.154em}
.quick_item a:hover span {color:#1081ce}

.quick_item .qmn_ico:before {content: ''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; border-radius: 50%; transform: translate(0, -101%); transition: all .3s}
.quick_item .qmn_ico:before {background-color:#4dabf1}
.quick_item:hover .qmn_ico:before {transform: translate(0, 0); z-index:-2}
.quick01 .qmn_ico {background:#fff url(../images/main/bg_quick01.png) no-repeat 50% 50%}
.quick02 .qmn_ico {background:#fff url(../images/main/bg_quick02.png) no-repeat 50% 50%}
.quick03 .qmn_ico {background:#fff url(../images/main/bg_quick03.png) no-repeat 50% 50%}
.quick04 .qmn_ico {background:#fff url(../images/main/bg_quick04.png) no-repeat 50% 50%}
.quick05 .qmn_ico {background:#fff url(../images/main/bg_quick05.png) no-repeat 50% 50%}
.quick06 .qmn_ico {background:#fff url(../images/main/bg_quick06.png) no-repeat 50% 50%}
.quick01:hover .qmn_ico {background:url(../images/main/bg_quick01_a.png) no-repeat 50% 50%}
.quick02:hover .qmn_ico {background:url(../images/main/bg_quick02_a.png) no-repeat 50% 50%}
.quick03:hover .qmn_ico {background:url(../images/main/bg_quick03_a.png) no-repeat 50% 50%}
.quick04:hover .qmn_ico {background:url(../images/main/bg_quick04_a.png) no-repeat 50% 50%}
.quick05:hover .qmn_ico {background:url(../images/main/bg_quick05_a.png) no-repeat 50% 50%}
.quick06:hover .qmn_ico {background:url(../images/main/bg_quick06_a.png) no-repeat 50% 50%}
/* 닫기 */
.main_quick.quick_close .mquick_wrap {margin-top:-282px}
.main_quick.quick_close .btn_mquick a {bottom:-2px; background:#fff url(../images/main/btn_mquick_off.gif) no-repeat 50% 50%;}

/* notice */
#main_notice {margin-top:10px}
.notice_box {overflow:hidden; position: relative; padding:60px 0 0; background:#fff; border-radius:10px}
.notice_box h3 {position: absolute; top:8px; box-sizing: border-box}
.notice_box .noticetab01 {left:16px}
.notice_box .noticetab02 {left:95px}
.notice_box .noticetab03 {left:203px}
.notice_box h3 {position: absolute; top:0; font-size:1.231em; text-align: center}
.notice_box h3 a {position:relative; display: block; padding:22px 10px; color:#909090}
.notice_box h3 a:before {content:""; position: absolute; left: 0; top:0; width:0; height: 6px; background: #0096a2; border:0; transition: width .5s; border-radius:0 0 6px 6px}
.notice_box h3.on > a:before {width: 100%}
.notice_box h3:hover > a:before {width: 100%}
.notice_box h3:hover a, .notice_box h3.on > a {color:#0096a2}
.notice_box h3.on a:after {content:""; position: absolute; left:50%; top:54px; width:18px; height: 28px; margin-left:-9px; background:url(../images/main/blt_notice_tit.png) no-repeat 50% 100%}

.notice_box .btn_more {top:20px; right:15px}
.noticetb {overflow:hidden; border-top:1px solid #d7d7d7}
.noticetb ul {overflow:hidden; height:190px; padding:19px 12px; margin-bottom:15px; box-sizing:border-box}
.noticetb li {position:relative; overflow:hidden; padding:0 70px 0 22px; margin-left:10px; height:30px; line-height:30px; background:url(../images/main/blt_notice.gif) no-repeat 0 50%; color:#2c2c2c; font-weight:400; text-overflow:ellipsis; white-space:nowrap}
.noticetb li:hover a {text-decoration: underline}
.noticetb .date {position:absolute; top:50%; right:10px; height:30px; line-height:30px; margin-top:-15px; text-align:right; font-weight:200; letter-spacing:-0.1px; color:#868686}

.noticetb .first_noti {position:relative; height:68px; margin:0 0 15px; padding:24px 70px 22px 85px; background:#deeef7 url(../images/main/bg_firstnotice.gif) no-repeat 7px 50%; border-radius:10px; border:0; box-sizing:border-box}
.noticetb .first_noti .tit {height:22px; line-height:22px; overflow:hidden; text-overflow:ellipsis;  white-space:nowrap}
.noticetb .first_noti .tit a {display:block; color:#000; font-size:1.077em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.noticetb .first_noti .txt {overflow:hidden; height:22px; line-height:22px; font-weight:300; text-overflow:ellipsis; white-space:nowrap}
.noticetb .first_noti .date {margin-top:-13px}

/* 행사 */
.cal_wrap .caltop {position:relative; padding:24px 0 16px}
.cal_wrap .tit {display:block; text-align:center}
.cal_wrap .tit span {display:inline-block; padding-right:30px}
.cal_wrap .btn_more {top:24px; left:50%; margin-left:35px}
.cal_area {padding:21px 10px 10px; background:#b396dd url(../images/main/bg_cal_box.png) no-repeat  100% 100%; border-radius:10px}
.cal_box {position:relative; padding:24px 12px 15px;  background:#fff; border-radius:10px}
.cal_box:after {content:""; display:block; position:absolute; top:-8px; left:0; width:100%; height: 19px; background:url(../images/main/bg_cal_patt.png) repeat-x 0 0}
.cal_box .cal_date {font-weight:600; color:#000; font-size:1.077em}
.cal_box .cal_date .month {color:#8355c6; font-size:1.286em}
.cal_box .btn_cal {position:absolute; top:17px; right:10px}
.cal_box .btn_cal li {display:inline-block; width:33px}
.date_lst {overflow:hidden; height:84px; margin:10px 0 0; padding-right:60px}
.cal_list li {overflow:hidden; height:28px; line-height:28px; text-overflow:ellipsis; white-space:nowrap}
.cal_list li a {color:#fff}
.cal_list .date {position:relative; padding:2px 11px; margin-right:4px; background:#8355c6; color:#fff; border-radius:50px; font-size:1.077em }

/* class */
#main_class {padding-bottom:17px}
.class_wrap .class_top {position:relative; padding:24px 0 16px}
.class_wrap .tit {display:block; text-align:center}
.class_wrap .tit span {display:inline-block; padding-right:30px}
.class_wrap .btn_more {top:24px; left:50%; margin-left:40px}

.class_wrap .grade {position:relative; float:left; width:100%}
.class_wrap .grade>li {float:left; width:16.6%}
.class_wrap .grade>li dt>a {display:block; width:42px; height:40px; line-height:40px; margin:0 auto; background:url(../images/main/bg_class_off.gif) no-repeat 50% 50%; text-align:center; color:#000; font-weight:500; font-size:1.231em; box-sizing: border-box; transition:ease-in-out .3s}
.class_wrap .grade .on dt>a {background:url(../images/main/bg_class_on.gif) no-repeat 50% 50%; color:#fff}
.class_wrap .grade_name {display:none; float:left}
.class_area {position:relative; height:130px; padding:0 9px 9px; background:#fd95b0; border-radius:10px}
.class_subtit {width:70%; margin:0 15% 8px; text-align:center; background:#fff; border-radius:0 0 10px 10px}
.class_subtit span {display:inline-block; padding:10px 10px 10px 30px; background:url(../images/main/blt_class_subtit.gif) no-repeat 0 50%; font-size:1.077em; font-weight:400}
.class_list {position:absolute; top:46px; left:0; width:100%; height:41px; line-height:41px; box-sizing:border-box; background:#fff; border-radius:10px; text-align: center}
.class_list>li {display:inline-block; padding:0 7px; font-weight:400}
.class_list>li a {display:block}
.class_list>li:hover a {transition:ease-in .2s; text-decoration: underline; color:#f82f50}

.kinder_area {position:relative; margin:10px 0 0;  padding:10px; background:#f8688d;  border-radius:10px; box-sizing: border-box}
.kinder_area .kinder_tit a {position:absolute; top:0; left:0; padding:15px 27px; font-size:1.231em; font-weight:500; color:#fff; text-align:center}
.kinder_area .kinder_tit span {display:block; margin-top:5px; padding:2px 5px; background:#fff; border-radius:50px; font-size:0.8em; color:#1a1a1a}
.kinder_area .kinder_tit a:hover span {background:#ef4873; color:#fff; transition:.3s}
.kinder_area ul {margin:0 0 0 90px; padding:7px; background:#fff; border-radius:10px}
.kinder_area li {float:left; width:50%; text-align:center; box-sizing: border-box}
.kinder_area .kinder01 {border-right:1px solid #bfbfbf}
.kinder_area li a {display:block; position:relative}
.kinder_area li span {display:inline-block; padding:9px 10px 9px 40px; border-radius:10px; color:#000; font-weight:400; font-size:1.077em; border-radius:10px}
.kinder_area .kinder01 span {background:url(../images/main/blt_kinder01.png) no-repeat 0 50%}
.kinder_area .kinder02 span {background:url(../images/main/blt_kinder02.png) no-repeat 0 50%}
.kinder_area li:hover span {background-color:#e1e1e1}

/* 오늘의 급식 */
#main_food {margin-top:15px}
.food_wrap {position:relative; padding:0 11px 10px; background:#97c44f url(../images/main/bg_foodwrap.png) no-repeat 100% 100%; border-radius:10px}
.food_top .tit {padding:17px 10px 18px}
.food_top .tit span {color:#fff}
.food_top .btn_more {top:15px; right:10px}
.food_date {padding:6px 0; margin-bottom:10px; background:#fff; text-align:center; font-size:1.154em; font-weight:400; border-radius:10px}
.food_date span {display:inline-block; width:30px; height:30px; line-height:30px; background:#6f9a2a; color:#fff; border-radius:50% 50%}
.food_txt {height:52px; padding:7px 80px 5px 10px; border-radius:10px}
.food_txt a {display:block; overflow:hidden; height:52px; line-height:1.4; font-weight:400; color:#fff}
.food_txt:hover a {text-decoration:underline}

/* 학교앨범 */
#main_album {margin:24px 0; padding-bottom:20px; border:1px solid #bfbfbf; border-left:0; border-right:0}
.album_top {position:relative}
.album_top .tit {display:block; padding:15px 0; text-align:center}
.album_top .tit span {display:inline-block; width:100px; height:35px; line-height:35px; padding-right:40px; background:url(../images/main/img_photo_mtit.gif) no-repeat 0 50%; text-align:center; text-indent:-9999px}
.album_top .btn_more {top:23px; left:50%; margin-left:40px}
.photo_area {overflow:hidden; height:158px}
.album_wrap .photo_item {text-align:center}
.album_wrap .photo {width:100%; height:112px; background:#efefef url(../images/main/bg_noimg.png) no-repeat 50% 50%}
.album_wrap .photo a {display:block; width:232px; height:158px; background:#efefef url(../images/main/bg_noimg.png) no-repeat 50% 50%}
.album_wrap .photo_item img {max-width:232px; height:158px; margin: 0 auto}
.album_wrap .photo_item {width:232px; height:158px; margin:0 auto}
.album_wrap .photo_item .photo_box {position:relative; overflow:hidden; width:232px; height:158px; margin: 0 auto; background:#efefef; border-radius:15px}
.album_wrap .photo_txt:before {content:""; display:block; position:absolute; bottom:0; left:0; width:232px; height:46px; background:rgba(0,0,0,0.6)}
.album_wrap .photo_txt .txt {text-align:center; font-weight:400; font-size:1.077em; color:#fff; box-sizing: border-box; z-index:10}
.album_wrap .photo_txt .txt a {overflow:hidden; position:relative; display:block; height:46px; line-height:46px; padding:0 20px; color:#fff; text-align: center; text-overflow:ellipsis; white-space:nowrap}

.album_wrap .photo a:before {content:""; display:block; position:absolute; bottom:46px; left:0; width:232px; height:0; background:rgba(0,0,0,0.6); background-position:50% 50%}
.album_wrap .photo_box:hover .photo a:before {bottom:46px; height:158px; transition:ease-in-out .3s; background:rgba(0,0,0,0.6) url(../images/main/bg_view.png) no-repeat 50% 75%}

/* 팝업존 
#main_popup {padding-bottom:25px}
.pop_wrap {position:relative; padding:0 10px 10px; border:3px solid #bfbfbf; border-radius:10px}
.pop_wrap .tit span {display:inline-block; padding:6px 0 6px 42px; background:url(../images/main/blt_popup_tit.gif) no-repeat -3px 50%}
.pop_wrap .btn_more {top:18px; right:10px}
.pop_top {padding:13px 0; margin-bottom:15px; border-bottom:1px solid #bfbfbf}
.pop_area .btn_slide {background:#bfbfbf; border-radius:10px}
.pop_area .btn_slide li {float:left; width:33.3%; text-align:center}
.pop_area .btn_slide li a {display: block; height:36px; line-height:36px; border-left:1px solid #fff}
.pop_area .btn_slide li:first-child a {border-left:0}
.pop_area .btn_slide li img {vertical-align:middle}
.pop_list li {overflow:hidden; width:100%; height:24px; line-height:24px;  background:url(../images/main/blt_popup.gif) no-repeat 0 8px; text-overflow:ellipsis; white-space:nowrap}
.pop_list li a {padding-left:23px; color:#282828; font-weight:300}
.pop_list li:hover a {text-decoration:underline; font-weight:400}
.pop_wrap .pop_box {height:54px}
.pop_wrap .bx-viewport {height:52px !important}*/

/* 팝업존 */
#main_popup {padding-bottom:25px}
.pop_wrap {position:relative; padding:0 10px 10px; border:3px solid #bfbfbf; border-radius:10px}
.pop_wrap .tit span {display:inline-block; padding:6px 0 6px 42px; background:url(../images/main/blt_popup_tit.gif) no-repeat -3px 50%}
.pop_wrap .btn_more {top:18px; right:10px}
.pop_top {padding:13px 0; margin-bottom:15px; border-bottom:1px solid #bfbfbf}
.pop_area .btn_slide {background:#bfbfbf; border-radius:10px}
.pop_area .btn_slide li {float:left; width:33.3%; text-align:center}
.pop_area .btn_slide li a {display: block; height:36px; line-height:36px; border-left:1px solid #fff}
.pop_area .btn_slide li:first-child a {border-left:0}
.pop_area .btn_slide li img {vertical-align:middle}
.pop_list .slick-slide {overflow:hidden; width:100%; height:24px; line-height:24px;  background:url(../images/main/blt_popup.gif) no-repeat 0 8px; text-overflow:ellipsis; white-space:nowrap}
.pop_list .slick-slide a {padding-left:23px; color:#282828; font-weight:300}
.pop_list .slick-slide:hover a {text-decoration:underline; font-weight:400}
.pop_wrap .pop_box {height:90px}
.pop_wrap .bx-viewport {height:52px !important}

/* banner */
.banner_wrap {position:relative; height:79px; margin:0 43px; background:#374961}
.banner_wrap:before {content:""; display:block; position:absolute; bottom:0; left:-43px; width:43px; height:79px; background: url(../images/main/bg_ban_left.gif) no-repeat 0 100%}
.banner_wrap:after {content:""; display:block; position:absolute; bottom:0; right:-43px; width:43px; height:79px; background: url(../images/main/bg_ban_right.gif) no-repeat 0 100%}
#main_banner .ban_head .tit {margin-bottom:10px; font-size:1.308em; font-weight:400; color:#fff}
.ban_head {position:relative; float:left; width:100px; padding:18px 0 14px}
.ban_head .btn_more {top:17px; right:12px}
.ban_head .btn_ban li {display:inline-block; margin-right:8px}
.ban_item a {overflow:hidden; display:block; width:100%; max-width:180px; height:50px; margin:0 auto; border-radius:10px}
.ban_item img {width:100%; height:100%; margin: 0 auto}

/* Footer */
#footwrap {position:relative; padding-bottom:20px; background:#5b5957; z-index:1}
.address_wrap address {line-height:160%; color:#fff; font-weight:300}
.foot_area .col01 a {color:#006baf}
.mb_menu {text-align:center}
.mb_menu li {display:inline-block; padding:12px 10px 12px 15px; background:url(../images/main/bg_mfoot_dott.gif) no-repeat 0 50%}
.mb_menu li a {display:inline-block; line-height:30px; color:#fff}
.mb_menu li:first-child {background:none}

.sb_box {border:1px solid #707070; text-align:center; letter-spacing:-0.5px; background:#fff; border-radius:5px}
.sb_menu {margin:0 11px; padding-bottom:22px}
.sb_menu li {display:none; padding:5px 15px}
.sb_menu li a {font-weight:400}
.copy {padding-top:15px; line-height:150%; color:#a1a1a1; font-weight:400}

/* MOBILE LAYOUT */
@media only screen and (max-width:1024px) {    
    /* ********************************** */
    .mobile_bg {position:fixed; background:#000; width: 100%; height: 100%; left: 0; top: 0; z-index: 99; display: none}
    /* ********************************** */
    
    /* logo */
    .logo_top {margin-top:10px}
    
    /* top_btn */
    .top_area {box-sizing: border-box}
    .top_wrap {padding:0 8px}
    .top_menu {width:100%}
    .qmn_wrap {position:absolute; top:6px; right:8px}
    .btn_barogagi {top:6px; left:8px}
    .popup_hide {font-size:0; overflow:hidden; text-indent:-9999px; line-height:0}
    
    /* GNB */
	#gnb {display:none; background:#fff2d0; border-top:3px solid #ffc436; /*width: 250px;*/ height:100%; min-height:100%; position:fixed; top:0; right:0; z-index:100; overflow-y:auto}
    #gnb .allbtnclose .closebtn {display:block; overflow: hidden; position:absolute; top:0; right:10px; width:48px; height:49px; font-size:0; line-height:0; text-indent:-9999px; background: url(../images/main/btn_menu_close.png) no-repeat 50% 50%}
    #gnb .gnb_tit {width:250px; padding:17px 15px 27px ; font-size:1.538em; font-weight:500; color:#1a1a1a; box-sizing:border-box; text-align:center; background:#fff url(../images/main/bg_gnbtit_bar.png) no-repeat left 50% bottom 12px}
    #gnb .gnb_tit span {color:#1473b9}
	#gnb .gnb_list {position:absolute; width:100%; top:64px; left:0; padding:0px 10px 15px; background:#fff; box-sizing: border-box}
    #gnb .gnb_list li:first-child a {margin-top:0}
    #gnb .gnb_list .gmn>a {overflow:hidden; display:block; font-size:1.154em; font-weight:400; padding:13px 45px 14px 15px; margin:11px 0 0; background:#fff url(../images/main/bg_menu_off.png) no-repeat right 1px bottom -4px; border:1px solid #ccc; border-radius:10px; color:#2e2e2e}
	#gnb .gnb_list .gmn>a[target=_blank] span{display:inline-block; padding-right:15px; background:url(../images/main/newopenwindow_btn_w.gif) no-repeat 100% 50%;}
	#gnb .gnb_list .gmn:hover>a, #gnb .gnb_list .act>a {padding:12px 45px 13px 15px; background:#4cabf1 url(../images/main/bg_menu_on.png) no-repeat right 0 bottom -5px; border:2px solid #4cabf2; color:#fff}
    #gnb .gnb_list .gmn:hover>a[target=_blank] span {background:url(../images/main/newopenwindow_btn_W.gif) no-repeat 100% 50%}

    #gnb .gnb_list .gmn .navi_sub {display:none; margin:8px 0}
    #gnb .gnb_list .gmn .navi_sub ul {padding:9px 11px 5px; background:#e1e1e1; border-radius:0 0 10px 10px}
    #gnb .gnb_list .gmn .navi_sub ul>li {border-top:1px solid #fff}
    #gnb .gnb_list .gmn .navi_sub ul>li:first-child {border-top:0}
	#gnb .gnb_list .gmn .navi_sub ul>li>a {margin:5px 0; line-height:160%; display:block; padding:2px 5px 2px 20px; background:url(../images/main/blt_layermn_off.png) no-repeat 0 7px; color:#2a2a2a}
    #gnb .gnb_list .gmn .navi_sub ul>li:first-child>a {margin-top:0}
	#gnb .gnb_list .gmn .navi_sub ul>li>a[target=_blank] span{display:inline-block; padding-right:15px; background:url(../images/main/newopenwindow_btn_b.gif) no-repeat 100% 50%}
	#gnb .gnb_list .gmn .navi_sub ul>li:hover>a {font-weight:500; background:url(../images/main/blt_layermn_on.png) no-repeat 0 7px; transition:.3s; color:#0061a3}

    /* 팝업 */
    .btn_pop.popup_open {position:absolute; top:63px; right:46px; margin:0}
    .btn_pop.popup_open a {display:block; width:33px; height:33px; text-align:center}
    .btn_pop.popup_open {background:url(../images/main/btn_popup_m.gif) no-repeat 50% 50%}
    .btn_pop.popup_open.openact {background:url(../images/main/btn_popupopen_m.gif) no-repeat 50% 50%}
    .popup_pc .popup_on {top:124px; background:rgba(255,255,255,0.7); border-radius:0}
     
    /* visual */
    .visual {position:relative; height:383px}
    .visual .visual_item span {text-indent:-9999px; font-size:0}
    .visual .visual_item {height:383px}
    .visual .item1 {background:url(../images/main/v_m01.jpg) no-repeat 50% 0}
	.visual .item2 {background:url(../images/main/v_m02.jpg) no-repeat 50% 0}
	.visual .item3 {background:url(../images/main/v_m03.jpg) no-repeat 50% 0}
    .visual .visual_pc {display:none}
    
    /* content */
    .content01 {padding:0 8px}
    .content02 {padding:0 8px}
    
    /* main_quick */
    .mq_left li:first-child a, .mq_left li:nth-child(3) a {margin-left:0}
    .mq_left li span {margin-left:48px; padding:14px 0 14px 8px; border-radius:0 5px 5px 0}
    .mq_left li:first-child a, .mq_left li:first-child:hover a {background-size:28px auto; background-position:6px 50%}
    .mq_left li:nth-child(2) a, .mq_left li:nth-child(2):hover a {background-size:27px auto; background-position:9px 50%}
    .mq_left li:nth-child(3) a, .mq_left li:nth-child(3):hover a {background-size:27px auto; background-position:8px 50%}
    .mq_left li:nth-child(4) a, .mq_left li:nth-child(4):hover a {background-size:27px auto; background-position:10px 50%}

    /* food */
    .food_wrap {background-size:70px auto}
    
    /* banner */
    .ban_item a {max-width:160px; height:44px}
    .ban_area {padding:18px 0 17px 95px}
    
    /* Footer */
    .address_wrap {padding:0 10px 32px; text-align: center}
    .foot_area .count {display: none}
    .sb_menu li {display:block}
    .sb_menu .f_li02, .sb_menu .f_li03 {display:inline-block; float:left; padding:0; width:50%}
    .sb_menu .f_li02 a, .sb_menu .f_li03 a {display:block; overflow: hidden; padding:11px 10px; border-right: 1px solid #878584; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal}
    .sb_menu .f_li03 a {border-right:0}
    .sb_menu .f_li04 { display:inline-block; float:left; width:100%; padding:0}
    .sb_menu .f_li04 a{ display:block; padding:12px 5px; border-top:1px solid #878584; border-left:0; border-right:0}
    .sb_menu .f_li01, .sb_menu .f_li05, .sb_menu .f_admin {display:none}

}

/* PC LAYOUT */
@media only screen and (min-width:1025px) {
    
    /* Common */
    #wrap {min-width:1380px}
    #content {position:relative}
    #content h3.tit {font-size:19px; font-weight:500; color:#000}
    
    .content01:after {content:""; display:block; position:absolute; bottom:0; right:50%; margin-right:-890px; width:284px; height:237px; background:url(../images/main/bg_charcter.gif) no-repeat 50% 100%}
    .content_wrap {position:relative; width:1200px; margin:0 auto 40px}
    .content02 {width:1200px; margin:40px auto}

    /* Mainheader */
    .headerwrap {width:100%}
    .top_area {padding:0; background:url(../images/main/bg_pcmenu_bar.png) repeat-x 0 0}
    .top_wrap {position:relative; width:1200px; height:80px; padding-top:71px; margin:0 auto; background:none; box-shadow:none}
    .top_menu {top:10px; right:0}
    .top_menu .btn_pop {display:none}
    .top_menu .btn_all {top:76px; right:0}
    .qmn_wrap {padding:5px 5px 4px 10px}
    .qmn_wrap .btn_qmn a {padding:13px 5px 13px 0; width:56px; font-size:1.154em}    
    .qmn_wrap .btn_login a {width:41px; height:41px; padding:0; margin:0; border:0; font-size:0; background:url(../images/main/btn_login_pc.png) no-repeat 50% 50%}
    .qmn_wrap .btn_logout a {background:url(../images/main/btn_logout_pc.png) no-repeat 50% 50%}
    .qmn_wrap .btn_srch a {width:41px; height:41px; padding:0; margin:0; border:0; font-size:0; background:url(../images/main/btn_srch_pc.png) no-repeat 50% 50%}
    
    .btn_barogagi {top:10px; right:194px}
    .btn_barogagi .btn_smartstu a {width:137px; height:50px; padding:18px 5px 0 52px; font-size:15px; background:#ffc436 url(../images/main/btn_smartstu.png) no-repeat 0 50%}
    
    /* logo */
    .logo_top {position:absolute; top:0; left:0}
    .logo_m {display:none}
    .logo_pc {display:inline-block; margin-top:10px}

    /* fixed */
    #mainheader.fixed {position:fixed; top:0; left:0; width:100%; min-width:350px; margin-top:-72px; transition:all .7s}
    #mainheader.fixed .top_wrap {background:none; box-shadow:none}
    
    /* Gnb */
    #gnb .allbtnclose, #gnb .gnb_logo, #gnb .gnb_tit, #gnb .eng_tit, #gnb .navi_sub, .mbl_area {display: none}
    #gnb .gmn {position: relative; float: left; width:14.2%}
    #gnb .gmn > a {position: relative; display: block; text-align: center; padding:20px 13px 19px 12px; line-height:140%; color:#1a1a1a; font-size:20px; font-weight:500}
    .gnb_list {width:1150px; padding-right:50px; margin:0 auto}
    #gnb .navi_sub {position: absolute; left:50%; top:72px; width:100%; min-width:174px; margin-left:-87px; padding:22px 10px 10px; background: #fff; text-align: center; border-radius:15px; box-shadow:0 2px 3px 2px rgba(0,0,0,0.1); z-index:101; box-sizing: border-box}
    #gnb .navi_sub li {padding:5px 0; border-bottom:1px solid #d1d1d1}
    #gnb .navi_sub li:first-child {border-top:0}
    #gnb .navi_sub li:hover a {background:#41b1f8; font-weight:400; transition:ease-in .2s; color:#fff; border-radius:10px}
    #gnb .gmn:hover .navi_sub {display: block; z-index: 30}
    .gmn_hide {display:none}
    #gnb .navi_sub a {display: block; font-size: 15px; font-weight: 500; line-height: 1.3; text-align: center; padding:8px 5px; color: #222;}
    #gnb .navi_sub:before {content: ''; display: block; width: 100%; height:40px; background: url(../images/main/blt_pcmenu.png) 50% 0 no-repeat; position: absolute; left:0; top: -22px;}

    /* visual */
    .visual {height:600px}
    .visual .visual_item {height:600px}
    .visual .item1 {background:url(../images/main/v_pc01.jpg) no-repeat 50% 0}
    .visual .item2 {background:url(../images/main/v_pc02.jpg) no-repeat 50% 0}
    .visual .item3 {background:url(../images/main/v_pc03.jpg) no-repeat 50% 0}
    .visual .slick-dots {right:50%; margin:0 -600px 0 0}
    .visual .visual_pc {position:absolute; width: 430px; top:166px; left:50%; margin-left:-540px}
    .visual .visual_pc .v_txt {opacity: 0; transform: translateY(100%)}
    .visual .visual_pc .v_txt01 {display:block; width:348px; height:110px; background:url(../images/main/v_txt01.png) no-repeat 0 0; animation:vtxt1 15s infinite; z-index:2}
    .visual .visual_pc .v_txt02 {display:block; width:47px; height:73px; margin:-70px 0 0 380px;background:url(../images/main/v_txt03.png) no-repeat 0 0; animation:vtxt3 15s infinite; z-index:1}
    .visual .visual_pc .v_txt03 {display:block; width:254px; height:64px; margin:-30px 0 0 164px; background:url(../images/main/v_txt02.png) no-repeat 0 0;animation:vtxt2 15s infinite;; z-index:3}
    
    /* popup */
    .popup_wrap {top:0; z-index:99}
    .popup_wrap .popup_open {position:absolute; top:138px; right:50%; margin-right:-685px; width:84px; height:108px; transition: ease-in 0.3s}
    .popup_open .open_pop {display:block; width:84px; height:108px; padding:68px 25px 0; background:url(../images/main/bg_popup_pc.png) no-repeat 50% 0; border-left:0; box-sizing:border-box; transition:ease-in .4s; text-align:center; font-size:14px; color:#1a1a1a; font-weight:400; border-radius:15px 0 0 0}
    .popup_open .open_pop a {display:block}
    
    .popup_wrap .popup_on {top:260px; right:45px; width:297px; background:rgba(255,255,255,0.9)}
    .popup_pc .popup_layer .popup_tit {margin:6px 0}
    .popup_pc .slick-prev {bottom:12px; left:12px}
    .popup_pc .slick-next {bottom:12px; right:12px}
    
    /* quickmenu */
    .main_quick {width:1200px; margin:0 auto 8px}
    .main_quick .mquick_wrap {padding:12px 0}
    .mquick_wrap .quick_box {padding:0}
    .mq_left {float:left; width:620px; padding:0 12px; box-sizing: border-box}
    .mq_left li {width:25%; margin:0}
    .mq_left li a {margin-left:10px; text-align:center}
    .mq_left li:first-child a {margin:0}
    .mq_left li span {margin-top:82px; padding:17px 10px; border-radius:0 0 4px 4px; font-size:16px}
    .mq_right {float:right;  width:560px; padding-right:12px;}
    .mq_right .quick_item {padding:5px 0}
    .quick_item span {line-height:120%; font-size:16px}
    
	.main_quick.quick_close {padding-bottom:36px}
    .main_quick.quick_close .mquick_wrap {margin-top:-167px}
    .main_quick.quick_close .mquick_wrap .mq_right {display:none}

    /* notice */
    #main_notice {width:519px; margin:0; margin-left:340px; box-sizing:border-box}
    .notice_box {padding-top:70px}
    .notice_box h3 > a {padding:28px 12px 23px; font-size:19px; text-align:center}
    .notice_box .noticetab01 {left:24px}
    .notice_box .noticetab02 {left:118px}
    .notice_box .noticetab03 {left:247px}
    .notice_box h3.on a:after {top:65px}
    .notice_box .btn_more {top:26px; right:20px}
    .noticetb ul {height:201px; padding:22px 12px}
    .noticetb li {height:32px; line-height:32px; margin-left:0; font-size:15px}
    .noticetb .first_noti {margin-bottom:15px}
    .noticetb .first_noti .tit a {padding-right:20px; font-size:16px}
    .noticetb .first_noti .txt {font-size:15px}
    .noticetb .date {font-size:14px}
    
    /* calendar */
    #main_calendar {display:block; position: absolute; top:0; left:0; width:309px}
    .cal_wrap .caltop {padding:0 0 20px}
    .cal_wrap .btn_more {top:0; margin-left:40px}
    .cal_box {padding:24px 17px 15px}
    .cal_box:after {width:95%; left:5px}
    .cal_box .cal_date {font-size:16px}
    .cal_box .cal_date .month {font-size:22px}
    .cal_list .date {padding:0 11px; font-size:15px}
    .cal_list li a {font-size:15px}
    .date_lst {height:142px; margin-top:13px; padding-right:80px}
    .cal_area {background:#b396dd url(../images/main/bg_calpc_box.png) no-repeat 100% 100%}
    
    /* class */
    #main_class {display:block; position: absolute; top:0; right:0; width:309px; padding:0}
    .class_wrap .class_top {padding:0 0 20px}
    .class_wrap .btn_more {top:0; margin-left:50px}
    .class_subtit span {padding:9px 9px 9px 30px; font-size:16px}
    .class_subtit {width:246px; margin:0 auto 13px}
    .class_list {top:52px}
    .class_list>li a {font-size:15px}
    .class_area {height:141px; padding:0 8px 8px}
    .kinder_area {margin-top:21px; padding:7px}
    .kinder_area ul {padding:12px 8px}
    .kinder_area .kinder_tit a {padding:17px 22px; font-size:20px; text-align:center}
	.kinder_area .kinder_tit span {display:block; font-size:14px}
    .kinder_area li span {padding:12px 7px 11px 35px; font-size:16px}
    .kinder_area .kinder01 span {margin-right:6px}
    .kinder_area .kinder02 span {margin-left:6px}
    
    /* food */
    #main_food {display:block; position: absolute; top:0; left:0; width:309px; margin:0}
    .food_top .tit {padding:23px 5px}
    .food_top .btn_more {top:23px; right:15px}
    .food_wrap {padding:0 15px 10px}    
    .food_date {padding:11px 0 10px;font-size:17px}
    .food_txt {height:89px; padding:7px 87px 15px 5px}
    .food_txt a {height:89px; line-height:1.5; font-size:15px}
    
    /* album */
    #main_album {width:519px; margin:0; margin-left:340px; box-sizing:border-box}
    .album_top .tit {padding:12px 0}
    .album_top .tit span {width:114px; height:43px; line-height:43px; background:url(../images/main/img_photo_tit.gif) no-repeat 0 50%}
    .album_wrap .photo_txt .txt {font-size:16px}
    .album_top .btn_more {top:24px; margin-left:48px}
    
    /* popup */
    #main_popup {display:block; position: absolute; top:0; right:0; width:309px; padding:0}
    .pop_top {margin-bottom:12px; padding:17px 0}
    .pop_wrap {padding:0 12px 12px}
    .pop_wrap .btn_more {top:22px; right:15px}
    .pop_list .slick-slide {height:30px; line-height:30px; background-position:0 11px}
    .pop_list .slick-slide a {font-size:15px}
    .pop_area .btn_slide li a {height:41px; line-height:41px}
    .pop_wrap .pop_box {height:110px}
    .pop_wrap .bx-viewport {height:85px !important}
    
    /* banner */
    .banner_wrap {width:1106px; height:87px; margin:0 auto}
    .banner_wrap:before {bottom:0; left:-47px; width:47px; height:87px; background: url(../images/main/bg_banpc_left.gif) no-repeat 0 100%}
    .banner_wrap:after {bottom:0; right:-47px; width:47px; height:87px; background: url(../images/main/bg_banpc_right.gif) no-repeat 0 100%}
    #main_banner .ban_head .tit {font-size:19px}
    .ban_head {padding:20px 4px 18px}
    .ban_head .btn_more {top:19px; right:8px}
    .ban_head .btn_ban li {margin-right:12px}
    .ban_area {padding:19px 0 18px 130px}
    
    
    /* Footer */
    #footwrap {background:none; padding:0}
    .foot_area {width:100%; padding:15px 0; background:#5b5957}
    .foot_bg {position: relative; width: 1200px; margin: 0 auto}
    .foot_menu {background:none}
    .mb_menu {display:none}
    .sb_menu {padding:0; margin:0}
    .sb_box {width:1200px; margin:0 auto; padding:0; background:#fff; border:none; border-radius:15px}
    .sb_menu li {display:inline-block; padding:0}
    .sb_menu li a {display: block; padding:20px 23px; font-size:15px; font-weight:500; letter-spacing:0.3px; background:url(../images/main/bg_foot_dott.gif) no-repeat 0 50%}
    .sb_menu li:first-child a {background:none}
    .sb_menu li.f_admin {background:url(../images/main/blt_admin_ico.gif) no-repeat 20px 50%}
    .sb_menu li.f_admin a {padding:20px 23px 20px 46px}
    .address_wrap {padding:30px 200px 70px 0; font-size:14px; font-weight:300}
    .footer_wrap {position:relative; width:1200px; margin:0 auto}
    
    .footer_wrap .count {position: absolute; top:30px; right:0}
    .count h3 {display:none}
    .count li {float:left; font-size:14px}
    .count li span {display:block}
    .count li .tit {border-radius:10px 10px}
    .count .today {width:90px}
    .count .total {width:90px; margin-left:10px}
    .count .today .tit {background:#adacab}
    .count .total .tit {background:#7c7a79}
    .count .tit {width:90px; padding:10px 0; text-align: center; color:#fff; font-weight:500}
    .count .num {padding:10px; text-align:center; color:#fff; border-bottom:1px solid #adacab; font-size:14px}

	
}

@media only screen and (max-width:440px) {
}

@media only screen and (min-width:801px) and (max-width:1499px) {
    
}