@charset "utf-8";

/* Skip To Content */
.skipToContent{margin:0 auto;background:#fff ;width:1000px;text-align:center}
.skipToContent a{position:absolute;width:1px;height:0;left:0;top:0;overflow:hidden;color:#999;text-decoration:none;display:block;padding:5px 0;white-space:nowrap}
.skipToContent a:hover,
.skipToContent a:active,
.skipToContent a:focus{position:relative;height:auto;width:auto}

/* Layout */
#xe{ position:relative;}
#container{ position:relative;}
#header{ position:relative; clear:both; *zoom:1;}
#header:after{ content:""; display:block; clear:both;}
#body{ position:relative; clear:both; *zoom:1;}
#body:after{ content:""; display:block; clear:both;}
#content{ position:relative;*zoom:1;}
#content:after{ content:""; display:block; clear:both;}
#footer{ position:relative; clear:both; *zoom:1;}
#footer:after{ content:""; display:block; clear:both;}
#footer address{ text-align:center;}
.e1{ position:relative; display:block; *zoom:1;}
.e1:after{ content:""; display:block; clear:both;}
/* Footer Extension */
#footer .extension{ position:relative; *zoom:1;}
#footer .extension:after{ content:""; display:block; clear:both;}
#footer .extension .section{ position:relative;}
#footer .extension ul{ position:relative;}
#footer .extension li{ position:relative; display:inline; list-style:none;}

/*나눔고딕*/
@font-face{font-family:ngttf; src:url(../font/NanumGothic.ttf);}
@font-face{font-family:ngeot; src:url(../font/NanumGothic.eot);}

/* Element Reset */
body, input, button, textarea, table{font:12px/18px NanumGothic, 나눔고딕, ngttf, ngeot, Tahoma, Geneva, sans-serif;}

/* font */
#xe .wrap_ZineA li.Hanbiauthor,
#xe .wrap_ZineA li.Hanbititle,
#xe .normalATable td.Hanbiauthor a,
#xe .widgetGalleryA .Hanbiauthor,
#xe .widgetA .Hanbiauthor,
#xe .normalAwidget .author,
#xe .normalAwidget .Hanbiauthor,
#xe .wrap_GalleryA li.Hanbititle,
#xe .widgetThumb .thumb,
#xe .widgetTabA li a,
#xe div.hanbisimpleWidgetStyle h2{font-family:NanumGothic, 나눔고딕, ngttf, ngeot, Tahoma, Geneva, sans-serif;}
/* Element Reset */
html, body{height:100%}
body{margin:0;padding:0;background:#fff url(../img/BgBody.gif) repeat-x left top}
form, fieldset{border:0;margin:0;padding:0}
.hr {display:none; position:absolute;}
#header img,
#body .extension img{border:0;}
#header{z-index:3;}
#body{z-index:2;}
#footer{z-index:1;}
#header img,
.e1 img{border:0;}

/* ----- Column Layout ----- */

.c #body #content{width:980px;}
.ce #body .e1,
.ec #body .e1{ width:220px;}
.ce #body #content,
.ec #body #content{ width:730px; }
.ce #body #content{ float:left;}
.ec #body #content{ float:right;}
.ce #body .e1,
.ec #body .e1{ display:block;}
.ce #body .e1{ float:right;clear:right;}
.ec #body .e1{ float:left;clear:left;}
.ece #body #content{ width:550px; float:right; right:30px;}
.ece #body .e1{float:right;clear:right;width:220px;display:block;}
.ece #body .e2{float:left;clear:left;width:150px;display:block;}
.eceA #body #content{ width:500px; float:left;}
.eceA #body .e1{float:left;clear:left;width:220px;display:block; margin-right:20px}
.eceA #body .e2{float:right;clear:right;width:220px;display:block;}
/* -- IMG -- */
#header .account li,
.top_menu li,
.breadclumb li,
.Text_slide .slides_container div,
div.MoveLink h2 a,
.MenuStyleA h2 a{background-image:url(../img/Colection.gif); background-repeat:no-repeat;}

/* MenuStyleA 배경처리 */
.MenuStyleA{background:url(../img/MenuStyleA.gif) repeat left top;}
.MenuStyleA .inner_lnb,
.MenuStyleA h2,
.MenuStyleA .locNav{background-image:url(../img/MenuStyleA.png);}
.ece .e2 .MenuStyleA .inner_lnb,
.ece .e2 .MenuStyleA h2,
.ece .e2 .MenuStyleA .locNav{background-image:url(../img/MenuStyleA150.png);}
/* login form & notice */
#xe .login_white,
#xe .login_white form,
.E2Notice,
.E2Notice .notice_widget{background-image:url(../img/BgLogin.gif); background-repeat:no-repeat;}
/* li 라인 */
.MenuStyleB ul li,
.E2Notice h2,
#xe .login_white form ul.help,
#xe .login_white form .userName{background-image:url(../img/BgLnbLi.gif); background-repeat:repeat-x;}

#container{position:relative; width:980px; margin:0 auto;}
/* -- HEADER -- */
#header{ padding-top:26px;margin-bottom:11px;}
#header ul{margin:0; padding:0;}
#header li{list-style:none;}

/* - h1 - */
#header h1{margin:0; padding:0 10px; position:relative;text-align:center; top:0; z-index:2; overflow:hidden;}
.header_styleA h1{ height:90px; width:300px;}
.header_styleB h1{ height:60px; width:250px;}

/* - extension - */
#header .extension{position:relative; height:40px;z-index:3; background-position:left top;}
.ForhanbiSearch{position:absolute; top:-60px; left:340px; width:350px; height:50px;background-position:left -50px;z-index:2;}
.ForhanbiSearch .inputText{position:absolute; top:13px; left:27px; width:256px; height:20px; padding:2px; line-height:20px;cursor: auto;border:0; background:url(../img/empty.gif) repeat left top;}
.ForhanbiSearch .submit{position:absolute; height:27px; width:33px; top:11px; right:23px;}
.ForhanbiSearch.NonTextBanner{top:-70px;}
.header_styleB .ForhanbiSearch{top:-40px; left:290px; width:300px; height:30px;}
.header_styleB .ForhanbiSearch .inputText{top:0; left:0; border-width:4px; border-style:solid; width:250px; padding:1px}
.header_styleB .ForhanbiSearch .submit{right:2px; top:1px;}
/* - HeaderRight - */
.HeaderTop{position:absolute;float:right; width:970px; left:1px; top:-115px; height:24px;z-index:3; }
.header_styleB .HeaderTop{top:-85px;}
/* top_menu */
.top_menu{position:absolute; left:0; top:2px;_top:3px;}
.top_menu a{text-decoration:none; color:#888;}
.top_menu li{float:left; padding:0 12px 0 10px; background-position:right -15px;}
.top_menu li.last_top_li{background:none;}

/* - 언어 선택창 - */
#header .account{top:-1px; right:10px;float:right; position:relative;}
#header .account:after{content:""; display:block; clear:both;}
#header .account li{float:left; position:relative; background-position:left 10px; padding-left:3px;}
#header .account a,
#header .account button{ background:none; border:0; display:inline-block;height:24px;padding:0 10px;margin:0;line-height:24px;font-size:12px;color:#777;text-decoration:none;text-align:center;vertical-align:bottom;cursor:pointer;overflow:visible;}
#header .account li.wrap_log{background:none;}
#header .account ul{ display:block; width:105px;padding:5px 1px; position:absolute; top:21px; left:12px; background:#f7f7f7; border:1px solid #eeeeee; border-top:0;}
#header .account ul li{list-style:none; width:100%;padding:0; margin-bottom:1px;background:none; height:24px;}
#header .account ul li button{background:none; height:18px; line-height:18px; font-size:12px; padding:0 13px;font-family:Tahoma, sans-serif;}
#header .account .openlang{ display:none; *zoom:1;}
#header .account ul li.clo_lang{position:absolute; right:2px; top:2px;height:12px; width:10px;}

/* menu */
#header .menu{height:38px;*zoom:1; position:relative; clear:both; z-index:1; }
#header .main_menu{ position:relative; overflow:visible; *zoom:1; height:38px; padding-left:20px;}
#header .main_menu:after{ content:""; display:block; clear:both;}
#header .main_menu li{*zoom:1;position:relative; float:left; background-position: right -48px; padding-right:5px;}
#header .main_menu li.last_main_li{background:none;}
#header .main_menu a{text-decoration:none;}
#header .main_menu a.first_a{ display:inline-block; cursor:pointer; font-weight:bold;height:29px; line-height:29px; padding:4px 20px 3px 20px; color:#fff;text-transform:capitalize;}
#header .main_menu ul{position:absolute;_overflow:visible !important; top:34px; left:-2px; *zoom:1; width:170px; border-width:3px; border-style:solid;}
#header .main_menu ul a{width:145px; padding:0 15px 0 10px;float:left;  height:20px; line-height:20px; height:auto; font-weight:normal; *zoom:1; color:#666;text-shadow: 1px 1px 0 #fff;}
#header .main_menu .sub1{display:none;}
#header .main_menu li li{float:none; display:inline-block; *display:inline;_overflow:visible !important; background:#f9f9f9; height:27px; padding:0; padding-top:7px; margin:0;border-top:1px solid #fff; border-bottom:1px solid #e5e5e5; }
#header .main_menu li li.addLiColor{background:#f4f4f4;border-top:1px solid #fff; border-bottom:1px solid #e5e5e5;}

/* 2차메뉴 */

#header .main_menu ul li ul{top:-4px; left:170px;}
.view_children span.i{display:inline-block; height:11px; width:10px; margin:0; padding:0; background-position:left top; position:absolute; right:0; top:12px;}
.view_children .highlight .highlight span.i{background-position:left -30px;}

.main_menu div.back{background-position:50% -230px;height:10px; top:27px; position:absolute; z-index:-1; width:66px;}
/* SlideBanner */
#TopImgBanner{position:absolute;height:90px;width:200px; top:30px; right:0; z-index:1; }
#TopImgBanner .slides_container {width:200px;height:90px;display:none;}
#TopImgBanner .slides_container div {width:200px;height:90px;display:block;}
#TopImgBanner .pagination,
#TopTextBanner .pagination,
#BodyTextBanner .pagination{display:none;}
#TopImgBanner .prev,
#TopImgBanner .next{position:absolute; top:80px; left:200px;}
#TopImgBanner .next{top:90px;}
#TopTextBanner,
#BodyTextBanner{position:absolute;height:15px;width:310px; z-index:1;}
#BodyTextBanner{top:16px; right:20px; padding-left:200px;}
#BodyTextBanner .TitleTextBanner{position:absolute; left:-5px; text-align:right; height:15px;line-height:15px; color:#555; width:200px;}
#TopTextBanner{ top:35px; left:360px;}
.header_styleB #TopTextBanner{ top:60px;left:650px;}
.Text_slide .slides_container{height:15px;width:310px; display:none;}
.Text_slide .slides_container div{height:15px;width:295px; display:block; padding-left:15px; background-position:left -58px;*background-position:left -57px;_background-position:left -58px;}
.Text_slide a{display:block; color:#848484; width:295px; height:15px; line-height:15px; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;-o-text-overflow: ellipsis;}

/*header_styleB */

/* -- BODY -- */
#body{margin-bottom:12px;}
/* - CONTENT - */
/* BREADCLUMB */
.wrap_breadclumb{position:relative;*zoom:1; background:url(../img/BgWrap_breadclumb.png) no-repeat left bottom; padding:3px; padding-top:9px; height:26px; top:-20px; margin-bottom:-5px;}
.wrap_breadclumb:after{content:""; display:block; clear:both;}
.breadclumb{position:relative; *zoom:1; height:24px;padding:2px 0 0 0; margin:0; display:block;}
.breadclumb:after{content:""; display:block; clear:both;}
.breadclumb li{float:left; padding:0 10px 0 15px; list-style:none; background-position:left -83px;}
.breadclumb li.first_breadclumb{background:none;}
.breadclumb a{text-decoration:none;vertical-align:bottom; text-transform:capitalize;height:24px;_height:23px; font-size:12px; line-height:24px;_line-height:23px;position:relative;  display:inline-block; color:#676767;text-shadow: 0 1px 0 #e6e6e6; }
.breadclumb img{ position:relative; top:6px;}

/* WrapHanbiProducts */
#WrapHanbiProducts{height:300px; position:relative; margin-bottom:10px; top:-5px;}

/* Body Extension */
#body .extension{position:relative; *zoom:1; display:none;}
#body .extension:after{ content:""; display:block; clear:both;}
#body .extension li{position:relative; list-style:none;}
#body .extension a{text-decoration:none;}

/* Body Extension widget */
.wrap_widget h2 {color: #575757;margin:0;padding:4px 15px;height:24px;text-transform:capitalize;font-weight:bold; font-size:14px;}
.wrap_widget h2 a{color: #575757;padding:0;padding-right:20px;height:24px;line-height:24px;display:inline-block;}
.wrap_widget div.MoveLink h2 a{background-position: right -342px;}
.wrap_widget a{text-decoration:none;}
.hanbi_widget{position:relative;*zoom:1; margin-bottom:10px; }
.WidgetStyleA h2{background:url(../img/BgH2A.gif) repeat-x left bottom; padding-bottom:10px; margin-bottom:10px;}
.WidgetStyleC h2{background:url(../img/BgH2C.gif) repeat-x left bottom; padding-bottom:7px; margin-bottom:10px;}
.WidgetStyleD h2{padding-bottom:5px; margin-bottom:10px; border-bottom:1px solid #ddd;}
.WidgetStyleB{border:1px solid #ddd;}
.WidgetStyleB h2{background:url(../img/BgH2.gif) repeat-x left bottom; border:1px solid #fff;}
.WidgetStyleB .inner_hanbi_widget{border-top:1px solid #ddd; padding:6px;}
.WidgetStyleB .inner_hanbi_widget .WrapHanbiZineA{padding:0;}
.hanbi_widget:after{content:"";display:block;clear:both;}
.WidgetStyleA,
.WidgetStyleC,
.WidgetStyleD{margin-bottom:20px;}

/* Content */

/* - E1 - */
/* lnb */
.lnb{position:relative; *zoom:1; margin-bottom:10px;}
.lnb:after,
.inner_lnb:after{content:""; clear:both; display:block;}
.inner_lnb{position:relative; *zoom:1;}
.lnb h2{margin:0;font-size:14px; text-transform:capitalize;}
.lnb h2 a{display:block; color:#575757; text-shadow:1px 1px 0 #fff;}
.lnb a{line-height:20px; padding:4px 0;}
.lnb ul{padding:0; margin:0; *zoom:1; position:relative;}
.lnb ul li{padding:0 0 2px 0;position:relative;*zoom:1;}
.lnb ul li a{text-transform:capitalize;color:#555;text-shadow:1px 1px 0 #fff;}
.lnb ul li li a{text-transform:none; font-weight:normal;color:#777;}


/* e2 .MenuStyleA */
.MenuStyleA{padding:3px; margin-bottom:6px; top:-3px;}
.MenuStyleA .inner_lnb{background-position:-600px bottom; background-repeat:no-repeat; padding-bottom:7px;}
.MenuStyleA h2{background-position:left top; background-repeat:no-repeat; padding:10px 10px 18px 20px; height:24px;}
.MenuStyleA h2 a{padding:0 15px 0 5px; height:24px; line-height:24px;display:inline-block; position:relative;*zoom:1;background-position: right -342px;}
.MenuStyleA .locNav{background-position:-300px bottom; background-repeat:repeat-y; padding:0 2px 0 2px;}
.MenuStyleA ul li{padding:0 10px 3px 10px; background:url(../img/MenuStyleALi.gif) repeat-x left bottom;}
.MenuStyleA ul li.lastlocNav{background:none;}
.MenuStyleA ul li a{padding:5px 0 5px 20px; display:block; background-position:5px -330px;}
.MenuStyleA ul .active a{background-position:5px -380px;}
.MenuStyleA ul li li{padding:2px 0px 0 10px; background:url(../img/MenuStyleALiLi.gif) repeat-x left top;}
.MenuStyleA ul li.active li a,
.MenuStyleA ul li li a{background-position:10px -428px;}
.MenuStyleA ul li.active li.active a{background-position:10px -478px;}
.ece .e2 .MenuStyleA h2{padding-left:5px;}
.ece .e2 .MenuStyleA ul li{padding-left:5px;}
.ece .e2 .MenuStyleA ul li a{padding-left:15px;background-position:0 -330px;}
.ece .e2 .MenuStyleA ul .active a{background-position:0 -380px;}
.ece .e2 .MenuStyleA ul li.active li a,
.ece .e2 .MenuStyleA ul li li a{background-position:5px -428px;}
.ece .e2 .MenuStyleA ul li li{padding-left:5px;}
.ece .e2 .MenuStyleA ul li.active li.active a{background-position:5px -478px;}

/* MenuStyleB */
.MenuStyleB{background-position:-500px top; background-repeat:repeat-y; top:-1px}
.MenuStyleB h2{background-position:left top; background-repeat:no-repeat; padding:9px 15px 11px 10px; height:27px;} 
.MenuStyleB .inner_lnb{background-position:-1000px bottom; background-repeat:no-repeat;padding-bottom:9px; }
.MenuStyleB h2 a{position:relative; padding:4px; padding-right:17px; background-position:right -90px; _background-position:right -92px;  height:19px; line-height:19px; display:inline-block; *zoom:1;}
.MenuStyleB ul{padding:0 15px;}
.MenuStyleB a{display:block;}
.MenuStyleB ul li{background-position:left top;padding:2px 0 0 0;}
.MenuStyleB ul li.firstlocNav{background:none;}
.MenuStyleB ul li a{padding-left:17px;background-position:5px -131px;}
.MenuStyleB ul li.active a{background-position:5px -172px; _background-position:5px -173px;}
.MenuStyleB ul li li{background:url(../img/BgLnbLiLi.gif) repeat-x left top;}
.MenuStyleB ul li.active li a,
.MenuStyleB ul li li a{background-position:5px -240px; _background-position:5px -241px}
.MenuStyleB ul li.active li.active a{background-position:5px -281px; _background-position:5px -282px}
.ece .e2 .MenuStyleB ul{padding:0 10px;}
.ece .e2 .MenuStyleB ul li a{padding-left:12px;background-position:0 -131px;}
.ece .e2 .MenuStyleB ul li.active a{background-position:0 -172px; _background-position:0 -173px;}
.ece .e2 .MenuStyleB ul li.active li a,
.ece .e2 .MenuStyleB ul li li a{background-position:0 -240px; _background-position:0 -241px}
.ece .e2 .MenuStyleB ul li.active li.active a{background-position:0 -281px; _background-position:0 -282px}
/* OnFontColor */
.OnFontColor li.active li a{color:#555}

/* eceA형의 notice */
.E2Notice{padding-top:5px; background-position:left top; margin-bottom:10px;}
.E2Notice .notice_widget{padding:0 5px; background-position:left bottom; height:137px;}
.E2Notice h2{color: #575757;margin:0 0 3px 0;padding:1px 15px 6px 15px;height:22px;text-transform:capitalize;font-weight:bold; font-size:14px; background-position:left bottom;}
.E2Notice h2 a{color: #575757;padding:0;padding-right:20px;height:22px;line-height:22px;display:inline-block;}
#body .extension .E2Notice div.MoveLink h2 a {background-position: right -343px;}

/* Footer */

#footer{border-top:1px solid #aaa; padding:20px 10px 20px 10px;}
#footer .extension{position:relative;margin:0 auto; *zoom:1;}
#footer .extension:after{content:""; display:block; clear:both;}
#footer img.sitemap {border:0; float:left;}
.address{float:left; text-align:left; color:#444; margin:0; padding:0;}
.familyLink{ height:20px; padding:0; right:10px; *zoom:1; position:relative; float:right; }
.familyLink:after{content:""; clear:both; display:block;}
.familyLink select{border:1px solid #ddd;height:24px; padding:0;}
#footer a{ text-decoration:none;}
#footer a:hover,
#footer a:active,
#footer a:focus{ text-decoration:underline; color:#f5f5f5;}

/* Login */
#xe #memberModule .memberSmallBox .login .keep label {color:#fff;}
#xe .actHanbiLogin #body .extension,
#xe .actHanbiLogin #body #WrapHanbiProducts{background:none; display:none !important;}
.ece.actHanbiLogin #body #content,
.eceA.actHanbiLogin #body #content,
.ce.actHanbiLogin #body #content,
.ec.actHanbiLogin #body #content{width:980px !important; left:0; right:0;}
.actHanbiLogin #content div,
.actHanbiLogin #content ul,
.actHanbiLogin #content p,
.actHanbiLogin #content dl{display:none;}
.actHanbiLogin #content #memberModule,
.actHanbiLogin #content #memberModule div,
.actHanbiLogin #content #memberModule ul,
.actHanbiLogin #content #memberModule dl,
.actHanbiLogin #content #memberModule p{display:block;}
#xe #memberModule .memberSmallBox{ padding:12px 16px; border:0; margin-top:20px;}
#memberModule .memberSmallBox .header{font-size:16px; font-weight:bold;background:none;}
#xe #memberModule .memberSmallBox .login dl dd .w140 {width: 130px;}
#xe #memberModule .memberSmallBox .header,
#xe #memberModule .memberSmallBox .help{border:0;}
#xe #memberModule .memberSmallBox .help a{text-decoration:none;}
/* 위젯 & 로컬메뉴 배경이미지 처리 */

/* Login Form */
#xe .login_white{border:0;width:220px; padding-top:5px; background-position:left top; margin-bottom:10px;}
#xe .login_white form{background-position:left bottom;border:0; padding:11px 15px 7px 15px; width:190px;}
#xe .login_white form .idpwWrap{width:190px;position:relative; height:45px;}
#xe .login_white form .idpw{width:130px;}
#xe .login_white form .idpw input{background:#fff;width:120px;}
#xe .login_white form .login{position:absolute; right:0; top:0;}
#xe .login_white form ul.help li{left:-1px; padding-right:6px}
#xe .login_white form .userName{width:190px;border-bottom:0;padding: 0 0 8px 0; background-position:left bottom;}
#xe .login_white form .userName strong {font-size:1em;}
#xe .login_white form ul.userMenu{padding: 0 10px 6px 10px; margin-top:5px;} 
#xe .login_white form ul.userMenu li {list-style: none;background: url(../img/BgLnbLiLi.gif) repeat-x left bottom;padding: 2px 0 4px 10px;margin-bottom:0;}
#xe .login_white form p.latestLogin{padding-left:20px;}
#xe .login_white form ul.help{*zoom:1; position:relative;padding:10px 0 2px 0; background-position:left top; border:0;}
#xe .login_white form p.save{padding:3px 0; height:20px;}
#xe .login_white form ul.help li.first-child a {color: #999;}