
/* ************************************** 
        
   File   : front_2013.css
   Title  : front_2013
   Author : Park Yu Jin
   Date   : 2013.06.11
   Last   : 2013.06.11
	 
************************************** */

/* *** Browser Reset *** */
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,form,fieldset,p,button{margin:0;padding:0}
body,h1,h2,h3,h4,th,td,input{color:#666;font-family:"돋음",dotum,sans-serif;font-size:12px;font-weight:normal;line-height:17px;}
hr{display:none;}
img,fieldset{border:0;}
ul,ol,li{list-style:none;}
img,input,select,textarea{vertical-align:middle;}
a{color:#737373;text-decoration:none;}
a:hover{color:#737373;text-decoration:underline;}
.hidden {position:absolute;left:-1000%;top:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden;}
caption {display:none;}
textarea {resize:none;}
label{vertical-align:-1px}
*:focus {outline: none;}

/* Layout */
html,body { height:100%; margin:0;padding:0}

/* header */
#headerFront {width:100%;  position:fixed; height:63px; z-index:2; background:url(/static/images/popup/top_bg.png) repeat-x 0 0  } 
#headerFront .headerInner { margin:0 auto; width:980px; height:63px; position:relative;}
#headerFront .headerInner h1 { padding:11px 0 0 11px;}
#headerFront .headerInner .gnb { position:absolute; top:25px; right:144px;}
#headerFront .headerInner .gnb ul li { float:left;  margin-left:32px; cursor:pointer;}
#headerFront .headerInner .gnb_btn { position:absolute; top:22px; right:2px;}
#headerFront .headerInner .gnb_btn ul li { float:left;  margin-left:5px;}
#headerFront01 {width:100%; margin:0 auto;  position:fixed; height:49px; z-index:2; background:url(/static/images/popup/top_bg1.png) repeat-x 0 0 } 
#headerFront01 .headerInner { margin:0 auto; width:980px; height:49px; position:relative;}
#headerFront01 .headerInner h1 { padding:7px 0 0 11px;}
#headerFront01 .headerInner .gnb { position:absolute; top:16px; right:129px; }
#headerFront01 .headerInner .gnb ul li { float:left;  margin-left:21px;}
#headerFront01 .headerInner .gnb ul li a { color:#cccccc; text-decoration:none; }
#headerFront01 .headerInner .gnb ul li .on {color:#81bee9; text-decoration:none; font-weight:bold; }
headerFront01 .headerInner .gnb ul li a:hover { font-weight:bold; color:#81bee9; text-decoration:none; }/*윗줄.on클래스 주석처리하고 hover 사용가능*/
#headerFront01 .headerInner .gnb_btn { position:absolute; top:14px; right:2px;}
#headerFront01 .headerInner .gnb_btn ul li { float:left;  margin-left:5px;}

/* leftmenu */
.frontleftLnb {float:left; width:184px;  margin-left:1px;}
*html .frontleftLnb { height:100%; }
.frontleftLnb .frontleftTit{ margin-top:38px; border-bottom:1px solid #ececec; padding-top:38px;}
.frontleftLnb .frontleftTit a {padding: 0 0 30px 17px; display:inline-block;}
.frontnavigation { margin-top:20px; border-bottom:1px solid #ececec;}
.frontnavigation li { padding: 0 0 18px 0; color:#363636;display:block;cursor: pointer; text-decoration:none;}
.frontnavigation li.last { padding-bottom:0}
.frontnavigation .on { padding: 0 0 20px 0; font-weight:bold; width:184px; background:url(/static/images/popup/arrow_on.png) no-repeat 0 0; position:relative; top:2px;}
.frontnavigation.end { border:0}
frontnavigation li:hover { padding: 9px 0 3px 0; width:184px;}
.frontnavigation li a { text-decoration:none;}
.frontnavigation li .fontArea {color:#363636;!important; margin-left:18px;} 
.frontleftLnb .leftBanner {float:left; width:164px; margin-left:10px;}

/* contentBox */
#contentBox { background:url(/static/images/popup/main_bg.gif) repeat-x 0 61px; z-index:1; min-height: 100%;} 
*html #contentBox {height: 100%; } 
#contentFront { margin:0 auto; padding: 63px 0 0 0; width:980px; position:relative; } 
#contentFront .mainvisual { zoom:1}
#contentFront .mainvisual:after {content:""; display:block; clear:both;;}
#contentFront .mainvisualBtn {position:absolute; top:306px; left:7px;}
#contentFront .mainBoard { width:980px; margin-top:59px; margin-left:10px; zoom:1;}
#contentFront .mainBoard:after {content:""; display:block; clear:both;;}
#contentFront .mainBoard ul li { float:left; width:455px; margin:0 60px 0 0;}
#contentFront .mainBoard ul li.last { margin-right:0;}
#contentFront .mainBoard .boardTxt dt{ font-size:14px; color:#636363; line-height:20px; margin:10px 0 25px 36px;}
#contentFront .mainBoard .boardTxt dt a{color:#a1a1a1;}
#contentFront .mainBoard .boardTxt dt a:hover{color:#a1a1a1}
#contentFront .mainBtn { text-align:center; margin:59px 0 65px 0;}

/* frontcontent */
.wrapper { margin:0 auto; width:100%;}
.wrapper01 {margin:0 auto; width:100%; min-height: 100%; margin: 1px  0 -105px;}
.wrapperBox {margin:0 auto; width:980px; height: 100%;  margin-top:1px; background:url(/static/images/popup/content_bg.gif) repeat-y 0 -1px;  *zoom:1; min-height: 888px;}
.wrapperBox:after{content:"";display:block;clear:both;}
.wrapperBox01 {margin:0 auto; width:980px; height: 100%; *zoom:1}
.wrapperBox01:after{content:"";display:block;clear:both;}
.contentinnerBox {width:794px; margin: -1px 0 0 186px; }

*html .contentinnerBox { height:100%;} 
.contentinnerBox01 {width:980px; margin: -1px 0 0 0; }
*html .contentinnerBox01 {height:100%;}
.contentInner {float:left;  width:754px; padding:38px 0 40px 40px; }
.contentInnerB {float:left;  width:980px; padding:87px 0 145px 0;}
.contentInner .titTxt{width:749px; border-bottom:2px solid #464a57; padding:2px 0 12px 5px; color:#737373; position:relative;}
.contentInner .titTxt .titTxtin{ display:inline-block;  margin-left:13px;}
.contentInnerB .titTxt {width:873px; border-bottom:2px solid #464a57; padding:2px 0 12px 5px; color:#737373; position:relative;}
.contentInnerB .titTxt .titTxtin { display:inline-block;  margin-left:13px;}
.contentInnerB .titTxt a, .contentInner .titTxt a {color:#737373; margin-left:10px; display:inline-block; position:relative; top:2px;}
.mrgT5 { margin-top:5px;}
.mrgT10 { margin-top:10px;}
.mrgT40 { margin-top:40px;}
.mrgT20 { margin-top:20px;}
.pdT20 { padding-top:20px;}



.contentInner .functionBox {width:749px; margin:30px 0 0 0; padding:0 0 30px 5px; border-bottom:1px solid #e6e6e6; zoom:1}
.contentInner .functionBox:after {content:""; display:block; clear:both;}
.contentInner .functionBox.last { border-bottom:0;}
.contentInner .functionBox li { float:left; width:352px; margin:0 40px 0 0;}
.contentInner .functionBox li.last { margin:0}
.contentInner .functionBox li div span { float:left; display:inline-block; width:32px;}
.contentInner .functionBox li div dl dt{width:320px; height:29px; font-weight:bold; font-size:14px; padding-top:4px; margin-left:32px;}
.contentInner .functionBox li div dl dd { margin-left:32px; color:#737373;}
.contentInner .functionBox li div dl dd.mrgLx { margin-left:0}
.contentInner .functionBox li div dl dd.dot {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 0; float:left; padding: 0 0 0 6px; margin: 0 0 0 32px;width:352px;}
.contentInner .functionBox.end { padding-bottom:0;}

.contentInner .functionBoxb {width:749px; margin:30px 0 0 5px; border-bottom:1px solid #e6e6e6; zoom:1}
.contentInner .functionBoxb:after {content:""; display:block; clear:both;}
.contentInner .functionBoxb.last { border-bottom:0;}
.contentInner .functionBoxb li { float:left; width:480x; margin:0 40px 0 0;}
.contentInner .functionBoxb li.last { margin:0}
.contentInner .functionBoxb li div span { float:left; display:inline-block; width:32px;}
.contentInner .functionBoxb li div dl dt{width:480x; height:29px; font-weight:bold; font-size:14px; padding-top:4px; margin-left:32px;}
.contentInner .functionBoxb li div dl dd { margin-left:32px; color:#737373;}
.contentInner .functionBoxb li div dl dd.mrgLx { margin-left:0}
.contentInner .functionBoxb li div dl dd.dot {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 0; float:left; padding: 0 0 0 6px; margin: 0 0 0 32px; width:450px;}

.contentInner .functionBoxs {width:749px; margin:30px 0 0 5px; padding-bottom:30px; border-bottom:1px solid #e6e6e6; zoom:1}
.contentInner .functionBoxs:after {content:""; display:block; clear:both;}
.contentInner .functionBoxs.last { border-bottom:0;}
.contentInner .functionBoxs li { float:left; margin:0 40px 0 0;}
.contentInner .functionBoxs li.w225 {width:225px;}
.contentInner .functionBoxs li.w210 {width:210px;}
.contentInner .functionBoxs li.last { margin:0}
.contentInner .functionBoxs li div span { float:left; display:inline-block; width:32px;}
.contentInner .functionBoxs li.w210 div dl dt {width:170px; height:29px; font-weight:bold; font-size:14px; padding-top:4px; margin-left:32px;}
.contentInner .functionBoxs li.w225 div dl dt{width:190px; height:29px; font-weight:bold; font-size:14px; padding-top:4px; margin-left:32px;}
.contentInner .functionBoxs li div dl dd { margin-left:32px; color:#737373;}
.contentInner .functionBoxs li div dl dd.mrgLx { margin-left:0}
.contentInner .functionBoxs li div dl dd.dot {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 0; float:left; padding: 0 0 0 6px; margin: 0 0 0 32px; width:190px;}

.contentInner .functionBox li div dl dd.mg34 {margin-top:34px;}
.contentInner .subBtn {width:754px; height:54px; text-align:center; margin:40px 0 0 0;}
.contentInner .mrgB8 { margin-bottom:8px;}
.contentInner .mrgT40 { margin-top:40px;}

.innerBox { width:749px; margin:20px 0 30px 5px; *zoom:1;}
.innerBox:after {content:"";display:block;clear:both;}
.innerBox .txtBlue { color:#1498fc; text-decoration:underline;}

.innerBox .downloadBox { float:left; *zoom:1; margin-top:20px;}
.innerBox .downloadBox:after {content:"";display:block;clear:both;}
.innerBox .downloadBox li {float:left; margin-right:7px;}
.innerBox .downloadBox li.last {margin-right:0;}

.innerBox .messengerStep { float:left; *zoom:1; margin-top:20px; background: url(/static/images/popup/step_bg_03.png) no-repeat scroll 0 0; width:749px; height:78px; padding:91px 0 0 5px;}
.innerBox .messengerStep:after {content:"";display:block;clear:both;}
.innerBox .messengerStep li {float:left; margin-left:20px; color:#737373;}
.innerBox .messengerStep li a { color:#ff6d00; text-decoration:underline;}
.innerBox .messengerStep li.step01 { width:200px}
.innerBox .messengerStep li.step02 { width:256px}
.txtGry {color:#737373}
.txtStic {color:#e1e1e1;}
.txtBlue {color:#1498fc}

.demandarea {float:left; width:725px; padding:18px 0 18px 22px; border:1px solid #efefef;}
.demandarea ul { clear:both;}
.demandarea ul li {float:left; background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 0; padding: 0 0 0 6px; color:#737373; margin:9px 0 0 20px;}
.demandarea ul li.first {margin-left:0;}
.demandarea ul li span { display:inline-block; width:28px; }
.demandarea.border0 { border:0}

.prodownTop {width:723px; border:1px solid #efefef; padding:15px 0 13px 24px; background:#f8fbfe;}
.prodownTxt {float:left; width:723px; border-right:1px solid #efefef;  border-left:1px solid #efefef; padding:15px 0 30px 24px; }
.prodownTxt li { float:left; width:333px; margin-right:40px; color:#737373;} 
.prodownTxt li div {color:#737373;}
.prodownTxt li img { margin-top:25px;}
.prodownTxt li.last { margin-right:0;}
.prodownTxt ul li .feature dl dt { margin-bottom:9px;}
.prodownTxt ul li .feature dl dd { background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 0; padding: 0 0 0 6px; color:#737373;}
.mgt0 { margin-top:0;}
.pad0 { padding:0;}

/* 접기 펼치기 부분 */
.optionBox {}
.optionBox li {position:relative; width:749px;padding:18px 0 0 5px; *zoom:1;}
.optionBox li:after {content:"";display:block;clear:both;}
.optionBox li p { margin-top:20px;}
.optionBox li .optionTab { margin-left:13px; *zoom:1;}
.optionBox li .optionTab:after {content:"";display:block;clear:both;}
.optionBox li .optionTab dl dt { float:left;}
.optionBox li .optionTab dl dt.layout01 {margin-left:15px; }
.optionBox li .optionTab dl dt.addtext { padding-top:1px; color:#737373;}
.optionBox li .optionTab dl dt a {color:#737373;}
.optionBox li .optionTab dl dt a:hover {color:#737373; text-decoration:underline; }
.optionBox li .optionTab dl dt .optionIc {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 -35px; position:absolute;left:5px; top:24px; width:6px; height:6px;}
.optionBox li .optionTab dl dt .optionIcIcon {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 -67px; position:absolute;left:5px; top:23px; width:6px; height:9px; }
.optionBox li .input_chk{width:13px;height:13px;vertical-align:text-top;}
.optionBox li .optionTab .vatTxt { position:absolute; top:20px; right:0; color:#737373}
.optionBox li .optionTab .vatTxt01 { position:absolute; top:0; right:0; color:#737373}
.optionBox li.pd0 { padding-top:0;}

.addTxt { margin:14px 0 0 0; position:relative}
.addTxt ul li { padding:2px 0 0 4px; color:#737373; position:relative;}
.addTxt ul li a {color:#ff6d00; text-decoration:underline; }
.addTxt ul li a.txtGry {color:#737373; text-decoration:none; }
.addTxt ul li span {color:#ff6d00; }
.addTxt .invatTxt { position:absolute; top:0px; right:0; color:#737373}

.addTxt01 { margin:8px 0 0 0; position:relative}
.addTxt01 ul li { padding:0 0 0 15px; color:#999999; position:relative;}
.addTxt01 ul li a {color:#ff6d00; text-decoration:underline; }
.addTxt01 ul li a.txtGry {color:#737373; text-decoration:none; }
.addTxt01 ul li span {color:#ff6d00; }

.personalTxt { margin:24px 0 0 5px; color:#737373;}
.personalTxt a {color:#737373; }
.personalTxt a:hover {color:#737373; text-decoration:underline; }

.textArea { margin:16px 0 0 13px; line-height:17px; color:#737373}
.textArea01 { padding:16px; line-height:17px; background:#f9f9f9; border:1px solid #ececec;}
.textArea02 { display:inline-block;  margin:10px 0 0 0; line-height:17px; color:#737373; width:500px; }
.imgBox { margin:20px 0 40px 0;}
.signStep {margin:20px 0 0 0;}
.signStep li.bg1 {background: url(/static/images/popup/sign_step01.gif) no-repeat scroll 0 0; width:749px; height:96px; padding:0;}
.signStep li.bg2 {background: url(/static/images/popup/sign_step02.gif) no-repeat scroll 0 0; width:749px; height:95px; padding:0;}
.signStep li.bg3 {background: url(/static/images/popup/sign_step03.gif) no-repeat scroll 0 0; width:749px; height:95px; padding:0;}
.signStep li.bg4 {background: url(/static/images/popup/sign_step04.gif) no-repeat scroll 0 0; width:749px; height:95px; padding:0;}
.signStep li.bg5 {background: url(/static/images/popup/sign_step05.gif) no-repeat scroll 0 0; width:749px; height:95px; padding:0;}
.signStep li.bg6 {background: url(/static/images/popup/sign_step06.gif) no-repeat scroll 0 0; width:749px; height:95px; padding:0;}
.signStep li .bgTxt { padding:20px 0 0 227px; color:#737373}
.signStep a {color:white !important;}
.signStep .button:hover {border:0px !important;}


text-decoration: none;
/* Table */
.bordertableBox {width:100%;}
.borderTable {width:100%; border:1px solid #ececec; border-collapse:collapse;width:100%; margin-top:20px; text-align:center;}
.borderTable.mgt9 { margin-top:9px}
.borderTable th {margin:0;padding:10px 0;background:#f9f9f9; font-weight:bold; color:#000; border-right:1px solid #ececec; border-bottom:1px solid #ececec; color:#000;}
.borderTable td {margin:0;padding:8px 0 8px 0;border-bottom:1px solid #ececec;border-right:1px solid #ececec; color:#000;}
.borderTable td.txtBlue {color:#1498fc}
.borderTable td.txtGry {color:#737373}
.borderTable th.thline {border-right:1px solid #b7b7b7;}
.borderTable td.thline {border-right:1px solid #b7b7b7; background:#f9f9f9}
.borderTable td.thbg {background:#f9f9f9}
.borderTable td.txtleft {text-align:left; padding:8px 0 8px 16px;}
.borderTable th.txtleft {text-align:left; padding:8px 0 8px 16px;}
.borderTable td .dot ul { width:350px;}
.borderTable td .dot ul li {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 0; padding: 0 0 0 6px; width:350px; color:#737373}
.borderTable td .dot ul li span {color:#ff6d00;}
.borderTable td .dot01 ul { width:350px;}
.borderTable td .dot01 ul li {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 0; padding: 0 0 0 6px; width:350px; color:#737373; font-size:11px;}
.borderTable td .dot01 ul li span {color:#ff6d00;}
.borderTable td .dot01_01 ul { width:350px; margin-top:5px}
.borderTable td .dot01_01 ul li {background: url(/static/images/popup/dot_bg_01.png) no-repeat scroll 0 -2px; padding: 0 0 0 6px; width:350px; color:#737373; font-size:11px; line-height:14px}

.borderTable td .inTxt ul li {float:left; width:153px; padding:10px 10px;}
.borderTable td input[type="text"] {width:162px; border-top:1px solid #c2c2c2; border-left:1px solid #c2c2c2; border-right:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2;background:#FFFFFF;height:15px; padding:4px 0 0 4px;}
.borderTable td span {color:#ff6d00;}
.borderTable td .red {color:#ff6d00;}
.borderTable a { text-decoration:underline; color:#737373;}
.w680 { width:680px;}

.borderTable01 {width:100%;border-left:1px solid #ececec; border-right:1px solid #ececec; border-bottom:1px solid #ececec; border-collapse:collapse;width:100%; text-align:center;}
.borderTable01.mgt9 { margin-top:9px}
.borderTable01 th {margin:0;padding:10px 0;background:#f9f9f9; font-weight:bold; color:#000; border-right:1px solid #ececec; border-bottom:1px solid #ececec; color:#000;}
.borderTable01 td {margin:0;padding:8px 0 8px 0;border-bottom:1px solid #ececec;border-right:1px solid #ececec; color:#737373; vertical-align:top;}
.borderTable01 td.txtBlue {color:#1498fc}
.borderTable01 td.txtGry {color:#737373}
.borderTable01 td.thbg {background:#f9f9f9}
.borderTable01 td.txtleft {text-align:left; padding:10px 0 10px 16px; vertical-align: middle;}
.borderTable01 td.txtright {text-align:right; padding:10px 16px 10px 0; vertical-align: middle;}
.borderTable01 th.txtleft {text-align:left; padding:10px 0 10px 22px; vertical-align: middle;}
.borderTable01 td strong { color:#000;}
.borderTable01 td .infoBox ul {*zoom:1}
.borderTable01 td .infoBox ul:after {content:"";display:block;clear:both;}
.borderTable01 td .infoBox ul li { float:left;  margin-right:60px; color:#737373 }
.borderTable01 td .infoBox ul li .space { display:inline-block; width:107px; color:#000; }
.borderTable01 td .infoBox ul li .space01 { display:inline-block; width:84px; color:#737373 }
.borderTable01 td .infoBox .infoaddTxt {color:#acacac; margin-top:8px; font-size:11px;} 
.borderTable01 td .infoBox .item{position:relative;margin:-4px 0; color:#737373}  /* 인풋텍스트 */
.borderTable01 td .infoBox .item .i_label { top:0; left:10px; color:#acacac;}  /* 인풋텍스트 */
.borderTable01 td .dot ul { width:350px;}
.borderTable01 td .dot ul li {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 0; padding: 0 0 0 6px; width:350px; color:#737373}
.borderTable01 td .dot ul li span {color:#ff6d00;}
.borderTable01 td .dot01 ul { width:250px;}
.borderTable01 td .dot01 ul li {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 0; padding: 0 0 0 6px; width:250px; color:#737373}
.borderTable01 td .inTxt ul li {float:left; width:153px; padding:10px 10px;}
.borderTable01 td input[type="text"] {border-top:1px solid #c2c2c2; border-left:1px solid #c2c2c2; border-right:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2;background:#FFFFFF;height:15px; padding: 3px 4px; color:#737373; vertical-align:middle;}
.borderTable01 td .red, .borderTable01 th .red  {color:#ff6d00;}
.borderTable01 td .sumBox { position:relative;}
.borderTable01 td .sumBox .sumTxt {position:absolute; top:1px; right:5px; color:#737373 }
.borderTable01 td .won { color:#ff6d00; font-size:15px; font-weight:bold; margin-left:5px;}
.borderTable01 td .space01 { display:inline-block; width:117px; color:#000; }
.borderTable01 td strong.txtBlue {color:#1498fc}
.borderTable01 td.txtadd03 { text-align:left; padding:19px 0 10px 16px;}
.borderTable01 td .item{position:relative;margin:-4px 0; color:#737373}  /* 인풋텍스트 */
.borderTable01 td .item .i_label { top:4px; left:10px; color:#acacac;}  /* 인풋텍스트 */

.smallTable { background:#f4f8ff; width:250px; border:1px solid #ececec}
.smallTable table td{border:none;}
.smallTable td.txtleft {text-align:left; padding:5px 0 5px 16px;}
.smallTable td.txtleftB {text-align:left; padding:37px 0 5px 16px;}
.smallTable td select { margin-top:5px;}


/* 기존 하이웍스 버튼*/
.btnx, .btnx *{ position:relative; margin:0; padding:0; display:inline-block; text-decoration:none !important; border:0; white-space:nowrap; background:url(/static/images/popup/btn.gif) no-repeat; vertical-align:top; overflow:visible; cursor:pointer; _cursor:hand;}
.btnx *{left:2px; cursor:pointer; _cursor:hand;}
.btnx.o7, .btnx.o7 *{height:25px; line-height:25px}
.btnx.o7 {background-position:left -431px;}
.btnx.o7:hover {background-position:left -461px;}
.btnx.o7 *{padding:1px 8px 0 7px; background-position:right -431px;}
.btnx.o7 *:hover, .btnx.o7:hover * {background-position:right -461px;}
.btnA0 {padding:20px 0 0 0; text-align:center;}
.btnA0_01 {padding:10px 0 0 0; text-align:center;}
.btnA01 {text-align:center;zoom:1;margin:0 auto;padding:40px 0 0 0;}
.btnA01:after {content:''; display:block; clear:both}

.btnA .btnx, .btnA .btnx *, .btnA01 .btnx, .btnA01 .btnx *, .btnA02 .btnx, .btnA02 .btnx *, .btnA03 .btnx, .btnA03 .btnx *{ position:relative; margin:0; padding:0; display:inline-block; text-decoration:none !important; border:0; white-space:nowrap; background:url(/static/images/popup/btn01.gif) no-repeat; vertical-align:top; overflow:visible; cursor:pointer; _cursor:hand;}
.btnA .btnx *, .btnA01 .btnx *, .btnA02 .btnx *, .btnA03 .btnx *{left:2px; cursor:pointer; _cursor:hand;}
.btnA .btnx.regBtn, .btnA .btnx.regBtn *, .btnA01 .btnx.regBtn, .btnA01 .btnx.regBtn *, .btnA02 .btnx.regBtn, .btnA02 .btnx.regBtn *, .btnA03 .btnx.regBtn, .btnA03 .btnx.regBtn *{height:37px; line-height:37px}
.btnA .btnx.regBtn, .btnA01 .btnx.regBtn, .btnA02 .btnx.regBtn, .btnA03 .btnx.regBtn {background-position:left -174px;}
.btnA .btnx.regBtn:hover, .btnA01 .btnx.regBtn:hover, .btnA02 .btnx.regBtn:hover, .btnA03 .btnx.regBtn:hover {background-position:left -216px;}
.btnA .btnx.regBtn *, .btnA01 .btnx.regBtn *{padding:1px 44px 0 44px; background-position:right -174px;}
.btnA02 .btnx.regBtn *{padding:1px 14px 0 14px; background-position:right -174px;}
.btnA03 .btnx.regBtn *{padding:1px 24px 0 24px; background-position:right -174px;}
.btnA .btnx.regBtn *:hover, .btnA .btnx.regBtn:hover *, .btnA01 .btnx.regBtn *:hover, .btnA01 .btnx.regBtn:hover *, .btnA02 .btnx.regBtn *:hover, .btnA02 .btnx.regBtn:hover * ,.btnA03 .btnx.regBtn *:hover, .btnA03 .btnx.regBtn:hover * {background-position:right -216px;}

/* addButton */
.button,
.button a,
.button button,
.button input { position:relative; margin:0; display:-moz-inline-stack; display:inline-block; text-decoration:none !important; border:0; font-size:12px; font-family:Tahoma, Sans-serif; white-space:nowrap; background:url(/static/images/popup/dot_bg.png) no-repeat; overflow:visible; color:#333;}
.button { height:22px; padding:0; vertical-align:middle; margin-right:2px; background-position:left top;}
.button a,
.button button,
.button input{ left:2px; vertical-align:top; cursor:pointer;}

/* Button Size */
.button.small { height:22px; background-position:left -126px; }
.button a,
.button button,
.button input{ height:22px; padding:0 10px 0 8px; font-size:12px; line-height:23px; background-position:right top;}
.button.small a,
.button.small button,
.button.small input { height:22px; padding:0 17px 0 9px; font-size:11px; line-height:22px; background-position:right -126px;}

/* Button Size */
.button.small { height:22px; background-position:left -126px; }
.button a,
.button button,
.button input { height:22px; padding:0 10px 0 8px; font-size:12px; line-height:23px; background-position:right top;}
.button.small a,
.button.small button,
.button.small input { height:22px; padding:0 17px 0 9px; font-size:11px; line-height:22px; background-position:right -126px;}
.button.small01 { height:22px; background-position:left -154px; }
.button a,
.button button,
.button input { height:22px; padding:0 10px 0 8px; font-size:12px; line-height:23px; background-position:right top;}
.button.small01 a,
.button.small01 button,
.button.small01 input { height:22px; padding:0 17px 0 9px; font-size:11px; line-height:22px; background-position:right -154px;}

/* Button Text Color */
.button.black,
.button.black a,
.button.black button,
.button.black input { background-image:url(/static/images/popup/dot_bg.png); color:#fff !important; border: 0px;}
.button.white,
.button.white a,
.button.white button,
.button.white input { background-image:url(/static/images/popup/dot_bg.png); color:#737373;}

.btnA {margin-top:20px; text-align:center;}
.btnbox { padding:10px 20px 0 0 ; text-align:right; width:731px;}
.btnbox01 { margin:-7px 20px 0 0 ; text-align:right; width:731px;}
.btnbox02 { position:absolute; top:-4px; left:127px;}

/* 시작하기 */
.subBg {background:url(/static/images/popup/sub_index_bg.gif) no-repeat scroll 0 0; width:927px; height:429px; margin:40px 0 0 0; padding:40px 0 0 53px;}
.subBg img { margin-right:15px;}
.subBg ul { margin-top:20px;}
.subBg ul li {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 3px; padding: 0 0 0 6px; color:#737373; padding-bottom:15px; position:relative;}
.subBg ul li .btnbox { position:absolute; top:-14px; left:272px;}

.sub_tit_step { position:relative; width:100%; height:53px;}
.sub_tit_step01 { position:relative; width:100%; height:110px;}
.sub_tit_step .step { position:absolute; top:0; right:0;}
.outlineBox { margin:20px 0 0 0}
.centerBox { border-left:1px solid #e6e6e6; border-right:1px solid #e6e6e6; width:878px; padding:0 50px 0 50px}
.titImg { text-align:center; padding-bottom:30px;}
.titBox { padding:20px 0 0 0}

.tabArea {border-left: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; border-right: 1px solid #e6e6e6;}
.layerTab {padding: 0 0 30px 0; width: auto;  *zoom:1;}
.layerTab:after {content: ""; display: block; clear: both;}
.layerTab li {float: left;}
.layerTab li a.on {border-bottom:1px solid #f9f9f9; color: #3d9fe9; background: #fff;}
.layerTab li a {display: block;font-weight: bold;height:23px;color: #737373;text-align: center;padding: 12px 0 6px 0;;border-right: 1px solid #e6e6e6;border-bottom: 1px solid #e6e6e6;background: #f7f7f8;text-decoration: none;}
.layerTab li.end a {border-right: 0;}
.layerTab li img { vertical-align:top;}
.innerList {padding-bottom:23px; padding-left:40px ;clear:both; position:relative;}
.innerList input[type="text"] { border-top:1px solid #c2c2c2; border-left:1px solid #c2c2c2; border-right:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2;background:#FFFFFF;height:15px; padding:4px 0 0 4px; color:#737373;}
.innerList .okay { color:#ff6d00; margin:6px 0 0 275px;}
.innerList .innerListStep1 {zoom:1;}
.innerList .innerListStep1:after {content:''; display:block; clear:both}
.innerList .innerListStep1 dt { float:left; margin:11px 0 0 0; width:140px;}
.innerList .innerListStep1 dd { float:left; position:relative;}
.innerList .item {position:relative;margin:-4px 0; color:#737373}
.innerList .item .i_label { top:1px; left:10px; color:#acacac;}
.innerList .item .i_label { *top:12px; left:10px; color:#acacac;}


.innerList .innerListStep2 {zoom:1; margin-top:15px;}
.innerList .innerListStep2:after {content:''; display:block; clear:both}
.innerList .innerListStep2 dt { float:left; margin:1px 0 30px 0; width:140px;}
.innerList .innerListStep2 dd { float:left; position:relative;}
.innerList .innerListStep2 dd .txtBlue { color:#3d9fe9;} 
.innerList .innerListStep2 dd .txtadd01 { margin-left:18px; color:#737373;}
.innerList .innerListStep2 dd .txtadd02 { display:inline-block; margin:15px 0 0 18px; color:#ff6d00;}
.optionTab01 { position:relative; margin:15px 0 15px 0;}
.optionTab01 dl dt {margin: 0 0 0 13px;}
.optionTab01 dl dt .optionIc {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 -35px; position:absolute;left:0; top:4px; width:6px; height:6px;}

.addOption { position:relative;}
.addOption .btnprice { position:absolute; top:2px; right:0;}

/* 제휴/API */
.contentInner .listDot { padding-top:20px; padding-left:5px; *zoom:1; }
.contentInner .listDot:after {content:''; display:block; clear:both}
.contentInner .listDot li {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 1px; float:left; padding: 0 0 0 6px; width:709px; line-height:18px;}
.contentInner .listDot01 { padding-top:10px; padding-left:5px; *zoom:1; }
.contentInner .listDot01:after {content:''; display:block; clear:both}
.contentInner .listDot01 li {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 1px; float:left; padding: 0 0 0 6px; width:663px; line-height:18px; color:#727272;}
.contentInner .listDot li a.txtRline {color: #ff6d00; text-decoration: underline; }
.contentInner .listDot a.txtRline {color: #ff6d00; text-decoration: underline; }
.contentInner .listDot div.pdT10 { padding-top:10px}
.contentInner .listDot.last {padding:0; }
.contentInner .listDot.last li {color: #737373;}
.innerScase {padding:0 0 23px 0; clear:both; position:relative; text-align:center;}
.innerScase p { background:#f9f9f9; height:60px; padding:20px 0 0 0; margin-bottom:20px}
.moveArea {*zoom:1; padding-top:25px;}
.moveArea:after {content:''; display:block; clear:both}
.moveArea li{ float:left; vertical-align:middle; }
.moveArea .mLeft, .moveArea .mRight {text-align: center; width: 66px; margin-top: 180px;}
.vodBox {zoom:1; margin-top:30px; padding-left:5px;  position:relative;}
.vodBox:after {content:''; display:block; clear:both}
.vodBox span img { float:left;  width:174px; margin-right:30px}
.vodBox dl {zoom:1;  }
.vodBox dl:after {content:''; display:block; clear:both}
.vodBox dl dt {font-weight:bold; padding-bottom:18px;} 
.vodBox dl dd {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 1px; float:left; padding: 0 0 0 6px; margin: 0 0 0 5px; width:275px; color:#737373} 
.vodBox .vodBtn { position:absolute; top:75px; left:212px;}

.apidownBox {zoom:1; margin-top:40px; padding-left:5px; padding-bottom:40px; position:relative; border-bottom:1px solid #e6e6e6;}
.apidownBox:after {content:''; display:block; clear:both}
.apidownBox .iconAround {float:left; margin-right:7px; height:110px; vertical-align:top; }
.apidownBox span img { width:94px;}
.apidownBox dl {zoom:1;  }
.apidownBox dl:after {content:''; display:block; clear:both}
.apidownBox dl dt {font-weight:bold; padding-bottom:18px;} 
.apidownBox dl dd { color:#737373} 
.apidownBox dl dd .dot {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 3px; float:left; padding: 0 0 0 6px; margin: 20px 0 0 5px; width:240px; color:#737373}


/* faq */
.faq{border-bottom:1px solid #ddd;font-size:12px}
.faq .hgroup{position:relative;margin:0 0 10px 0;*zoom:1}
.faq .hgroup .trigger{overflow:visible;position:absolute;top:50%;right:0;margin:-7px 0 0 0;padding:0;border:0;background:none;font-size:12px;cursor:pointer}
.faq ul{margin:0;padding:0;list-style:none}
.faq .q{margin:0;border-top:1px solid #ddd; color:#737373; }
.faq .q.first{border-top:0}
.faq .q a.trigger{display:block;padding:10px 15px; color:#3d9fe9;text-align:left; text-decoration:none !important}
.faq .hide .q a.trigger{font-weight:normal;background:none;color:#737373}
.faq .q a.trigger:hover,
.faq .q a.trigger:active,
.faq .q a.trigger:focus{color:#3d9fe9}
.faq .a{margin:0;padding:10px 20px;line-height:1.5; }
.faq .answerBox {padding-top:10px; margin-top:0px; padding-bottom:10px; margin-bottom:0px; border-top:1px solid #ddd;}


/* paginate */
.paginate{padding:30px 0;text-align:center;line-height:normal}
.paginate *{display:inline-block;position:relative;margin:0 -2px;padding:3px 4px;font-size:11px;font-family:Tahoma, Sans-serif;color:#333;line-height:normal;text-decoration:none;vertical-align:middle}
.paginate a { background:#ececec; color:#727272; margin-left:3px; width:12px; height:14px;}
.paginate a:hover, .paginate a:active, .paginate a:focus{background-color:#4cb0fd; color:#fff;text-decoration:none;}
.paginate a.on{background-color:#4cb0fd; color:#fff;text-decoration:none;}

/* 툴팁 */
.box1 {width:456px; border:1px solid #555555; background-color:#ffffff; line-height:17px; font-size:11px;}
.box1 span { color:#737373;}
.box1 .tooltiptit {float:left; line-height:44px; margin-left:-6px; color: #0b3984; font-weight:bold;}
.box1 .tooltiptitbtn { float:right; margin:13px 15px 0 0}
.box2 {width:550px; border:1px solid #555555; background-color:#ffffff; line-height:17px; font-size:11px;} 
.box2 span { color:#737373;}
.box2 .tooltiptit {float:left; line-height:44px; margin-left:-6px; color: #0b3984; font-weight:bold;}
.box2 .tooltiptitbtn { float:right; margin:13px 15px 0 0}
.box3 {width:796px; border:1px solid #555555; background-color:#ffffff; line-height:17px; font-size:11px;} 
.box3 span { color:#737373;}
.box3 .tooltiptit {float:left; line-height:44px; margin-left:-6px; color: #0b3984; font-weight:bold;}
.box3 .tooltiptitbtn { float:right; margin:13px 15px 0 0}

.inboxTxt { padding:20px; position:relative; background:#FFF;}
.inboxTxt a.txtBlue {color:#1498fc; text-decoration:none;}
.inboxTxt .otherBtn { position:absolute; bottom:23px; right:20px;}
.scrollBox {width: 390px; height: 65px; overflow: auto; border:1px solid #ebebeb; padding:10px; margin-top:15px;}
.box4 {border:1px solid #555555; background-color:#ffffff; width:288px; padding:20px; line-height:17px; font-size:11px;}
.box4 span { color:#737373;}
.shadow {
    -webkit-box-shadow: 2px 2px 2px 0px #d7d7d7;  /* Safari and Chrome */
    -moz-box-shadow: 2px 2px 2px #d7d7d7;  /* Firefox */
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#d7d7d7, Direction=135, Strength=2);  /* IE */}

/* layer scroll style */
.layerPup.scroll {*zoom:1; }
.layerPup.scroll:after {content: ""; display: block; clear: both;}
.layerPup .Puptop {position:relative; height:41px; width:744px; zoom:1; background:#3d9fe9; border-top:1px solid #555555; border-right:1px solid #555555; border-left:1px solid #555555;}
.layerPup .Puptop P {padding:15px 0 0 35px; height:30px; font-size:14px; color:#FFF;}
.layerPup .Puptop .Pupx {position:absolute; top:14px; right:33px;}
.layerPup.scroll .Pupbot {float:left; width:714px; padding:30px 0 30px 30px; zoom:1;border-bottom:1px solid #555555; border-right:1px solid #555555; border-left:1px solid #555555;}
.layerPup.scroll .Pupbot .scrollArea {height:560px;padding:0 15px 0 0;overflow:auto;*overflow-x:hidden;}
.imgGroup{position:relative}
.PuplayerTab {padding: 0 0 30px 0; width: auto;  *zoom:1; }
.PuplayerTab:after {content: ""; display: block; clear: both;}
.PuplayerTab li {float: left;}
.PuplayerTab li span.on { border-top:1px solid #e8e8e8; border-bottom:0; color: #000000; background: #fff; border-left:1px solid #e8e8e8;}
.PuplayerTab li span.end {border-left:0}
.PuplayerTab li span.first {border-left:1px solid #e8e8e8;}
.PuplayerTab li span {display: block;font-weight: bold;height:px;color: #737373;text-align: center;padding: 10px 0 8px 0; border-top: 1px solid #e8e8e8;border-bottom: 1px solid #e8e8e8; border-right:1px solid #e8e8e8;background: #f7f7f8;text-decoration: none;}



.PupinnerList {padding-bottom:23px;clear:both; position:relative; height:800px;}
.PuptextArea { margin:30px 0 0 0; line-height:17px; color:#737373}
.PuptextArea.first { margin-top:0}
.PuptextArea p { font-weight:bold; color:#000; margin-bottom:14px;}
.PuptextArea01 { padding:16px; line-height:17px; background:#f9f9f9; border:1px solid #ececec;}
.PuptextArea01 { padding-top:20px; *zoom:1; }
.PuptextArea01:after {content:''; display:block; clear:both}
.PuptextArea01 li {background: url(/static/images/popup/dot_bg.png) no-repeat scroll 0 1px; float:left; padding: 0 0 0 6px; margin: 0 0 0 5px; color: #737373; line-height:18px;}
.PuptextArea01 li a.txtRed {color:#ff6c00; text-decoration:underline;}
.PuptextArea01 input[type="text"] {border-top:1px solid #c2c2c2; border-left:1px solid #c2c2c2; border-right:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2;background:#FFFFFF;height:15px; padding: 3px 4px; color:#737373; vertical-align:middle;}

.functionBoxpop { margin:20px 0 0 5px; padding-bottom:30px; border-bottom:1px solid #e6e6e6; zoom:1;}
.functionBoxpop:after {content:""; display:block; clear:both;}
.functionBoxpop.last { border-bottom:0;}
.functionBoxpop.end { padding-bottom:0;}
.functionBoxpop li { float:left; margin:0 40px 0 0;}
.functionBoxpop li.last { border-bottom:0}
.functionBoxpop li div { width:260px;}
.functionBoxpop li div dl dd { margin:0 0 8px 32px; color:#737373;}


/* footer */
#footerFront {clear:both;  background:url(/static/images/popup/footer_bg.gif) repeat-x 0 0;zoom:1}
#footerFront:after {content:""; display:block; clear:both;;}
#footerFront .footerInner { margin:0 auto; width:980px;}
#footerFront .footerInner .footerUtill { height:42px; padding-top:9px; position:relative;}
#footerFront .footerInner .footerUtill a img { margin-left:15px;}
#footerFront .footerInner .footerUtill img { margin-left:4px;}
#footerFront .footerInner .footerUtill .addList {position:absolute; top:20px; right:171px;}
#footerFront .footerInner .footerUtill .addList li {float:left; padding: 0 14px 0 14px; background:url(/static/images/popup/line_list.gif) no-repeat right 2px;}
#footerFront .footerInner .footerUtill .addList li.last, #footerFront .footerInner .adrBox .address li.last { background:none;}
#footerFront .footerInner .footerUtill .snsBox {position:absolute; top:16px; right:3px;}
#footerFront .footerInner .footerUtill .snsBox dt { float:left;}
#footerFront .footerInner .footerUtill .snsBox dt img { margin-left:11px;}
#footerFront .footerInner .footerUtill .snsBox dd { float:left;}
#footerFront .footerInner .footerUtill .snsBox dd img { margin:1px 0 0 2px;} 
#footerFront .footerInner .adrBox {width:980px; height:103px; position:relative;}
#footerFront .footerInner .adrBox .companyName {float:left; width:170px; height:77px; padding:25px 0 0 4px;  color:#000;}
#footerFront .footerInner .adrBox .companyName strong { font-size:14px;}
#footerFront .footerInner .adrBox .utillList {float:left; padding-top:26px;}
#footerFront .footerInner .adrBox .utillList li{ float:left;  margin-right:18px;} 
#footerFront .footerInner .adrBox .utillList li a {color:#000;}
#footerFront .footerInner .adrBox .address {float:left; padding-top:6px; width:591px; font-size:11px; color:#898989;}
#footerFront .footerInner .adrBox .address li {float:left; padding: 0 8px 0 8px; background:url(/static/images/popup/line_list.gif) no-repeat right 2px;}
#footerFront .footerInner .adrBox .address li.first { padding-left:0;}
#footerFront .footerInner .adrBox .snsBtns {position:absolute; top:23px; right:0px;}
#footerFront .footerInner .adrBox .snsBtns li { float:left; margin-left:4px;} 

#footerFront01 {clear:both; height:105px; background:url(/static/images/popup/footer_bg01.gif) repeat-x 0 0;zoom:1;}
#footerFront01:after {content:""; display:block; clear:both;;}
#footerFront01 .footerInner { margin:0 auto; width:980px;}
#footerFront01 .footerInner .adrBox {width:980px; height:105px; position:relative;}
#footerFront01 .footerInner .adrBox .companyName {float:left; width:170px; height:77px; padding:25px 0 0 4px; color:#000;}
#footerFront01 .footerInner .adrBox .companyName strong { font-size:14px;}
#footerFront01 .footerInner .adrBox .utillList {float:left; padding-top:26px;}
#footerFront01 .footerInner .adrBox .utillList li{ float:left;  margin-right:18px;} 
#footerFront01 .footerInner .adrBox .utillList li a {color:#000;}
#footerFront01 .footerInner .adrBox  ul.address {float:left; padding-top:6px; width:591px;}
#footerFront01 .footerInner .adrBox  ul.address li {float:left; padding: 0 8px 0 8px; color:#898989; background:url(/static/images/popup/line_list.gif) no-repeat right 2px;  font-size:11px;}
#footerFront01 .footerInner .adrBox  ul.address li.first { padding-left:0;}
#footerFront01 .footerInner .adrBox .snsBtns {position:absolute; top:23px; right:0px;}
#footerFront01 .footerInner .adrBox .snsBtns li { float:left; margin-left:4px;}
#footerFront01 .footerInner .adrBox .address li.last { background:none;}
.mgB100 { margin-bottom:100px;}


#new_infoTag{position: absolute;background:#F2F2F2;  padding:10px; width:310px; border: 1px solid #c8c8c8; z-index:9999;}
#login_btn{	width: 71px;	height: 71px;	border:0px; 	background:url(/static/images/popup/btn_login.gif) no-repeat; 	overflow:hidden;	font-size: 0px;}





.profile_on { padding:5px; border:none; height:38px; overflow:hidden; background:url(../images/arrow_new.gif) right 12px no-repeat;}
.profile_on:hover { border-radius:2px; border:1px solid #5b5e69; padding:4px; height:38px; background:#30333f url(../images/arrow_new_v1.gif) right 11px no-repeat; cursor:pointer;}
.profile_on:hover span {color:#eaebec;}

#popup_home_officelist {max-height: 400px;overflow-X: hidden;}