/* 상단 영역 */
#header { position:fixed; display:block; left:0; top:27px; width:100%; height:93px; background:#f4f4f4; overflow:hidden; z-index:100; }
#header > h1 { position:absolute; left:50%; margin-left:-600px; }

#header > #btn_total { display:none; }
#btn_n_close { display:none; }

#top_area { position:fixed; display:block; left:0; top:0; width:100%; height:27px; background:#182f4f; overflow:hidden; z-index:100; }
#top_area > .top_btn { position:absolute; display:block; list-style:none; right:50%; height:100%; margin-right:-600px; overflow:hidden; }
#top_area > .top_btn:after { display:block; content:''; clear:both; }
#top_area > .top_btn > li { display:block; float:left; height:100%; }
#top_area > .top_btn > li > a { display:block; height:100%; line-height:27px; padding:0 20px; font-size:12px; color:#fff; font-weight:700; text-transform:uppercase; background:url('/share/top_btn_line.gif') no-repeat right center; }
#top_area > .top_btn > li:nth-last-child(1) a { padding-right:0; background-image:none; }

#gn_area { position:fixed; display:block; right:50%; top:59px; margin-right:-600px; z-index:101; }
#gn_area > .gn { display:block; list-style:none; margin:0; padding:0; }
#gn_area > .gn > li { position:relative; display:block; float:left; }
#gn_area > .gn > li > a { display:block; width:100%; height:61px; line-height:61px; padding:0 46px; font-size:18px; color:#333; font-weight:400; box-sizing:border-box; overflow:hidden; }
#gn_area > .gn > li:nth-last-child(1) a { padding-right:0; }

#gn_area .sn { position:absolute; display:none; left:0; top:61px; height:50px; overflow:hidden; }
#gn_area .sn > ul { display:block; list-style:none; width:100%; height:100%; overflow:hidden; }
#gn_area .sn > ul > li { display:block; float:left; height:100%; }
#gn_area .sn > ul > li > a { display:block; height:100%; line-height:50px; padding:0 15px; font-size:16px; color:#fff; font-weight:400; }

#gn_area .sn > ul > li > .ssn { display:none; }

#gn_area .sn1 { width:900px; }
#gn_area .sn2 { width:400px; }
#gn_area .sn3 { left:-100px; width:700px; }
#gn_area .sn4 { width:400px; }
#gn_area .sn5 { width:330px; }
#gn_area .sn6 { left:auto; right:-100px; width:500px; }

#gnb_bg { position:fixed; display:none; left:0; right:0; top:120px; width:100%; height:50px; background:rgba(0,51,102,0.7); overflow:hidden; z-index:100; }

/* 하단 영역 */
#footer { clear:both; display:block; background:#182f4f; overflow:hidden; }
#footer > .foot_inner { display:block; width:auto; max-width:1200px; margin:0 auto; padding:30px 0; overflow:hidden; }
#footer > .foot_inner > .foot_btn { display:block; list-style:none; margin-bottom:14px; overflow:hidden; }
#footer > .foot_inner > .foot_btn:after { display:block; content:''; clear:both; }
#footer > .foot_inner > .foot_btn > li { display:block; float:left; }
#footer > .foot_inner > .foot_btn > li > a { display:block; padding:10px 10px; font-size:12px; color:#fff; font-weight:700; background:url('/share/foot_line.gif') no-repeat right center; }
#footer > .foot_inner > .foot_btn > li:nth-child(1) a { padding-left:0; }
#footer > .foot_inner > .foot_btn > li:nth-last-child(1) a { background-image:none; }

#footer > .foot_inner > p { font-size:12px; color:#fff; font-weight:400; line-height:1.8; }

/* 중앙 영역 */
#m_body { display:block; margin:120px auto 100px; box-sizing:border-box; overflow:hidden; }
#s_body { display:block; margin:120px auto 100px; box-sizing:border-box; overflow:hidden; }
#s_body > #sub_cnt { display:block; width:auto; max-width:1200px; margin:0 auto; box-sizing:border-box; overflow:hidden; }

@media (max-width:1200px) {
}

@media (max-width:1024px) {
	/* 헤더 */
	#header { position:fixed; display:block; left:0; top:0; width:100%; min-width:100%; height:60px; margin:0; background:#fff; box-sizing:border-box; box-shadow:0 3px 5px rgba(0,0,0,0.3); overflow:hidden; z-index:130; }
	#header > h1 { position:relative; left:0; width:auto; height:100%; margin:0; overflow:hidden; }
	#header > h1 img { max-height:100%; }

	#header > #btn_total { position:absolute; display:block; right:10px; top:0; bottom:0; width:30px; height:30px; line-height:30px; margin:auto 0; text-align:center; background:#333399; border-radius:0.3em; }
	#header > #btn_total:after { font-family:'FontAwesome'; color:#fff; content:'\f0c9'; }
	#header > #btn_total > .txt { font-size:0; }

	/* 우측 사이드 메뉴 영역 */
	.m_side_area { position:fixed; display:block; right:-220px; top:0; bottom:0; width:220px; height:100%; background:#fff; box-sizing:border-box; overflow-y:auto; z-index:201; }
	#btn_n_close { position:absolute; display:block; right:10px; top:10px; width:auto; height:auto; padding:10px 10px; background:#444; z-index:202; }
	#btn_n_close:after { font-family:'FontAwesome'; font-size:16px; color:#fff; content:'\f00d'; }
	#btn_n_close > .txt { font-size:0; }

	#top_area { position:relative; display:block; left:auto; top:auto; width:auto; height:90px; background:#444; overflow:hidden; z-index:100; }
	#top_area > .top_btn { position:relative; display:block; list-style:none; right:auto; margin:50px 0 0; }

	#gn_area { position:relative; display:block; right:0; top:0; margin:0; }
	#gn_area > .gn > li { float:none; }
	#gn_area > .gn > li > a { height:40px; line-height:40px; padding:0 10px 0 20px !important; font-size:1em; font-weight:700; border-bottom:1px solid #ddd; }
	#gn_area > .gn > li > a:after { float:right; font-family:'FontAwesome'; color:#999; content:'\f078'; }

	#gn_area > .gn > li.current > a { color:#fff; background:#182f4f; }
	#gn_area > .gn > li.current > a:after { color:#eee; content:'\f077'; }

	#gn_area .sn { position:relative; display:none; left:auto; top:auto; height:auto; background:#eee; }
	#gn_area .sn > ul > li { float:none; height:auto; }
	#gn_area .sn > ul > li > a { height:40px; line-height:40px; font-size:0.875em; color:#333; border-bottom:1px solid #ddd; }
	#gn_area .sn > ul > li > a:before { margin-right:10px; font-family:'FontAwesome'; color:#999; content:'\f013'; }

	#gn_area .ssn { position:relative; display:none; left:auto; top:auto; width:100%; height:auto; background:#fff; }
	#gn_area .ssn > ul { }
	#gn_area .ssn > ul > li { float:none; height:auto; border-bottom:1px solid #ddd; }
	#gn_area .ssn > ul > li > a { display:block; height:40px; line-height:40px; padding-left:20px; font-size:0.875em; color:#333; }
	#gn_area .ssn > ul > li > a:before { margin-right:10px; color:#999; content:'\ -'; }

	#gn_area .sn1 { width:100%; }
	#gn_area .sn2 { width:100%; }
	#gn_area .sn3 { width:100%; }
	#gn_area .sn4 { width:100%; }
	#gn_area .sn5 { left:auto; right:auto; width:100%; }
	#gn_area .sn6 { left:auto; right:auto; width:100%; }

	#gn_area .sn2 > ul > li:nth-child(1) > a:after { float:right; font-family:'FontAwesome'; color:#999; content:'\f078'; }
	#gn_area .sn2 > ul > li:nth-child(2) > a:after { float:right; font-family:'FontAwesome'; color:#999; content:'\f078'; }
	#gn_area .sn2 > ul > li:nth-child(3) > a:after { float:right; font-family:'FontAwesome'; color:#999; content:'\f078'; }

	#gn_area .sn3 > ul > li:nth-child(2) > a:after { float:right; font-family:'FontAwesome'; color:#999; content:'\f078'; }
	#gn_area .sn3 > ul > li:nth-child(3) > a:after { float:right; font-family:'FontAwesome'; color:#999; content:'\f078'; }
	#gn_area .sn3 > ul > li:nth-child(4) > a:after { float:right; font-family:'FontAwesome'; color:#999; content:'\f078'; }

	/* 하단 영역 */
	#footer > .foot_inner { max-width:100%; padding:20px 20px; }

	/* 중앙 영역 */
	#m_body { margin:60px auto 50px; }
	#s_body { margin:60px auto 50px; }
	#s_body > #sub_cnt { max-width:100%; }
}
@media (max-width:480px){
	#m_body { margin:60px auto 10px; }
	#s_body { margin:60px auto 10px; }
}