@charset "utf-8";

/* 메인페이지 스타일만 정의 */
@media screen and (min-width: 992px) {
	.main .slider {height:750px;}
	.main .slider .slogan {position:absolute; width:100%; max-width:1200px; left:50%; top:50%; transform:translateX(-50%); color:#fff; font-size:56px; font-weight:400; letter-spacing:-1px; line-height:1.2;}
	.main .slider .slogan div {position:relative; text-shadow:5px 5px 5px rgba(0,0,0,.5); font-weight:600;}
	.main .slider .slogan div p {margin:0;}
	.main .slider .slogan div p:last-child {padding-left:295px;}
	.main .slider .slogan div p span {margin-left:30px; font-size:18px; line-height:1;}

	.main .rowWrap {position:relative; width:1200px; margin:0 auto; padding:80px 0;}
	.main .rowWrap>div {float:left; width:50%;}

	/* 공지사항 */
	.main .notice {position:relative; max-height:230px; width:50%;}
	.main .notice .tab {display:block; height:70px;}
	.main .notice .tab li {position:relative; float:left;}
	.main .notice .tab li+li {padding-left:20px; margin-left:20px;}
	.main .notice .tab li+li:before {content:""; display:block; width:1px; height:20px; position:absolute; left:0; top:0; background:#ddd;}
	.main .notice .tab li a {position:relative; font-size:22px; color:#000; line-height:1; font-weight:600;}
	.main .notice .tab li a:hover {color:#ae6f49;}
	.main .notice .tab li.on a {color:#ae6f49;}
	.main .notice .tab li.on a:after {content:""; display:block; width:100%; height:2px; background:#ae6f49; position:absolute; bottom:-3px;}
	.main .notice .tab_con {clear:both;}
	.main .notice .tab_con .box li {overflow:hidden;}
	.main .notice .tab_con .box li+li {margin-top:8px;}
	.main .notice .tab_con li>a {position:relative; width:calc(100% - 120px); padding:5px 0; float:left; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; line-height:1;}
	.main .notice .tab_con li>a:before {
		content:""; display:block; width:0px; height:2px; position:absolute; left:3px; top:12px; background:#000;
		transition:all .3s ease !important; -webkit-transition:all .3s ease !important; -moz-transition:all .3s ease !important;
	}
	.main .notice .tab_con li>a:hover {padding-left:15px;}
	.main .notice .tab_con li>a:hover:before {width:5px;}
	.main .notice .tab_con li>span {width:120px; float:left; text-align:right;}
	.main .notice .tab_con .more {position:absolute; top:-10px; right:0; width:35px; height:35px; line-height:1; text-align:center; padding-top:8px; font-size:18px; color:#999; border:1px solid #ddd;}
	.main .notice .tab_con .more:hover {border:1px solid #ae6f49; color:#000;}

	/* 퀵링크 */
	.main .quick {padding-left:100px;}
	.main .quick h2 {font-size:22px; line-height:1; height:70px;}
	.main .quick li {position:relative; display:block; float:left; width:calc((100% - 30px) / 4);}
	.main .quick li+li {margin-left:10px;}
	.main .quick li a {display:block; text-align:center;  font-size:18px; font-weight:400; color:#000;}
	.main .quick li a i {
		z-index:0; position:relative; display:block; margin-bottom:15px; overflow:hidden; background-size:50% !important; background-position:50%;
		transition:all .3s ease !important; -webkit-transition:all .3s ease !important; -moz-transition:all .3s ease !important;
	}
	.main .quick li a:hover i {z-index:1; box-shadow:10px 10px 10px rgba(0,0,0,.2); transform:scale(1.1);}
	.main .quick li:nth-child(1) i {background:#e2d8c7;}
	.main .quick li:nth-child(2) i {background:#dddbce;}
	.main .quick li:nth-child(3) i {background:#d6ddce;}
	.main .quick li:nth-child(4) i {background:#ceddd9;}

	/* 소개 */
	.main .rowWrap2 {width:100%; min-width:1200px;}
	.main .rowWrap2>* {width:50%; height:450px; float:left; overflow:hidden;}
	.main .intro {position:relative; width:50%; background:url(../images/main/intro_bg.jpg) no-repeat 100% 0; background-size:cover;}
	.main .intro:before {z-index:0; content:""; display:block; width:100%; height:100%; position:absolute; left:0; top:0; background:rgba(0,0,0,.3);}
	.main .intro .wrap {z-index:1; position:relative; float:right; max-height:450px; width:600px; color:#fff; padding-top:80px;}
	.main .intro .wrap p {font-size:36px; font-weight:600; line-height:1; margin-bottom:10px;}
	.main .intro .wrap ul {margin-top:80px;}
	.main .intro .wrap a {display:inline-block; padding:10px 20px; color:#fff; font-weight:400; border:1px solid #fff; background:rgba(0,0,0,.2) url(../images/main/icon_rightW.png) no-repeat 90% 42%; width:30%;}
	.main .intro .wrap a:hover {color:#000; background:#fff url(../images/main/icon_rightB.png) no-repeat 90% 42%; width:35%;}
	.main .intro .wrap li+li {margin-top:10px;}


	/* 산학기관 */
	.main .agent {background:#f7f7f7;}
	.main .agent .wrap {z-index:1; position:relative; max-height:450px; width:600px; padding:80px 0 0 100px;}
	.main .agent .wrap p {font-size:36px; font-weight:600; line-height:1; margin-bottom:10px;}
	.main .agent .wrap span {font-size:15px; letter-spacing:-.5px; }
	.main .agent .wrap ul {margin-top:60px;}
	.main .agent .wrap a {display:block; padding:10px 0; color:#000; font-weight:400; border-bottom:1px solid #ddd; background:url(../images/main/icon_rightB.png) no-repeat 100% 42%;}
	.main .agent .wrap a:hover {padding:10px 20px; color:#fff; border-bottom:1px solid #ae6f49; background:#ae6f49 url(../images/main/icon_rightW.png) no-repeat 90% 42%;}
	.main .agent .wrap li {float:left; width:45%;}
	.main .agent .wrap li:nth-child(2n) {margin-left:10%;}


	/* 갤러리 */
	.main .gallery {clear:both; width:1200px; margin:80px auto;}
	.main .gallery .head {position:relative; margin-bottom:30px;}
	.main .gallery .head h2 {display:inline-block; margin-right:30px; font-size:36px; font-weight:600; line-height:1;}
	.main .gallery .head .more {position:absolute; top:0; right:0; width:35px; height:35px; line-height:1; text-align:center; padding-top:8px; font-size:18px; color:#999; border:1px solid #ddd;}
	.main .gallery .head .more:hover {border:1px solid #ae6f49; color:#000;}

	.main .gallery .list>li {overflow:hidden; float:left; width:calc((100% - 75px) / 4);}
	.main .gallery .list>li+li {margin-left:25px;}
	.main .gallery .list a div {overflow:hidden;}
	.main .gallery .list a div i.img {display:block; width:100%; height:100%; transition:all 3s ease !important; -webkit-transition:all 3s ease !important; -moz-transition:all 3s ease !important; background-position:50%;}
	.main .gallery .list a p {margin:20px 0 10px; line-height:1.4;}
	.main .gallery .list a:hover i {transform:scale(1.2);}

	.main+footer {margin-top:0;}
}


  
@media screen and (max-width: 991px) {
	/* 메인페이지 스타일만 정의 */
	.main .slider {height:50vw;}
	.main .slider .slogan {position:absolute; width:100%; padding:0 7vw; max-width:100%; left:50%; top:50%; transform:translateX(-50%); color:#fff; font-size:5vw; font-weight:400; letter-spacing:-1px; line-height:1.2;}
	.main .slider .slogan div {position:relative; color:#fff; text-shadow:5px 5px 5px rgba(0,0,0,.5); font-weight:600;}
	.main .slider .slogan div p {margin:0;}
	.main .slider .slogan div p:last-child {padding-left:15vw;}
	.main .slider .slogan div p span {word-break:keep-all; margin-left:3vw; font-size:18px; line-height:1;}

	.main .rowWrap {position:relative; padding:50px 20px;}
	.main .rowWrap>div {}

	/* 공지사항 */
	.main .notice {position:relative;}
	.main .notice .tab {display:block; height:50px;}
	.main .notice .tab li {position:relative; float:left;}
	.main .notice .tab li+li {padding-left:10px; margin-left:10px;}
	.main .notice .tab li+li:before {content:""; display:block; width:1px; height:20px; position:absolute; left:0; top:0; background:#ddd;}
	.main .notice .tab li a {position:relative; font-size:20px; color:#000; line-height:1; font-weight:600;}
	.main .notice .tab li a:hover {color:#ae6f49;}
	.main .notice .tab li.on a {color:#ae6f49;}
	.main .notice .tab li.on a:after {content:""; display:block; width:100%; height:2px; background:#ae6f49; position:absolute; bottom:-3px;}
	.main .notice .tab_con {clear:both;}
	.main .notice .tab_con .box li {overflow:hidden;}
	.main .notice .tab_con .box li+li {margin-top:8px;}
	.main .notice .tab_con li>a {position:relative; width:calc(100% - 120px); padding:5px 0; float:left; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; line-height:1; font-weight:400;}
	.main .notice .tab_con li>a:before {
		content:""; display:block; width:0px; height:2px; position:absolute; left:3px; top:12px; background:#000;
		transition:all .3s ease !important; -webkit-transition:all .3s ease !important; -moz-transition:all .3s ease !important;
	}
	.main .notice .tab_con li>a:hover {padding-left:15px;}
	.main .notice .tab_con li>a:hover:before {width:5px;}
	.main .notice .tab_con li>span {width:120px; float:left; text-align:right;}
	.main .notice .tab_con .more {position:absolute; top:-10px; right:0; width:35px; height:35px; line-height:1; text-align:center; padding-top:8px; font-size:18px; color:#999; border:1px solid #ddd;}
	.main .notice .tab_con .more:hover {border:1px solid #ae6f49; color:#000;}

	/* 퀵링크 */
	.main .quick {position:relative; margin-top:30px; padding-top:30px;}
	.main .quick:before {content:""; position:absolute; left:-20px; top:0; width:calc(100% + 40px); border-top:1px solid #e5e5e5;}
	.main .quick h2 {font-size:20px; line-height:1; height:40px;}
	.main .quick li {position:relative; display:block; float:left; width:calc((100% - 30px) / 4);}
	.main .quick li+li {margin-left:10px;}
	.main .quick li a {display:block; text-align:center;  font-size:16px; font-weight:400; color:#000;}
	.main .quick li a i {
		z-index:0; position:relative; display:block; margin-bottom:10px; overflow:hidden; background-size:50% !important; border-radius:10px;  background-position:50%;
	}
	.main .quick li:nth-child(1) i {background:#e2d8c7;}
	.main .quick li:nth-child(2) i {background:#dddbce;}
	.main .quick li:nth-child(3) i {background:#d6ddce;}
	.main .quick li:nth-child(4) i {background:#ceddd9;}

	/* 소개 */
	.main .rowWrap2 {width:100%;}
	.main .rowWrap2>* {overflow:hidden;}
	.main .intro {position:relative; padding:50px 20px; background:url(../images/main/intro_bg.jpg) no-repeat 100% 0; background-size:cover; text-align:center;}
	.main .intro:before {z-index:0; content:""; display:block; width:100%; height:100%; position:absolute; left:0; top:0; background:rgba(0,0,0,.3);}
	.main .intro .wrap {z-index:1; position:relative; color:#fff;}
	.main .intro .wrap p {font-size:30px; color:#fff; font-weight:600; line-height:1; margin-bottom:10px;}
	.main .intro .wrap ul {margin-top:50px;}
	.main .intro .wrap ul li {display:inline-block;}
	.main .intro .wrap a {display:inline-block; padding:10px 60px 10px 20px; color:#fff; font-weight:400; border:1px solid #fff; background:rgba(0,0,0,.2) url(../images/main/icon_rightW.png) no-repeat 90% 42%;}


	/* 산하기관 */
	.main .agent {background:#f7f7f7; padding:50px 20px;}
	.main .agent .wrap {}
	.main .agent .wrap p {font-size:30px; font-weight:600; line-height:1; margin-bottom:10px;}
	.main .agent .wrap span {display:block; font-size:14px; color:#999; letter-spacing:-.5px; line-height:1.3;}
	.main .agent .wrap ul {margin-top:30px;}
	.main .agent .wrap a {display:block; padding:10px 0; color:#000; font-weight:400; border-bottom:1px solid #ddd; background:url(../images/main/icon_rightB.png) no-repeat 100% 42%;}
	.main .agent .wrap li {float:left; width:45%;}
	.main .agent .wrap li:nth-child(2n) {margin-left:10%;}


	/* 갤러리 */
	.main .gallery {clear:both; padding:50px 20px;}
	.main .gallery .head {position:relative; margin-bottom:30px;}
	.main .gallery .head h2 {font-size:30px; font-weight:600; line-height:1;}
	.main .gallery .head .more {position:absolute; top:-5px; right:0; width:35px; height:35px; line-height:1; text-align:center; padding-top:8px; font-size:18px; color:#999; border:1px solid #ddd;}
	.main .gallery .head .more:hover {border:1px solid #ae6f49; color:#000;}
	.main .gallery .head span {display:block; font-size:14px; color:#999; letter-spacing:-.5px; line-height:1.3;}

	.main .gallery .list>li {overflow:hidden; float:left; width:calc((100% - 75px) / 4);}
	.main .gallery .list>li+li {margin-left:25px;}
	.main .gallery .list a div {overflow:hidden;}
	.main .gallery .list a div i.img {display:block; width:100%; height:100%; background-position:50%;}
	.main .gallery .list a p {margin:20px 0 10px; line-height:1.4;}

	.main+footer {margin-top:0;}
		
}

@media screen and (max-width: 767px) {
	/* 갤러리 */
	.main .gallery .head {margin:0;}
	.main .gallery .head span {display:block; padding:10px 50px 0 0;}
	.main .gallery .list>li {overflow:hidden; float:left; width:calc((100% - 20px) / 2); margin-top:30px !important;}
	.main .gallery .list>li+li {margin:0;}
	.main .gallery .list>li:nth-child(2n) {margin-left:20px;}
	.main .gallery .list>li:nth-child(2n+1) {clear:both;}
	.main .gallery .list a p {margin:10px 0 5px; line-height:1.4; max-height:44px; overflow:hidden; text-overflow:ellipsis;}
}