@charset "euc-kr"; @import url('common.css'); /* Nateon Web Main Renewal Css code */ /* to preserve line-height and selector appearance */ body { color:#666; font:normal 9pt/1.5 돋움, Dotum, 굴림, Gulim, AppleGothic, sans-serif; } #MainWrap {width:960px; margin:0 auto;text-align:left;} #header .secNaviWrap ul li.nateon_home_select dl dd {display:block;padding:12px 0 0 9px;display:block;} #header .secNaviWrap ul li.nateon_home_select dl dd a {width:auto;font-weight:normal;color:#e5f0f6;font-size:12px;letter-spacing:0;} #header .secNaviWrap ul li.nateon_home_select dl dd a em {font-weight:bold;font-style:normal;} #header .secNaviWrap ul li.nateon_home_select dl dd a:hover {width:auto;} #topPromo {width:960px;height:374px;margin:4px auto 0;position:relative;font-size:0;overflow:hidden;} #topPromo .moves a {position:absolute;top:178px;text-indent:-3333em;background:url(../img/main/btn_moves.gif) no-repeat left top;width:19px;height:31px;outline:0;} #topPromo .moves .left,#topPromo .moves .leftOn {left:25px;cursor:default;} #topPromo .moves .leftOn:hover {left:25px;background-position:-25px top;} #topPromo .moves .right,#topPromo .moves .rightOn {right:25px;background-position:left -40px;cursor:default;} #topPromo .moves .leftOn,#topPromo .moves .rightOn {cursor:pointer; } #topPromo .moves .rightOn:hover {right:25px;background-position:-25px -40px;} #topPromo .indicator {position:absolute;bottom:25px;text-align:center;width:100%;.float:left;.width:auto;.left:50%;.margin-left:-30px;} #topPromo .indicator a {cursor:pointer;display:inline-block;text-indent:-3333em;width:12px;height:12px;margin-left:5px;margin-right:5px;background:url(../img/main/btn_moves.gif) no-repeat -20px -80px;.float:left;outline:0;} #topPromo .indicator a.on { background-position:left -80px;} #topPromo .dn_41 {position:absolute; top:299px; left:604px; width:275px; height:28px; background:url(../img/main/btn_dn41_t.png) no-repeat; text-indent:-9999px;} #topPromo .dn_41 a { float:right; display:block; width:96px; height:26px; text-indent:-9999px; } .topViewer { height:373px;border-bottom:1px solid #acacac;overflow:hidden;position:relative;}/* 130712 */ .topViewer h3 {text-indent:-3333em;} .topViewer p {text-indent:-3333em;} .topViewer li {display:none;} /* 130712:S */ .topViewer .topPr01 {background:url(../img/main/top_pr05.jpg) no-repeat left top;width:960px;height:373px;display:block;} .topViewer .topPr01 .links a {position:absolute;display:block;top:239px;width:186px;height:48px;display:block;text-indent:-3333em;} .topViewer .topPr01 .links .linkI {left:547px;} .topViewer .topPr01 .links .linkR {left:744px;width:132px; } .topViewer .topPr02 {background:url(../img/main/top_pr07.jpg) no-repeat left top;width:960px;height:373px;}/* 131104 */ .topViewer .topPr02 .links a {position:absolute;display:block;top:250px;width:204px;height:48px;display:block;text-indent:-3333em;} .topViewer .topPr02 .links .linkI {left:448px;}/* 131104 */ .topViewer .topPr02 .links .linkR {left:717px;} .topViewer .topPr03 {background:url(../img/main/top_pr08.jpg) no-repeat left top;width:960px;height:373px;} .topViewer .topPr03 .links a {position:absolute;display:block;top:256px;width:149px;height:36px;display:block;text-indent:-3333em;} .topViewer .topPr03 .links .linkI {left:549px;top:233px;width:216px;height:49px;} /* 130712:E */ .mainCont {width:100%;height:366px;position:relative;} .mainCont .mainLeft {width:240px;position:absolute;border-right:1px solid #d7d7d7;height:366px;left:0;top:1px;} .mainCont .mainLeft h3,.mainCont .mainRight h3 { display:none; } .mainCont .mainRight { margin-left:240px;height:366px; } .dirLinks {border-top:1px solid #acacac;background-color:#f8f8f8;padding-bottom:30px;font-size:11px;line-height:1.8em;letter-spacing:-1px;} .dirLinks a { color:#999 !important; } .dirLinks h3 { margin:30px 0 0 25px;text-indent:-3333em;width:130px;height:12px;background:url(../img/main/txt_msg.gif) no-repeat left -460px;.float:left;.display:inline;} .dirLinks ul {margin:10px 0 0 25px;display:inline-block;clear:both;.margin-top:5px;} .dirLinks ul li {float:left;width:230px;height:20px;overflow:hidden;} .dirLinks ul li a {float:left; } .dirLinks ul li span {float:left;text-indent:-3333em;width:9px;height:9px;vertical-align:middle;background:url(../img/main/ico_sec.gif) no-repeat left -330px;margin-left:5px;margin-top:4px;} .dirLinks ul li span.n {background-position: left -360px;} .dirLinks .dn_41 {position:absolute; top:14px; left:430px; width:330px; height:40px; background:url(../img/main/btn_dn41.png) no-repeat; text-indent:-9999px;} .dirLinks .dn_41 a { float:right; display:block; margin-top:4px; width:126px; height:31px; text-indent:-9999px; } .loginTab {width:100%;height:26px;background:url(../img/main/tab_login.gif) no-repeat left top;} .loginTab a {float:left; text-indent:-3333em;width:50%;height:26px;outline:0;overflow:hidden;} .nateLog {background-position:left top;} .cyworldLog {background-position:left -27px} .nateonOption {padding:18px 25px;border-bottom:1px solid #dfdfdf;} .nateonOption li {line-height:1.8em;height:19px;padding-left:18px;background:url(../img/main/ico_sec.gif) no-repeat left -128px} .nateonOption li a {color:#666;} .nateonOption li.i1 {background-position:left -128px;} .nateonOption li.i2 {background-position:left -150px;} .nateonOption li.i3 {background-position:left -172px;} .otherInfo {padding:18px 25px;overflow:hidden;display:inline-block;} .otherInfo li { float:left;line-height:1.8em;height:22px;padding-left:17px;background:url(../img/main/ico_sec.gif) no-repeat left -191px;overflow:hidden;.height:18px;} .otherInfo li a { color:#666; } .otherInfo li.o1 {background-position:left -191px;} .otherInfo li.o2 {background-position:left -213px;} .otherInfo li.o3 {background-position:left -235px;} .otherInfo li.o4 {background-position:left -255px;} .otherInfo li.o5 {background-position:left -277px;} .otherInfo li.o6 {background-position:left -299px;} .otherInfo li.o1,.otherInfo li.o2,.otherInfo li.o3 {width:96px;} .otherInfo li.o4,.otherInfo li.o5,.otherInfo li.o6 {width:60px;} /* 130712:S */ .mainRight { overflow:hidden; } .mainRight .msgInfo {float:left;height:278px;margin:16px 0 0 40px;.display:inline;width:700px;} .mainRight .msgInfo li { width:183px;float:left;margin-right:45px;padding-top:49px;background:url(../img/main/img_msg_v2.gif) no-repeat left top; } .mainRight .msgInfo li.pcmsg {background-position:left top;} .mainRight .msgInfo li.smartmsg {background-position:-192px top;} .mainRight .msgInfo li.webmsg {background-position:-383px top;} .mainRight .msgInfo li.featemsg {background-position:-514px top;margin-right:0;} .mainRight .msgInfo li h4 { height:17px;background:url(../img/main/txt_msg_v2.gif) no-repeat left top;text-indent:-3333em;}/* 130712 */ .mainRight .msgInfo li p { height:27px;background:url(../img/main/txt_msg_v2.gif) no-repeat left -26px;text-indent:-3333em;margin-top:10px;margin-bottom:30px;}/* 130712 */ .mainRight .msgInfo li a { display:block;width:126px;height:30px;text-indent:-3333em;overflow:hidden;outline:0;background:url(../img/main/btn_msgs_v2.gif) no-repeat left top;} .mainRight .msgInfo li a.window {height:31px;} .mainRight .msgInfo li a.macOS {background-position:left -31px;} .mainRight .msgInfo li a.linux {background-position:left -61px;} .mainRight .msgInfo li a.englishVer {background-position:left -91px; } .mainRight .msgInfo li a.natetalk { height:31px;background-position:left -121px; } .mainRight .msgInfo li a.nateUc { background-position:left -152px; } .mainRight .msgInfo li a.webNate { height:29px;background-position:left -182px; } .mainRight .msgInfo li.smartmsg h4 { background-position:left -80px; } .mainRight .msgInfo li.smartmsg p { background-position:left -106px; } .mainRight .msgInfo li.webmsg h4 { background-position:left -160px; } .mainRight .msgInfo li.webmsg p { background-position:left -186px; } /* 130712:E */ .eventArea { clear:both;width:720px;overflow:hidden;border-top:1px solid #e6e6e6;} .eventArea ul{ width:722px; } .eventArea li{ float:left;border-right:1px solid #e6e6e6; } .eventArea a{ display:block;width:360px;height:72px; } #MainWrap #footer {margin-top:0;text-align:center;} /* .inputFields {padding:8px 25px;color:#838383;width:190px;border-bottom:1px solid #dfdfdf;} .inputFields .secLev {position:relative;height:18px;} .inputFields .wrpLev {width:52px;height:15px;background:url(../img/main/ico_sec.gif) no-repeat left top;font-size:0;display:inline-block;vertical-align:middle;.margin-right:4px;position:absolute;} .inputFields .states {font-size:11px;letter-spacing:-1px;position:absolute;left:55px;top:1px;} .inputFields .optSec {position:absolute;left:112px;cursor:pointer} .inputFields .secSel1 {background-position:left top;} .inputFields .secSel2 {background-position:left -20px;} .inputFields .secSel3 {background-position:left -40px;} .inputFields .wrpLev a { text-indent:-3333em;display:inline-block;cursor:pointer;} .inputFields .wrpLev a.lev01 { width:18px;height:14px;} .inputFields .wrpLev a.lev02 { width:16px;height:14px;} .inputFields .wrpLev a.lev03 { width:17px;height:14px;} .loginForm { width:100%;} .inputFields .states em { font-style:normal;font-weight:bold;font-family:verdana;font-size:8pt;margin:0 2px;color:#3fa0e3} .inputFields .optSec {background:none;text-indent:-3333em;width:48px;height:17px;background:url(../img/main/ico_sec.gif) no-repeat left -60px;vertical-align:middle;.margin-left:4px;} .inputFields .idInput {height:20px;margin-top:6px;position:relative;} .inputFields .idInput input {width:81px;height:12px;border-top:1px solid #b3b3b3;border-left:1px solid #b3b3b3;border-right:1px solid #d6d6d6;border-bottom:1px solid #d6d6d6;font-size:12px;padding:2px;} .inputFields .idInput span {height:22px;position:absolute;right:0;top:0;font-size:11px;display:block;vertical-align:middle;} .inputFields .idInput select {width:96px;font-size:12px;height:20px;} .inputFields .pwInput {height:20px;margin-top:4px;position:relative;.margin-top:5px;} .inputFields .pwInput input {width:81px;height:12px;border-top:1px solid #b3b3b3;border-left:1px solid #b3b3b3;border-right:1px solid #d6d6d6;border-bottom:1px solid #d6d6d6;font-size:12px;padding:2px;vertical-align:middle;} .inputFields .pwInput .pwLb {position:absolute;left:1px;font-size:11px;display:block;top:1px;padding:1px 3px 0px;width:79px;letter-spacing:-1px;color:#ccc;cursor:text;background-color:#fff;height:12px;} .inputFields .pwInput button {width:97px;height:19px;background:url(../img/main/ico_sec.gif) no-repeat left -80px;text-indent:-3333em;vertical-align:middle;position:absolute;right:0;cursor:pointer;} .inputFields .option {width:100%;margin-top:9px;font-size:11px;color:#6f787d;letter-spacing:-1px;} .inputFields .option input { margin-right:0px;vertical-align:middle;.margin-top:-1px;} .inputFields .option label {vertical-align:middle} .inputFields .option span {margin-left:45px;} .inputFields .option span a {font-weight:bold;text-decoration:underline;font-size:11px;letter-spacing:-1px;color:#707980;} .inputFields .option span.red a {color:red;} .inputFields .option { border-bottom:1px solid #f0f0f0;padding-bottom:5px;} .inputFields .btmInfo {font-size:11px;padding-top:7px;letter-spacing:-1px;} .inputFields .btmInfo a { display:inline-block;margin-right:5px;} .inputFields .btmInfo a.joins {font-weight:bold;color:#666;padding-left:7px;background:url(../img/main/ico_sec.gif) no-repeat left -107px;} */ /* 로그인 후 */ .personal { position:relative; width:190px;height:135px;padding:24px 25px 0; border-bottom:1px solid #dfdfdf; }/* 130712 */ .personal p.name { color:#333; text-decoration:none; } /* 2009.09.09 수정 */ .personal p.name strong { font-weight:bold; } .personal p.email { margin:5px 0 0; padding:4px 0 0 5px; height:17px; background:#fff7d9; color:#333; font-size:8pt; } .personal ul.info { margin:4px 2px 0; } .personal ul.info li { display:inline; float:left; padding:2px 0 0;color:#0f8bc7; font-size:8pt; }/* 130712 */ .personal ul.info li.email { margin-right:10px; padding-right:10px; background:url('../img/common/bg_slash_01.gif') no-repeat 100% 4px; } .personal ul.info li.message { width:185px; } .personal ul.info li a { margin-right:4px; display:inline; float:left; color:#999; } /* 2009.11.18 */ .personal ul.info li span { margin-top:2px; display:inline; float:left; } /* 2009.11.18 */ .personal ul.info li span img { display:inline; float:left; } /* 2009.11.18 */ .personal ul.info li a img { vertical-align:middle; } .personal div.link { margin:8px 0 0; } .personal div.link a { display:block; float:left; overflow:hidden; width:92px; height:22px; text-indent:-1000em; background:url('../img/main/ico_sec.gif') no-repeat; } .personal div.link a.profile { background-position:0 -380px; margin-right:5px; } .personal div.link a.logout { background-position:0 -410px; } /* 로그인 전 */ #LoginBox { border-bottom:1px solid #dfdfdf; } #LoginBox form { line-height:0; } #LoginBox .tab_login { width:240px; height:26px; } #LoginBox .tab_login .wrap { width:100%; height:26px; background:url('../img/main/tab_login.gif') no-repeat; } #LoginBox.login_form_cy .tab_login .wrap { background-position:0 -27px; } #LoginBox .tab_login button { margin:0; padding:0; border:0; overflow:hidden; display:inline; float:left; width:120px; height:26px; background:transparent; text-indent:-1000em; cursor:pointer; } #LoginBox fieldset { width:190px; padding:8px 25px 0; color:#838383; line-height:1; } #LoginBox fieldset legend { display:block; overflow:hidden; height:0; font:normal 0/0 verdana; } #LoginBox fieldset ul.check { margin-top:10px; padding-bottom:6px; border-bottom:1px solid #f0f0f0; } #LoginBox fieldset ul.check * { color:#666666; font-size:8pt; vertical-align:middle; letter-spacing:-1px; } #LoginBox fieldset ul.check li.remember { display:inline; padding-right:7px; float:left; } #LoginBox fieldset ul.check li label { position:relative; .top:-1px; cursor:pointer; } #LoginBox fieldset ul.check li label input { margin-top:-1px; .margin:-4px -4px 0 -4px; vertical-align:middle; } #LoginBox fieldset ul.check li.info { float:right; width:60px; font-size:8pt; color:#838383; letter-spacing:-1px; font-family:돋움; margin:0 3px 0 0; text-align:right; } #LoginBox fieldset ul.check li.info a { color:#666; font-weight:bold; text-decoration:underline; cursor:pointer; }/* 2010.04.19 수정 */ #LoginBox fieldset ul.check li.info a:link, #LoginBox fieldset ul.check li.info a:visited, #LoginBox fieldset ul.check li.info a:active { font-size:11px; }/* 2010.04.19 수정 */ #LoginBox fieldset ul.check li.info a.on { color:#f53118; }/* 2010.04.19 수정 */ #LoginBox fieldset ul.check li.info span {width:80; margin-left:-45px; margin-top:-4px;} #LoginBox fieldset ul.check li.info span.level3 { float:right; display:block; height:19px; background:url('/login/img/set_ip.gif') no-repeat; text-indent:-9999em; overflow:hidden; cursor:pointer;width:50px; background-position:0 0; } #LoginBox fieldset ul.check li.info span.level2 { margin-right:5px; ;float:right; display:block; height:19px; background:url('/login/img/set_ip.gif') no-repeat; text-indent:-9999em; overflow:hidden; cursor:pointer;width:50px; background-position:0 -20px; } #LoginBox fieldset ul.check li.info span.level1 { float:right; display:block; height:19px; background:url('/login/img/set_ip.gif') no-repeat; text-indent:-9999em; overflow:hidden; cursor:pointer;width:55px; background-position:0 -40px; } #LoginBox fieldset ul.check li.security { position:relative; float:left; } #LoginBox fieldset ul.check li.security a { text-decoration:none; } #LoginBox fieldset ul.check li.security button { position:absolute; top:1px; right:-22px; overflow:hidden; width:19px; height:12px; background:url('//natesf.kr/keycrypt/icon_key_off.gif') no-repeat; text-indent:-1000em; cursor:pointer; } #LoginBox fieldset ul.check li.security button.on { background-image:url('//natesf.kr/keycrypt/icon_key_on.gif'); } /* S : 2009.09.24 */ /* #LoginBox fieldset p.login { width:190px; margin-top:7px; position:relative; } #LoginBox fieldset p.login input.input { margin-top:6px; .margin-top:2px; padding:2px; border:1px solid #b3b3b3; border-right-color:#d6d6d6; border-bottom-color:#d6d6d6; display:block; width:81px; height:12px; background:url('../img/common/bg_input.gif') no-repeat 0 -48px; } #LoginBox.login_form_cy fieldset p.login input.input { width:111px; } #LoginBox fieldset p.login input.input.member-id { background-position:0 -32px; } #LoginBox.login_form_cy fieldset p.login input.input.member-id { background-position:0 0; } #LoginBox fieldset p.login input.input.passwd { background-position:0 -16px; } #LoginBox fieldset p.login span { position:absolute; top:0; .top:2px; right:0; height:22px; display:block; font-size:11px; vertical-align:middle; } #LoginBox fieldset p.login span select { width:96px; height:20px; font-size:12px; vertical-align:middle; } #LoginBox.login_form_cy fieldset p.login span { display:none; } #LoginBox fieldset p.login input.submit { border:none; position:absolute; top:24px; .top:26px; right:0; overflow:hidden; width:97px;height:19px;background:url('../img/main/ico_sec.gif') no-repeat left -80px;text-indent:-3333em;vertical-align:middle; } #LoginBox.login_form_cy fieldset p.login input.submit { top:0; .top:2px; width:66px; height:42px; background-position:0 -440px; } */ #LoginBox fieldset p.login { width:190px; margin-top:7px; position:relative; } #LoginBox fieldset p.login input.input { margin-top:6px; .margin-top:2px; padding:2px; border:1px solid #b3b3b3; border-right-color:#d6d6d6; border-bottom-color:#d6d6d6; display:block; width:111px; height:12px; background:url('../img/common/bg_input.gif') no-repeat 0 -48px; } #LoginBox.login_form_cy fieldset p.login input.input { width:111px; } #LoginBox fieldset p.login input.input.member-id { background-position:0 -32px; } #LoginBox.login_form_cy fieldset p.login input.input.member-id { background-position:0 0; } #LoginBox fieldset p.login input.input.passwd { background-position:0 -16px; } #LoginBox fieldset p.login span { position:absolute; top:0; .top:2px; right:0; height:22px; display:block; font-size:11px; vertical-align:middle; } #LoginBox fieldset p.login span select { width:96px; height:20px; font-size:12px; vertical-align:middle; } #LoginBox.login_form_cy fieldset p.login span { display:none; } #LoginBox fieldset p.login input.submit { border:none; position:absolute; top:0; .top:2px; right:0; overflow:hidden; width:66px;height:42px;background:url('../img/main/ico_sec.gif') no-repeat left -80px;text-indent:-3333em;vertical-align:middle;background-position:0 -440px; } #LoginBox.login_form_cy fieldset p.login input.submit { top:0; .top:2px; width:66px; height:42px; background-position:0 -440px; } /* E : 2009.09.24 */ #LoginBox ul.link { width:190px; padding:7px 25px 4px; height:16px;} #LoginBox ul.link li { float:left; font-size:8pt; vertical-align:middle; letter-spacing:-1px; } #LoginBox ul.link li a { color:#666666; } #LoginBox ul.link li.remember { background:url('../img/common/bg_slash_02.gif') no-repeat 100% 3px; padding-right:8px; } #LoginBox ul.link li.regist { font-weight:bold; padding-left:7px; white-space:nowrap;letter-spacing:-2px;padding-left:6px; }/* 2010.11.29수정 */ /* S : 보안로그인 추가 */ #LoginBox dl.otp { height:17px; } #LoginBox dl.type2 { top:108px; } #LoginBox dl.otp dt { float:left; width:0; text-indent:-1000em; } #LoginBox dl.otp dd { float:left; color:#838383; } #LoginBox dl.otp dd.level { float:left; width:59px; height:16px; overflow:hidden; } #LoginBox dl.otp dd.levelText { float:left; margin-left:-4px; padding-top:2px; font-size:8pt; letter-spacing:-1px; cursor:pointer; } #LoginBox dl.otp dd.info { margin:0 0 0 5px; width:49px; } #LoginBox dl.otp dd.info a.btn { display:block; width:49px; height:17px; padding:0; background:url('../img/button/btn_otp.gif') no-repeat; text-indent:-100em; overflow:hidden; cursor:pointer; } #securityText { margin:0 2px; font-family:verdana; font-size:8pt; color:#3FA0E3; font-weight:bold; } #LoginBox #ifrmLevel { float:left; width:51px height:17px; margin:-1px 0 0 -1px; } #LoginBox .otp_layer { position:absolute; top:20px; left:0; display:none; width:238px; height:124px; background:#FFFFFF; border:1px solid #E6E6E6; z-index:22; } #LoginBox .layer2 { height:128px; } #LoginBox .layer3 { top:108px; } #LoginBox .layer4 { height:120px; top:108px; } #LoginBox .layer_content { position:relative; top:50%; left:0; float:left; width:100%; height:100%; margin-top:-22px; color:#464646; font-family:돋움, Dotum; font-size:8pt; letter-spacing:-1px; line-height:15px; text-align:center; } #LoginBox .layer_content strong { font-weight:bold; } #LoginBox .layer_content a { display:inline-block; margin:8px 1px 0 1px; font-family:돋움, Dotum; font-size:8pt; text-decoration:underline; cursor:pointer; } #LoginBox .layer_content a:hover { font-family:돋움, Dotum; font-size:8pt; } #LoginBox .layer_content a.install { color:#EE482F; font-weight:bold; } #LoginBox a.close { position:absolute; top:9px; right:9px; display:block; width:11px; height:11px; background:url('https://xo.nate.com/common/img/btn_close_layer.gif') no-repeat 1px 1px; text-indent:-1000em; overflow:hidden; cursor:pointer; } * html #LoginBox a.close { position:relative; top:9px; float:right; margin-bottom:-22px; } /* E : 보안로그인 추가 */ #nLoginBox { padding:25px 0 0 0; height:119px; border-bottom:1px solid #dfdfdf; text-align:center; } #nLoginBox h3 { display:block; margin:0 auto; width:181px; height:10px; text-indent:-9999em;background:url('../img/common/set_login.png') no-repeat; } #nLoginBox p { margin:9px auto 10px auto; width:181px; height:25px; text-indent:-9999em;background:url('../img/common/set_login.png') no-repeat 0 -19px; } #nLoginBox .btnLogin { border:0; width:181px; height:42px; cursor:pointer; background:url('../img/common/set_login.png') no-repeat 0 -54px; } #nLoginBox .btnLogin span { display:none; }