@charset "utf-8";
@import url("base.css");
@import url("main.css");
@import url("contents.css");

@media (min-width:768px) {}
@media screen and (max-width: 600px) {}
@media (max-width: 600px) {}
@media all and (min-width:768px) and (max-width:1080px) {}
@media (min-height: 680px), screen and (orientation: portrait) {}

@font-face {
    font-family: 'GyeonggiBatang';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/GyeonggiBatang.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* 건너뛰기 */
#accessibility{position:absolute;left:0;top:0;z-index:1; z-index:9999999;}
	#accessibility li{float:left}
	#accessibility a{position:absolute;width:1px;height:1px;top:-50px;overflow:hidden;text-align:center}
	#accessibility a:focus, #accessibility a:active{position:absolute;top:0px;width:200px;height:auto;padding:5px;background-color:#fff;border:solid 1px #0079c6;color:#0079c6;z-index:2} 
	
	

/*-----------------------------------------------------------------------------------------------------------
공통css
-----------------------------------------------------------------------------------------------------------*/
body			{ }
#skipnavigation { display:none; visibility:hidden;}

#wrapper	{position:relative; width:100%; overflow:hidden}
#header		{width:100%;height:125px;}

	
	.top-link{ position: relative; left:0px; top:0; z-index:100; height: 40px; border-bottom: 1px solid #ddd; background: #f3f3f3;}
	.top-link ul{list-style:none; float: right;	}
	.top-link li{display: inline; float: left; padding:10px 5px; height:40px;box-sizing:border-box; position:relative;}
	.top-link li:before{ position:absolute; content:''; width:1px; height:15px; background:#ddd; top:10px; right:0}
	.top-link li:last-child:before{ position:absolute; content:''; width:0px; height:20px; background:#ddd; top:0; right:0}
	.top-link li a{display:block; padding:0 5px; color:#666; font-size:0.93em}
	.top-link li a:hover{ color:#cd3a27}
	.top-link li a.on{color:#cd3a27; font-weight: bold;}
	
		
	.clearH		{ clear:both; width:100%;}

	 /* PC Device */
	@media all and (min-width:1025px){
		
	
	}
	
	
	/* 테블릿 세로 해상도 */
	@media all and (max-width:980px) {
		
		#wrapper	{overflow:hidden}
		#header		{ background:none; height:50px}
		.top-link{ position: relative; left:0px; top:0; z-index:100; height: auto; border-bottom: 0; background:none;}
		.top-link ul		 { display:none;}		
	
			
	}
	
	/* 모바일 해상도 */
	@media all and (max-width:800px) {	
	
		#wrapper{min-width:100%; overflow:hidden}
		
	}
	
	
	
/*-----------------------------------------------------------------------------------------------------------
PC메뉴
-----------------------------------------------------------------------------------------------------------*/

	
	h1.logo  { position: absolute; top:70px}
	/* gnb */
	#gnb {position:absolute; width:100%;}
	#gnb > ul { box-sizing:border-box; max-width: 1280px; padding:40px 0 0 440px; margin: 0 auto;}
	#gnb > ul:after {display:block; clear:both; content:'';}
	#gnb > ul > li {position:relative; z-index:120; float:left; width:19%; height: 70px;}

	#gnb > ul > li:before { position:absolute; content:''; background:#ddd; width:1px; height:10px;  top:12px; right:0;}
	#gnb > ul > li:last-child:before { position:absolute; content:''; background:none;}
	#gnb > ul > li.on > a {color:#cd3a27;}
	#gnb > ul > li > a {display:block; position:relative; height:40px; padding:5px 0 10px 0; color:#222; font-size:18px; text-decoration:none; text-align:center; letter-spacing:-1px;font-weight:400;}
	#gnb > ul > li > ul {display:none; position:absolute; z-index:120; top:62px; left:0; width:100%; height:378px; border-right:1px solid #ddd;}
	
	#gnb > ul > li > ul:hover 	{background:rgba(246,246,246,.5);}
	#gnb > ul > li > ul:hover a {}
	
	#gnb > ul > li:first-child > ul {border-left:1px solid #ddd;}
	#gnb.open > ul > li > ul {display:block;}
	#gnb div.bg 		{display:none; position:absolute; z-index:100; top:102px; left:0; width:100%; height:378px;  border-bottom:1px solid #ddd; background:#fff;}
	#gnb.open div.bg 	{display:block; border-top:1px solid #ddd}
	#gnb.open > ul > li:first-child:before {display:block;}
	#gnb > ul > li > ul > li > a {display:block; position:relative; padding:10px; color:#777;  text-align:center; letter-spacing:-1.7px; font-size:16px}
	#gnb > ul > li > ul:hover > li:hover > a:hover {display:block; position:relative; padding:10px; color: #fff; text-align:center; background:#cd3a27;  box-sizing:border-box; }

	

	/* 테블릿 가로 해상도 */
	@media all and (max-width:1199px) {
					
		#gnb span.bg {background-position:3% bottom;}
		
	}

	
	/* 테블릿 세로 해상도 */
	@media all and (max-width:980px) {
		
		h1.logo  { position: relative; top:0; padding: 20px 0; text-align: center;}
		h1.logo img { width: 150px;}
		#gnb{display:none}
		.gnb_bg{display:none}
		
			
	}
	
	/* 모바일 해상도 */
	@media all and (max-width:800px) {	
	
		#gnb{display:none}	
		
	}

/*-----------------------------------------------------------------------------------------------------------
모바일
-----------------------------------------------------------------------------------------------------------*/


#mobileLnb{display:none; position:absolute; top:0; left:0; width:100%; height:40px; border-bottom:1px solid #ddd; z-index:800;}
	#mobileLnb .mLnbDiv{position:relative; width:94%; height:40px; margin:auto;}
	#mobileLnb .mLnbDiv a{display:block}
	#mobileLnb .mLnbDiv .home{width:48px; height:14px; padding:13px 0; text-align:center; float:left; border-left:1px solid #ddd; border-right:1px solid #ddd}
	#mobileLnb .mLnbDiv .lnbOne{position:relative; width:160px; padding:12px 19px; float:left; border-right:1px solid #ddd}
	#mobileLnb .mLnbDiv .lnbOne.on{color:#333; }
	#mobileLnb .mLnbDiv .lnbOne.cur{color:#cd3a27; }
	#mobileLnb .mLnbDiv .lnbOne img{position:absolute; top:19px; right:19px;}
	#mobileLnb .mLnbDiv .lnbTwo{display:none; position:absolute; top:40px; left:0; width:160px; border:1px solid #ddd; padding:15px 19px 5px; background:#fff}
	#mobileLnb .mLnbDiv .lnbTwo a{font-size:13px; margin-bottom:15px;}
	#mobileLnb .mLnbDiv .lnbTwo a:hover{color:#cd3a27; }
	#mobileLnb .mLnbDiv .lnbTwo a.on{color:#cd3a27; }

	.mobileMenu	{display:none; position:absolute; top:20px; right:15px; width:25px; height:25px; background:url(/image/common/mobile_menubt.gif) no-repeat 100%; z-index:100;}
	
	#gnbM{display:none; position:absolute; top:0; right:-300px; width:300px; background:#f8f8f8; z-index:100000;}
	#gnbM .mUtil{padding:17px 15px; background:#cd3a27; font-size:13px; letter-spacing:-1px}
	#gnbM .mUtil a{color:#fff; padding:0 15px 0 10px; position: relative;}
	#gnbM .mUtil a::before{ position: absolute; content: ""; top: 7px; left: 0; width: 1px; height: 10px; background-color: #fff;}
	#gnbM .mUtil span{margin:0 6px; color:#ddf2e7}
	#gnbM .mobileMenuXbt{position:absolute; top:18px; right:10px;}
	#gnbM .mobileMenuXbt img{width:15px}
	#gnbM .gnbDiv a{display:block}
	#gnbM .gnbDiv .one{padding:14px 20px 10px; font-size:16px; color:#333; border-bottom:1px solid #d9d9d9; font-weight:400; }
	#gnbM .gnbDiv .one.on{color:#cd3a27; border-bottom:1px solid #666;}
	#gnbM .gnbDiv .two{padding:15px 20px; border-bottom:1px solid #d9d9d9; background:#fff}
	#gnbM .gnbDiv .two .twoD{font-size:15px; color:#555; padding:10px 7px; border-bottom:1px solid #d9d9d9;}
	#gnbM .gnbDiv .two .twoD2{font-size:15px; color:#555; padding:10px 7px; border-bottom:1px solid #d9d9d9; background:#f3f3f3}
	#gnbM .gnbDiv .two .twoD3{font-size:15px; color:#555; padding:10px 7px 10px 15px; border-bottom:1px dotted #ccc; background:#fff}
	#gnbM .gnbDiv .two .thr{padding:15px 15px 5px; border-bottom:1px solid #d9d9d9; background:#f7f7f7}
	#gnbM .gnbDiv .two .thr .thrD{font-size:13px; color:#777; margin-bottom:10px}
	.dimdBg{display:none; position:absolute; top:0; left:0; width:100%; background:#000; opacity:0.7; z-index:1000}


	.mNxt{ display:none}	
	
	
	/* 테블릿 세로 해상도 */
	@media all and (max-width:980px) {
		
		
		#mobileLnb{display:none}
			.mobileMenu{display:block}		
			#gnbM{display:block}
			#mobileSub{display:block;}
			.mobileSubmenu{display:none;}
			
			
			
	}
	
	/* 모바일 해상도 */
	@media all and (max-width:800px) {	
	
		#mobileLnb{display:none;}
		.boxTxt .addInfoBt img{width:100px;}
		.mHidden{display:none;}
		
	}
	
	
/*-----------------------------------------------------------------------------------------------------------
하단
-----------------------------------------------------------------------------------------------------------*/	
	
	
#footer{width:100%;z-index:800; background: #4b4b4b; margin-top: 60px;}
	
	
	#ft_company		{ width:1200px;  margin:auto; position:relative;}
	#ft_company h2	{ padding-top: 40px; text-align: center;}
	#ft_company p.ft_info	{ color:#999; font-size:14px; padding-top:30px; line-height:1.6; text-align: center;}
	#ft_company p.ft_info span.point	{ color:#fff;font-size:12px; }
	#ft_company p.ft_info span.pl		{ margin-left: 20px;}
	#ft_company #ft_copy	{ color:#777; font-size:14px; padding:5px 0 30px; line-height:1.6; text-align: center;}
	
	
		
	
	/* 테블릿 가로 해상도 */
	@media all and (max-width:1199px) {
					
	
	}
	
	/* 테블릿 세로 해상도 */
	@media all and (max-width:980px) {
			
		#footer{height:auto; clear:both; padding-top: 10px; margin-top: 20px}
				
		#ft_company		{ width:100%;}
		#ft_company h2,
		#ft_company p.ft_info	{ display: none;}
		#ft_company #ft_copy	{ padding:5px 15px 20px;}
		
		
	}



/*-----------------------------------------------------------------------------------------------------------
서브
-----------------------------------------------------------------------------------------------------------*/

/* 서브페이지 */
	/* 상단 비주얼, 로케이션 영역 */
	#subWarp		{ position:relative}
		.subVisual 	{ position:relative; left:0; top:20px; width:100%; background:url() no-repeat center #000; height: 315px }
		.bg1		{ background:url(/image/common/sub_img_01.jpg)}
		.bg2		{ background:url(/image/common/sub_img_01.jpg)}
		.bg3		{ background:url(/image/common/sub_img_01.jpg)}
		.bg4		{ background:url(/image/common/sub_img_01.jpg)}
		.bg5		{ background:url(/image/common/sub_img_01.jpg)}
		.bg6		{ background:url(/image/common/sub_img_01.jpg)}

		
		@-webkit-keyframes fadeInDown {
		  from {
			opacity: 0;
			-webkit-transform: translate3d(0, -50%, 0);
			transform: translate3d(0, -50%, 0);
		  }
		
		  to {
			opacity: 1;
			-webkit-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
		  }
		}
		
		@keyframes fadeInDown {
		  from {
			opacity: 0;
			-webkit-transform: translate3d(0, -50%, 0);
			transform: translate3d(0, -50%, 0);
		  }
		
		  to {
			opacity: 1;
			-webkit-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
		  }
		}
		
		.fadeInDown {
		  -webkit-animation-name: fadeInDown;
		  animation-name: fadeInDown;
		}
		

	
		.location { position: absolute; height:55px; z-index: 30; width:100%; background:rgb(0,0,0,0.8); bottom: 0;}
		.location:after { display: block; content:''; clear: both; }
		.subMenu  { width:1200px; margin:0 auto; height:55px; border-left:1px solid #444}
		.subMenu ul li	{ float:left;}
		.subMenu ul li a{ line-height:55px; padding:0 23px; border-right:1px solid #444; color:#fff; }
		.subMenu ul li a.on{ background: #cd3a27; opacity: 1}
		

	/* Sweep To Bottom */
	.subMenu li a {
	  display: inline-block;
	  vertical-align: middle;
	  -webkit-transform: perspective(1px) translateZ(0);
	  transform: perspective(1px) translateZ(0);
	  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	  position: relative;
	  -webkit-transition-property: color;
	  transition-property: color;
	  -webkit-transition-duration: 0.3s;
	  transition-duration: 0.3s;
	}
	.subMenu li a:before {
	  content: "";
	  position: absolute;
	  z-index: -1;
	  top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  background:  #cd3a27;
	  -webkit-transform: scaleY(0);
	  transform: scaleY(0);
	  -webkit-transform-origin: 50% 0;
	  transform-origin: 50% 0;
	  -webkit-transition-property: transform;
	  transition-property: transform;
	  -webkit-transition-duration: 0.3s;
	  transition-duration: 0.3s;
	  -webkit-transition-timing-function: ease-out;
	  transition-timing-function: ease-out;
	}
	.subMenu li a:hover, .submenu li a:focus, .submenu li a:active {
	  color: #fff;
	}
	.subMenu li a:hover:before, .submenu li a:focus:before, .submenu:active li a:before {
	  -webkit-transform: scaleY(1);
	  transform: scaleY(1);
	}
		
	#container { width: 100%; color: #333; line-height: 24px; font-size: 15px; overflow:hidden; }	
	#container h2 { font-size:2.8rem; letter-spacing:-0.5px; text-align:center; font-weight:500; color:#000;}
	#container p.Tittxt { font-size:16px; text-align:center; color:#999; padding:20px 0}
	
	.path		{position:relative; color:#666; text-align:center; clear:both; padding-bottom:30px}	
	.path span	{padding-left:19px; margin-left:15px; background:url('/image/common/path_arrow.gif') no-repeat 0 center}
	.path span.home{padding-left:0px; margin-left:0px; background:none}
				
	/* 제목 영역 */
	.in-wrap 	{ min-height:600px;_height:expression(this.scrollHeight<600?"600px":"auto"); clear:both;}
		
	.con_wrap,
	.inner				{max-width:1280px; width:100%; margin:0 auto; position:relative; }
	
	@media only screen and (min-width:1024px) {/* PC */
	}
	
	/* 테블릿 가로 해상도 */
	@media all and (max-width:1199px) {
			
		/* 서브페이지 */
					
		#container { padding-bottom:20px;width:100%; color: #333; line-height: 24px; font-size: 15px; overflow:hidden;}
		#mobileLnb{display:block}
	
	}
	
	/* 테블릿 세로 해상도 */
	@media all and (max-width:980px) {
		
		
		/* 서브페이지 */
		.subVisual 	{ height: 100px; background-size:cover;}		
		.location   { display: none;}
			
		.mNxt{ display:block; position:absolute; top:20px; right:15px; z-index:10}
		
		#container h2 { font-size:1.5rem;}
		#container h2.pdt_80 	{ padding-top: 40px;}		
		#container p.Tittxt 	{ padding:10px 0 20px}

		.path			{padding-bottom:20px}
		.in-wrap 		{ border-top: 1px solid #ddd; width:100%; padding-bottom: 30px;}
		
		.con_wrap		{width:96%; margin: 0 auto;}
		.inner			{width:100%; margin: 0 auto;}
		
		
	}
	
	/* 모바일 해상도 */
	@media all and (max-width:800px) {	
	
				
	
		
	}