@charset "utf-8";

/* 상단메뉴 */
#header { width:100%; z-index:2 }
#headerM {display: none;}

/* 소메뉴 */
#top_sm { width: 100%; max-width: 1270px; margin:0 auto; z-index:30;}
#top_sm .smenu { float:right; width:160px; background:#fff; padding:0; overflow:hidden; }
#top_sm .smenu.login { width:200px }
#top_sm .smenu ul { width:auto; padding:0; }
#top_sm .smenu li { display:inline-block; width: auto; height:35px; line-height:35px; margin:0 }
#top_sm .smenu li a { height:auto; font-size:13px; color:#999; padding:0 0 0 35px; }
#top_sm .smenu li:first-child a { background:url('../images/top/smenu1.gif') no-repeat 12px center }
#top_sm .smenu li:last-child a { background:url('../images/top/smenu2.gif') no-repeat 14px 7px }

/* gnb 전체 감싸는 영역 */
#gnb { position:relative; width:100%; background:#fff url('../images/top/top_bg.gif') repeat-x; z-index:20;}
#gnb .wrap { clear:both; max-width:1270px; margin:0 auto; height:97px; }
	
/* 로고 */
#gnb h1 { float:left; width:370px; padding-top:27px; }
#gnb h1 img {max-width: 100%;}

/* gnb 대메뉴 공통 속성 */
#gnb ul { float:left; width:calc(100% - 370px); padding-top:43px; }
#gnb ul li { float:left; width: 20%; height:54px; text-align: center;}
#gnb ul li a { display:block; padding:0 10px; height:54px; font-family: 'Nanum Square-b', 'Nanum Gothic'; font-size:18px; letter-spacing:-0.5px; color:#201d1b; }
#gnb ul li a:hover, 
#gnb ul li a:focus { color:#475893; }
#gnb ul li a.on { color:#475893; border-bottom:3px solid #475893; background:url('../images/top/top_on.png') no-repeat center bottom; }
#gnb ul li a.active { color:#475893; }

/* 서브메뉴 펼쳐졌을때 서브ul을 감싸는 영역-처음에는 안보이게 설정*/
#gnb ul li .sub {position:relative; height:190px; display:none; }

/* 서브메뉴 공통속성 -처음에는 안보이게 설정 */
#gnb ul li ul {width: 100%;  display:none; position:absolute; left:0; top:0; padding-top:20px; padding-left: 40px; }
#gnb ul li ul li {width: 100%; clear:both; height:29px; margin-left:0; }
#gnb ul li ul li a {width: 100%; display:block; height:auto; line-height:24px; font-family: 'Nanum Gothic'; font-weight:normal; text-align:left; cursor:pointer; font-size:13px; }
#gnb ul li.g6 ul li.s2 a {  letter-spacing:-1px; }

/* 서브메뉴 오버하기 전 글자 속성 */
#gnb ul li ul li a { color:#fff; }

/* 서브메뉴 오버했을때 글자 속성 */
#gnb ul li ul li a:hover,
#gnb ul li ul li a:focus { background:none; border:none; display:block; color:#afbfe1; font-weight:bold}

/* 서브메뉴 펼쳐졌을 때 전체 영역-처음에는 안보이게 설정 */
#sub { display:none; position:absolute; left:0; top:96px; width:100%; height:230px; background:#475893 url('../images/top/top_bg.png'); z-index:10;}

/* 서브메뉴 영역 */
#sub .wrap { position:relative; width:1270px; margin:0 auto; height:230px; }

/* 서브메뉴 펼쳐졌을때 왼쪽 이미지 영역 */
#sub .subimg { position:absolute; left:0; top:60px; width:370px; height:160px;/* border-right:1px solid #889aca;*/ }
#sub .img1 { background:url('../images/top/simg1.png') no-repeat 0 20px; }
#sub .img2 { background:url('../images/top/simg2.png') no-repeat 0 20px; }
#sub .img3 { background:url('../images/top/simg3.png') no-repeat 0 20px; }
#sub .img4 { background:url('../images/top/simg4.png') no-repeat 0 20px; }
#sub .img5 { background:url('../images/top/simg5.png') no-repeat 0 20px; }
#sub .img6 { background:url('../images/top/simg6.png') no-repeat 0 20px; }

@media (max-width: 1280px) {
	#sub .subimg {left: 30px;}
}

@media (max-width: 1120px) {
	#sub .subimg {left: 30px;}
	#gnb ul li ul { padding-left: 20px; }
}

@media (max-width: 1025px) {
	#gnb ul li ul { padding-left: 0px; }
}










/* 모바일상단메뉴 */
#headerM { position:fixed; left:0; top:0; width:100%; height:60px; background:#fff; box-shadow:0px 0px 6px rgba(0, 0, 0, 0.35); z-index:20000;}
#headerM h1 {margin-left: 20px; padding-top: 18px;}
#headerM h1 img { width:220px; }
#gnbM { position:relative; margin:0 auto; max-width:1024px; }

/* 모바일 상단메뉴 =============================== */
.open_sidemenu { position:absolute; right:15px; top:20px; width:31px; height:21px; font-size:0; background:url('/_mobile/images/top/icon_open.gif') no-repeat; }
.sidemenu_box { position:relative; min-height:100%; height:auto; display:none; z-index:1000000; }
.sidemenu_box_bg { position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.7; filter:alpha(opacity=70);}

/* 모바일 메뉴 닫기 */
.close_sidemenu_bg { position:relative; display:block; width:100%; height:60px; background:#1b2388; }
.close_sidemenu_bg span.mem { position:absolute; left:15px; top:15px; width:32px; height:32px; background:url('/_mobile/images/top/icon_mem.png') no-repeat; background-size:100%; }
.close_sidemenu_bg .tit { position:absolute; display:block; left:65px; top:22px; }
.close_sidemenu_bg .tit span { font-size:15px; color:#fff; vertical-align:top }
.close_sidemenu_bg .tit a { font-family:'Nanum Square-b'; font-size:15px; color:#fff; }
a.close_sidemenu { position:absolute; right:18px; top:18px; width:19px; height:19px; background:url('/_mobile/images/top/icon_close.gif') no-repeat; }

/* 모바일 메뉴 스크롤 */
#sidemenu_wrap { overflow:auto; position:absolute; width:100%; top:70px; bottom:0; z-index:1;  }
.sidemenu_w { position:fixed; top:0; bottom:0; right:-310px; width:300px; background:#fff; }
.sidemenu_w.open {right:0px;}

/* 모바일 메뉴 스타일 */
.sidemenu { position:absolute; width:100%; background:#fff; }
.sidemenu a.toggle span { 
	z-index:10000; position:absolute; top:50%; margin-top:-3px; right:20px;
	 width:11px; height:6px; background:url('/_mobile/images/top/sidemenu_bullet.gif') no-repeat;
	-webkit-transition:all 0.3s ease-in-out; 
	-moz-transition: all 0.3s ease-in-out; 
	-o-transition: all 0.3s ease-in-out; 
	-ms-transition: all 0.3s ease-in-out; 
	transition: all 0.3s ease-in-out; 
}
.sidemenu a.expanded span { 
	-webkit-transform: rotate(180deg); 
	-moz-transform: rotate(180deg); 
	-o-transform: rotate(180deg); 
	-ms-transform: rotate(180deg); 
	transform: rotate(180deg);
}
.sidemenu ul ul.submenu, 
.sidemenu ul ul.submenu li ul.submenu { display: none; }

.sidemenu ul li a.mm { position:relative; display:block; text-indent:20px; height:45px; line-height:45px; color:#000; font-weight:bold; text-align:left;
font-family:'Nanum Square-b'; font-size:16px; background:#fff; border-bottom:1px solid #dadada; }
.sidemenu ul li a.mm.toggle { position:relative; display:block; text-indent:20px; height:45px; line-height:45px; color:#000; font-weight:bold; text-align:left; 
font-family:'Nanum Square-b'; font-size:16px; background:#fff; border-bottom:1px solid #dadada; }
.sidemenu ul li a.mm.expanded { color:#1b2388; }
.sidemenu ul ul.submenu li a { position:relative; display:block; width:100%; height:40px; line-height:40px; background:#b7ddef; 
font-family:'Nanum Square-b'; font-size:13px; color:#272727; text-align:left; text-indent:20px; border-bottom:1px solid #fff }
.sidemenu ul ul.submenu li a.toggle span { margin-top:-4px; width:11px; height:11px; background:url('/_mobile/images/top/sidemenu_bullet2.gif') no-repeat; }



@media (max-width: 1280px) {
	#gnb h1 {width: 250px; margin-left: 50px; margin-right: 20px; padding-top:34px;}
	#gnb ul {width: calc(100% - 320px);}
}

@media (max-width: 980px) {

	#header {display: none;}
	#headerM {display: block;}
}