﻿body { min-width:1200px; }

/* 로고 */
#header { position:fixed; top:0; display:block; width:100%; height:68px; margin:0 auto; z-index:10; }
#header > h1 { position:absolute; display:block; left:50%; top:22px; width:145px; margin:0; margin-left:-600px; overflow:hidden; }
#header > #btn_total { display:none; }

/* GN : 영역 */
#btn_n_close { display:none; }
#gn_area { position:absolute; display:block; left:50%; top:0; margin-left:-318px; z-index:129; }
#gn_area ul { display:block; list-style:none; margin:0; padding:0; box-sizing:border-box; }
#gn_area ul li { display:block; box-sizing:border-box; }
#gn_area ul li a { display:block; box-sizing:border-box; }

#gn_area > ul { }
#gn_area > ul > li { position:relative; float:left; }
#gn_area > ul > li > a { width:100%; height:50px; line-height:1.5; padding:26px 42px 10px; font-size:1em; font-weight:400; color:#000; overflow:hidden; }
#gn_area > ul > li:hover > a { font-weight:700; }
#gn_area > ul > li.current > a { font-weight:700; }
#gn_area > ul > li:hover .sn { display:block; }

#gn_area > ul > li .point { position:absolute; left:50%; top:-7px; display:block; width:13px; height:13px; background:url('../../images/common/gn_point.png') no-repeat center; }
#gn_area .sn { position:absolute; left:50%; top:118px; display:none; width:330px; margin-left:-160px; text-align:center; background:#225165; }
#gn_area .sn:after { display:block; content:""; clear:both; }
#gn_area .sn > ul { width:100%; height:100%; margin:0; padding:22px 20px; }
#gn_area .sn > ul:after { display:block; content:""; clear:both; }
#gn_area .sn > ul li { display:block; float:left; }
#gn_area .sn > ul li a { padding:0 6px; font-size:0.83em; color:#fff; letter-spacing:-0.5px; }
#gn_area .sn > ul li:hover a { font-weight:500; text-decoration:underline; }
#gn_area .sn > ul > li > ul { display:none; }
#gn_area .sn5 { width:205px; margin-left:-105px; }

#gn_link { position:absolute; right:50%; top:26px; margin-right:-530px; }
#gn_link > ul { display:block; margin:0; padding:0; list-style:none; overflow:hidden; }
#gn_link > ul > li { display:block; float:left; overflow:hidden; }
#gn_link > ul > li a { display:block; padding:2px 10px; font-size:0.75em; }
#gn_link > ul > li:nth-child(1) a { background:url('../../images/common/bar1.png') no-repeat right center; }

#gn_area .selectbox { position:absolute; right:50%; top:18px; display:block; width:45px; margin-right:-597px; font-size:0.75em; color:#000; border-bottom:1px solid #000; cursor:pointer; }
#gn_area .selectbox span { display:block; width:100%; height:29px; line-height:29px; padding:0 6px; background:url('../../images/common/icon_arrow.png') no-repeat 90% 50%; box-sizing:border-box; }
#gn_area .selectbox ul { position:absolute; left:0; top:30px; display:none; width:100%; height:auto; margin:0; padding:5px 0; list-style:none; background:#fff; border:1px solid #414141; box-sizing:border-box; overflow:hidden; }
#gn_area .selectbox ul li a { display:block; padding:5px 0; color:#606060; text-align:center; }
#gn_area .selectbox ul li:hover a { font-weight:600; color:#000; }

/* 상단 검색 버튼 */
#top_search_area { position:absolute; display:block; right:50%; top:74px; width:50px; height:59px; margin:0; margin-right:-600px; }
#top_search_area > .btn_top_search { display:block; width:100%; height:59px; text-align:center; }
#top_search_area > .btn_top_search:after { font-family:'FontAwesome'; line-height:59px; content:'\f002'; }
#top_search_area > .btn_top_search span { font-size:0; }

#top_search_area > .btn_top_search_active { display:block; width:100%; height:59px; text-align:center; background:#2d2e33; }
#top_search_area > .btn_top_search_active:after { font-family:'FontAwesome'; line-height:59px; color:#fff; content:'\f00d'; }
#top_search_area > .btn_top_search_active span { font-size:0; }

/* 상단 검색 박스 */
#top_search_box { position:absolute; display:none; right:50%; top:133px; width:370px; height:auto; margin-right:-600px; padding:6px; background:#f4f4f4; border:5px solid #2d2e33; box-sizing:border-box; overflow:hidden; }
#top_search_box > input[type=text] { display:inline-block; width:calc(100% - 40px); height:34px; line-height:34px; text-indent:5px; border:1px solid #ccc; box-sizing:border-box; outline:0; }
#top_search_box > button { display:inline-block; width:34px; height:34px; font-size:13px; color:#fff; background:#000; border:0; outline:0; }

/* 푸터 */
#footer { position:relative; display:block; height:174px; background:#333; overflow:hidden; clear:both; }
#footer .foot_sns { position:relative; display:block; width:auto; box-sizing:border-box; overflow:hidden; }
#footer .foot_sns ul { display:block; max-width:1200px; margin:0 auto; padding:25px 0; list-style:none; overflow:hidden; }
#footer .foot_sns ul li { display:block; float:left; padding:0 12px; }
#footer .foot_sns ul li:first-child { padding-left:0; background:none; }
#footer .foot_sns ul li a { display:block; font-size:0.93em; font-weight:500; color:#fff; }
#footer .foot_sns ul li:hover a { }

#footer .foot_txt { width:auto; max-width:1200px; line-height:2; margin:0 auto; padding:5px 0 34px; font-size:0.87em; color:#aeaeae; box-sizing:border-box; clear:both; overflow:hidden; }
#footer .foot_txt p { display:block; }
#footer .foot_txt p span { padding-right:13px; }
#footer .foot_txt p span:first-child { background:none; }
#footer .foot_txt p .btn_ims { display:inline-block; width:30px; height:18px; line-height:18px; margin-left:5px; font-size:0.625em; color:#878787; text-align:center; background:#f5f5f5; border-radius:3px; }

#footer .sitebox { position:absolute; right:50%; top:74px; display:block; width:171px; height:32px; line-height:32px; margin-right:-600px; font-size:0.87em; color:#fff; border:1px solid #a1a1a1; box-sizing:border-box; cursor:pointer; }
#footer .sitebox span { display:block; width:100%; height:32px; line-height:32px; padding:0 17px; background:url('../../images/common/icon_arrow2.png') no-repeat 90% 50%; box-sizing:border-box; }
#footer .sitebox ul { position:absolute; left:-1px; top:31px; display:none; width:171px; height:auto; margin:0; padding:5px 0; list-style:none; background:#fff; border:1px solid #fff; box-sizing:border-box; overflow:hidden; }
#footer .sitebox ul li a { display:block; line-height:2; padding:0 17px; color:#606060; }
#footer .sitebox ul li:hover a { font-weight:600; color:#000; }

.btn_all_top { position:absolute; right:50%; top:18px; display:block; width:39px; height:39px; line-height:39px; margin-right:-590px; font-size:0.87em; color:#fff !important; text-align:center; background:#666; border-radius:50px; }

/* 메인 프레임 */

/* 화면 사이즈 별 스타일시트 */
/*@media (max-width:1500px) {
	#gn_link > ul > li a { color:#fff; }
	#gn_area .selectbox { color:#fff; }
}*/

@media (max-width:1250px) {
	#footer { padding:0 20px ; }
}

@media (max-width:1200px) {
	#gn_area { left:15%; margin-left:0; }
	#gn_area { right:150px; margin-right:0; }
	#gn_area > ul > li > a { font-size:0.93em; }
	#gn_link { top:28px; margin-right:-400px; }
	#gn_area .selectbox { margin-right:-450px; }

	#top_area { left:auto; right:0; margin-left:0; }
	#top_area > ul { padding-right:10px; }
	#header > h1 { left:15px; margin-left:0; }
	#footer .foot_logo { left:20px; }
}

@media (max-width:1024px) {
	body { min-width:320px; }

	/* 로고 */
	#header { position:absolute; display:block; left:0; top:0; width:100%; min-width:100%; height:70px; margin:0; background:none; box-sizing:border-box; z-index:1000; }
	#header > h1 { position:relative; left:20px; top:22px; width:100px; margin:0; overflow:hidden; }
	#header > h1 a { display:block; }
	#header > h1 img { max-width:100%; }
	#header > #btn_total { position:absolute; display:block; right:10px; top:0; bottom:0; width:40px; height:40px; line-height:40px; margin:auto 0; text-align:center; background:#353331; border-radius:0.3em; cursor:pointer; }
	#header > #btn_total:after { font-family:'FontAwesome'; font-size:22px; color:#fff; content:'\f0c9'; }
	#header > #btn_total > .txt { font-size:0; }

	/* 우측 사이드 메뉴 영역 */
	.m_side_area { position:fixed; display:none; right:-220px; top:0; width:220px; height:100%; background:#fff; box-sizing:border-box; overflow-x:hidden;  z-index:9999; }
	#btn_n_close { position:absolute; display:block; right:10px; top:12px; width:16px; height:16px; background:url('../../images/common/icon_close.png') no-repeat center center; background-size:100%; z-index:129; cursor:pointer; }
	#btn_n_close > .txt { font-size:0; }

	#gn_area { position:relative; left:auto; right:auto; top:auto; display:none; margin:0; padding:40px 0 0; background:#514d4b; }
	#gn_area > ul { }
	#gn_area > ul > li { float:none; background:#fff; border-bottom:0; }
	#gn_area > ul > li.home { display:none; }
	#gn_area > ul > li > a { width:100%; height:40px; line-height:40px; padding:0 10px; font-size:0.87em; font-weight:400; color:#333; background:url('../../images/common/gn_arrow.png') no-repeat 95% center; background-size:8px; border-bottom:1px solid #dbdbdb; }
	#gn_area > ul > li:first-child a { border-top:1px solid #d8d8d8; }
	#gn_area > ul > li:hover > a { color:#fff; background:#123577 url('../../images/common/gn_arrow_over.png') no-repeat 95% center; background-size:8px; }
	#gn_area > ul > li.current > a { color:#fff; background:#123577 url('../../images/common/gn_arrow_over.png') no-repeat 95% center; background-size:8px; }
	#gn_area > ul > li:hover .sn { display:none; }
	#gn_area > ul > li .point { display:none; }

	#gn_area .sn { position:relative; left:auto; top:auto; display:none; width:100%; height:auto; margin-left:0; background:#eee; box-shadow:none; border-bottom:1px solid #ccc;  }
	#gn_area .sn > ul { padding:0; }
	#gn_area .sn > ul > li { float:none; text-align:left; }
	#gn_area .sn > ul > li > a { height:34px; line-height:34px; padding:0 10px; font-size:0.81em; color:#333; background:url('../../images/common/m_bar1.gif') no-repeat 10px center; background-size:5px; border-bottom:1px solid #d8d8d8; }
	#gn_area .sn > ul > li:hover a { color:#225165; }
	#gn_area .sn > ul > li:last-child > a { border-bottom:0; }

	#gn_area .sn > ul > li > ul { display:none; background:#4d6cd7; }
	#gn_area .sn > ul > li > ul > li { }
	#gn_area .sn > ul > li > ul > li > a { padding:0 10px; font-size:0.75em; }
	#gn_area .sn2 > ul li { display:block; float:none; width:100%; }

	#gn_link { position:relative; right:auto; top:auto; margin:0; border-bottom:1px solid #ddd; transform:none; }
	#gn_link > ul { overflow:hidden; }
	#gn_link > ul > li { float:left; width:50%; height:auto; background-image:none !important; overflow:hidden; }
	#gn_link > ul > li a { display:block; width:100%; padding:10px; font-size:0.875em; color:#fff; text-align:center; }
	#gn_link > ul > li .labels { position:relative; left:auto; top:auto; }
	#gn_link > ul > li:nth-child(1) a { background:none; }
	#gn_link > ul > li:nth-child(1) a:after { position:absolute; left:50%; top:50%; width:1px; height:35%; background:#fff; transform:translateY(-50%); content:''; }

	/* 푸터 */
	#footer { height:auto; }
	#footer .sitebox { position:absolute; right:75px; top:22px; margin-right:0; }
	.btn_all_top { position:absolute; right:20px; margin-right:0; }

}

@media (max-width:768px) {
	#footer .foot_txt p span.email { display:block; }
}

@media (max-width:520px) {
	#footer { padding:0 20px 25px; }
	#footer .foot_sns { text-align:center; }
	#footer .foot_sns ul { display:inline-block; }
	#footer .foot_txt { padding:5px 0 20px; }
	#footer .sitebox { position:relative; right:auto; top:auto; margin:0 auto 15px; }

	.btn_all_top { position:fixed; top:auto; bottom:20px; }
}

@media (max-width:480px) {

}	

@media (max-width:430px) {

}

