/* 레이아웃 */
#gaonwrap { min-width:1280px; width:100%; }

#top { position:relative; min-width:1280px; width:100%; height:156px; border-bottom:1px solid #ddd; background:url(/images/inc/top_bg.gif) repeat-x; }
	#toparea { position:relative; width:1280px; height:156px; margin:0 auto; overflow:visible; } 
	
/*#container { position:relative; min-width:1280px; width:100%; z-index:2; margin-bottom:100px; }*/
	
	#container { position:relative; width:100%; height:734px; padding:54px 0 0 0; box-sizing:border-box; background:url(/images/child/main/main_bg.jpg) no-repeat 50% 50%; }
		.containerarea { width:1280px; height:100%; padding:0 30px 0 50px; box-sizing:border-box; overflow:visible; margin:0 auto; }
	
#bottom { position:relative; width:100%; min-width:1280px; border-top:1px solid #ddd; background:#fff; z-index:4; }
	#bottomarea { position:relative; width:1280px; padding:40px 0 40px 0; margin:0 auto; z-index:5; }


@media (min-width:1025px) and (max-width:1280px){
	html, body, #gaonwrap { min-width:100%; width:100%; }
	
		#top { position:relative; min-width:100%; width:100%; height:156px; border-bottom:1px solid #ddd; background:url(/images/inc/top_bg.gif) repeat-x; }
		#toparea { position:relative; width:100%; height:156px; margin:0 auto; overflow:visible; } 
		
	/*#container { position:relative; min-width:1280px; width:100%; z-index:2; margin-bottom:100px; }*/
		
		#container { position:relative; width:100%; height:734px; padding:30px 0 0 0; box-sizing:border-box; background:url(/images/child/main/main_bg.jpg) no-repeat 50% 50%; }
			.containerarea { width:100%; height:100%; padding:0 30px 0 50px; box-sizing:border-box; overflow:visible; margin:0 auto; }
		
	#bottom { position:relative; width:100%; min-width:1280px; border-top:1px solid #ddd; background:#fff; z-index:4; }
		#bottomarea { position:relative; width:1280px; padding:40px 0 40px 0; margin:0 auto; z-index:5; }

	
}

@media (min-width:769px) and (max-width:1024px){
	html, body, #gaonwrap { min-width:100%; width:100%; }
		
	#top { position:relative; min-width:100%; width:100%; height:88px; border-bottom:1px solid #ddd; background:#fff; }
		#toparea { position:relative; width:100%; height:88px; margin:0 auto; overflow:visible; } 
		
	/*#container { position:relative; min-width:1280px; width:100%; z-index:2; margin-bottom:100px; }*/
		
		#container { position:relative; width:100%; height:800px; padding:30px 0 0 0; box-sizing:border-box; background:url(/images/child/main/main_bg2.jpg) no-repeat bottom center; }
			.containerarea { width:100%; height:100%; padding:0 30px; box-sizing:border-box; overflow:visible; margin:0 auto; }
		
	#bottom { position:relative; width:100%; min-width:100%; border-top:1px solid #ddd; background:#fff; z-index:4; }
		#bottomarea { position:relative; width:100%; padding:40px 0 40px 0; margin:0 auto; z-index:5; }
}


@media (max-width:768px){
	html, body, #gaonwrap { min-width:100%; width:100%; }
		
	#top { position:relative; min-width:100%; width:100%; height:70px; border-bottom:1px solid #ddd; background:#fff; }
		#toparea { position:relative; width:100%; height:70px; margin:0 auto; overflow:visible; } 
		
	/*#container { position:relative; min-width:1280px; width:100%; z-index:2; margin-bottom:100px; }*/
		
		#container { position:relative; width:100%; height:800px; padding:30px 0 0 0; box-sizing:border-box; background:url(/images/child/main/main_bg2.jpg) no-repeat bottom center; }
			.containerarea { width:100%; height:100%; padding:0 30px; box-sizing:border-box; overflow:visible; margin:0 auto; }
		
	#bottom { position:relative; width:100%; min-width:100%; border-top:1px solid #ddd; background:#fff; z-index:4; }
		#bottomarea { position:relative; width:100%; padding:40px 0 40px 0; margin:0 auto; z-index:5; }
}




/* 타이틀 */
#top h1.title { position:absolute; left:0; top:75px; }

@media (min-width:1025px) and (max-width:1280px){
	
}


@media (min-width:769px) and (max-width:1024px){
	#top h1.title { left:calc(50% - 83px); right:auto; top:17px; text-align:center; margin:0; }
	#top h1.title img { height:54px; }
	.sidenav h1 img { height:37px; } 
}

@media (max-width:768px){
	#top h1.title { left:calc(50% - 57px); right:0; left:0; top:14px; text-align:center; margin:0; }
	#top h1.title img { height:37px; }
	
	.sidenav h1 img { height:37px; } 
}



/* 모바일용 상단 버튼 */
.mobileTopBtn { display:none; width:0; height:0; overflow:hidden;  }

@media (min-width:769px) and (max-width:1024px){
	.mobileTopBtn { display:block; }
	.mobileTopBtn li.mobileTopBtn1 { position:absolute; left:25px; top:24px; display:block; }
	.mobileTopBtn li.mobileTopBtn2 { position:absolute; right:21px; top:24px; display:block; }
}


@media (max-width:768px){
	.mobileTopBtn { display:block; }
	.mobileTopBtn li.mobileTopBtn1 { position:absolute; left:15px; top:22px; display:block; }
	.mobileTopBtn li.mobileTopBtn2 { position:absolute; right:15px; top:22px; display:block; }
	.mobileTopBtn li.mobileTopBtn1 img { width:18px; }
	.mobileTopBtn li.mobileTopBtn2 img { width:20px; }
}



/* 모바일용 외부 링크 */
.mobileLink { display:none; width:0; height:0; overflow:hidden; }

@media (min-width:769px) and (max-width:1024px){
	.mobileLink {position:absolute; left:0; top:88px; width:100%; height:auto; border-top:1px solid #ddd; border-bottom:1px solid #0b2557; background:#f9f9f9; overflow:visible; z-index:10; }
	.mobileLink ul { width:100%; overflow:hidden; }
	.mobileLink ul li { float:left; width:calc(20% + 1px); height:40px; line-height:40px; border:1px solid #ddd; box-sizing:border-box; text-align:center; font-size:90%; letter-spacing:-1px; margin:-1px 0 0 -1px; }
    .mobileLink ul li:nth-child(5n) { border-right:none; } 
	
	.mobileLink ul li a:link,
	.mobileLink ul li a:visited { width:100%; color:#555; display:block; }
	.mobileLink ul li a:active,
	.mobileLink ul li a:focus,
	.mobileLink ul li a:hover,
	.mobileLink ul li a.select { background:#fff; color:#0a72a7; }
}


@media (max-width:768px){
	.mobileLink { position:absolute; left:0; top:65px; width:100%; height:auto; border-top:1px solid #ccc; border-bottom:1px solid #666; background:#fff; z-index:1000; }
	.mobileLink ul { width:100%; overflow:hidden; }
	.mobileLink ul li { float:left; width:calc(20% + 1px); height:auto; padding:10px 0 10px 0; border:1px solid #ddd; box-sizing:border-box; text-align:center; font-size:90%; letter-spacing:-1px; margin:-1px 0 0 -1px; }	
	.mobileLink ul li:nth-child(5n) { border-right:none; }
	
	.mobileLink ul li a:link,
	.mobileLink ul li a:visited { width:100%; color:#555; display:block; }
	.mobileLink ul li a:active,
	.mobileLink ul li a:focus,
	.mobileLink ul li a:hover,
	.mobileLink ul li a.select { background:#fff; color:#0a72a7; }
}
@media (max-width:425px){
	.mobileLink ul li { float:left; width:calc(25% + 1px); padding:8px 0 8px 0; }	
	.mobileLink ul li:nth-child(5n) { border-right:1px solid #ddd; }
	.mobileLink ul li:nth-child(4n) { border-right:none; } 
	
}


/* 외부 링크 */
.underLink { position:relative; float:left; }
.underLink > ul { overflow:visible; border-left:1px solid #6690b9; }
.underLink > ul > li { float:left; width:140px; height:50px; border-right:1px solid #6690b9; }
.underLink > ul > li > a:link,
.underLink > ul > li > a:visited { width:100%; height:50px; line-height:50px; text-align:center; color:#ccc; font-size:95%; display:block; }
.underLink > ul > li > a:active,
.underLink > ul > li > a:focus,
.underLink > ul > li > a:hover { color:#fff; }
.underLink > ul > li > a.select { background:#fff; color:#000; font-weight:bold; }

.underLink > ul > li:nth-child(3) { padding-right:32px; box-sizing:border-box; background: url(/images/inc/underLink_arrow.png) no-repeat right 50%; text-align:left; }

.underLink > ul li .memberHomeList { position:absolute; left:0; top:61px; width:500px; padding:15px; border:1px solid #ddd; box-sizing:border-box; background:#fff; display:none; z-index:10000; }
.underLink > ul li .memberHomeList li { float:left; width:20%; }
.underLink > ul li .memberHomeList li a:link,
.underLink > ul li .memberHomeList li a:visited { width:100%; height:30px; line-height:30px; color:#333; text-align:center; display:inline-block;  }
.underLink > ul li .memberHomeList li a:active,
.underLink > ul li .memberHomeList li a:focus,
.underLink > ul li .memberHomeList li a:hover { color:#ff7505; }


@media (min-width:1025px) and (max-width:1280px){
	.underLink > ul { border-left:none; }
}


@media (min-width:769px) and (max-width:1024px){
	.underLink { display:none;}
}

@media (max-width:768px){
	.underLink { display:none;  }
}


/* 폰트설정 */
.fontszie { float:right; }
.fontszie ul { overflow:hidden; border-left:1px solid #6690b9; }
.fontszie ul li { float:left; width:50px; height:50px; border-right:1px solid #6690b9; }

.fontszie ul li a:link,
.fontszie ul li a:visited { display:block; }
.fontszie ul li a:active,
.fontszie ul li a:focus,
.fontszie ul li a:hover { background:#3e6d99; }


@media (max-width:1024px){
	.fontszie { display:none; } 	 	
}




/* 메인 메뉴 */
#menu { position:absolute; right:0; top:85px; }
#topMenu { position:relative; overflow:visible !important; }

#topMenu > li { position:relative; float:left; text-align:center; display:inline-block; }

#topMenu > li > a:link,
#topMenu > li > a:visited { height:100px; vertical-align:top; padding:0 60px; box-sizing:border-box; color:#222; font-size:140%; font-family:"PGOV"; font-weight:800; letter-spacing:-1px; display:block; }
#topMenu > li > a:active,
#topMenu > li > a:focus,
#topMenu > li > a:hover,
#topMenu > li > a.select { color:#ff7505;  }


@media (min-width:1153px) and (max-width:1280px){
	#topMenu > li > a:link,
	#topMenu > li > a:visited { padding:0 20px;  }
}


@media (min-width:1025px) and (max-width:1152px){
	#topMenu > li > a:link,
	#topMenu > li > a:visited { padding:0 13px;  }
}

@media (min-width:769px) and (max-width:1024px){
	#menu { display:none;  }
}


@media (max-width:768px){
	#menu { display:none; } 
}
	



/* 메인텍스트 */
.mText1 { font-size:270%;  font-family:"PGOV"; font-weight:800; color:#111; letter-spacing:-2px; }
.mText1 span { font-size:110%;color:#5584b1; }
.mText2 { font-size:170%; margin:-5px 0 30px 0; }

@media (min-width:1025px) and (max-width:1280px){
	.mText1 { font-size:240%; }
	.mText2 { margin:-5px 0 20px 0; }
	
}

@media (min-width:769px) and (max-width:1024px){
	.mText1 { font-size:190%; }
	.mText2 { margin:-5px 0 20px 0; }
}


@media (max-width:768px){
	.mText1 { font-size:170%; }
	.mText2 { font-size:150%; margin:-5px 0 30px 0; }
}

@media (max-width:640px){
	.mText1 { font-size:150%; }
	.mText2 { font-size:100%; margin:-5px 0 30px 0; }
}



/* 사이트링크 */
.link { float:left; width:560px; margin-right:20px; overflow:hidden; }
.link ul { width:100%; }
.link ul li { float:left; width:calc(50% - 15px); height:90px; line-height:90px; margin-right:15px; }
.link ul li:last-child { margin-right:0; margin-left:15px;  }

.link ul li a:link,
.link ul li a:visited { width:100%; height:100%; padding:0 20px; box-sizing:border-box; border-radius:15px; background:#fff url(/images/child/main/link_btn_off.png) no-repeat right center; font-size:120%; color:#888; display:block; }
.link ul li a:active,
.link ul li a:focus,
.link ul li a:hover { background:#5584b1 url(/images/child/main/link_btn_on.png) no-repeat right center; color:#fff; }

@media (min-width:769px) and (max-width:1024px){
	.link { float:none; margin:0 auto; }
}

@media (max-width:768px){
	.link { width:100%; margin:0px 0px 20px 0px;}
	.link ul { width:100%; }
}


@media (max-width:640px){
	.link ul li { line-height:1.4; }
	.link ul li a:link,
	.link ul li a:visited {  padding-top:15px; box-sizing:border-box; background:#5584b1; color:#fff; text-align:center; }	
	
	.link ul li a span { display:block; }
	
}





/* 퀵메뉴 */
.quick { float:right; width:470px; display:block; }
.quick ul { width:100%; }
.quick ul li { float:left; width:calc(50% - 15px); height:220px; margin:0 30px 30px 0; }
.quick ul li:nth-child(2n-0) {margin-right:0; }
.quick ul li a:link, 
.quick ul li a:visited { width:100%; height:100%; padding:10px; border:10px solid #fff; box-sizing:border-box; border-radius:15px; display:block; background:#fff; font-size:120%; color:#5584b1; letter-spacing:-1px; }
.quick ul li a:active,
.quick ul li a:focus,
.quick ul li a:hover { border:10px solid #5584b1; padding:10px; }

.quick ul li.q1 a { background:#fff url(/images/child/main/icon1.png) no-repeat center bottom; }
.quick ul li.q2 a { background:#fff url(/images/child/main/icon2.png) no-repeat center bottom; }
.quick ul li.q3 a { background:#fff url(/images/child/main/icon3.png) no-repeat center bottom; }
.quick ul li.q4 a { background:#fff url(/images/child/main/icon4.png) no-repeat center bottom; }

@media (min-width:1025px) and (max-width:1280px){
		
}


@media (max-width:1024px){
	.quick { float:none; width:100%; margin-top:30px; }
	.quick ul li { float:left; width:calc(50% - 20px); margin:0 40px 40px 0; }
	.quick ul li:nth-child(2n-0) {margin:0 0 40px 0; }
	.quick ul li a { width:100%; display:block;}
	

}


@media (max-width:640px){
	.quick ul li { float:left; width:calc(50% - 10px); height:200px; margin:0 10px 20px 0; }
	.quick ul li:nth-child(2n-0) {margin:0 0 20px 10px; }
	
	.quick ul li a:link, 
	.quick ul li a:visited { font-size:95%; }
	
}







/* 하단 */
#bottom #bottomarea address { color:#333; margin:0 0 25px 20px; }
#bottom #bottomarea address span { margin-right:20px; }

#bottom #bottomarea .copyright { font-size:90%; font-family:Arial, Helvetica, sans-serif; color:#888; margin:0 0 0 20px; } 

#bottom .topbtn { position:absolute; right:30px; bottom:30px; z-index:100001; }


@media (min-width:1025px) and (max-width:1280px){
	#bottom .bottomLink > ul { width:100%; }
}



@media (min-width:769px) and (max-width:1024px){
	#bottom .bottomLink > ul { width:100%; }
}


@media (max-width:768px){
	#bottom .bottomLink { display:none; }
	
	
	#bottom #bottomarea .bottomMenu { width:100%; text-align:center; font-size:95%; letter-spacing:-1px; }
	#bottom #bottomarea .bottomMenu ul li { float:none; display:inline; line-height:1.8;  }	
	
	#bottom #bottomarea address { color:#333; margin:0 0 10px 20px; }
	#bottom #bottomarea address span { margin-right:20px; }
	
	#bottom #bottomarea .copyright { font-size:90%; font-family:Arial, Helvetica, sans-serif; color:#888; margin:0 0 0 20px; } 
	
	#bottom #bottomarea .topbtn { position:absolute; right:0; bottom:0; }
}

@media (max-width:425px){
	#bottom #bottomarea address { text-align:center; margin:0 0 10px 0px; }
	#bottom #bottomarea address span:first-child { display:block; margin-bottom:5px;}
	#bottom #bottomarea address span { text-align:center; margin-right:20px; }
	
	#bottom #bottomarea .copyright { text-align:center;  margin:0; } 
	
	#bottom #bottomarea .topbtn { position:absolute; right:0; bottom:0; }
}

















































