@charset "utf-8";
@import url("./default.css"); 
@font-face {
    font-family: "GmarketSansLight";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff")
        format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "GmarketSansMedium";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff")
        format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "GmarketSansBold";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff")
        format("woff");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'yg-jalnan';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


body{background:#fff;}

#container {width:100%; margin:0px auto; position:relative; }
#container:after { content:""; display:block; clear:both; }

#layerBell{width:758px;height:426px;position:fixed; left:calc(50% - 339px); top:calc(50% - 213px);  padding:0px 30px 0px; z-index:999; background:#fff;  box-sizing:border-box; -webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.25);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.25);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.25);}
#layerBell .lb_titlebox { text-align:center; position:relative; width:100%; height:110px; }
#layerBell .lb_titlebox:before { content:""; display:block; width:178px; height:192px; background:url(../images/layer/layer_bg.png) center top no-repeat; position:absolute; right:0; bottom:0; }
#layerBell .lb_titlebox h3 { font-size:28px; color:#333; font-weight:500; padding:38px 0 6px; }
#layerBell .lb_titlebox p { font-size:14px; color:#666666; }
#layerBell.bellview { display:none; }
#layerBell .close{position:absolute;bottom:5px;right:5px;}
#layerBell ul { height:240px;  overflow-y:scroll; position:relative; box-sizing:border-box; padding:20px; background:#f5f5f5; }
#layerBell ul:before { content:""; display:block; width:1px; height:100%; background:#ccc; position:absolute; left:18px; top:0px; }
#layerBell ul li { line-height:50px; font-size:15px; color:#333; margin-bottom:10px;  }
#layerBell ul li a { display:block; width:100%; height:50px; line-height:50px; position:relative; padding:0 85px 0 55px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#333; box-sizing:border-box; }
#layerBell ul li a span.Blink { display:block; position:absolute; right:15px; top:calc(50% - 13px); width:55px; height:25px; line-height:25px; background:#999; font-size:12px; color:#fff; text-align:center;  transition:all 0.4s; }

#layerBell ul li a:before { content:""; display:block; width:38px; height:38px; position:absolute; left:0; top:6px; background:#eee url(../../../images/member/cal_off.png) 11px center no-repeat; border-radius:50%; transition:all 0.4s; }
#layerBell ul li a:hover { font-weight:500; }
#layerBell ul li a:hover:before { background:#01b093 url(../../../images/member/cal_on.png) 11px center no-repeat; transition:all 0.4s; }

#layerBell ul li a:hover span.Blink { background:#444;  transition:all 0.4s;}
#layerBell .today_close_box { width:100%; position:relative; background:#f5f5f5; margin-top:12px; text-align:right; }
#layerBell .today_close_box span { display:block; width:calc(100% - 172px); cursor:pointer; line-height:45px; font-weight:500; color:#4e4e4e; box-sizing:border-box; padding:0 44px 0 0; }
#layerBell .today_close_box span:before { content:""; display:inline-block; background:url(../images/layer/new_chk_on.png) left top no-repeat; width:18px; height:17px; position:relative; margin:0 12px 0 0; top:3px; }
#layerBell .bell_close {position:absolute; right:0; bottom:0; }
#layerBell .bell_close a { display:block; vertical-align:top; text-align:center; width:172px; height:45px; line-height:45px; text-align:center; font-weight:500; color:#4e4e4e; background:#fae86c;  }
#layerBell .bell_close i { color:#fff !important; }

#layerBell table.cStyle {border-top:2px solid #93a9d7; width:100%; border-left:1px solid #dddddd; font-size:13px; text-align:center; border-collapse:collapse; word-break:break-all; margin:0px 0; background:#fff;}
#layerBell table.cStyle th {background:#f4f6fa; color:#444; line-height:24px; padding:6px 5px; border-right:1px solid #dddddd; border-bottom:1px solid #dddddd;}
#layerBell table.cStyle td {color:#555; padding:6px 5px; line-height:20px; border-right:1px solid #dddddd; border-bottom:1px solid #dddddd; font-size:14px; font-weight:500; }
#layerBell .tablecont {  position:relative;  box-sizing:border-box; padding:20px; background:#f5f5f5;}
#layerBell .layer_table {  overflow-y:scroll; position:relative; box-sizing:border-box; height:203px;}
#layerBell table.cStyle .Blick { display:block; width:68px; height:28px; margin:0 auto; line-height:28px; background:#d95f5f; font-size:13px; color:#fff; text-align:center;  transition:all 0.4s; font-weight:500; border-radius:3px; }
#layerBell table.cStyle .Blick:hover { background:#c31414;  transition:all 0.4s;}
#layerBell .lb_chk { display:inline-block; height:28px; margin:0 auto; line-height:28px; background:#5d86e0; font-size:13px; color:#fff; text-align:center;  transition:all 0.4s; font-weight:500; border-radius:3px; padding:0 10px;}
#layerBell .bell_text { }


/*박스 공통*/
.col_box{float:left;  position:relative; width:30%; height:195px;  box-sizing:border-box; background:#fff;} /* 340 / 1100 = */


/*메인비주얼*/
#visualbox { position:relative; }
.visual_wrap { margin:0px 0 0px; position:relative; padding:0px 0 0;}
.visual_wrap .slick-slide { width:100%; height:780px; position:relative; }
.visual_wrap .slick-slide video { width:100%; height:100%; left:50%; transform:translateX(-50%); top:0px;  object-fit: fill;
    position: absolute;} 
.visual_wrap .slick-slide img {  }

.visual_txt { position:absolute; z-index:1; width:1400px; box-sizing:border-box; padding:0 0; left:50%; transform:translateX(-50%); top:155px;    }


.visual_txt .vis_t1 svg {  }
.visual_txt .vis_t1 svg text { font-family: "GmarketSansMedium"; filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.7));   font-size:28px; color:#e1e7ff;  fill:transparent;
            stroke-dasharray: 326px;
			stroke:transparent;
                stroke-width: 2px;
             }


.visual_txt .vis_t1.effect svg text {  animation: stroke 4s linear;
			animation-iteration-count: 1;
            animation-fill-mode: forwards; }
.visual_txt .vis_t2 { position:relative; padding:0 0px 0 0px; display:inline-block; margin:0px 0 0 0px; }
.visual_txt .vis_t2 p { font-size:36px; display:none;  }
.visual_txt .vis_t2 svg { letter-spacing:-0.5px; }
.visual_txt .vis_t2 svg text {filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.7)); font-family: 'yg-jalnan'; font-weight:bold; font-size:36px; color:#fff;  fill:transparent;
            stroke-dasharray: 326px;
			stroke:transparent;
                stroke-width: 2px;  }
.visual_txt .vis_t2.effect svg text:nth-child(1) {animation: stroke2 4s linear;
			animation-iteration-count: 1;
            animation-fill-mode: forwards; }
.visual_txt .vis_t2.effect svg text:nth-child(2) {animation: stroke 4s linear;
			animation-iteration-count: 1;
            animation-fill-mode: forwards; }

.visual_txt .vis_t2.effect svg text:nth-child(1) { color:#fbe3b5; filter: drop-shadow(1px 1px 0px rgba(255, 255, 255, 0.9));}			
.visual_txt .vis_t2.effect svg text:nth-child(2) { color:#fff; }			
	
.visual_txt .vis_t2 svg text tspan { animation: stroke3 4s linear;
			animation-iteration-count: 1;
            animation-fill-mode: forwards; }	
			
			
.visual_wrap .vbtbox { position:absolute; left:0; width:100%; bottom:30px; text-align:center;  }
.visual_wrap .vbt_cir { display:inline-block; border-radius:150px; padding:10px 15px 3px; box-sizing:border-box; background:rgba(0,0,0,0.5); height:auto; }
.visual_wrap .vbt { display:inline-block; vertical-align:top; margin:2px 15px 0 0; }
.visual_wrap .vbt a { display:block; width:9px; height:12px; text-indent:-99999px; background:url(../images/main/v_bt1.png) left top no-repeat;  }
.visual_wrap .v_stop a { background:url(../images/main/v_bt2.png) left top no-repeat; }

.visual_wrap .mut { display:inline-block; vertical-align:top;  }	
.visual_wrap .mut a { display:block; width:21px; height:15px; text-indent:-99999px; background:url(../images/main/mt_ic.png) left top no-repeat; transition:all 0.4s;  }
.visual_wrap .mt_ic_on a { background:url(../images/main/mt_ic_on.png) left top no-repeat; }


@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
.visual_txt .vis_t1 svg text {  fill:#e1e7ff; }
.visual_txt .vis_t2.effect svg text:nth-child(1) { color:#fbe3b5; }			
.visual_txt .vis_t2.effect svg text:nth-child(2) { color:#fff; }			

}
		svg text:nth-child(1) {
            animation-delay: 1s;
        }
        svg text:nth-child(2) {
            animation-delay: 1.5s;
        }
        svg text:nth-child(3) {
            animation-delay: 2s;
        }
        svg text:nth-child(4) {
            animation-delay: 2.5s;
        }
@keyframes stroke {
            0%   {
				
                stroke:#fbfab5;
                stroke-width: 2px;
                stroke-dashoffset: 326px;
            }
            70% {
                fill: transparent;
            }
            98% {
                stroke:#fbfab5;
                stroke-width: 2px;
            }
            100% {
                fill: #fbfab5;
                stroke-dashoffset: 0px;
            }
}

@keyframes stroke2 {
            0%   {
				
                stroke:#264ead;
                stroke-width: 2px;
                stroke-dashoffset: 326px;
            }
            70% {
                fill: transparent;
            }
            98% {
                stroke:#264ead;
                stroke-width: 2px;
            }
            100% {
                fill: #264ead;
                stroke-dashoffset: 0px;
            }
}

@keyframes stroke3 {
            0%   {
				
                stroke:#fff;
                stroke-width: 2px;
                stroke-dashoffset: 326px;
            }
            70% {
                fill: transparent;
            }
            98% {
                stroke:#fff;
                stroke-width: 2px;
            }
            100% {
                fill: #fff;
                stroke-dashoffset: 0px;
            }
}


/*공지사항 type1*/
.noticeGroup{ width:100%; height:auto; min-height:392px; z-index:1; margin-bottom:60px; }
.noticeGroup:before { content:""; display:block; width:1265px; height:100%; position:absolute; z-index:-1; border-radius:0 50px 150px 0; background: rgb(236,245,248);
background: linear-gradient(90deg, rgba(236,245,248,1) 0%, rgba(234,242,254,1) 100%); left:-260px; top:0; }
.noticeGroup .noti_all { font-size:24px; color:#121212; font-weight:bold; height:122px; box-sizing:border-box; padding:61px 0 0 0; float:left; }

.noticeGroup .btbox { position:absolute; right:0; top:-62px; }
.noticeGroup .btbox:after { content:""; display:block; clear:both; }
.noticeGroup .btbox li { float:left; position:relative; }
.noticeGroup .btbox li a { display:block; text-indent:-999999px; }
.noticeGroup .btbox li.nbtn01 { padding-right:25px; margin-top:6px; }
.noticeGroup .btbox li.nbtn01:before { content:""; display:block; width:1px; height:16px; background:#cfcfcf; position:absolute; right:0; top:0; }
.noticeGroup .btbox li.nbtn01 a { width:18px; height:16px; background:url(../images/main/noti_bt1.png) left top no-repeat; }
.noticeGroup .btbox li.nbtn03 { padding-left:25px; margin-top:6px; }
.noticeGroup .btbox li.nbtn03 a { width:18px; height:16px; background:url(../images/main/noti_bt2.png) left top no-repeat; }

.noticeGroup .btbox li.more { margin-left:30px; }
.noticeGroup .btbox li.more a { width:27px; height:27px; border-radius:50%; background:#3481f5 url(../images/main/noti_more.png) center center no-repeat; }

.noticeGroup h3 { float:left; position:relative; padding:0 29px; margin-top:56px; }
.noticeGroup h3.btn1 { margin-left:488px; }
.noticeGroup h3:before { content:""; display:block; width:5px; height:5px; border-radius:50%; background:#cfcfcf; position:absolute; left:0; top:calc(50% - 2.5px); z-index:1; }
.noticeGroup h3.btn1:before { display:none; }
.noticeGroup h3 a { display:block; font-size:22px; color:#565656; font-weight:500; line-height:24px; position:relative; }
.noticeGroup h3 a:before { content:""; display:block; width:0%; height:2px; background:#2f5bc1; position:absolute; left:0; bottom:-6px; transition:width 0.4s; }

.noticeGroup .on_check .tabcontent{display:block;}
.noticeGroup .on_check .btn a { color:#2f5bc1; }
.noticeGroup .on_check .btn a:before { width:100%; }

.noticeGroup div.tabcontent {position:absolute; left:-99999px; top:122px;width:100%; opacity:0;  }
.noticeGroup .on_check .tabcontent{ opacity:1; left:0; }
.noticeGroup .on_check .tabcontent:after { content:""; display:block; width:35px; height:100%; position:absolute; right:-52px; top:10px; background:#fff; z-index:10; box-shadow:-35px 0px 30px 40px rgba(255,255,255,1); }


.noticeGroup .slick-slide { float:left; width:350px; height:210px; margin-right:30px; position:relative;  }
.noticeGroup .noti_item { float:left; width:350px; height:210px; box-sizing:border-box; padding:10px 0 0;}
.noticeGroup .board_notice:before { content:"공지"; display:block; width:84px; height:39px; line-height:39px; text-align:center; background:#3f4350; color:#fff; border-radius:0 15px 0 0; font-weight:500; font-size:16px; position:absolute; right:0; top:0; z-index:1;}

.noticeGroup .noti_item a { display:block; width:100%; box-sizing:border-box; height:200px; background:#fff; position:relative; border-radius:0 0 15px 0; border:1px solid #ddd; padding:0 30px 0; }
.noticeGroup .noti_item a dt { font-size:17px; color:#333; font-weight:500; overflow:hidden; /* 여러 줄 자르기 추가 스타일 */
    white-space: normal;
    line-height: 24px;
    height: 48px;
    text-align: left;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; margin:24px 0 11px; }

.noticeGroup .board_notice a dt { padding-right:65px; }
	
.noticeGroup .noti_item a dd { letter-spacing:-0.5px; font-size:16px; color:#555; overflow:hidden; /* 여러 줄 자르기 추가 스타일 */
    white-space: normal;
    line-height: 24px;
    height: 48px;
    text-align: left;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; }
.noticeGroup .noti_item a::before { box-sizing:border-box; content:""; display:block; width:0px; height:0px; position:absolute; left:0px; top:0px; border:4px solid transparent; border-radius:0 0 15px 0; }
.noticeGroup .noti_item a::after { box-sizing:border-box; content:""; display:block; width:0px; height:0px; position:absolute; right:0px; bottom:0px; border:4px solid transparent; border-radius:0 0 15px 0; }
.noticeGroup .noti_item a:hover::before { width:100%; height:100%;  
transition:
width 0.35s ease-out,
height 0.35s ease-out 0.35s; }

.noticeGroup .noti_item a:hover::after { width:100%; height:100%;    transition:
width 0.35s ease-out,
height 0.35s ease-out 0.35s; }

.noticeGroup .noti_item a:hover::before { border-top-color:#3b9adc; border-right-color:#3b9adc; }
.noticeGroup .noti_item a:hover::after {  border-bottom-color:#fddb6b; border-left-color:#fddb6b; }

.noticeGroup .noti_item a img { display:none; }
.noticeGroup .noti_item a p.noti_date { text-align:right; margin-top:19px; }
.noticeGroup .noti_item a p.noti_date:before { content:""; display:inline-block; vertical-align:top; width:11px; position:relative; top:7px; margin:0 10px 0 0; height:11px; background:url(../images/main/noti_date.png) left top no-repeat; }


/*월중행사 type1*/
.schedule { width:645px; height:534px; margin-right:50px; }
.schedule h3 { color:#121212; font-size:24px; margin-bottom:28px; }
.schedule h3 span { color:#2f5bc1; }

.schedule .more { position:absolute; right:0; top:0; }
.schedule .more a { display:block; width:29px; height:29px; border-radius:50%; box-sizing:border-box; text-indent:-99999px; border:1px solid #ddd; background:#f2f2f2 url(../images/main/sch_more.png) center center no-repeat; }

.schedule .schbox { width:100%; overflow:hidden; border-radius:15px; background:#fff; height:482px; box-sizing:border-box; border:1px solid #ddd; }
.schedule table { border-collapse:collapse; width:100%; text-align:center; background:#f8f8f8; }
.schedule table th { border-right:1px solid #ddd; height:54px; box-sizing:border-box; line-height:54px; background:#2f5bc1; color:#fff; font-size:18px; font-weight:500; }
.schedule table th:last-child { border-right:0 none; }

.schedule table td { border-right:1px solid #ddd; border-bottom:1px solid #ddd; height:70px; box-sizing:border-box; font-size:18px; color:#333;}
.schedule table td:first-child a { color:#f23545; }
.schedule table td:last-child a { color:#2f5bc1; }

.schedule table td:last-child { border-right:0 none;  }

#schedule_content { margin:31px 29px 0; height:235px; overflow-y:auto; }
#schedule_content div { margin-bottom:13px; }
#schedule_content div a { display:block; height:34px; width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; line-height:34px; font-size:18px; color:#555; }
#schedule_content div a:after { content:""; display:block; clear:both;  }
#schedule_content div a span { float:left; display:block; width:89px; height:34px; line-height:34px; border-radius:150px; background:#203a91; color:#fff; font-weight:500; margin:0 26px 0 0; text-align:center; }
#schedule_content div a:hover { font-weight:500; }

/*팝업*/
.popupZone { width:382px; height:286px; border:1px solid #ddd; border-radius:15px; padding:0 29px 0; }
.popupZone h3 { height:83px; line-height:76px; font-size:24px; color:#121212; }

.popupZone ul.main_btn { position:absolute; right:29px; top:29px; }
.popupZone ul.main_btn li { float:left; margin-left:20px; }
.popupZone ul.main_btn li a { display:block; text-indent:-99999px; }
.popupZone ul.main_btn li.pbtn01 a { width:12px; height:18px; background:url(../images/main/pop_bt1.png) left top no-repeat; }
.popupZone ul.main_btn li.pbtn02 a { width:10px; height:18px; background:url(../images/main/pop_bt2.png) left top no-repeat; }
.popupZone ul.main_btn li.p_play a { background:url(../images/main/pop_bt2_on.png) left top no-repeat; }

.popupZone ul.main_btn li.pbtn03 a { width:12px; height:18px; background:url(../images/main/pop_bt3.png) left top no-repeat; }
#popup_scroll { width:100%; height:172px; overflow:hidden; }
.popupZone .pitem { width:100%; }
.popupZone .pitem a { display:block; width:100%; height:172px; }
.popupZone .pitem img { width:100%; height:172px; display:block; }

/*바로가기*/
.quick_ground { width:292px; height:286px; border:1px solid #ddd; border-radius:15px; float:right; padding:27px 30px 0; }
.quick_ground h3 { font-size:24px; color:#121212; margin-bottom:25px; }
.quickbox { }
.quickbox .slick-slide { border:0 none;  }
.quickbox .qitem { margin-bottom:4px; }
.quickbox .qitem a { display:block; font-size:16px; color:#121212; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; height:38px; line-height:38px; }
.quickbox .qitem a span { display:inline-block; vertical-align:top; }
.quickbox .qitem1 a span { width:42px; height:23px; background:url(../images/main/q_ic1.png) left top no-repeat; margin:9px 0px 0 0; }
.quickbox .qitem2 a span { width:42px; height:29px; background:url(../images/main/q_ic2.png) left top no-repeat; margin:5px 0px 0 0; }
.quickbox .qitem3 a span { width:42px; height:31px; background:url(../images/main/q_ic3.png) left top no-repeat; margin:3px 0px 0 0; }
.quickbox .qitem4 a span { width:42px; height:27px; background:url(../images/main/q_ic4.png) left top no-repeat; margin:7px 0px 0 0; }
.quickbox .qitem a:hover { font-weight:500; }

.quick_ground ul.main_btn { position:absolute; right:29px; top:29px; }
.quick_ground ul.main_btn li { float:left; margin-left:20px; }
.quick_ground ul.main_btn li a { display:block; text-indent:-99999px; }
.quick_ground ul.main_btn li.q_prev a { width:12px; height:18px; background:url(../images/main/pop_bt1.png) left top no-repeat; transform:rotate(-90deg); }
.quick_ground ul.main_btn li.qstop a { width:10px; height:18px; background:url(../images/main/pop_bt2.png) left top no-repeat; }
.quick_ground ul.main_btn li.q_stop a { background:url(../images/main/pop_bt2_on.png) left top no-repeat; }
.quick_ground ul.main_btn li.q_next a { width:12px; height:18px; background:url(../images/main/pop_bt3.png) left top no-repeat;  transform:rotate(-90deg);}


/*급식*/
.food { width:705px; height:216px; overflow:hidden; border-radius:15px; margin:32px 0 0 0; background:url(../images/main/f_pat2.png) right top no-repeat, #3b9adc  url(../images/main/f_pat1.png) left top no-repeat; padding:0 213px 0 30px;}
.food:before { content:""; display:block; width:147px; height:179px; background:url(../images/main/f_pic.png) right top no-repeat; position:absolute; right:35px; bottom:0; }

.food h3 { font-size:24px; color:#fff; padding:28px 0 22px; }
.food p.f_txt { line-height:24px; font-size:16px; color:#fff; }
.food .more { width:133px; margin-top:30px; }
.food .more a { display:block; width:100%; height:34px; line-height:34px; border-radius:150px; position:relative; background:#203a91 url(../images/main/f_more.png) right 20px center no-repeat; font-size:16px; color:#fff; font-weight:500; padding:0 0 0 21px; box-sizing:border-box; transition:all 0.4s; }
.food .more a:hover { background:#203a91 url(../images/main/f_more.png) right 14px center no-repeat; }


/*갤러리 img는 absolute로 날리고 썸네일을 background로 살리면 깨끗하게 쓸수 있습니다 common.js파일에 갤러리img추출 부분을 소스에 맞게 수정해주면됨*/
.galleryGroup{ margin:60px 0 0 0; width:100%; height:auto; min-height:420px; }
.galleryGroup:before { content:""; display:block; width:100%; height:315px; background:#264ead url(../images/main/gal_pat.jpg) right top no-repeat; position:absolute; left:0; top:0; }
.galleryGroup .default_layout { z-index:1; }
.galleryGroup .titlebox { height:114px; box-sizing:border-box; padding:48px 0 0 0; }
.galleryGroup .titlebox:after { content:""; display:block; clear:both; }
.galleryGroup .titlebox h3 { float:left; font-size:24px; color:#fff; }
.galleryGroup .titlebox h3 a { color:#fff; }
.galleryGroup .titlebox h3 span { color:#f2be5c; }
.galleryGroup .titlebox p { float:left; font-size:16px; color:#fff; margin:2px 0 0 36px; }

.galleryGroup .main_btn { position:absolute; right:0; top:52px; }
.galleryGroup .main_btn:after { content:""; display:block; clear:both; }
.galleryGroup .main_btn li { float:left; margin-left:27px; }
.galleryGroup .main_btn li a { display:block; text-indent:-99999px; }
.galleryGroup .main_btn li.gbtn01 a { width:12px; height:18px; background:url(../images/main/gal_bt1.png) left top no-repeat; }
.galleryGroup .main_btn li.gbtn03 a { width:12px; height:18px; background:url(../images/main/gal_bt3.png) left top no-repeat; }
.galleryGroup .main_btn li.more { margin:-6px 0 0 24px; }
.galleryGroup .main_btn li.more a { width:29px; height:29px; border-radius:50%; background:#fff url(../images/main/gal_more.png) center center no-repeat; }


.galleryGroup #gallery_scroll { width:100%; margin:0px 0 0; }
.galleryGroup .slick-slide { width:327px; height:297px; margin:0 27px 0 0; box-sizing:border-box; padding:5px; }
.galleryGroup .slick-slide .gitem a { display:block; position:relative; height:285px; width:100%; background:#fff; border-radius:0 15px 0px 0; box-shadow:0px 0px 6px 1px rgba(9,17,82,0.3); }
.galleryGroup .slick-slide .gitem .pic { width:100%; height:213px; box-sizing:border-box; overflow:hidden; position:relative; background-size:cover !important; border-radius:0 15px 0px 0; overflow:hidden;}
.galleryGroup .slick-slide .gitem .pic img { position:absolute; left:-999999px; top:0; }

.galleryGroup .slick-slide .gitem .g_sub { padding:0 19px; line-height:24px; font-size:16px; font-weight:500; color:#121212; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; margin:10px 0 3px; }
.galleryGroup .slick-slide .gitem a:hover .g_sub { font-weight:bold; }
.galleryGroup .slick-slide .gitem .g_date { margin:0 19px; padding:0 0 0 21px; font-size:15px; color:#797979; background:url(../images/main/noti_date.png) left 7px no-repeat; }

.galleryGroup .slick-slide .gitem a::before { box-sizing:border-box; content:""; display:block; width:0px; height:0px; position:absolute; left:0px; top:0px; border:4px solid transparent; border-radius:0 15px 0 0; z-index:1; }
.galleryGroup .slick-slide .gitem a::after { box-sizing:border-box; content:""; display:block; width:0px; height:0px; position:absolute; right:0px; bottom:0px; border:4px solid transparent;  border-radius:0 15px 0 0;  z-index:1;}
.galleryGroup .slick-slide .gitem a:hover::before { width:100%; height:100%;  
transition:
width 0.35s ease-out,
height 0.35s ease-out 0.35s; }

.galleryGroup .slick-slide .gitem a:hover::after { width:100%; height:100%;    transition:
width 0.35s ease-out,
height 0.35s ease-out 0.35s; }

.galleryGroup .slick-slide .gitem a:hover::before { border-top-color:#6785cd; border-right-color:#6785cd; }
.galleryGroup .slick-slide .gitem a:hover::after {  border-bottom-color:#fddb6b; border-left-color:#fddb6b; }




/*학생학부모바로가기*/
.main_student { width:230px; height:220px; position:fixed; right:-120px; top:50%; transform:translateY(-50%); transition:all 0.4s; z-index:1; background:none; }
.main_student.side_view { right:0; }
.main_student dt { position:absolute; left:0px; top:0; width:110px;  }
.main_student dt.tepbt1 { top:0px; }
.main_student dt.tepbt2 { top:80px; }
.main_student dt.tepbt3 { top:160px; }
.main_student dt a { color:#fff; font-size:16px; width:100%; background:rgba(32,58,145,0.6); border-radius:15px 0 0 15px; height:80px; display:block; text-align:center; line-height:18px; font-weight:500; box-sizing:border-box; padding-top:47px;}
.main_student dt a:hover { background:rgba(32,58,145,0.8); }
.main_student dt.tepbt1 a { border-radius:15px 0 0 0; border-bottom:1px solid #a4b7cc; }
.main_student dt.tepbt2 a {  border-radius:0 0 0 0px; border-bottom:1px solid #a4b7cc;}
.main_student dt.tepbt3 a { border-radius:0 0 0 15px;   }

.main_student dt.on a { background:#2f5bc1; }

.main_student dt a:before { content:""; display:block; width:100%; height:67px; position:absolute; left:0; top:0; }
.main_student dt.tepbt1 a:before { background:url(../images/main/qt_ic1.png) center 12px no-repeat; background-size:20px;}
.main_student dt.tepbt2 a:before { background:url(../images/main/qt_ic2.png) center 13px no-repeat; background-size:25px; }
.main_student dt.tepbt3 a:before { background:url(../images/main/qt_ic3.png) center 13px no-repeat; background-size:20px;}

.main_student dd { display:none; width:120px; height:240px; background:#63709c; box-sizing:border-box; margin:0 0 0 110px; padding:25px 5px 0 12px; }
.main_student dd.tepbox1 { display:block; }

.main_student dd ul { max-height:180px; overflow-y:auto; }
/* 스크롤바의 폭 너비 */
.main_student dd ul::-webkit-scrollbar {
    width: 3px;  
}

.main_student dd ul::-webkit-scrollbar-thumb {
    background:#bbbbbb; /* 스크롤바 색상 */
    border-radius: 3px; /* 스크롤바 둥근 테두리 */
}

.main_student dd ul::-webkit-scrollbar-track {
    background:#f9f9f9;  /*스크롤바 뒷 배경 색상*/
}
.main_student dd ul li { }
.main_student dd ul li a { display:block; width:100%; color:#fff; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; line-height:30px; font-size:15px; letter-spacing:-1px; }
.main_student dd ul li a:hover { font-weight:500; }

/*배너모음*/
#banner {margin:46px 0 0 0; height:88px;  float:left; position:relative; width:100%; box-sizing:border-box; border-top:1px solid #aaaaaa; }
#banner h3 { float:left; font-size:24px; color:#121212; padding:31px 0 0;}
#banner .main_btn { position:absolute; right:0px; top:29px; }
#banner .main_btn:after { content:""; display:block; clear:both; }
#banner .main_btn li { float:left; width:26px; margin-left:9px; display:block; }
#banner .main_btn li a { display:block; width:100%; height:26px; border-radius:50%; box-sizing:border-box; border:1px solid #ddd; text-indent:-999999px; }
#banner .main_btn li.bbtn01 a { background:#fff url(../images/main/b_bt1.png) center center no-repeat; }
#banner .main_btn li.bbtn02 a { background:#f2f2f2 url(../images/main/b_bt2.png) center center no-repeat; }
#banner .main_btn li.bbtn03 a { background:#fff url(../images/main/b_bt3.png) center center no-repeat; }
#banner .main_btn li.more a { background:#f2f2f2 url(../images/main/b_more.png) center center no-repeat; }


div#banner_scroll {position:absolute;left:112px; top:17px; width:1122px; height:53px; overflow:hidden;  }
div#banner_scroll #banner_content { width:100%;}
div#banner_scroll #banner_content .slick-slide { margin:0 7px 0px 0; width:180px; }
div#banner_scroll #banner_content .banitem {float:left; width:100%; height:53px; box-sizing:border-box; border:1px #ddd solid;}
div#banner_scroll #banner_content .banitem img {float:left;width:100%;height:51px; }









/*/////////////////////////////////////////////////////////////////////////////////반응형/////////////////////////////////////////////////////////////////////////////////*/

@media all and (max-width:1024px) {

/*레이어 알람*/
#layerBell{width:94%; position:fixed; left:3%; padding:0 3%; }
#layerBell .lb_titlebox:before { display:none; }
#layerBell table.cStyle .Blick { display:inline-block; padding:0 5px; height:auto; line-height:24px; width:auto; }
#layerBell .lb_chk { display:inline-block; height:auto; margin:0 auto; line-height:24px;  padding:0 5px;}
#layerBell .today_close_box { width:100%; position:relative; background:#f5f5f5; margin-top:12px; text-align:center; }
#layerBell .today_close_box span { display:block; box-sizing:border-box; padding:0 5px 0 5px; width:calc(100% - 82px); }
#layerBell .today_close_box span:before {  margin:0 8px 0 0; top:3px; }
#layerBell .bell_close {position:absolute; right:0; bottom:0; }
#layerBell .bell_close a { display:block; vertical-align:top; text-align:center; width:82px; height:45px; line-height:45px; text-align:center; font-weight:500; color:#4e4e4e; background:#fae86c;  }
#layerBell .bell_close i { color:#fff !important; }


#container {width:100%; margin:18px auto; min-height:100%;}

/*메인비주얼*/
#visualbox { position:relative; }
.visual_wrap { margin:0px 0 0px; position:relative; padding:0px 0 0;}
.visual_wrap .slick-slide { width:100%; height:auto; min-height:250px; position:relative; }
.visual_wrap .slick-slide div { height:auto;  }
.visual_wrap .slick-slide video { width:100%; height:100%; left:50%; transform:translateX(-50%); top:0px;  object-fit: fill;
    position: absolute;} 
.visual_wrap .slick-slide img { display:block; width:100%; min-height:180px;  }

.visual_txt { position:absolute; z-index:1; width:100%; box-sizing:border-box; padding:0 0; left:15px; transform:translateY(-50%); top:50%;    }
.visual_txt .vis_t1 svg { width:290px; height:28px;}
.visual_txt .vis_t1 svg text { transform:scale(0.5); }

.visual_txt .vis_t2 svg { width:420px; position:relative; top:-10px; }
.visual_txt .vis_t2 svg text { transform:scale(0.7);  }
.visual_wrap .vbtbox { z-index:2; bottom:15px; }

/*박스 공통*/
.col_box{float:left; clear:both;  width:94%; margin:0 3% 20px 3% !important;}

/*공지사항 type1*/
.noticeGroup{ width:97%; height:auto; min-height:392px; z-index:1; margin:0 0 20px 3% !important;}
.noticeGroup:before { width:68%; height:100%; position:absolute; left:-4%; top:0; }
.noticeGroup .noti_all { height:auto; box-sizing:border-box; padding:35px 0 20px 0; float:left; }

.noticeGroup .btbox { position:absolute; right:3%; top:-42px; }

.noticeGroup h3 { float:left; padding:0 29px; margin-top:35px; }
.noticeGroup h3.btn1 { margin-left:20px; }
.noticeGroup h3 a { display:block; font-size:20px;}

.noticeGroup div.tabcontent { top:122px; width:100%; opacity:0;  }
.noticeGroup .on_check .tabcontent{ opacity:1; left:0; }
.noticeGroup .on_check .tabcontent:after { display:none; }

.noticeGroup .slick-slide { margin-right:30px;  }

/*월중행사*/
#schedule_content { margin:31px 15px 0; }
#schedule_content div a {   font-size:16px; color:#555; }

/*팝업존*/
.popupZone { padding:0 20px 0; float:left; width:46%; margin:0 1% 20px 3% !important; }

/*바로가기*/
.quick_ground { padding:27px 20px 0; float:right; width:46%; margin:0 3% 20px 1% !important; clear:none; }



/*갤러리 img는 absolute로 날리고 썸네일을 background로 살리면 깨끗하게 쓸수 있습니다 common.js파일에 갤러리img추출 부분을 소스에 맞게 수정해주면됨*/
.galleryGroup{ margin:0px 0 20px 0 !important; width:100%; height:auto; min-height:420px;  }
.galleryGroup:before { content:""; display:block; width:100%; height:315px; background:#264ead url(../images/main/gal_pat.jpg) right top no-repeat; position:absolute; left:0; top:0; }
.galleryGroup .titlebox { height:114px; box-sizing:border-box; padding:48px 3% 0; }
.galleryGroup .titlebox p { display:none; }

.galleryGroup .main_btn { position:absolute; right:3%; top:52px; }
.galleryGroup #gallery_scroll { width:97%; margin:0 0 0 3%; }
.galleryGroup .slick-slide { height:297px; margin:0 27px 0 0; }


/*학생학부모바로가기*/
.main_student { width:94%; height:auto; position:relative; right:inherit; top:inherit; transform:none; transition:all 0.4s; z-index:1; background:none; padding-top:80px; }
.main_student.side_view { right:0; }
.main_student dt { position:absolute; left:0; top:0; width:33%;  }
.main_student dt.tepbt1 { top:0px; }
.main_student dt.tepbt2 { top:0px; left:33%;  width:34%;  }
.main_student dt.tepbt3 { top:0px; left:67%; }
.main_student dt a {  font-size:16px; width:100%; border-radius:15px 0 0 15px; height:80px;  text-align:center; line-height:18px; font-weight:500; border-bottom: 1px solid #a4b7cc;}
.main_student dt.tepbt2 a { border-radius:0px 0px 0px 0; }
.main_student dt.tepbt3 a { border-radius:0px 15px 0px 0; }
.main_student dt.on a { color:#fff; }

.main_student dd { display:none; width:100%;  padding:20px 20px 0; margin:0 0 0 0; }
.main_student dd.tepbox1 { display:block; }



/*급식*/
.food {  height:auto; padding:0 20px 40px 20px;}
.food:before { content:""; display:block; width:100px; height:122px; background-size:cover;  right:35px; bottom:0; }

.food h3 { font-size:24px; color:#fff; padding:28px 0 22px; }
.food p.f_txt { position:relative; z-index:1;}
.food .more {position:relative; z-index:1; }


/*배너모음*/
#banner {margin:0px 0 0 0; height:auto;  float:left; position:relative; width:100%; border-top:1px solid #aaaaaa; box-sizing:border-box; padding:25px 0 10px; }
#banner h3 { float:none; padding:0px 0 0 3%;}
#banner .main_btn { position:absolute; right:3%; top:0px; }
 
div#banner_scroll {position:relative; left:inherit; top:inherit; width:97%; overflow:hidden; margin:20px 0 0 3%; }
div#banner_scroll ul#banner_content {position:absolute;left:0;top:0;width:100%;}
div#banner_scroll ul#banner_content li {float:left; margin:0 3% 0px 0; width:22%;  }
div#banner_scroll #banner_content .slick-slide { margin:0 15px 0px 0; }


}

@media all and (max-width:829px) {
/*공지사항 type1*/
.noticeGroup{ width:94%; height:auto; min-height:592px; z-index:1; margin:0 3% 20px 3% !important;}	
.noticeGroup .noti_all { height:auto; box-sizing:border-box; padding:35px 0 20px 0; float:left; width:100%; box-sizing:border-box; }

.noticeGroup h3 { float:left; padding:0 20px; box-sizing:border-box;  margin-top:5px; }
.noticeGroup h3.btn1 { margin-left:0px; }

.noticeGroup .slick-slide { margin:0 0 15px 0;  }
.noticeGroup .btbox { position:absolute; right:0; top:-89px; }
.noticeGroup div.tabcontent { top:125px; width:100%; opacity:0;  }

}

@media all and (max-width:740px) {
	
/*팝업존*/
.popupZone { float:left; width:94%; margin:0 3% 20px 3% !important; }

/*바로가기*/
.quick_ground {  float:right; width:94%; margin:0 3% 20px 3% !important; clear:both; }

/*배너모음*/
div#banner_scroll ul#banner_content li {float:left; margin:0 0 0px 3%; width:30%;  }

}

@media all and (max-width:719px) {
	
.galleryGroup #gallery_scroll { width:94%; margin:0 3% 0 3%; }
.galleryGroup .slick-slide { margin:0 0px 20px 0; }

}


@media all and (max-width:550px) {

/*배너모음*/
div#banner_scroll ul#banner_content li {float:left;  width:47%;  }

}

@media all and (max-width:440px) {
.visual_wrap .slick-slide { width:100%; height:auto; min-height:140px; position:relative; }
.visual_wrap .slick-slide img { display:block; width:100%; min-height:140px;  }

.visual_txt .vis_t1 svg { width:290px; height:28px;}
.visual_txt .vis_t1 svg text { transform:scale(0.5); }

.visual_txt .vis_t2 svg { width:320px; position:relative; top:-10px; }
.visual_txt .vis_t2 svg text { transform:scale(0.5);  }

}

@media all and (max-width:420px) {
#layerBell ul:before { display:none; }
#layerBell ul li a {  padding:0 85px 0 0px;  }
#layerBell ul li a:before { display:none !important; }	
	
}

