@charset "utf-8";
@import url("./default.css?240229"); 
@import url("../../../css/content.css?240429");


/*서브비주얼*/
.visual_wrap { position:relative; height:400px;}
.visual_wrap:after { content:""; display:block; clear:both; }
.visual_wrap .slick-slide { width:100%; height:400px; 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_wrap .visual01 { width:100%; height:400px; background:url(../images/sub/sub_visual01.jpg) center top no-repeat; text-indent:-99999px; }
div.s_education .visual01, div.s_teacher .visual01 { width:100%; height:400px; background:url(../images/sub/sub_visual02.jpg) center top no-repeat; text-indent:-99999px; }
div.s_student .visual01, div.s_open .visual01 { width:100%; height:400px; background:url(../images/sub/sub_visual03.jpg) center top no-repeat; text-indent:-99999px; }
div.s_news .visual01, div.s_parents .visual01 { width:100%; height:400px; background:url(../images/sub/sub_visual05.jpg) center top no-repeat; text-indent:-99999px; }
/*div.s_news .visual01  
div.s_intro .visual01
메뉴별 다른이미줄때는 s_페이지코드 적으세요*/

#visualbox .slick-slide { border:0 none; }
.visual_wrap .slick-dots { width:100%; position:absolute; left:0; bottom:52px; text-align:center; height:14px; }
.visual_wrap .slick-dots li { display:inline-block; vertical-align:top; margin:0 5px; }
.visual_wrap .slick-dots li span { display:block; width:14px; height:14px; text-indent:-99999px; cursor:pointer; background:#dddddd; border-radius:50%; box-shadow:3px 3px 5px rgba(0,0,0,0.2); }
.visual_wrap .slick-dots li.slick-active span { background:#fff; border-radius:150px; width:42px; }

.vitxtbox { position:absolute; z-index:1; left:0; top:50%; transform:translateY(-50%); width:100%; text-align:center; -webkit-animation: scale-in-hor-center 1.0s 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: scale-in-hor-center 1.0s 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}
.vitxtbox p { font-size:30px; color:#fff; line-height:48px; font-weight:bold; text-shadow:0px 0px 7px rgba(0,0,0,0.4); }
.vitxtbox p span.vsize1 { display:inline-block; position:relative; z-index:1; font-size:36px; padding:0 8px; }
.vitxtbox p span.vsize1:before { content:""; display:block; width:0%; height:23px; position:absolute; left:0; bottom:4px; z-index:-1; background:rgba(0,56,118,0.5); -webkit-animation: scale-shape 0.8s 1.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: scale-shape 0.8s 1.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}
.vitxtbox p span.shape { display:inline-block; position:relative; z-index:1; padding:0 8px; }
.vitxtbox p span.shape:before { content:""; display:block; width:0%; height:24px; position:absolute; left:0; bottom:3px; z-index:-1; background:rgba(4,103,179,0.5); -webkit-animation: scale-shape 1.2s 1.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: scale-shape 1.2s 1.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}

.vitxtbox p span.vsize2 { display:inline-block; font-size:36px; }

@-webkit-keyframes scale-in-hor-center {
  0% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    opacity: 1;
  }
}
@keyframes scale-in-hor-center {
  0% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    opacity: 1;
  }
}

@-webkit-keyframes scale-shape {
	0% {
		width:0;
	}
	100% {
		width:100%;
	}

}
@keyframes scale-shape {
	0% {
		width:0;
	}
	100% {
		width:100%;
	}
}


#container {margin:0 auto; width:1440px; }
#container:after { content:""; display:block; clear:both; }

/*레프트메뉴*/
#left {float:left; width:284px; margin:-40px 50px 40px 0;}
#left h2 {position:relative; border-radius:15px 15px 0 0; margin-bottom:8px; text-align:center; height:163px; padding:66px 0 0px 0; box-sizing:border-box;  background:#fff url(../images/sub/left_h2_title.jpg) left bottom no-repeat; color:#fff; font-size:30px; background: rgb(41,91,197);
background:url(../images/sub/left_pat.png) left bottom no-repeat, linear-gradient(90deg, rgba(41,91,197,1) 0%, rgba(26,43,100,1) 100%);}

ul#leftMenu {width:100%;}
ul#leftMenu li {border:1px #dddddd solid; font-size:18px; letter-spacing:-0.5px; margin-bottom:5px; }
ul#leftMenu li a {display:block; color:#333; line-height:18px; padding:18px 10px 18px 20px; background:#fff; font-weight:500; position:relative; }
ul#leftMenu li a:hover {font-weight:bold; background:#f3f3f3;  }
ul#leftMenu li a.on {font-weight:bold; color:#fff; line-height:18px; background:#2c66db;}

ul#leftMenu li div {display:none;position:relative; background:#f2f2f2; border-top:1px solid #ddd; overflow:hidden;}
ul#leftMenu li div.on {display:block;}
ul#leftMenu li div ul { padding:10px 0;}
ul#leftMenu li div ul li {font-size:16px; border:0px;}
ul#leftMenu li div ul li a {display:block; color:#555; padding:3px 0 3px 39px; line-height:23px; background:none; position:relative;  }
ul#leftMenu li div ul li a:before { content:""; display:block; width:10px; height:3px; background:#555555; position:absolute; left:22px; top:13px; }
ul#leftMenu li div ul li a:hover{color:#2c66db; font-weight:500 !important; background:none;  }

ul#leftMenu li div ul li.on a{color:#2c66db; font-weight:500 !important; background:none;  }
ul#leftMenu li div ul li.on a:before { background:#2c66db; }

ul#leftMenu li a.depth_view { padding:18px 43px 18px 20px; letter-spacing:-1px; }
ul#leftMenu li a.depth_view:before { content:""; display:block; width:15px; height:15px; box-sizing:border-box; background:url(../images/sub/depth_off.png) center center no-repeat; position:absolute; right:19px; top:calc(50% - 7.5px); }

ul#leftMenu li a.on.depth_view:before { background:url(../images/sub/depth_on.png) center center no-repeat; }


#contentGroup { float:right; padding:0px 0 0 0; width:calc(100% - 334px); }


/*가이드박스*/
#guideGroup {position:relative;  height:123px; box-sizing:border-box; border-bottom:1px #d1d1d1 solid; padding-top:54px;}
#guideGroup h3 { font-size:30px; color:#333333; padding:13px 0 0 0; font-weight:500; letter-spacing:-1.5px; position:relative;}
	
#guideGroup .guide { position:absolute; top:20px; left:0px;}
#guideGroup .guide li{float:left;color:#777;line-height:23px; font-size:15px; padding:0 15px 0 20px;background:url(../images/sub/guide_dot.png) left 6px no-repeat; }
#guideGroup .guide li.first {padding:2px 12px 0 0;background:none; }
#guideGroup .guide li a { display:inline-block; width:20px; height:20px; vertical-align:top; text-indent:-99999px; background:url(../images/sub/s_home.png) left top no-repeat;}


#guideGroup .page_config {position:absolute; top:53px; right:0px;}
#guideGroup .page_config li{float:left; margin-left:10px; }
#guideGroup .page_config li a{display:block; text-indent:-99999px; width:39px; height:39px; border-radius:50%; box-sizing:border-box; border:1px solid #ddd; }
#guideGroup .page_config li.print a {background:url(../images/sub/page_print.png) center center no-repeat; }
#guideGroup .page_config li.edit a {background:url(../images/sub/page_admin.png) center center no-repeat; }


/*컨텐츠박스*/
#content { position:relative; min-height:400px; margin:30px 0 40px 0; }
#content:after { content:""; display:block; clear:both; }



/* 컨텐츠 공통 스타일 */
h4.cStyle {clear:both; font-size:24px; padding:0 0 0 30px; font-weight:600; color:#333; background:url(../images/sub/h4_dot.png) left 6px no-repeat; line-height:30px; margin-bottom:10px;}
h5.cStyle {clear:both; font-size:22px; padding:0 0 0 45px; font-weight:600; color:#2c66db; background:url(../images/sub/h5_dot.png) 15px 6px no-repeat; line-height:30px;}
h6.cStyle {clear:both; font-size:19px; padding:0 0 0 55px; font-weight:600; color:#555; background:url(../images/sub/h6_dot.png) 30px 8px no-repeat; line-height:30px;}

dl.cStyle {clear:both; font-size:14px;}
dl.cStyle dt {font-size:15px; padding:0 0 0 56px; margin:5px 0 0 0; color:#444; background:url(../images/sub/dt_dot.png) 40px 9px no-repeat; line-height:24px; }
dl.cStyle dd {font-size:14px; padding:0 0 0 59px; margin:5px 0 0 0; color:#767676; background:url(../images/sub/dd_dot.png) 46px 11px no-repeat; line-height:24px;}

ul.cStyle {clear:both; font-size:14px;}
ul.cStyle li {font-size:15px; padding:0 0 0 56px; margin:5px 0 0 0; color:#444; background:url(../images/sub/dt_dot.png) 40px 9px no-repeat; line-height:24px;}

table.cStyle {border-top:2px solid #2c66db; width:100%; border-left:1px solid #dddddd; font-size:14px; text-align:center; border-collapse:collapse; margin:20px 0 20px 0; box-sizing:border-box;}
table.cStyle th {background:#f6f4f2; color:#333; line-height:24px; font-size:15px; padding:9px 5px; border-right:1px solid #dddddd; border-bottom:1px solid #dddddd;}
table.cStyle td {color:#555; padding:7px 5px; line-height:24px; border-right:1px solid #dddddd; border-bottom:1px solid #dddddd; }
table.cStyle td.bg {background:#f9f9f9; font-weight:bold; color:#888;}

p.cStyle { clear:both; font-size:14px; color: #555; margin: 5px 0; line-height: 20px; padding: 0 10px 0 15px; }
.ctop {width:100%; padding:10px 20px; background:#f9f9f9; border:1px solid #ddd; border-radius:10px; -webkit-box-shadow: 0px 1px 0px 0px rgba(221,221,221,1); -moz-box-shadow: 0px 1px 0px 0px rgba(221,221,221,1); box-shadow: 0px 1px 0px 0px rgba(221,221,221,1); box-sizing:border-box;}
.ctop p { font-size:14px; color:#555; }

p.cStyle2 {width:100%; padding:10px 20px; background:#f9f9f9; border:1px solid #ddd; border-radius:10px; -webkit-box-shadow: 0px 1px 0px 0px rgba(221,221,221,1); -moz-box-shadow: 0px 1px 0px 0px rgba(221,221,221,1); box-shadow: 0px 1px 0px 0px rgba(221,221,221,1); box-sizing:border-box; font-size:14px; margin-top:10px;}


.tapMenu2 { margin:20px 0 20px 0; }
.tapMenu2 ul { text-align:left; }
.tapMenu2 ul:after { content:""; display:block; clear:both; }
.tapMenu2 ul li { display:inline-block; margin-right:10px; position:relative; }
.tapMenu2 ul li a { display:block; width:100%; min-width:250px; height:40px;  background:#fff;  color:#6f9bcb; border:1px solid #6f9bcb;  text-align:center; line-height:40px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:14px; font-weight:bold; border-radius:5px; box-sizing:border-box; padding:0 11px; }
.tapMenu2 ul li.on a { color:#fff; background:#4fa7f1; }

.tapMenu3 { margin:20px 0 20px 0; }
.tapMenu3 ul { text-align:left; }
.tapMenu3 ul:after { content:""; display:block; clear:both; }
.tapMenu3 ul li { display:inline-block; margin-right:10px; position:relative; }
.tapMenu3 ul li a { display:block; width:100%; min-width:100px; height:40px;  background:#fff;  color:#1d97cb; border:1px solid #087cae;  text-align:center; line-height:40px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:15px; font-weight:bold;  box-sizing:border-box; padding:0 11px; border-radius:10px 10px 10px 0;}
.tapMenu3 ul li.on a { color:#fff; background:#1d97cb; }


/* 내용없음 */
.cm_no_conts {text-align:center; overflow:hidden; padding:50px 0 70px 0; margin:50px 0}
.cm_no_conts .no_icon {background:transparent url(../images/common/no_conts_page.png) center center no-repeat; height:100px;}
.cm_no_conts .gtxt {color:#999 !important; font-size:13px; letter-spacing:-1px;}

p.page_none { width:100%; height:310px; background:url(../images/sub/page_none.png) center top no-repeat; margin:40px auto; max-width:493px; text-indent:-99999px; }

/* 페이지네이트*/
.page_on {border:1px #248a2b solid; background:#31b049;}

.ibox{font-size:14px;border:1px solid #ddd;padding:5px;background-color:#f9f9f9;border-radius:10px; overflow:hidden; line-height:28px;}
.ibox div,.ibox dl,.ibox ul{padding:10px;border:1px dashed #ddd;background-color:#fff;border-radius:5px;overflow:hidden;}
.ibox div span{ color:#F00;}

.ibox dt{width:70%;float:left;}
.ibox dt a{display:block; line-height:28px;color:#000;}
.ibox dd{overflow:hidden; text-align:right;color:#777;}



/*/////////////////////////////////////////////////////////////////////////////////반응형/////////////////////////////////////////////////////////////////////////////////*/

@media all and (max-width:1024px) {


/*서브비주얼*/
#sub_visual {display:none;}
.visual_wrap { display:none; }
#container {margin:0px; width:100%; overflow:hidden; background:none; }


/*레프트메뉴*/
#left {display:none;}

#contentGroup {overflow:hidden; padding:0px; float:none; width:100%;}

#content {width:94%; clear:both; margin:30px auto;}

/*가이드박스*/
#guideGroup {height:auto; padding:0; border-top:1px solid #ddd; border-bottom:0 none;}
#guideGroup h3 {display:none;}
	
#guideGroup .guide { position:relative; width:100%; overflow:hidden; background:#f8f8f8; border-bottom:1px #ddd solid; top:0; box-sizing:border-box; padding:0 10px;}
#guideGroup .guide li{float:left; line-height:35px; padding: 0 13px 0 13px; background:url(../images/sub/guide_dot_m.png) left 13px no-repeat; font-size:14px; }
#guideGroup .guide li.first {padding:0 10px 0 0;background:none; }
#guideGroup .guide li.first a { position:relative; top:8px; }
#guideGroup .guide li.this {color:#666666;}
#guideGroup .page_config {display:none;}


/* 컨텐츠 공통 스타일 */

table.cStyle {font-size:12px;}
.tablebox { width:100%; overflow:auto; }
.tablebox table.cStyle { width:100%; min-width:580px; }


p.page_none { background-size:90%; }


}