@charset "utf-8";
/* 메인페이지 스타일만 정의 */


/* ********************************* PC over : 992 ~  ********************************* */
@media screen and (min-width:992px), print{
	
	/*공통::*/
	.headerH {height:80px;}
	section[class*="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;}
	
	
	/*섹션별::배경*/
	section.main {
		width:100%;
		background-repeat:no-repeat;
		background-position:center;
		background-size:cover;
		position:relative;
	}
	section.main:before {
		position:absolute; top:0; left:0; width:100%; height:100%; display:block; content:"";
		z-index:-1;
		background-position:center;
		background-repeat:no-repeat;
		background-size:cover;
	}
	
	.main.slogan {height:780px; background-image:url(../images/main/main-1-img.png); background-attachment:fixed; background-size:contain;}
	.main.slogan:before {
		background-image:url(../images/main/main-1-bg.jpg);
		background-position:right bottom;
	}
	
	.main.notice {height:895px; background-image:url(../images/main/main-2-img.png); background-attachment:fixed; background-size:contain;}
	.main.notice:before {
		background:url(../images/main/main-2-bg.jpg);
	}
	
	.main.quick {padding:100px 0;}
	.main.quick:before {
		background-image:url(../images/main/main-3-bg.jpg);
		background-position:right bottom; 
	}
	
	/*개별::슬라이더*/
	.main .visual {width:1200px; margin:0 auto; height:780px; position:relative;}
	.main .visual .sliderObj li {width:600px; height:600px; top:50%; margin-top:-300px; box-shadow:20px 20px 20px rgba(0,0,0,.2);}
		
	.main .visual .txt-wrap {position:absolute; top:50%; right:0; width:600px; height:600px; text-align:center; color:#fff; margin-left:50%; margin-top:-300px;}
	.main .visual .txt-wrap h2 {
		padding-top:130px;
		font-size:100px; font-weight:500; letter-spacing:-.3vw; line-height:1;
		font-family:"CookieRun", sans-serif; text-shadow:3px 3px 3px rgba(0,0,0,.1);
	}
	.main .visual .txt-wrap h2 span {font-size:70px; margin-top:30px;}
	.main .visual .txt-wrap p {font-size:18px; letter-spacing:-.05vw; line-height:1.6; padding-top:50px;}
	
	
	/* 알림마당 */
	.main.notice .notice-wrap {
		background:#fff; height:100px; box-shadow:20px 20px 20px rgba(0,0,0,.1);
		position:absolute; top:-50px; left:50%; margin-left:-600px;
		padding-left:250px; padding-right:150px;
	}
	.main.notice .notice-wrap>* {display:inline-block; float:left;}
	.main.notice .notice-wrap h3 {font-size:24px; font-weight:300; line-height:1.6; color:#000; width:200px; padding-left:40px; background:url(../images/main/i-notice.png)no-repeat left 0; position:absolute; top:30px; left:50px;}
	.main.notice .notice-wrap>a.more {position:absolute; top:0; right:0; width:100px; height:100px; background:#11423f url(../images/main/i-more.png)no-repeat center; z-index:7;}
	
	.main.notice .notice-wrap .slider {width:100%;}
	.main.notice .notice-wrap .slider:before {}
	.main.notice .notice-wrap .slider ul {height:100px; line-height:100px;}
	.main.notice .notice-wrap .slider ul:before {position:absolute; top:38px; left:0; display:block; content:""; background:#ccc; height:24px; width:1px;}
	.main.notice .notice-wrap .slider ul li a {font-size:20px; font-weight:300; color:#000; display:block; position:relative; padding-left:50px; padding-right:150px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
	.main.notice .notice-wrap .slider ul li a span {position:absolute; top:0; right:0; font-size:18px; color:#999;}
	
	/* 포토앨범 */
	.main .photo-wrap {position:relative; padding:100px 0;}
	.main .photo-wrap h3 {font-family:"CookieRun", sans-serif; text-shadow:3px 3px 3px rgba(0,0,0,.1); text-align:center; font-size:70px; color:#fff; letter-spacing:-.2vw;}
	.main .photo-wrap article {margin-top:40px;}
	.main .photo-wrap article>div {float:left; width:50%;}
	.main .photo-wrap article>div a {background:#fff; display:inline-block; position:relative;}
	.main .photo-wrap article>div a:before {position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.2); display:block; content:""; transition-duration:.3s !important;}
	.main .photo-wrap article>div a:hover:before {background:rgba(0,0,0,.6);}
	.main .photo-wrap article>div a:after {position:absolute; top:30px; left:30px; width:34px; height:30px; background:url(../images/common/i-luv.png)no-repeat center; display:block; content:"";}
	.main .photo-wrap article>div.photo-1 a {float:left; width:280px; margin-left:20px; height:280px;}
	.main .photo-wrap article>div.photo-1 a:nth-child(2)~a {margin-top:20px;}
	.main .photo-wrap article>div.photo-2 {padding:0 20px;}
	.main .photo-wrap article>div.photo-2 a {width:100%; height:580px;}
	.main .photo-wrap article>div.photo-2 a .img {height:580px !important;}
	
	.main .photo-wrap article>div a .txt {display:none; transition-duration:.3s !important;}
	.main .photo-wrap article>div a:hover .txt {display:block; position:absolute; top:50%; left:0; margin-top:-52.5px; width:100%; padding:0 80px; text-align:center; color:#fff; font-weight:300;}
	.main .photo-wrap article>div a .txt>span {line-height:1; display:block;}
	.main .photo-wrap article>div a .txt .yyyymm {font-size:14px;}
	.main .photo-wrap article>div a .txt .dd {font-size:40px; font-weight:700; margin-top:5px;}
	.main .photo-wrap article>div a .txt p {font-size:20px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; margin-top:10px;}
		
	
	
	
	/* 퀵메뉴 */
	.main.quick .quick-wrap h3.tit {font-family:"CookieRun", sans-serif; font-size:26px; color:#000; letter-spacing:-.05vw;}
	.main.quick .quick-wrap p.tit-next {font-size:16px; color:#555; line-height:1.4; word-break:keep-all; letter-spacing:-.05vw; margin-top:30px;}
	
	.main.quick .quick-wrap {box-shadow:20px 20px 20px rgba(0,0,0,.1);}
	.main.quick .quick-wrap .inBox {float:left; display:inline-block; width:50%; background:#fff; padding:50px 40px 50px 50px;}
	.main.quick .quick-wrap .inBox:nth-child(odd) {border-right:1px solid #e5e5e5;}
	.main.quick .quick-wrap .inBox:nth-child(2)~.inBox {border-top:1px solid #e5e5e5;}
	
	.main.quick .quick-wrap .inBox .box {display:table; width:100%;}
	.main.quick .quick-wrap .inBox .box>* {display:table-cell; vertical-align:top;}
	.main.quick .quick-wrap .inBox .box>article {width:210px; border-right:1px dashed #d9d9d9;}
	.main.quick .quick-wrap .inBox .box>div {width:calc(100% - 210px); padding-left:40px;}
	
	.main.quick .quick-wrap .inBox .box>div ul.link {margin-top:30px;}
	.main.quick .quick-wrap .inBox .box>div ul.link li+li {margin-top:15px;}
	.main.quick .quick-wrap .inBox .box>div ul.link li {line-height:1;}
	.main.quick .quick-wrap .inBox .box>div ul.link li a {
		font-size:20px; color:#000; letter-spacing:-.05vw; line-height:1.2;
		display:inline-block; width:100%;
		background-repeat:no-repeat;
		background-position:calc(100% - 10px) center;
	}
	.main.quick .quick-wrap .inBox .box>div ul.link li a:hover {background-position:100% center;}
	
	.main.quick .quick-wrap .inBox.type-olive .box>div ul.link li a {background-image:url(../images/main/arrow-right-olive.png);}
	.main.quick .quick-wrap .inBox.type-olive .box>div ul.link li a:hover {color:#81a944;}
	.main.quick .quick-wrap .inBox.type-mustard .box>div ul.link li a {background-image:url(../images/main/arrow-right-mustard.png);}
	.main.quick .quick-wrap .inBox.type-mustard .box>div ul.link li a:hover {color:#f6c800;}
	
	
	
	
	
	
	
	
	
	

	
	
}


/* ********************************* 모바일 ********************************* */
@media screen and (max-width:991px){
	
	body {overflow-x:hidden;}
	
	/*공통::*/
	.headerH {height:0;}
	section[class*="main"] {max-width:100%;}
	.main div[class*="-wrap"] {width:100%; max-width:100%; margin:0 auto;}
	.main .slider div[class*="-wrap"] {z-index:99; position:relative;}
	
	
	/*섹션별::배경*/
	section.main {
		width:100%;
		background-repeat:no-repeat;
		background-position:center;
		background-size:cover;
		position:relative;
	}
	section.main:before {
		position:absolute; top:0; left:0; width:100%; height:100%; display:block; content:"";
		z-index:-1;
	}
	
	.main.slogan {
		background-image:url(../images/main/main-1-img.png), url(../images/main/main-1-img2.png);
		background-attachment:fixed, fixed;
		background-size:120%, 150%;
		background-position:left 100px, right bottom;
	}
	.main.slogan:before {
		background-image:url(../images/main/main-1-onlyBg.jpg);
		background-position:center;
	}
	.main.notice {
		background-image:url(../images/main/main-2-img.png), url(../images/main/main-2-img2.png);
		background-attachment:fixed, fixed;
		background-size:150%, 150%;
		background-position:right top, bottom left;
	}
	.main.notice:before {
		background-color:#ffd723;
	}
	
	.main.quick {padding:30px 20px;}
	.main.quick:before {
		background-image:url(../images/main/main-3-onlyBg.jpg);
		background-position:right bottom;
		background-size:cover;
	}
	
	/*개별::슬라이더*/
	.main .visual {width:100%; height:850px; position:relative;}
	.main .visual .sliderObj li {width:80%; height:400px; top:120px; left:50%; margin-left:-40%; box-shadow:10px 10px 10px rgba(0,0,0,.2);}
		
	.main .visual .txt-wrap {position:absolute; top:560px; left:50%; width:80%; height:auto; text-align:center; color:#fff; margin-left:-40%;}
	.main .visual .txt-wrap h2 {
		font-size:80px; font-weight:500; letter-spacing:-.3vw; line-height:1;
		font-family:"CookieRun", sans-serif; text-shadow:3px 3px 3px rgba(0,0,0,.1);
	}
	.main .visual .txt-wrap h2 span {font-size:60px; margin-top:20px; display:block;}
	.main .visual .txt-wrap p {font-size:16px; letter-spacing:-.05vw; line-height:1.6; padding-top:30px;}
	
	
	/* 알림마당 */
	.main.notice .notice-wrap {
		background:#fff; width:100%; height:100px; box-shadow:10px 10px 10px rgba(0,0,0,.1);
	}
	.main.notice .notice-wrap>* {display:inline-block; float:left;}
	.main.notice .notice-wrap h3 {font-size:24px; font-weight:300; line-height:1.6; color:#000; width:200px; padding-left:40px; background:url(../images/main/i-notice.png)no-repeat left 0; position:absolute; top:30px; left:30px;}
	.main.notice .notice-wrap>a.more {position:absolute; top:0; right:0; width:100px; height:100px; background:#11423f url(../images/main/i-more.png)no-repeat center; z-index:7;}
	
	.main.notice .notice-wrap .slider {width:calc(100% - 200px - 100px) !important; margin-left:200px; margin-right:100px;}
	.main.notice .notice-wrap .slider ul {height:100px; line-height:100px;}
	.main.notice .notice-wrap .slider ul:before {position:absolute; top:38px; left:0; display:block; content:""; background:#ccc; height:24px; width:1px;}
	.main.notice .notice-wrap .slider ul li {left:0;}
	.main.notice .notice-wrap .slider ul li a {font-size:20px; font-weight:300; color:#000; display:block; position:relative; padding-left:30px; padding-right:150px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
	.main.notice .notice-wrap .slider ul li a span {position:absolute; top:0; right:30px; font-size:18px; color:#999;}
	
	/* 포토앨범 */
	.main .photo-wrap {position:relative; padding:50px 0;}
	.main .photo-wrap h3 {font-family:"CookieRun", sans-serif; text-shadow:1px 1px 1px rgba(0,0,0,.1); text-align:center; font-size:50px; color:#fff; letter-spacing:-.2vw;}
	.main .photo-wrap article {margin-top:50px;}
	.main .photo-wrap article>div {float:left; width:100%; padding-right:20px;}
	.main .photo-wrap article>div a {background:#fff; display:inline-block; position:relative;}
	.main .photo-wrap article>div a:before {position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.2); display:block; content:""; transition-duration:.3s !important;}
	.main .photo-wrap article>div a:hover:before {background:rgba(0,0,0,.6);}
	.main .photo-wrap article>div a:after {position:absolute; top:30px; left:30px; width:34px; height:30px; background:url(../images/common/i-luv.png)no-repeat center; display:block; content:"";}
	.main .photo-wrap article>div.photo-1 a {float:left; width:calc(50% - 20px); margin-left:20px;}
	.main .photo-wrap article>div.photo-1 a:nth-child(2)~a {margin-top:20px;}
	.main .photo-wrap article>div.photo-2 {padding:0 20px; margin-top:20px;}
	.main .photo-wrap article>div.photo-2 a {width:100%;}
	
	.main .photo-wrap article>div a .txt {display:none; transition-duration:.3s !important;}
	.main .photo-wrap article>div a:hover .txt {display:block; position:absolute; top:50%; left:0; margin-top:-52.5px; width:100%; padding:0 80px; text-align:center; color:#fff; font-weight:300;}
	.main .photo-wrap article>div a .txt>span {line-height:1; display:block;}
	.main .photo-wrap article>div a .txt .yyyymm {font-size:14px;}
	.main .photo-wrap article>div a .txt .dd {font-size:40px; font-weight:700; margin-top:5px;}
	.main .photo-wrap article>div a .txt p {font-size:20px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; margin-top:10px;}
		
	
	
	
	/* 퀵메뉴 */
	.main.quick .quick-wrap h3.tit {font-family:"CookieRun", sans-serif; font-size:24px; color:#000; letter-spacing:-.05vw; padding-top:100px; position:relative;}
	.main.quick .quick-wrap p.tit-next {font-size:14px; color:#555; line-height:1.4; word-break:keep-all; letter-spacing:-.05vw; margin-top:20px; height:38px; overflow:hidden;}
	
	.main.quick .quick-wrap {box-shadow:5px 5px 5px rgba(0,0,0,.1); position:relative; padding-top:80px;}
	.main.quick .quick-wrap:before {
		position:absolute; top:0; left:50%; display:block; content:""; margin-left:-43.5px;
		background:url(../images/common/img-tree3.png)no-repeat center; background-size:cover;
		width:97px; height:80px;
	}
	.main.quick .quick-wrap .inBox {float:left; display:inline-block; width:50%; background:#fff; padding:30px 30px 50px 40px; overflow:hidden;}
	.main.quick .quick-wrap .inBox:nth-child(odd) {border-right:1px solid #e5e5e5;}
	.main.quick .quick-wrap .inBox:nth-child(2)~.inBox {border-top:1px solid #e5e5e5;}
	
	.main.quick .quick-wrap .inBox h3.tit:before {display:block; content:""; position:absolute; top:0; left:0; width:80px; height:80px; background-size:cover; background-repeat:no-repeat; border-radius:50%; border:2px dashed #e5e5e5;}
		.main.quick .quick-wrap .inBox:nth-child(1) h3.tit:before {background-image:url(../images/main/link-1-s.png);}
		.main.quick .quick-wrap .inBox:nth-child(2) h3.tit:before {background-image:url(../images/main/link-2-s.png);}
		.main.quick .quick-wrap .inBox:nth-child(3) h3.tit:before {background-image:url(../images/main/link-3-s.png);}
		.main.quick .quick-wrap .inBox:nth-child(4) h3.tit:before {background-image:url(../images/main/link-4-s.png);}
	
	.main.quick .quick-wrap .inBox .box>* {display:inline-block; float:left; width:100%;}
	.main.quick .quick-wrap .inBox .box>article {display:none;}
	
	.main.quick .quick-wrap .inBox .box>div ul.link {margin-top:30px;}
	.main.quick .quick-wrap .inBox .box>div ul.link li+li {margin-top:15px;}
	.main.quick .quick-wrap .inBox .box>div ul.link li {line-height:1;}
	.main.quick .quick-wrap .inBox .box>div ul.link li a {
		font-size:18px; color:#000; letter-spacing:-.05vw; line-height:1.2;
		display:inline-block; width:100%;
		background-repeat:no-repeat;
		background-position:calc(100% - 10px) center;
	}
	.main.quick .quick-wrap .inBox .box>div ul.link li a:hover {background-position:100% center;}
	
	.main.quick .quick-wrap .inBox.type-olive .box>div ul.link li a {background-image:url(../images/main/arrow-right-olive.png);}
	.main.quick .quick-wrap .inBox.type-olive .box>div ul.link li a:hover {color:#81a944;}
	.main.quick .quick-wrap .inBox.type-mustard .box>div ul.link li a {background-image:url(../images/main/arrow-right-mustard.png);}
	.main.quick .quick-wrap .inBox.type-mustard .box>div ul.link li a:hover {color:#f6c800;}
	
	
	
	
	
	
	
	
	
	
	
	
	
}


/* ********************************* 767이하 ********************************* */
@media screen and (max-width:767px){
	
	/* body {border:10px solid red;} */
	.main.slogan {background-size:200%, 250%;}
	
	.main .visual {height:700px;}
	.main .visual .sliderObj li {height:300px;}
	.main .visual .txt-wrap {top:460px; word-break:keep-all;}
	.main .visual .txt-wrap h2 {font-size:50px;}
	.main .visual .txt-wrap h2 span {font-size:30px;}
	.main .visual .txt-wrap p {font-size:14px;}
	
	.main.notice .notice-wrap {height:80px; background:#fff url(../images/main/i-notice.png)no-repeat 30px 23px;}
	.main.notice .notice-wrap>a.more,
	.main.notice .notice-wrap h3 {display:none;}
	
	.main.notice .notice-wrap .slider {width:calc(100% - 80px) !important; margin-left:60px; margin-right:20px;}
	.main.notice .notice-wrap .slider ul {height:80px; line-height:80px;}
	.main.notice .notice-wrap .slider ul:before,
	.main.notice .notice-wrap .slider ul li a span {display:none;}
	
	.main.notice .notice-wrap .slider ul li a {padding:0; font-size:17px;}
	
	.main .photo-wrap {padding:30px 0;}
	.main .photo-wrap h3 {font-size:40px;}
	.main .photo-wrap article {margin-top:30px;}
	.main .photo-wrap article>div.photo-1 a {width:calc(100% - 20px);}
	.main .photo-wrap article>div.photo-1 a+a {margin-top:20px;}
	
	.main.quick .quick-wrap .inBox {width:100%; padding:30px;}
	.main.quick .quick-wrap .inBox+.inBox {border-top:1px solid #e5e5e5;}
	.main.quick .quick-wrap h3.tit {padding-top:80px;}
	.main.quick .quick-wrap .inBox h3.tit:before {width:60px; height:60px;}
	
	
}