
@media only screen and (max-width:1220px){
    #container .wrap{width:100%; margin: 0; padding: 0 2%;}
}

#header {position: absolute; top: 0; left: 0; width: 100%;}
#container{word-break:keep-all; position:relative; margin-top:222px;}

.visual{position:relative; width:100%; height:540px; overflow:hidden; box-sizing:content-box;} 
.visual .wrap {position:static}
.visual .list{position: absolute; top: 0; left:0; width: 100%; height: 100%;}
.visual .list .slide{width:100%; height:741px; background-repeat: no-repeat; background-position: center top;}
.visual .list .slide.bg1{background-image: url(../images/main/visual_img.jpg); background-size:auto 100%;}
.visual .list .slide.bg2{background-image: url(../images/main/visual_img.jpg); background-size:auto 100%;}
.visual .list .slide.bg3{background-image: url(../images/main/visual_img.jpg); background-size:auto 100%;}
.visual .list .slide a {width:100%; height:100%; display:inline-block; position:relative; z-index:10;}
.visual .slogan{display:none;position: absolute; top: 150px; right:54px;}
.visual .slogan .text {width: 413px; height: 191px; display:block; background:url(../images/main/main_sprite.png) no-repeat left -83px;}

.visual .control{position:absolute; bottom:30px; left:0px; width:100%; text-align:center; font-size:0px;}
.visual .control button{display:block; position:relative; display:inline-block;width:48px; height:48px; margin:0 6px; margin-left:1px;  text-align:center; line-height:45px;}
.visual .control button.play{display:none;}
.visual .control button:before{display:inline-block; background:url(../images/main/main_sprite.png) no-repeat; vertical-align:middle;}
.visual .control button.prev:before{width:48px; height:48px; background-position:left top;}
.visual .control button.pause:before{width:48px; height:48px; background-position:-58px top;}
.visual .control button.play:before{width:48px; height:48px; background-position:-115px top;}
.visual .control button.next:before{width:48px; height:48px; background-position:-174px top;}

@media screen and (max-width:1220px){
	#container {margin-top:83px}
	.visual{position:relative; width:100%; height:600px; } 
	.visual .list .slide{height:600px; background-size:auto 100%; background-position:60% top;}
	.visual .slogan{right: 5%; transform:scale(0.8); transform-origin:left top;}
	.visual .control{top: 380px;}
}
@media screen and (max-width:800px){
	.visual .slogan {right: 5%; top:100px;  transform: scale(0.6);   transform-origin: right top;}
	.visual .control {top:250px}
	.visual .list .slide {height:320px;}
	.visual{position:relative; width:100%; height:320px; } 

}
@media screen and (max-width:640px){
	.visual{ height:350px;} 
	.visual .list .slide{height:350px; background-position:52% top;}
	.visual .slogan{top: 63px; left: 12px; transform:scale(1);}
	.visual .slogan .large_text{ transform:scale(0.50); transform-origin:left top;}
	.visual .slogan .text{margin-top: -50px; transform:scale(0.7); transform-origin:left top;}
	.visual .control{top: 195px;}
}


/* 링크 */
.rowgroup1 {width:100%; margin:40px 0 50px}
.rowgroup1 ul {width:calc(100% + 20px); margin:0 0 0 -10px; display:inline-block}
.rowgroup1 ul li {width:25%; padding:0 10px; display:inline-block; float:left}
.rowgroup1 ul li a {width:100%; height:106px; display:inline-block; border-radius:6px; line-height:106px; text-align:center;}
.rowgroup1 ul li a span {font-size:17px; color:#262626}
.rowgroup1 ul li.li_1 a {background:#edecf8}
.rowgroup1 ul li.li_2 a {background:#f9ecec}
.rowgroup1 ul li.li_3 a {background:#f8e8f6}
.rowgroup1 ul li.li_4 a {background:#f7f3f3}
.rowgroup1 ul li a:before {width:52px; height:44px; margin:0 8px 0 0; display:inline-block; vertical-align:middle; background-repeat:no-repeat; background-image:url('../images/main/main_sprite.png')}
.rowgroup1 ul li.li_1 a:before {background-position:5px -315px}
.rowgroup1 ul li.li_2 a:before {background-position:-85px -315px}
.rowgroup1 ul li.li_3 a:before {background-position:-182px -315px}
.rowgroup1 ul li.li_4 a:before {background-position:-276px -315px}


@media screen and (max-width:1040px){
	.rowgroup1 ul li a {line-height:1.25em}
	.rowgroup1 ul li a:before {display:block; margin:18px auto 5px}
	.rowgroup1 ul li a span {}
}


/* 공지사항 */
.rowgroup2 .board{position:relative;  float:left; width:740px; }

.rowgroup2 .board h2 {margin-bottom:10px;  font-size:24px; color:#333;}
.rowgroup2 .board ul li:first-child {position:relative; border:1px solid #ebebeb; border-radius:7px; box-sizing:border-box; display:inline-block; width:100%; margin:0 0 5px 0}
.rowgroup2 .board ul li:first-child:before {display:none}
.rowgroup2 .board ul li:first-child a {padding:25px 30px 25px 125px; box-sizing:border-box; width:100%}
.rowgroup2 .board ul li:first-child a:before {position:absolute; top:22px; left:25px; width:69px; height:69px; border-radius:69px; display:block; background:url('../images/main/main_sprite.png') no-repeat 21px -367px #71a3e4;}
.rowgroup2 .board ul li:first-child a .title {width:100%; display:block; color:#333333; font-weight:bold; font-size:20px; letter-spacing:-0.025em;}
.rowgroup2 .board ul li:first-child a .text {width:100%; display:block; text-overflow: ellipsis; overflow: hidden; white-space: nowrap }
.rowgroup2 .board ul li {position:relative; display:inline-block; width:100%; box-sizing:border-box; padding:0 0 0 25px}
.rowgroup2 .board ul li:before {display:block; position:absolute; top:12px; left:9px; width:3px; height:3px; background:#767676;}
.rowgroup2 .board ul li a {display:block; float:left; width:calc(100% - 90px);  font-size: 17px; color:#333333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.rowgroup2 .board ul li .date{float:right; color:#6c6c6c; font-size:15px;}
.rowgroup2 .board .more{position:absolute; top:10px; right:0px; width:18px; height:18px; display:block; font-size:0px; background:url('../images/main/main_sprite.png') no-repeat -250px -26px;}





@media screen and (max-width:1220px){
	.rowgroup2 .board {width:calc(100% - 440px); margin:0 20px 0 0}
}
@media screen and (max-width:1000px){
	.rowgroup2 .board {width:calc(100% - 420px);}

}
@media only screen and (max-width:800px){
	.rowgroup2 .board {float: none; width:100%; max-width:640px; margin: 35px auto 0;}

}

/* 팝업존 */
.rowgroup2 .popup{float:right; position:relative; width:420px;}
.rowgroup2 .popup .section_title{margin-bottom:10px; font-size:24px; font-weight:600; color:#333;}
.rowgroup2 .popup .list{position:relative; height:226px;}
.rowgroup2 .popup .list .slide a{display:block; height:100%;}
.rowgroup2 .popup .list .slide img{display:inline-block; max-width:100%; max-height:100%; vertical-align:bottom;}
.rowgroup2 .popup .control{position:absolute; top:5px; right:0;}
.rowgroup2 .popup .control button,
.rowgroup2 .popup .control a{display: block; float: left; width:33px; height:33px; background:#000000; border-radius:33px; font-size:0; color:transparent; text-align: center; line-height: 33px;}
.rowgroup2 .popup .control button{margin-left: 5px;}
.rowgroup2 .popup .control button.play{display:none;}

.rowgroup2 .popup .control button:before,
.rowgroup2 .popup .control a:before{display:inline-block; width: 7px;  height: 13px; background:url(../images/main/main_sprite.png) no-repeat; vertical-align:middle;}
.rowgroup2 .popup .control button.prev:before{background-position:-232px top;}
.rowgroup2 .popup .control button.pause:before{ background-position: -280px top;}
.rowgroup2 .popup .control button.play:before{ width: 8px; background-position:-258px top; margin:0 0 0 1px}
.rowgroup2 .popup .control button.next:before{ background-position:-307px top;}

@media only screen and (max-width:1000px){
	.rowgroup2 .popup{width:45%;}
	.rowgroup2 .popup .list{height:auto;}
}
@media only screen and (max-width:800px){
	.rowgroup2 .popup{float: none; width:100%; max-width:640px; margin: 35px auto 0;}
	.rowgroup2 .popup .list{height:auto;}
	.rowgroup2 .popup .slick-slide {text-align:center;}
}
@media only screen and (max-width:640px){
	.rowgroup2 .popup {margin-top: 36px;}
	.rowgroup2 .popup .section_title{margin-bottom: 35px; font-size: 18px; line-height: 1;}
	.rowgroup2 .popup .control a{width: 34px; height: 34px; line-height: 32px;}
}



/* .rowgroup3 */
.rowgroup3 {position: relative; width:100%; height:560px; background:#f2f3f4; margin: 82px auto 0;  background:url('../images/main/rowgroup3_bg.gif') no-repeat center bottom #f2f3f4;}
.rowgroup3 .link_area {position:absolute; top:65px; left:0px; width:280px}
.rowgroup3 .edu_info{position:relative;}
.rowgroup3 .edu_info .title_area {text-align:center; padding:65px 0 42px}
.rowgroup3 .edu_info .title_area h2 img {height:35px}

.rowgroup3 .edu_info .link_area a {position:relative; width:50%; height:40px; line-height:40px; text-align:left; padding:0 0 0 15px; font-size:15px; font-weight:600; display:inline-block; box-sizing:border-box; color:#fff; float:left;}
.rowgroup3 .edu_info .link_area a:before {display:block;  position:absolute; top:16px; right:16px; width:4px; height:7px; background:url(../images/main/main_sprite.png) no-repeat -360px -347px}
.rowgroup3 .edu_info .link_area a.btn_1 {background:#143fbb}
.rowgroup3 .edu_info .link_area a.btn_2 {background:#252525}


.rowgroup3 .edu_info .control button{position:absolute; top:300px; display: inline-block; width:22px; height:41px; font-size:0; background-image:url(../images/main/main_sprite.png); background-repeat:no-repeat; color:transparent; text-align: center; }

.rowgroup3 .edu_info .control button.prev{background-position:-100px -380px; left:-65px;}
.rowgroup3 .edu_info .control button.next{background-position:-148px -380px; right:-65px;}
.rowgroup3 .edu_info .list{position:relative; height:340px; }
.rowgroup3 .edu_info .list .slide{ padding-top: 27px;}
.rowgroup3 .edu_info .list .slide a{display:block; position: relative; width:280px; max-width:calc(100% - 10px); margin: 0 auto; background-color: #fff; color:#444; text-decoration:none; transition:all 0.2s linear;}


.rowgroup3 .edu_info .list .slide{padding-top: 0;}
.rowgroup3 .edu_info .list .slide a{height: 340px; border: 1px solid #dadada; border-radius:9px}
.rowgroup3 .edu_info .list .slide .text_area{position: relative; padding:20px 25px; box-sizing:border-box; background: none;}
.rowgroup3 .edu_info .list .slide .text_area:before{position:absolute; top:0px; right:0px; display:block; width:37px; height:37px; background:url(../images/main/main_sprite.png) no-repeat -45px -383px #2e2d28}
.rowgroup3 .edu_info .list .slide .text_area span{display:block; width:100%;  text-decoration:none; transition:color 0.2s linear; transition-delay:0.2s;}

.rowgroup3 .edu_info .list .slide .text_area span.cate { font-size:15px; color:#00542f; line-height: 1.3;}
.rowgroup3 .edu_info .list .slide .text_area span.title{overflow:hidden; height:46px; font-size:18px; color:#262626; line-height: 1.3; margin:10px 0;}
.rowgroup3 .edu_info .list .slide .text_area span.date{font-size:15px; color:#616161; line-height:16px; letter-spacing:-0.025em}

@media only screen and (max-width:1200px){
	.rowgroup3 .edu_info .list {width: calc(100% + 30px); }
}


/* .rowgroup4 */
.rowgroup4{padding: 60px 0 85px; background:url('../images/main/rowgroup3_bg.jpg') no-repeat center top;}
.rowgroup4 .info_tab{position: relative; z-index: 10; text-align:center;}
.rowgroup4 .info_tab .tab_item li {display:inline-block; width:224px; height:46px; display:inline-block; text-align:center; }
.rowgroup4 .info_tab .tab_item li button{display: block; width: 100%; height:100%;  box-sizing:border-box; background:#000;  font-size: 20px; font-weight: 600; color: #fff; border-radius:46px;}
.rowgroup4 .info_tab .tab_item li.active button{ position:relative; background-color: #fff; color: #333; font-size:22px;}
.rowgroup4 .info_tab .tab_item li.active button:before {display:block; width:10px; height:10px; background:#fff; position:absolute; bottom:-5px; left:50%; margin:0 0 0 -5px; transform: rotate( 45deg );}

.rowgroup4 .info_tab .tab_obj{display: none; position: relative; padding:62px 0 0 0; width:calc(100% + 30px); }


.rowgroup4 .info_tab .tab_obj .list .slide{display: block; overflow: hidden; width: 280px; margin:0 15px; background-color: #fff;}
.rowgroup4 .info_tab .tab_obj .list .slide .img_area {border:8px solid #fff; width:100%; border-bottom:none}
.rowgroup4 .info_tab .tab_obj .list .slide .img_area img {width:100%}
.rowgroup4 .info_tab .tab_obj .list .slide .text_area {position:relative; width:100%; height:110px; padding:20px 30px 15px; box-sizing:border-box; border:8px solid #f2b10b; border-top:none}
.rowgroup4 .info_tab .tab_obj .list .slide .text_area:before {position:absolute; top:0px; right:-8px; width:8px; height:45px; background:#fff; display:block;}
.rowgroup4 .info_tab .tab_obj .list .slide .text_area .title {font-size:18px; color:#333; line-height:1.15em; display:block; height:42px; overflow:hidden}
.rowgroup4 .info_tab .tab_obj .list .slide .text_area .date {font-size:15px; color:#777777; display:block; margin:5px 0 0 0}


@media only screen and (max-width:800px){
	.rowgroup3 .link_area {position:relative; top:auto; left:auto; margin:0 auto; width:280px; display:inline-block;}
	.rowgroup3 {height:580px}
}




@media only screen and (max-width:640px){
	.rowgroup4 .info_tab .tab_item li {width:145px; height:35px;}
	.rowgroup4 .info_tab .tab_item li button {font-size:16px;}
	.rowgroup4 .info_tab .tab_item li.active button {font-size:16px;}
}