@charset "utf-8"; 
/* 
	copyright(c) WEBsiting.co.kr 
	모바일화면 관련 css파일입니다.
	각 넓이에 따른 스타일 설정이 가능합니다.
*/

@media all and (max-width:1500px)
{
	#ctWrap{width:96%;}
}

/* 디바이스 981px 이상에서 적용*/
@media all and (min-width:981px)
{
	html,body{overflow:auto; }
	html.ovfH,body.ovfH{overflow:hidden; }
	#snbOpen,
	#sideBarCover,
	#snbMvAr,
	#snbMvArBottom,
	.bNBarMwWrap{display:none; }
	.leftMenuUseFlase #ctWrap {background:none !important;}
	#container,
	.leftMenuUseFlase #container {width:100%; max-width:1400px; margin:0 auto; float:none;}

	.leftMenuUseFlase .contentTitle{text-align:center;}
	.leftMenuUseFlase .contentTitle strong{float:none;}
	.leftMenuUseFlase .contentTitle .locationBar{float:none;  }

	#hd{ background:RGBA(255,255,255,0.8); -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }

	#hd.scDown{background:#fff;}

	
		#hd.scDown #logo a{padding:15px; }
		#hd.scDown #logo img{height:50px;}
		#hd.scDown #gnb .gnb_1dli .gnb_1da{height:80px; line-height:80px;}
		#hd.scDown #gnb .gnb_1dli:hover .gnb_2dul{top:80px; }

	#topSpacer{height:110px; }
	.pc_br{display:block !important; }
	.pc_block{display:block !important; }
	.mobile_block{display:none !important; }
	.pc_inline-block{display:inline-block !important; }
	.mobile_inline-block{display:none !important; }
	
	/* 좌측메뉴를 사이트맵으로 */	
	#gnb_1dul{margin-right:120px;}

	#snbOpen,
	#snbOpen:focus{display:block !important; visibility:visible !important; width:52px; height:50px; line-height:50px; text-align:center; color:#fff; font-size:24px; background:RGBA(255,255,255,0.0); position:fixed; right:30px; top:30px; z-index:99999999; cursor:pointer; border:0px;outline:0; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease;}
	#snbOpen b{display:block; width:24px; height:22px; margin:13px 15px; position:relative; overflow:hidden; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease;}
	#snbOpen b i{display:block; width:100%; height:2px; position:absolute; right:50%; margin-right:-50%; width:100%; background:#000; border-radius:5px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease-out; transition-duration: 0.2s; transition-timing-function: ease-out; }
	#snbOpen b i:nth-child(1){top:0px;}
	#snbOpen b i:nth-child(2){top:50%;margin-top:-1px; width:70%; right:0px; margin-right:0px; -webkit-transition-duration: 0.9s; -webkit-transition-timing-function: ease; transition-duration: 0.9s; transition-timing-function: ease;}
	#snbOpen b i:nth-child(3){bottom:0px;}
	.ovfH #snbOpen {margin-top:-1px;}
	.ovfH #snbOpen b i:nth-child(1){top:50%; transform: rotate(135deg);}
	.ovfH #snbOpen b i:nth-child(2){width:1px; filter:Alpha(opacity=0); opacity:0; -moz-opacity:0; -webkit-transition-duration: 0.1s; -webkit-transition-timing-function: ease; transition-duration: 0.1s; transition-timing-function: ease;}
	.ovfH #snbOpen b i:nth-child(3){top:50%; bottom:auto; transform: rotate(-135deg);}

	
	.scDown #snbOpen,
	.scDown #snbOpen:focus{top:15px;}

		#sideBarCover{display:block; background:rgba(88,170,151,0.95); position:fixed; left:auto; top:-50px; bottom:auto; right:-50px; width:40px; height:40px; border-radius:50%;z-index:999999; 
			-webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-out; transition-duration: 0.4s; transition-timing-function: ease-out; }
		#sideBarCover.on{display:block;  width:10000px; height:10000px; right:-5000px; top:-5000px; }

		.sideBarLogo{display:block; width:360px; padding:0 30px;}

		#sideBar{text-align:right; display:block; position:fixed; right:-51%; top:120px; bottom:0px; z-index:9999999; width:50%; overflow:auto; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
		#sideBar.on{text-align:left; right:0px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
		#sideBar #snb {margin-top:50px;  padding:0 15px;}
		#sideBar #snb .snb{display:block !important; padding:10px 0; position:relative; }
		#sideBar #snb .snb > h2{position:relative; margin-bottom:0px; border-radius:0px; background:none !important;}
		#sideBar #snb .snb > h2 a{padding:15px;  color:#fff;  background:none !important;}
		#sideBar.on #snb .snb > h2 a{text-align:left;}
		#sideBar #snb .snb > h2 a b{display:block; width:auto; position:relative; font-size:70px; height:70px; font-weight:100; line-height:78px; position:relative; letter-spacing:10px;  border-left:7px solid RGBA(255,255,255,0.0);
			-webkit-transition-duration: 0.3s; -webkit-transition-timing-function: ease; transition-duration: 0.3s; transition-timing-function: ease;}
		#sideBar #snb .snb:hover > h2 a b{width:100%; font-weight:400;}
		
		#sideBar #snb .snb > h2 a b:after{content:'';display:block; position:absolute; left:0px; bottom:0px;width:1px; height:1px; background:RGBA(255,255,255,0);
			-webkit-transition-duration: 0.3s; -webkit-transition-timing-function: ease; transition-duration: 0.3s; transition-timing-function: ease;}
		#sideBar #snb .snb:hover > h2 a b:after{width:100%; background:#fff;}
		#sideBar #snb .snb > h2 a sub{display:none !important; }
		#sideBar #snb .snb.active > h2{ }

		#sideBar #snb .snb .snb2dDown{display:none !important; border:0px;}


		#sideBar #snb .snb > ul{display:block; margin-bottom:0px; padding-left:20px;} 
		#sideBar #snb .snb > ul > li{display:inline-block; border:0px;}
		#sideBar #snb .snb > ul > li a{padding:15px; border-bottom:1px solid RGBA(255,255,255,0);}
		#sideBar #snb .snb > ul > li a:hover{background:none; border-radius:3px; border-bottom:1px solid #fff;}
		#sideBar #snb .snb > ul > li a b{font-size:18px; color:#fff; font-weight:300; }
		#sideBar #snb .snb > ul > li a b i{display:none; }

		#sideBar #snb .snb > ul.snb2dul > li.active a{background:none; }
		#sideBar #snb .snb > ul.snb2dul > li a:hover{background:none;}
		#sideBar #snb .snb.active > ul.snb2dul{display:block; }

		#sideBar #snb li.noInfoPageTit,
		#sideBar #snb li.noInfoPageTit.active{display:none !important; }
		.snbCS{border:0px; }

		.snbCS{border-top:0px ; padding:30px 40px;}
		.snbCS dt{padding-bottom:10px; font-size:22px; font-weight:bold; color:#fff; }
		.snbCS dd,
		.snbCS dd a{font-size:14px; color:RGBA(255,255,255,0.6); }
		.snbCS dd strong{display:block; font-size:22px; padding-bottom:10px; color:#fff; }
		.snbCS dd strong a{font-size:22px; color:#fff;}
		.snbCS dd b{display:block; font-size:14px; font-weight:300; }

		.snbMvArBtn{height:50px; overflow:hidden; position:absolute; right:50px; top:0px; padding:10px; }
		.snbMvArBtn a{display:inline-block; padding:5px 7px; border:1px solid #ddd; border-radius:3px; font-size:11px; }
		#snbMvArBottom{border-top:1px dashed #efefef; padding:10px; text-align:center; }
		#snbMvArBottom a{display:inline-block; padding:5px 10px; border:1px solid #ddd; border-radius:3px; }

}
/* 디바이스 1100px 이하에서 적용*/
@media all and (max-width:1100px)
{
	#gnb .gnb_1dli .gnb_1da{padding:0 8px; }
}
/* 디바이스 980px 이하에서 적용*/
@media all and (max-width:980px)
{
	
	html.ovfH,body.ovfH{overflow:hidden; }
	.mobileNone{display:none; }

	#tnb,
	.gnb_1dli{display:none; }

	.pc_block{display:none !important; }
	.mobile_block{display:block !important; }
	.pc_inline-block{display:none !important; }
	.mobile_inline-block{display:inline-block !important; }

	#topSpacer{height:50px; }

	#gnb{position:fixed; left:0px; top:0px; width:100%; z-index:999; background:RGBA(255,255,255,0.8); -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
	.scDown #gnb{background:#fff; box-shadow:0px 0px 10px rgba(0,0,0,0.15),0px 0px 14px rgba(0,0,0,0.15),0px 0px 10px rgba(0,0,0,0.15);}

	.allSchBoxWr{display:block !important; }
	#btnSchbox{display:block !important; visibility:visible !important; position:fixed; right:50px; top:0px; width:50px; height:50px; line-height:50px; padding:0px; font-size:18px; text-align:center; z-index:9999; }
	#allSchBox{position:fixed; top:50px; right:0px; left:0px; margin-top:0px; padding:10px; background:#333; z-index:99999; }
	#allSchBox fieldset{border-radius:25px; width:100%; margin-right:50px; border-radius:0; }
	.allSchBoxWr #btnSchbox{margin-top:0px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
	.allSchBoxWr.on #btnSchbox{margin-top:50px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }


	#logo a{padding:5px; }
	#logo a img{height:40px; }

	/* 좌측메뉴를 모바일전용메뉴로 */	
	#snbOpen,
	#snbOpen:focus{display:block !important; visibility:visible !important; width:52px; height:50px; line-height:50px; text-align:center; color:#fff; font-size:24px; background:RGBA(255,255,255,0); position:fixed; right:0px; top:0px; z-index:99999999; cursor:pointer; border:0px;outline:0;}
	#snbOpen b{display:block; width:24px; height:22px; margin:13px 15px; position:relative; overflow:hidden; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease;}
	#snbOpen b i{display:block; width:100%; height:2px; position:absolute; right:50%; margin-right:-50%; width:100%; background:#000; border-radius:5px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease-out; transition-duration: 0.2s; transition-timing-function: ease-out; }
	#snbOpen b i:nth-child(1){top:0px;}
	#snbOpen b i:nth-child(2){top:50%;margin-top:-1px; width:70%; right:0px; margin-right:0px; -webkit-transition-duration: 0.9s; -webkit-transition-timing-function: ease; transition-duration: 0.9s; transition-timing-function: ease;}
	#snbOpen b i:nth-child(3){bottom:0px;}
	.ovfH #snbOpen {margin-top:-1px;}
	.ovfH #snbOpen b i:nth-child(1){top:50%; transform: rotate(135deg);}
	.ovfH #snbOpen b i:nth-child(2){width:1px; filter:Alpha(opacity=0); opacity:0; -moz-opacity:0; -webkit-transition-duration: 0.1s; -webkit-transition-timing-function: ease; transition-duration: 0.1s; transition-timing-function: ease;}
	.ovfH #snbOpen b i:nth-child(3){top:50%; bottom:auto; transform: rotate(-135deg);}

	#snbMvAr{display:block; position:absolute; left:0px; top:0px; right:0px;  }
	#snbMvAr a#btnHome{background:#fff; padding:0 15px; font-weight:bold; font-size:14px; height:50px; line-height:50px; margin-left:10px;}
	#snbMvAr a#snbClose{background:#000; border-left:1px solid #f2f2f2; width:50px; height:50px; line-height:50px; text-align:center; color:#fff; font-size:18px; position:absolute; top:0px; right:0px; }


		#sideBarCover{display:block; background:rgba(88,170,151,0.95); position:fixed; left:auto; top:-50px; bottom:auto; right:-50px; width:40px; height:40px; border-radius:50%;z-index:999999; 
			-webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-out; transition-duration: 0.4s; transition-timing-function: ease-out; }
		#sideBarCover.on{display:block;  width:10000px; height:10000px; right:-5000px; top:-5000px; }

		.sideBarLogo{display:block; width:160px; padding:0 30px; margin-top:50px;}

		#sideBar{text-align:right; display:block; position:fixed; right:-101%; top:0px; bottom:0px; z-index:9999999; width:90%; overflow:auto; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
		#sideBar.on{text-align:left; right:5%; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
		#sideBar #snb {margin-top:20px;  padding:0 15px;}
		#sideBar #snb .snb{display:block !important; padding:5px 0; position:relative; }
		#sideBar #snb .snb > h2{position:relative; margin-bottom:0px; border-radius:0px; background:none !important;}
		#sideBar #snb .snb > h2 a{padding:15px;text-align:left; color:#fff;  background:none !important;}
		#sideBar #snb .snb > h2 a b{display:block; font-size:30px; font-weight:300; letter-spacing:10px; height:30px; line-height:30px; position:relative; 
			-webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease;}
		#sideBar #snb .snb > h2 a sub{display:none !important; }
		#sideBar #snb .snb.active > h2{ }

		#sideBar #snb .snb .snb2dDown{display:none !important; border:0px;}


		#sideBar #snb .snb > ul{display:block; margin-bottom:0px; padding-left:10px;} 
		#sideBar #snb .snb > ul > li{display:inline-block; border:0px;}
		#sideBar #snb .snb > ul > li a{padding:8px; }
		#sideBar #snb .snb > ul > li a:hover{background:RGBA(0,0,0,0.1); border-radius:3px;}
		#sideBar #snb .snb > ul > li a b{font-size:14px;  font-weight:300; color:#fff; }
		#sideBar #snb .snb > ul > li a b i{display:none; }

		#sideBar #snb .snb > ul.snb2dul > li.active a{background:none; }
		#sideBar #snb .snb > ul.snb2dul > li a:hover{background:RGBA(0,0,0,0.1);}
		#sideBar #snb .snb.active > ul.snb2dul{display:block; }

		#sideBar #snb li.noInfoPageTit,
		#sideBar #snb li.noInfoPageTit.active{display:none !important; }
		.snbCS{border:0px; }

		.snbCS{border-top:0px ; padding:0 30px 30px;}
		.snbCS dt{padding-bottom:10px; font-size:22px; font-weight:bold; color:#fff; }
		.snbCS dd,
		.snbCS dd a{font-size:14px; color:RGBA(255,255,255,0.6); }
		.snbCS dd strong{display:block; font-size:22px; padding-bottom:10px; color:#fff; }
		.snbCS dd strong a{font-size:22px; color:#fff;}
		.snbCS dd b{display:block; font-size:14px; font-weight:300; }

		.snbMvArBtn{height:50px; overflow:hidden; position:absolute; right:50px; top:0px; padding:10px; }
		.snbMvArBtn a{display:inline-block; padding:5px 7px; border:1px solid #ddd; border-radius:3px; font-size:11px; }
		#snbMvArBottom{padding:10px; text-align:center; }
		#snbMvArBottom a{display:inline-block; padding:5px 10px; border:1px solid #ddd; border-radius:3px; background:#fff;}

	
	/* 서브페이지 상단 모바일 네비 */
	.subTopLocNav{display:block;margin-top:-20px; width:90%;}
	.subTopLocNav .loc1DA,
	.subTopLocNav .loc2DA{height:40px; line-height:40px;font-size:12px;}
	.subTopLocNav .loc1DA b,
	.subTopLocNav .loc2DA b{display:block; text-align:left; height:40px; line-height:40px; margin:0 36px 0 16px;}
	.bNBar1D, 
	.bNBar2D{top:40px; }
	.bNBar1D .snb h2 a b,
	.bNBar2D .snb2d a b{font-size:12px;}

	
	.bNBar1D .snb h2 a b,
	.bNBar2D .snb2d a b{padding:12px; font-size:13px;}

	/* 중간 레이아웃 */
	#ctWrap{ margin:15px auto; }
	#container{width:auto; float:none; padding:15px; }

	
	.contentTitle{border-bottom:0px !important;}
	.contentTitle{padding:10px 0 30px;margin-bottom:30px; text-align:center;}
	.contentTitle strong{float:none; color:#333; font-size:30px;}
	.contentTitle .locationBar{float:none;  }
	.contentTitle .locationBar i{padding:0 5px;}

	
	.leftMenuUseFlase .contentTitle{margin-bottom:5px;}
	.leftMenuUseFlase .contentTitle:after{width:45px;margin:15px auto;}

	
}

/* 디바이스 850px 이하에서 적용*/
@media all and (max-width:980px)
{
	/* contents */
	#page_title{width:96%; margin-top:2%;}
	#page_title .page_title_in {padding:60px 10px; text-align:center; }
	#page_title .page_title_in h2 strong{font-size:30px; }
	#page_title .page_title_in h2{text-align:center; }

	/* footer */
	#footer > div > dl {text-align:center;}
	#footer > div > dl > dt{position:static; padding-bottom:20px;}
	#footer > div > dl > dt img{}
	#footer > div > dl > dd a,
	#footer address {text-align:center;font-size:11px; letter-spacing:-0.05em; }
	#footer address em{display:none; }
	#footer p {text-align:center;}
	#footer p span{display:none; }

}
/* 디바이스 650px 이하에서 적용*/
@media all and (max-width:650px)
{
	/* contents */
	#page_title .page_title_in{padding:80px 10px 60px 10px; }
	#page_title .page_title_in h2 strong{font-size:18px;  }
	#page_title .page_title_in h2 .locationBar span{font-size:10px; }
	#page_title.on .page_title_in h2 > strong{ }

	#page_title.sbtImgPF .page_title_in{padding:150px 15px 100px; }
	#page_title.sbtImgPF #pageTitTxt:before{font-size:12px;}

	.contentTitle strong{font-size:20px;}
	.contentTitle .locationBar{font-size:12px;}

	.brn_650{display:none;}

}

/* 디바이스 420px 이하에서 적용*/
@media all and (max-width:420px)
{
	/* contents */
	#page_title {background-size:auto 100%; }

}