@charset "utf-8";
/* 메인페이지 스타일만 정의 */


/* ********************************* PC over : 992 ~  ********************************* */
@media screen and (min-width:992px), print{
	
	/*공통::*/
	.headerH {height:80px;}
	.main {max-width:100%;}
	.main div[class*="-wrap"] {width:1200px; max-width:100%; margin:0 auto;}
	.main .slider div[class*="-wrap"] {z-index:99; position:relative;}
	
	/*공통::*/
	.main h3.tit {font-size:30px; font-weight:400; line-height:1; letter-spacing:-1.5px; color:#000;}
	.main p.tit-next {font-size:16px; line-height:1.6; letter-spacing:-1px; color:#999; padding-top:10px; word-break:keep-all;}
	
	/* 배너 */
	.bannerWrap {position:relative; height:820px; background:url(../images/main/main_bg.jpg)center top no-repeat;}
	.bannerWrap .subBg {position:absolute; bottom:0; left:50%; transform:translateX(-50%);}
	.bannerWrap h2 {font-size:80px; text-align:center; padding:150px 0 30px; letter-spacing:-5px; text-shadow:5px 5px 5px rgba(0,0,0,.1); font-weight:700;}
	.bannerWrap>p {font-size:18px; color:#fff; text-align:center;}
	.bannerWrap .btnWrap {
		position:absolute; z-index:99; width:560px; margin:0 auto; height:426px;
		background:url(../images/main/bg_clover.png)center top no-repeat; /*margin-top:314px;*/
		left:50%; bottom:0; transform:translateX(-50%);
	}
	.bannerWrap .btnWrap>a {position:absolute; margin:0 auto; display:block; color:#7cce82;}
	.bannerWrap .btnWrap>a.center {top:40px; left:50%; transform:translateX(-50%);}
	.bannerWrap .btnWrap>a.left {top:185px; left:35px; color:#3d9bfb;}
	.bannerWrap .btnWrap>a.right {top:185px; right:35px; color:#f24ab1;}
	.bannerWrap .btnWrap span {display:block; width:200px; height:70px; margin:0 auto;}
	.bannerWrap .btnWrap p {text-align:center; font-size:20px; font-weight:400; line-height:1; padding-top:15px;}
	.bannerWrap .btnWrap span.cal {background:url(../images/main/i-calendar.png)center bottom no-repeat;}
	.bannerWrap .btnWrap span.fac {background:url(../images/main/i-facility.png)center bottom no-repeat;}
	.bannerWrap .btnWrap span.talk {background:url(../images/main/i-school.png)center bottom no-repeat;}
	
	/* 알림마당 */
	.main .notice-wrap {padding:100px 0;}
	.main .notice-wrap>div {overflow:hidden; float:left; display:inline-block; width:50%;}
	
	.main .notice-wrap .notice {}
	.main .notice-wrap .notice>div {position:relative;}
	.main .notice-wrap .notice>div>a {position:absolute; top:0; right:0; border:1px solid #e5e5e5; background:#fff url(../images/common/i-plus.png)no-repeat center; border-radius:50%; width:52px; height:52px;}
	.main .notice-wrap .notice>div>a:hover {border:1px solid #d9d9d9; background-color:#f9f9f9;}
	.main .notice-wrap ul {padding-top:40px;}
	.main .notice-wrap ul li {position:relative; line-height:1;}
	.main .notice-wrap ul li+li {margin-top:10px;}
	.main .notice-wrap ul li a {
		display:inline-block; padding:30px 160px 30px 50px; width:100%; height:80px;
		border:1px solid #e5e5e5; background-color:#f7f7f7; border-radius:50px;
		position:relative;
	}
	.main .notice-wrap ul li a:hover {background:#ff9bb7; border:1px solid #ff9bb7;}
	.main .notice-wrap ul li a>* {line-height:1; font-weight:300;}
	.main .notice-wrap ul li a:hover>* {color:#fff !important;}
	.main .notice-wrap ul li a p {font-size:18px; color:#000; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
	.main .notice-wrap ul li a span {
		position:absolute; top:33px; right:40px;
		font-size:14px; color:#999;
	}
	
	.main .notice-wrap .golink {padding-left:50px;}
	.main .notice-wrap .golink>div+div {margin-top:50px;}
	.main .notice-wrap .golink>div {overflow:hidden;}
	.main .notice-wrap .golink>div>div {float:left;}
	.main .notice-wrap .golink>div>.img {width:300px;}
	.main .notice-wrap .golink>div>.img img {max-width:100%; border-radius:10px;}
	.main .notice-wrap .golink>div>.txt {padding-left:30px; width:calc(100% - 300px);}
	
	.main .notice-wrap .golink .link {margin-top:30px; display:inline-block; line-height:1; padding:10px 30px; border-radius:30px; border:1px solid #e5e5e5; font-size:14px; color:#999;}
	.main .notice-wrap .golink .link:hover {background:#ff9bb7; color:#fff; border:1px solid #ff9bb7;}
	
	/* 포토앨범 */
	.main .photoWrap {padding:100px 0; background:#f8f3ec;}
	.main .photoWrap .photo-wrap {}
	.main .photoWrap .photo-wrap>* {float:left; width:50%;}
	.main .photoWrap .photo-left {position:relative; padding-right:6px; border-radius:10px; color:#fff; height:590px; background-position:center center;}
	.main .photoWrap .photo-left .photoTit {padding-left:80px; position:relative; z-index:99; top:50px; left:50px;}
	.main .photoWrap .photo-left .photoTit:before {
		content:''; display:block; background:url(../images/main/i-heart.png)center left no-repeat;
		width:60px; height:50px; position:absolute; left:0; top:0;
	}
	.main .photoWrap .photo-left .photoTit h3 {font-size:30px; font-weight:400;}
	.main .photoWrap .photo-left .photoTit p {font-size:16px; opacity:.5;}
	.main .photoWrap .photo-left .photoDate {position:absolute; bottom:50px; left:0; padding-left:50px; z-index:99;}
	.main .photoWrap .photo-left .photoDate p {font-size:18px;}
	.main .photoWrap .photo-left .photoDate span {font-size:14px;}
	.main .photoWrap .photo-left .cover {position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,.4); transition:all .3s;}
	.main .photoWrap .photo-left:hover .cover {background:rgba(0,0,0,.1);}
	
	.main .photoWrap .photo-right {padding-left:50px;}
	.main .photoWrap .photo-right ul {width:100%; overflow:hidden;}
	.main .photoWrap .photo-right ul+ul {padding-top:30px;}
	.main .photoWrap .photo-right ul li {float:left; width:calc((100% - 30px)/2); border-radius:10px !important; overflow:hidden;}
	.main .photoWrap .photo-right ul li a span {transition:all .3s !important;}
	.main .photoWrap .photo-right ul li+li {margin-left:30px;}
	.main .photoWrap .photo-right ul li span {display:block; width:100%; height:180px; border-radius:10px 10px 0 0;}
	.main .photoWrap .photo-right ul li div {position:relative; z-index:9; padding:30px; background:#fff; border-radius:0 0 10px 10px; text-align:center; transition:all .3s;}
	.main .photoWrap .photo-right ul li div p {
		font-size:16px; line-height:1; color:#000;
		overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
	}
	.main .photoWrap .photo-right ul li div p.date {font-size:14px; color:#999; padding-top:10px;}
	.main .photoWrap .photo-right ul li a:hover span {transform:scale(1.1);}
	
	
	
	
}


/* ********************************* 모바일 ********************************* */
@media screen and (max-width:991px){
	
	/*공통::*/
	.headerH {height:0;}
	section.main {max-width:100%;}
	.main div[class*="-wrap"] {width:100%; max-width:100%; padding:0 20px;}
	.main .slider div[class*="-wrap"] {z-index:99; position:relative;}
	
	/*공통::*/
	.main h3.tit {font-size:24px; font-weight:400; line-height:1; letter-spacing:-1.2px; color:#000;}
	.main p.tit-next {font-size:15px; line-height:1.6; letter-spacing:-.5px; color:#999; padding-top:10px; word-break:keep-all;}
	
	/* 배너 */
	.bannerWrap {position:relative; height:520px; background:url(../images/main/main_bg.jpg)70% center /cover no-repeat; word-break:keep-all;}
	.bannerWrap .subBg {width:90%; position:absolute; bottom:0; left:50%; transform:translateX(-50%);}
	.bannerWrap .subBg img {width:100%;}
	.bannerWrap h2 {font-size:42px; text-align:center; padding:40px 20px 20px; letter-spacing:-5px; text-shadow:5px 5px 5px rgba(0,0,0,.1); line-height:1.2;}
	.bannerWrap>p {font-size:18px; color:#fff; text-align:center; padding:0 20px; line-height:1.4;}
	.bannerWrap .btnWrap {
		position:absolute; bottom:0; left:50%; z-index:99; width:280px; margin:0 auto; height:250px;
		background:url(../images/main/bg_clover.png)center top /100% no-repeat; transform:translateX(-50%);
	}
	.bannerWrap .btnWrap>a {position:absolute; margin:0 auto; display:block; color:#7cce82;}
	.bannerWrap .btnWrap>a.center {top:-5px; left:50%; transform:translateX(-50%);}
	.bannerWrap .btnWrap>a.left {top:84px; left:-42px; color:#3d9bfb;}
	.bannerWrap .btnWrap>a.right {top:84px; right:-42px; color:#f24ab1;}
	.bannerWrap .btnWrap span {display:block; width:200px; height:70px; margin:0 auto;}
	.bannerWrap .btnWrap p {text-align:center; font-size:14px; font-weight:400; line-height:1; padding-top:10px;}
	.bannerWrap .btnWrap span.cal {background:url(../images/main/i-calendar.png)center bottom /40px no-repeat;}
	.bannerWrap .btnWrap span.fac {background:url(../images/main/i-facility.png)center bottom /40px no-repeat;}
	.bannerWrap .btnWrap span.talk {background:url(../images/main/i-school.png)center bottom /40px no-repeat;}
	
	/* 알림마당 */
	.main .notice-wrap {padding:50px 20px !important;}
	.main .notice-wrap>div {overflow:hidden; float:left; display:inline-block; width:100%;}
	
	.main .notice-wrap .golink {margin-top:30px; padding-top:30px; border-top:1px dotted #ddd;}
	.main .notice-wrap .golink>div+div {margin-top:30px;}
	.main .notice-wrap .golink>div {overflow:hidden;}
	.main .notice-wrap .golink>div>div {float:left;}
	.main .notice-wrap .golink>div>.img {width:300px;}
	.main .notice-wrap .golink>div>.img img {max-width:100%; border-radius:10px;}
	.main .notice-wrap .golink>div>.txt {padding-left:30px; width:calc(100% - 300px); padding-right:50px;}
	
	.main .notice-wrap .golink .link {margin-top:30px; display:inline-block; line-height:1; padding:10px 30px; border-radius:30px; border:1px solid #e5e5e5; font-size:14px; color:#999;}
	.main .notice-wrap .golink .link:hover {background:#ff9bb7; color:#fff; border:1px solid #ff9bb7;}
	
	
	.main .notice-wrap .notice>div {position:relative;}
	.main .notice-wrap .notice>div>a {position:absolute; top:0; right:0; border:1px solid #e5e5e5; background:#fff url(../images/common/i-plus.png)no-repeat center; border-radius:50%; width:52px; height:52px;}
	.main .notice-wrap .notice>div>a:hover {border:1px solid #d9d9d9; background-color:#f9f9f9;}
	.main .notice-wrap ul {padding-top:20px;}
	.main .notice-wrap ul li {position:relative; line-height:1;}
	.main .notice-wrap ul li+li {margin-top:10px;}
	.main .notice-wrap ul li a {
		display:inline-block; padding:20px 100px 20px 30px; width:100%; height:60px;
		border:1px solid #e5e5e5; background-color:#f7f7f7; border-radius:50px;
		position:relative;
	}
	.main .notice-wrap ul li a:hover {background:#ff9bb7; border:1px solid #ff9bb7;}
	.main .notice-wrap ul li a>* {line-height:1; font-weight:300;}
	.main .notice-wrap ul li a:hover>* {color:#fff !important;}
	.main .notice-wrap ul li a p {font-size:18px; color:#000; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
	.main .notice-wrap ul li a span {
		position:absolute; top:21px; right:30px;
		font-size:14px; color:#999;
	}
	
	/* 포토앨범 */
	.main .photoWrap {padding:50px 0; background:#f8f3ec;}
	.main .photoWrap .photo-wrap {}
	.main .photoWrap .photo-wrap>* {width:100%;}
	.main .photoWrap .photo-left {position:relative; border-radius:10px; color:#fff; height:590px; background-position:center center;}
	.main .photoWrap .photo-left .photoTit {padding-left:40px; position:relative; z-index:99; top:40px; left:30px;}
	.main .photoWrap .photo-left .photoTit:before {
		content:''; display:block; background:url(../images/main/i-heart.png)center /100% no-repeat;
		width:30px; height:30px; position:absolute; left:0; top:0;
	}
	.main .photoWrap .photo-left .photoTit h3 {font-size:24px; font-weight:400;}
	.main .photoWrap .photo-left .photoTit p {font-size:14px; opacity:.5; padding-right:40px;}
	.main .photoWrap .photo-left .photoDate {position:absolute; bottom:40px; left:0; padding-left:30px; z-index:99;}
	.main .photoWrap .photo-left .photoDate p {font-size:16px;}
	.main .photoWrap .photo-left .photoDate span {font-size:14px;}
	.main .photoWrap .photo-left .cover {position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,.4);}
	
	.main .photoWrap .photo-right {padding-top:10px;}
	.main .photoWrap .photo-right ul {width:100%; overflow:hidden;}
	.main .photoWrap .photo-right ul+ul {padding-top:10px;}
	.main .photoWrap .photo-right ul li {float:left; width:calc((100% - 10px)/2); border-radius:10px !important;}
	.main .photoWrap .photo-right ul li+li {margin-left:10px;}
	.main .photoWrap .photo-right ul li span {display:block; width:100%; height:180px; border-radius:10px 10px 0 0;}
	.main .photoWrap .photo-right ul li div {padding:20px; background:#fff; border-radius:0 0 10px 10px; text-align:center;}
	.main .photoWrap .photo-right ul li div p {
		font-size:15px; line-height:1; color:#000;
		overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
	}
	.main .photoWrap .photo-right ul li div p.date {font-size:13px; color:#999; padding-top:10px;}
	
}


/* ********************************* 767이하 ********************************* */
@media screen and (max-width:767px){
	
	/* body {border:10px solid red;} */
	.main div[class*="-wrap"] {padding:0;}
	.main .quick-wrap {padding-top:75px !important;}
	.main .quick-wrap:before {width:280px; height:77px; margin-left:-140px;}
	.main .quick-wrap ul {border-radius:30px;}
	
	.main .notice-wrap .golink>div>div {width:100% !important;}
	.main .notice-wrap .golink>div>.img img {width:100% !important;}
	.main .notice-wrap .golink>div>.txt {padding:20px 0 0 !important;}
	.main .notice-wrap .golink .link {margin-top:10px;}
	
	.main .notice-wrap .golink>div+div {margin-top:20px; padding-top:30px; border-top:1px dotted #ddd;}
	
	/* 포토앨범 */
	.main .photoWrap {padding:50px 20px;}
	.main .photoWrap .photo-right ul {}
	
	
}


