@charset "utf-8";

/* Layout */
body,form,fieldset,div,p,h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,input,select,th,td,textarea,button{margin:0;padding:0}
body{font:.75em/18px '나눔고딕', NanumGothic, 'ngeot', 'ngbeot', '돋움', Dotum, sans-serif; color:#666; background:url("images/pageBg.gif") repeat center}
dl,ul,ol{list-style:none}
img,fieldset{border:0}
img{vertical-align:top}
table{border-collapse:collapse;border-spacing:0}
a:link, a:visited{color:#4d4d4d; text-decoration:none; font-weight:normal}
a:hover, a:active{color:#e51e1e}
em, address{font-style:normal}
hr, caption{display:none}
* html input{margin:-1px 0}
*:first-child+html input{margin:-1px 0}

.hidden, legend{height:0;line-height:0;font-size:0;position:absolute;visibility:hidden}

@font-face{
  font-family: 'ngeot';
  font-style: normal;
  font-weight: normal;
  src: url('/fonts/NanumGothic.eot'); 
  src: local('☺'), url('/fonts/NanumGothic.woff') format('woff'), url('/fonts/NanumGothic.ttf') format('truetype'); 
}
@font-face{
  font-family: 'ngbeot';
  font-style: normal;
  font-weight: bold;
  src: url('/fonts/NanumGothicBold.eot'); 	
  src: local('☺'), url('/fonts/NanumGothicBold.woff') format('woff'), url('/fonts/NanumGothicBold.ttf') format('truetype'); 
}

table td{border:1px solid #ccc; padding:5px 10px}

.centerArea{position:relative; width:1000px; margin:0 auto}

#wrap{position:relative; width:100%}
#wrap.mainBg{background:url("images/mainBg.gif") no-repeat center top}
#wrap.subBg{background:url("images/subBg.gif") no-repeat center top}

#header{position:absolute; top:0; left:0; width:1000px; z-index:100}
#header .miniMnu{position:relative; width:100%; height:26px; background-color:#fff}
#header .miniMnu .rightP{position:absolute; top:0; right:0}
#header .miniMnu .rightP ul{overflow:hidden; zoom:1}
#header .miniMnu .rightP ul li{float:left}
#header .miniMnu .rightP ul li.search{padding-top:2px}
#header .miniMnu .rightP ul li.search *{vertical-align:middle}
#header .miniMnu .rightP ul li.search input.iText{padding:2px 0 2px; border:1px solid #ccc}
#header .miniMnu .rightP ul li a{display:block; height:26px; background:url("images/miniMnu.gif") no-repeat 0 0; text-indent:-3000px; line-height:0.1%; font-size:0.1%}
#header .miniMnu .rightP ul li.home a{width:41px; background-position:0 0}
#header .miniMnu .rightP ul li.login a{width:57px; background-position:-41px 0}
#header .miniMnu .rightP ul li.join a{width:66px; background-position:-98px 0}
#header .miniMnu .rightP ul li.logout a{width:66px; background-position:-164px 0}
#header .miniMnu .rightP ul li.mypage a{width:76px; background-position:-230px 0}
#header .miniMnu .rightP ul li.adm a{width:56px; background-position:-306px 0}
#header .miniMnu .rightP ul li.sitemap a{width:66px; background-position:-362px 0}
#header .miniMnu .rightP ul li.gotoMail a{width:85px; background-position:-428px 0}
#header .miniMnu .rightP ul li.languageEn a{width:67px; background-position:-513px 0}
#header .miniMnu .rightP ul li.home a:hover{background-position:0 -26px}
#header .miniMnu .rightP ul li.login a:hover{background-position:-41px -26px}
#header .miniMnu .rightP ul li.join a:hover{background-position:-98px -26px}
#header .miniMnu .rightP ul li.logout a:hover{background-position:-164px -26px}
#header .miniMnu .rightP ul li.mypage a:hover{background-position:-230px -26px}
#header .miniMnu .rightP ul li.adm a:hover{background-position:-306px -26px}
#header .miniMnu .rightP ul li.sitemap a:hover{background-position:-362px -26px}
#header .miniMnu .rightP ul li.gotoMail a:hover{background-position:-428px -26px}
#header .miniMnu .rightP ul li.languageEn a:hover{background-position:-513px -26px}
#header .miniMnu_en{position:relative; width:100%; height:26px; background-color:#fff}
#header .miniMnu_en .rightP{position:absolute; top:0; right:0}
#header .miniMnu_en .rightP ul{overflow:hidden; zoom:1}
#header .miniMnu_en .rightP ul li{float:left}
#header .miniMnu_en .rightP ul li.search{padding-top:2px}
#header .miniMnu_en .rightP ul li.search *{vertical-align:middle}
#header .miniMnu_en .rightP ul li.search input.iText{padding:2px 0 2px; border:1px solid #ccc}
#header .miniMnu_en .rightP ul li a{display:block; height:26px; background:url("images/miniMnu_en.gif") no-repeat 0 0; text-indent:-3000px; line-height:0.1%; font-size:0.1%}
#header .miniMnu_en .rightP ul li.home a{width:61px; background-position:0 0}
#header .miniMnu_en .rightP ul li.login a{width:57px; background-position:-61px 0}
#header .miniMnu_en .rightP ul li.join a{width:46px; background-position:-118px 0}
#header .miniMnu_en .rightP ul li.logout a{width:67px; background-position:-164px 0}
#header .miniMnu_en .rightP ul li.mypage a{width:68px; background-position:-231px 0}
#header .miniMnu_en .rightP ul li.adm a{width:59px; background-position:-299px 0}
#header .miniMnu_en .rightP ul li.sitemap a{width:68px; background-position:-358px 0}
#header .miniMnu_en .rightP ul li.gotoMail a{width:89px; background-position:-426px 0}
#header .miniMnu_en .rightP ul li.languageKo a{width:66px; background-position:-515px 0}
#header .miniMnu_en .rightP ul li.home a:hover{background-position:0 -26px}
#header .miniMnu_en .rightP ul li.login a:hover{background-position:-61px -26px}
#header .miniMnu_en .rightP ul li.join a:hover{background-position:-118px -26px}
#header .miniMnu_en .rightP ul li.logout a:hover{background-position:-164px -26px}
#header .miniMnu_en .rightP ul li.mypage a:hover{background-position:-231px -26px}
#header .miniMnu_en .rightP ul li.adm a:hover{background-position:-299px -26px}
#header .miniMnu_en .rightP ul li.sitemap a:hover{background-position:-358px -26px}
#header .miniMnu_en .rightP ul li.gotoMail a:hover{background-position:-426px -26px}
#header .miniMnu_en .rightP ul li.languageKo a:hover{background-position:-515px -26px}
#header .mnuArea{position:relative; padding-bottom:10px; background:url("images/gnbBg.png") repeat-x bottom}
#header .mnuArea h1{position:absolute; top:-6px; left:-9px}
#header .mnuArea .gnb{padding:24px 0 25px 340px; background-color:#282828}
#header .mnuArea .gnb ul{overflow:visible; width:100%; zoom:1}
#header .mnuArea .gnb ul:after{content:""; display:block; clear:both}
#header .mnuArea .gnb ul li{float:left; position:relative; padding:0 34px; background:url("images/mnuCutLine.gif") no-repeat left center}
#header .mnuArea .gnb ul li:first-child{background:none}
#header .mnuArea .gnb ul li a{display:block; padding:6px 0; color:#bbb; font-size:15px; font-family: 'ngbeot'; font-weight:bold}
#header .mnuArea .gnb ul li a:hover{color:#fff}
/*
#header .mnuArea .gnb ul li a{display:block; height:30px; background:url("images/mainMnu.gif") no-repeat 0 0; text-indent:-3000px; line-height:0.1%; font-size:0.1%}
#header .mnuArea .gnb ul #on62 a{width:56px; background-position:0 0}
#header .mnuArea .gnb ul #on113 a{width:56px; background-position:0 -30px}
#header .mnuArea .gnb ul #on124 a{width:56px; background-position:0 -60px}
#header .mnuArea .gnb ul #on140 a{width:56px; background-position:0 -90px}
#header .mnuArea .gnb ul #on156 a{width:56px; background-position:0 -120px}
#header .mnuArea .gnb ul #on62.active a,
#header .mnuArea .gnb ul #on62 a:hover{background-position:-150px 0}
#header .mnuArea .gnb ul #on113.active a,
#header .mnuArea .gnb ul #on113 a:hover{background-position:-150px -30px}
#header .mnuArea .gnb ul #on124.active a,
#header .mnuArea .gnb ul #on124 a:hover{background-position:-150px -60px}
#header .mnuArea .gnb ul #on140.active a,
#header .mnuArea .gnb ul #on140 a:hover{background-position:-150px -90px}
#header .mnuArea .gnb ul #on156.active a,
#header .mnuArea .gnb ul #on156 a:hover{background-position:-150px -120px}
*/
#header .mnuArea .gnb ul li ul{display:none; position:absolute; top:30px; left:0; padding:0 5px; background-color:#fff; border:2px solid #e51e1e}
#header .mnuArea .gnb ul #on62 ul{width:112px}
#header .mnuArea .gnb ul #on113 ul{width:112px}
#header .mnuArea .gnb ul #on124 ul{width:112px}
#header .mnuArea .gnb ul #on140 ul{width:112px}
#header .mnuArea .gnb ul #on156 ul{width:112px}
#header .mnuArea .gnb ul li ul li{background:none; padding:0; width:100%; border-top:1px dotted #bdbdbd}
#header .mnuArea .gnb ul li ul li:first-child{border-top:none}
#header .mnuArea .gnb ul li ul li a{display:block; padding:10px 0; height:14px; width:100% !important; background:none; font-weight:bold; text-indent:20px; line-height:100%; font-size:12px; color:#4d4d4d}
#header .mnuArea .gnb ul li ul li a:hover{background:url("images/subMnu_ov.gif") no-repeat 5px 12px !important; color:#e51e1e}

#mainContainer{position:relative}
#mainContainer .mainImgArea{position:relative; width:100%; min-width:1000px; height:520px; text-align:center}
#mainContainer dt{margin-bottom:20px}
#mainContainer dt a{position:absolute; top:7px; right:0}
#mainContainer .g2Project dt a{right:20px}
#mainContainer .g2Project dd{position:relative; width:100%}
#mainContainer .g2Project{padding:0 20px; margin-bottom:45px}
#mainContainer .g2Project a.arrow{position:absolute; top:100px; display:block; width:20px; height:24px; background:url("images/mc_contentArrow.gif") no-repeat; text-indent:-3000px; line-height:0.1%; font-size:0.1%; z-index:1000}
#mainContainer .g2Project a#go-prevs{left:-5px; background-position:left top}
#mainContainer .g2Project a#go-nexts{right:-5px; background-position: right top}
#mainContainer .g2Project a#go-prevs:hover{background-position:left bottom}
#mainContainer .g2Project a#go-nexts:hover{background-position: right bottom}
#mainContainer .g2Project dd ul li{padding:0 7px}
/*
#mainContainer .g2Project dd ul{overflow:hidden; width:100%; zoom:1}
#mainContainer .g2Project dd ul li{float:left; margin-left:15px}
#mainContainer .g2Project dd ul li:first-child{margin-left:0}
*/
#mainContainer .g2Project dd ul li a{display:block; border:1px solid #e3e3e3}
#mainContainer .mContent{position:relative; padding:40px 20px 0 20px; overflow:hidden; border-top:1px solid #ebebeb; background:url("images/mc_conBg.gif") no-repeat center top; zoom:1}
#mainContainer .mContent .news, #mainContainer .mContent .cCenter, #mainContainer .mContent .oContent{float:left; position:relative; display:inline}
#mainContainer .mContent .news{width:290px}
#mainContainer .mContent .cCenter{margin-left:40px; width:300px}
#mainContainer .mContent .oContent{margin-left:40px; width:290px}
#mainContainer .mContent .cCenter dd{padding-top:8px}
#mainContainer .mContent .oContent dd{position:relative; margin-left:10px}
#mainContainer .mContent .oContent dd a.arrow{position:absolute; top:25px; display:block; width:20px; height:24px; background:url("images/mc_contentArrow.gif") no-repeat; text-indent:-3000px; line-height:0.1%; font-size:0.1%}
#mainContainer .mContent .oContent dd a#go-prev{left:-20px; background-position:left top}
#mainContainer .mContent .oContent dd a#go-next{right:-20px; background-position: right top}
#mainContainer .mContent .oContent dd a#go-prev:hover{background-position:left bottom}
#mainContainer .mContent .oContent dd a#go-next:hover{background-position: right bottom}

#subContainer{position:relative}
#subContainer .subImgArea{position:relative; width:100%; height:300px; /*background:url("images/subImg.png") no-repeat center top;*/ z-index:10}
#subContainer .subImgArea_en{position:relative; width:100%; height:300px; /*background:url("images/subImg_en.png") no-repeat center top;*/ z-index:10}
#container{position:relative; width:100%}

#ln{position:absolute; width:196px; top:0; left:0; z-index:100}
#ln .leftMnu{position:relative; margin-top:-25px; background:url("images/leftBg.png") repeat-y center}
#ln .leftMnu h2{padding:20px 3px 15px; background:url("images/leftBgTop.png") no-repeat center top; border-bottom:1px solid #eaeaea}
#ln .leftMnu h2 a{margin-left:20px}
#ln .leftMnu ul{padding:10px 0 100px; background:url("images/leftBgBottom.png") no-repeat center bottom}
#ln .leftMnu ul li{border-bottom:1px dashed #eaeaea}
#ln .leftMnu ul li ul{display:none}
#ln .leftMnu ul li a.twoDepth{display:block; padding:7px 3px; height:16px; font-size:14px; font-family:'ngbeot'; text-indent:40px}
#ln .leftMnu ul li.active a.twoDepth{background:url("images/leftMnu_ov.png") no-repeat center top; color:#fff; font-weight:bold; text-indent:55px}
#ln .leftMnu ul li.active ul{display:block; padding:5px 0 20px; background:none}
#ln .leftMnu ul li.active ul li ul{display:none}
#ln .leftMnu ul li ul li{border-bottom:none}
#ln .leftMnu ul li ul li a.threeDepth{display:block; padding:5px; height:14px; font-size:12px; text-indent:40px}
#ln .leftMnu ul li ul li.active a.threeDepth{font-weight:bold; color:#e51e1e}
#ln .leftMnu ul li.active ul li.active ul{display:block}
#ln .leftMnu ul li ul li ul li{border-bottom:none}
#ln .leftMnu ul li ul li ul li a.fourDepth{display:block; padding:2px 5px; height:14px; font-size:12px; text-indent:40px}
#ln .leftMnu ul li ul li ul li.active a.fourDepth{font-weight:bold; color:#e51e1e}
#ln .lBanner{margin-top:40px; border-top:1px solid #e7e7e7}
#ln .lBanner li{border-bottom:1px solid #e7e7e7}

#rc{position:relative; padding-top:25px; margin-left:240px; width:760px; min-height:570px}
#content{position:relative}
#content h1{padding:15px 30px; background:url("images/subTit_bullet.gif") no-repeat left center; color:#282828; border-bottom:1px solid #b9b9b9; font-family:'Malgun Gothic' !important; letter-spacing:-1pt}
#content .navs{position:absolute; top:15px; right:0; padding-left:15px; font-size:11px; background:url("images/nav_home.gif") no-repeat left center}
#content .navs em{font-weight:bold}

#productArea{margin-top:30px}
#productArea dl{margin-top:30px}
#productArea dl dt{margin-bottom:10px; padding:7px 0 10px 25px; height:18px; background:url("images/sub/productPin.gif") no-repeat left center; font-size:18px; font-family: 'ngbeot'}
#productArea dl dd table{position:relative; width:100%; border-top:2px solid #cc0000; border-bottom:1px solid #999}
#productArea dl dd table thead th{padding:5px 0; border-left:1px solid #666;border-bottom:1px solid #666;background-color:#333; color:#fff}
#productArea dl dd table thead th:first-child{border-left:none}
#productArea dl dd table tbody th, #productArea dl dd table tbody td{padding:3px 10px; border-top:1px solid #ccc; font-size:11px; color:#666}
#productArea dl dd table tbody th{background-color:#f9f9f9;border-left:1px solid #ccc; color:#333; font-size:12px}
#productArea dl dd table tbody td{border-left:1px dotted #ccc}

#footer{position:relative; padding:30px 0; margin:70px auto 0; width:1000px; border-top:2px solid #999}
#footer .copyright{margin-left:20px; padding-left:115px; background:url("images/footLogo.gif") no-repeat left top}
#footer .footMnu{position:absolute; top:30px; right:0}
#footer .footMnu ul{overflow:hidden; width:243px; zoom:1}
#footer .footMnu ul li{float:left}
#footer .footMnu ul li a{display:block; height:20px; background:url("images/footMnu.gif") no-repeat 0 0; text-indent:-3000px; line-height:0.1%; font-size:0.1%}
#footer .footMnu ul li a.fMnu1{width:52px; background-position:0 0}
#footer .footMnu ul li a.fMnu2{width:90px; background-position:-52px 0}
#footer .footMnu ul li a.fMnu3{width:101px; background-position:-142px 0}
#footer .footMnu ul li a.fMnu1:hover{background-position:0 -20px}
#footer .footMnu ul li a.fMnu2:hover{background-position:-52px -20px}
#footer .footMnu ul li a.fMnu3:hover{background-position:-142px -20px}


/* popup login */
.loginWindow{ display:none; position:fixed; left:0; top:0; _position:absolute; width:100%; height:100%; z-index:100;} 
.loginWindow.open{ display:block;}
.loginWindow .modalWindow{ display:block; position:fixed; border:0; left:0; top:0; _position:absolute; width:100%; height:100%; background:#000; opacity:.3; filter:alpha(opacity:30);}
.loginWindow .loginLayer{ position:absolute; width:289px; top:120px; left:50%; padding:30px; border:2px solid #737373; margin:0 0 0 -175px; background:#fff;}
.loginWindow .loginLayer form{ display:none; *zoom:1; margin:0 0 29px 0;}
.loginWindow .loginLayer form:after{ content:""; display:block; clear:both;}
.loginWindow .loginLayer form legend{ position:absolute; width:0; height:0; overflow:hidden; font-size:0; line-height:0; visibility:hidden;}
.loginWindow .loginLayer fieldset{ border:0; margin:0; padding:0;}
.loginWindow .loginLayer.loginTypeA form.typeA,
.loginWindow .loginLayer.loginTypeB form.typeB{ display:block;}
.loginWindow .loginLayer dl{ margin:0; padding:0 0 1px 0;}
.loginWindow .loginLayer dt{ font-size:12px; font-weight:bold; color:#868d95; margin:0 0 2px 0;}
.loginWindow .loginLayer dd{ margin:0 0 21px 0;}
.loginWindow .loginLayer .inputText{ width:269px; height:31px; padding:6px 9px 0 9px; border:1px solid #ddd; font:20px Tahoma; color:#333;}
.loginWindow .loginLayer .inputText:focus{ background-color:#fbfbfb;}
.loginWindow .loginLayer .inputCheck{ margin:0 3px 0 0; width:13px; height:13px; vertical-align:middle;}
.loginWindow .loginLayer.loginTypeA .inputText{ background-image:url("images/bgLoginText.gif")undefined; background-repeat:no-repeat; background-position:right top;}
.loginWindow .loginLayer.loginTypeB .inputText{ background-image:url("images/bgOpenidText.gif")undefined; background-repeat:no-repeat; background-position:right top; padding:6px 9px 0 35px; width:243px;}
.loginWindow .loginLayer .keep{ margin:0; float:left; font-size:11px; line-height:normal; white-space:nowrap;}
.loginWindow .loginLayer .keep label{ color:#555;}
.loginWindow .loginLayer .loginButton,
.loginWindow .loginLayer .loginButton input{ position:relative; border:0; color:#fff; font-family:맑은 고딕; font-size:12px; font-weight:bold; display:inline-block; height:36px; line-height:36px; background-color:transparent; background-image:url("images/buttonLoginAction.gif"); background-repeat:no-repeat; overflow:visible;}
.loginWindow .loginLayer .loginButton{ float:right; background-position:0 0; right:11px;}
.loginWindow .loginLayer .loginButton input{ left:11px; background-position:right 0; padding:0 30px 0 45px; cursor:pointer;}
.loginWindow .loginLayer .help{ margin:0 -30px -30px -30px; padding:14px 0; list-style:none; text-align:center; background:#fafafa; border-top:1px solid #f2f2f2;}
.loginWindow .loginLayer .help li{ display:inline; font-size:11px; line-height:11px; padding:0 0 0 5px;}
.loginWindow .loginLayer .help li.join{ font-weight:bold;}
.loginWindow .loginLayer .help li.find{ border-left:1px solid #b3b3b3;}
.loginWindow .loginLayer .help li.typeA,
.loginWindow .loginLayer .help li.typeB{ display:none; border-left:1px solid #b3b3b3;}
.loginWindow .loginLayer.loginTypeA .help li.typeA,
.loginWindow .loginLayer.loginTypeB .help li.typeB{ display:inline;}
.loginWindow .loginLayer .help li a{ text-decoration:none; color:#555;}
.loginWindow .loginLayer .help li a:hover,
.loginWindow .loginLayer .help li a:active,
.loginWindow .loginLayer .help li a:focus{ text-decoration:underline;}
.loginWindow .loginLayer .close{ position:absolute; cursor:pointer; border:0; padding:0; top:0; right:0; width:27px; height:27px; background:transparent url("images/close.png") no-repeat center center;}
.loginWindow .loginLayer .close span{ position:absolute; font-size:0; line-height:0; width:0; height:.; overflow:hidden; visibility:hidden;}