﻿@charset "utf-8";

 @import url(common.css);
 
#container { position: relative; height: 100%}
#container:after { display: block; content: ""; clear: both; }

.main_content {position: relative;width: 1200px;margin: -107px auto 0;padding:0 0 40px;z-index: 7;}
.main_content:after { display: block; content: ""; clear: both; }

/* 메인비주얼 */
.main_visual{ position: relative; width: 100%; height:558px;  background: url('/images/template/00053/main/m_visual.png') no-repeat center 0 }
.main_visual .slogan { width:1200px; padding:220px 0 0; margin:0 auto; 
						-webkit-animation:move 0.8s  ease; -moz-animation:move 0.8s  ease; -o-animation:move 0.8s  ease; -ms-animation:move 0.8s  ease; animation:move 0.8s  ease;}
.main_visual .slogan h2{ font-size:50px; font-family: 'NanumBold'; color:#fff; letter-spacing:-1px; margin-bottom:10px}
.main_visual .slogan p{font-family: 'Nanum'; font-size:20px; line-height:30px; color:#fff; letter-spacing:-1px}


@-webkit-keyframes move {
	0% {transform:translateY(100px); opacity:0;}
	100% {transform:translateY(0); opacity:1;}
}
@-moz-keyframes move {
	0% {transform:translateY(100px); opacity:0;}
	100% {transform:translateY(0); opacity:1;}
}
@-o-keyframes move {
	0% {transform:translateY(100px); opacity:0;}
	100% {transform:translateY(0); opacity:1;}
}
@-ms-keyframes move {
	0% {transform:translateY(100px); opacity:0;}
	100% {transform:translateY(0); opacity:1;}
}
@keyframes move {
	0% {transform:translateY(100px); opacity:0;}
	100% {transform:translateY(0); opacity:1;}
}

/* 공지사항 */
.notice {position:relative;float:left;padding:20px 30px 0;width: 640px;height: 244px;border:1px solid #d4d4d4;background:#fff;margin-bottom: 15px;}
.notice h2 { font-size: 24px; font-family: 'NanumBold'}
.notice h2 a { position: absolute; display: block; top: 31px; text-align: center; color: #828fa4; background:url(/images/template/00053/main/noti_bg.gif) no-repeat left center}
.notice h2 a:hover { text-decoration:underline}
.notice h2.tit_1 a { width:121px; left: 11px; background:none }
.notice h2.tit_2 a { width:127px; left: 132px; }
.notice h2.tit_3 a { width:145px; left: 259px; }
.notice h2 a.current {color: #333}
.notice .list_box.on { display: block; }
.notice .list_box { display: none; padding: 60px 0 0; overflow: hidden; }
.notice .list_box li { position: relative; font-family: 'Nanum'; line-height: 31px; font-size: 16px; overflow: hidden; }
.notice .list_box li a { display: block; width: 70%; float: left; padding-left: 13px; color: #4b5970; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background: url("/images/template/00053/main/noti_dot.gif") no-repeat 0 13px; }
.notice .list_box li a:hover { text-decoration: underline; }
.notice .list_box li span.date { display: block; width: 25%; float: right; text-align: right; color: #4b5970; font-size: 14px; line-height: 31px; }
.notice .btn_more { position: absolute; width: 28px; height: 28px; right: 29px; top: 33px; text-indent: -9999em; line-height: 0; font-size: 0; background: url(/images/template/00053/main/btn_more.png) no-repeat; }
.notice .btn_more:hover {transition:transform 300ms ease-in-out 0s; transform:rotate(360deg);}


/* 갤러리 */
.gallery {position:relative;float:left;padding:31px 29px 0;width: 426px;height: 233px;border:1px solid #d4d4d4;background:#fff;margin-left:12px;margin-bottom:  15px;}  
.gallery h2 {font-size: 24px; font-family: 'NanumBold'; margin-bottom:23px}
.gallery .gall_list li { width:200px; height:116px; float:left; margin-left:26px}
.gallery .gall_list li:first-child {margin-left:0;}
.gallery .gall_list li a, .gallery .gall_list li span{display:block;}

.gallery .gall_list li .img {width:200px; height:116px;}
.gallery .gall_list li .img img {width:100%; height:116px;}
.gallery .gall_list li .txt { display:block; text-align:center; color:#4b5970; font-family: 'Nanum'; font-size:13px; margin-top:11px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.gallery .btn_more { position: absolute; width: 28px; height: 28px; right: 29px; top: 33px; text-indent: -9999em; line-height: 0; font-size: 0; background: url(/images/template/00053/main/btn_more.png) no-repeat center center; }
.gallery .btn_more:hover {transition:transform 300ms ease-in-out 0s; transform:rotate(360deg);}


/* 행사 보도자료 */
.news  {position:relative;width: 835px;height: 263px;float:left;background: #f2f8fa;border: 1px solid #d9d9d9;}
.news_w {padding: 20px 30px 20px;overflow: hidden;}
.news h2{font-size: 24px;font-family: 'NanumBold';padding: 30px 0 0 25px;}
.news  h2 a {color: #000;}
.news p.img {width: 35%;float:left;margin-right: 4%;}
.news .img img {width:100%;height: 158px;}
.news dl {margin-top: 0;width: 61%;float: left;}
.news dl dt {font-size: 18px;color: #000;font-weight:bold;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-family: 'NanumBold';line-height: 20px;}
.news dl dt:hover {color: #0367b3;}
.news dl dd.txt {margin-top:10px;font-size: 14px;color: #444;/* white-space:nowrap; */text-overflow:ellipsis;overflow:hidden;height:93px;line-height: 1.6;font-family: 'Nanum';}
.news dl dd.date {margin-top:10px;font-size: 13px;color: #949292;text-align: right;font-family: 'Nanum';}
.news .btn_more { position: absolute; width: 28px; height: 28px; right: 29px; top: 33px; text-indent: -9999em; line-height: 0; font-size: 0; background: url(/images/template/00053/main/btn_more.png) no-repeat center center; }
.news .btn_more:hover {transition:transform 300ms ease-in-out 0s; transform:rotate(360deg);}


/* 항공뷰 */
.M_link01 {position: relative;width:350px;height:265px;float:left;overflow:hidden;background:url(/images/template/00053/main/m_link_bg.png)no-repeat 50% 50%;margin-bottom:30px;margin-right: 13px;}
.M_link01 .img{padding-top:35px; text-align:center;}
.M_link01 .arrow{position:absolute; top:45%; right:20px;}
.M_link01 .text{margin-top:13px; font-size:18px; color:#fff; font-family: 'NanumBold'; text-align:center; }
.M_link01:hover .img{transform:rotateY(360deg); transition:transform 300ms ease-in-out 0s;}


/*하단 바로가기*/
.btm_link {float:left;position:relative;width:100%;height: 47px; background-color: #1c2f43;overflow:hidden;}
.btm_link ul li {position:relative; float:left; width:12.5%;}
.btm_link ul li a {display:block;font-size: 14px;padding:16px 0 16px 18px;color:#fff;background:url('/images/template/00053/main/link_bar.png') no-repeat right;font-family: 'NanumBold';}
.btm_link ul li:last-child a {background:none;}
.btm_link ul li a img {position:absolute;top: 15px;right:10px;}




 @media (max-width: 800px) {
	
	#container, .main_content,
	.main_visual, .main_visual .slogan,
	.notice, .gallery, .M_link01, .M_link01 ul li, .news, .btm_link, .btm_link li,
	 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box }
	
	.main_visual, .notice , .gallery, .M_link01, .M_link02, .news, .btm_link { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease }
	
	#container { width: 100%; padding-top: 69px; background: none; }
	.main_content { width: 95%; height: 100%; margin:0 auto; padding:2.5% 0 2.5% }


	/* 메인비주얼 */
	.main_visual{ width:100%; height:auto; background-size:cover}
	.main_visual .slogan { width:100%; padding:26% 4% 6%}
	.main_visual .slogan h2{ font-size:40px}
	.main_visual .slogan p{font-size:18px; line-height:150%; word-break:keep-all}
	.main_visual .slogan p br{ display:none}
	
	/* 공지사항 */
	.notice { width:100%; height: 264px; padding:20px 4% 20px; box-sizing: border-box;}
	.notice .btn_more {right:4%}

	/* 갤러리 */
	.gallery {width:100%;padding:31px 4% 30px;height:auto;margin: 0 0 2.5%;box-sizing: border-box;}  
	.gallery .gall_list li { width:48%; height:auto; margin-left:4%}
	.gallery .gall_list li .img { width:100%; height:auto}
	.gallery .gall_list li .img img {width:100%; height:auto}
	.gallery .btn_more {right: 4%}
	


	/* 행사 보도자료 */
	.news  {width:100%;}

	/* 항공뷰 */
	.M_link01 {width:100%;background-size:100% 100%;margin: 0 0 2.5%;}


	/*하단 바로가기*/
	.btm_link {height:auto;}
	.btm_link ul li {width:25%;}
	.btm_link ul li.link_04 a {background:none;}


}
	
	
 @media (max-width: 640px) {
	 
	 /* 메인비주얼 */
	.main_visual .slogan h2{ font-size:39px}
	.main_visual .slogan p{font-size:17px}
	
	/* 뉴스 */
	.news {width:100%;height:auto;margin: 0 0 2.5%;}
	.news p.img {width:100%; float:none;}
	.news p.img {width:100%; float:none;}
	.news dl {width:100%;float:none;margin-top: 20px;}
	.news dl dd.txt { height:100px; overflow-y: scroll;}


}


 @media (max-width: 560px) {
	 

	 /* 메인비주얼 */
	.main_visual .slogan {padding:28% 4% 5%}
	.main_visual .slogan h2{ font-size:35px; margin-bottom:7px}
	.main_visual .slogan p{font-size:16px}
	
	/* 공지사항 */
	.notice h2 { font-size: 22px; letter-spacing:-1px}
	.notice h2.tit_1 a { width:auto; padding:0 12px; left:11px}
	.notice h2.tit_2 a { width:auto; padding:0 12px; left:114px}
	.notice h2.tit_3 a { width:auto; padding:0 12px; left:217px}
	.notice .list_box li { font-size: 14px}
	.notice .list_box li span.date {font-size: 13px}
	.notice .btn_more {top:30px}
	
	/* 갤러리 */
	.gallery { width:100%; padding:31px 4% 30px; height:auto;}  
	.gallery h2 {font-size: 22px; letter-spacing:-1px}
	.gallery .gall_list li { width:48%; height:auto; margin-left:4%}
	.gallery .gall_list li .img { width:100%; height:auto}
	.gallery .gall_list li .img img {width:100%; height:auto}
	.gallery .btn_more {top:30px}
	
	/*하단 바로가기*/
	.btm_link ul li {width:50%;}
	.btm_link ul li.link_02 a, .btm_link ul li.link_08 a {background:none;}



	
}


 @media (max-width: 480px) {
	 
	 /* 공지사항 */
	.notice h2 { font-size: 19px}
	.notice h2.tit_1 a {left:5px}
	.notice h2.tit_2 a {left:96px}
	.notice h2.tit_3 a {left:187px}
	.notice .list_box li { font-size: 13px}
	.notice .list_box li span.date {font-size: 12px}
	
	
}
 
 
 @media (max-width: 380px) {
	 

	/* 메인비주얼 */
	.main_visual .slogan {padding:28% 4% 5%}
	.main_visual .slogan h2{ font-size:30px; margin-bottom:5px}
	.main_visual .slogan p{font-size:14px}
	
	/* 공지사항 */
	.notice h2 { font-size: 17px}
	.notice h2.tit_1 a {padding:0 8px; left:5px}
	.notice h2.tit_2 a {padding:0 8px; left:81px}
	.notice h2.tit_3 a {padding:0 8px; left:157px}
	.notice .btn_more {top:27px}
	
	/* 갤러리 */
	.gallery h2 {font-size: 17px}
	.gallery .btn_more {top:27px}
	


	
}
