@charset "utf-8";
/* NHN > UIT Center > Open UI Technology Team > Jeong Chan Myeong(dece24@nhncorp.com) */

/* 
A CSS framework begins here. We don't recommend modifying framework. You can override these properties by defining the styles outside the framework.
여기서 부터 CSS 프레임웍 입니다. 프레임웍 수정을 권장하지 않습니다. 스킨을 변형할 때 프레임웍 밖에서 선언된 속성으로 덮어쓰기 할 수 있습니다. 
*/

/* 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; text-align:justify; *zoom:1;}
#content:after{ content:""; display:block; clear:both;}
#footer{ position:relative; clear:both; *zoom:1;}
#footer:after{ content:""; display:block; clear:both;}

/* Layout Width */
.fixed #container{ width:960px; margin-left:auto; margin-right:auto;}
.liquid #container{ width:80%; margin-left:auto; margin-right:auto;}
.hybrid #container{ width:80%; margin-left:auto; margin-right:auto;}

/* Layout Align */
.aLeft #container{ margin-left:0;}
.aRight #container{ margin-right:0;}

/* Header Extension */
#header .extension{ position:relative; *zoom:1; margin:0; padding:0;}
#header .extension:after{ content:""; display:block; clear:both;}
#header .extension .section{ position:relative;}
#header .extension ul{ position:relative;}
#header .extension li{ position:relative; display:inline; list-style:none;}

/* Footer Extension */
#footer .extension{ position:relative; *zoom:1;}
#footer .extension:after{ content:""; display:block; clear:both;}
#footer .extension *{ margin:0; padding:0;}
#footer .extension .section{ position:relative;}
#footer .extension ul{ position:relative;}
#footer .extension li{ position:relative; display:inline; list-style:none;}

/* Body Extension */
#body .extension{position:relative; *zoom:1; display:none;}
#body .extension:after{ content:""; display:block; clear:both;}
#body .extension .section{position:relative;}

/* ----- Fixed 1 Column Layout ----- */
.fixed .c #body .e1{ display:block; margin-right:-30px;}
.fixed .c #body .e1 .section{ float:left; width:300px; margin-right:30px;}

/* ----- Liquid 1 Column Layout ----- */
.liquid .c #body .e1{ display:block; margin-right:-3.4%;}
.liquid .c #body .e1 .section{ float:left; width:30%; margin-right:3.3%;}

/* ----- Hybrid 1 Column Layout ----- */
.hybrid .c #body .e1{ display:block; margin-right:-30px;}
.hybrid .c #body .e1 .section{ float:left; width:240px; margin-right:30px;}

/* ----- Fixed 2 Column Layout ----- */
.fixed .ce #body .e1,
.fixed .ec #body .e1{ width:220px;}
.fixed .ce #body #content,
.fixed .ec #body #content{ width:720px;}
.fixed .ce #body #content{ float:left;}
.fixed .ec #body #content{ float:right;}
.fixed .ce #body .e1,
.fixed .ec #body .e1{ display:block;}
.fixed .ce #body .e1{ float:right; clear:right;}
.fixed .ec #body .e1{ float:left; clear:left;}

/* ----- Liquid 2 Column Layout ----- */
.liquid .ce #body .e1,
.liquid .ec #body .e1{ width:23%;}
.liquid .ce #body #content,
.liquid .ec #body #content{ width:75%;}
.liquid .ce #body #content{ float:left;}
.liquid .ec #body #content{ float:right;}
.liquid .ce #body .e1,
.liquid .ec #body .e1{ display:block;}
.liquid .ce #body .e1{ float:right; clear:right;}
.liquid .ec #body .e1{ float:left; clear:left;}

/* ----- Hybrid 2 Column Layout ----- */
.hybrid .ce #body{ padding-right:280px;}
.hybrid .ec #body{ padding-left:280px;}
.hybrid .ce #body .e1,
.hybrid .ec #body .e1{ width:260px;}
.hybrid .ce #body #content,
.hybrid .ec #body #content{ width:100%;}
.hybrid .ce #body #content{ float:left;}
.hybrid .ec #body #content{ float:right;}
.hybrid .ce #body .e1,
.hybrid .ec #body .e1{ display:block;}
.hybrid .ce #body .e1{ float:right; clear:right; margin-left:-260px; right:-280px;}
.hybrid .ec #body .e1{ float:left; clear:left; margin-right:-260px; left:-280px;}

/* ----- Fixed 3 Column Layout ----- */
.fixed .cee #body .e1,
.fixed .cee #body .e2,
.fixed .ece #body .e1,
.fixed .ece #body .e2,
.fixed .eec #body .e1,
.fixed .eec #body .e2{ display:block; width:200px;}

.fixed .cee #body #content,
.fixed .ece #body #content,
.fixed .eec #body #content{ width:520px;}

.fixed .cee #body #content{ float:left; margin-right:20px;}
.fixed .ece #body #content{ float:left; margin-right:-100%; left:220px;}
.fixed .eec #body #content{ float:right;}

.fixed .ece #body .e1,
.fixed .eec #body .e1{ float:left; margin-right:20px;}

.fixed .cee #body .e1,
.fixed .eec #body .e2{ float:left;}

.fixed .cee #body .e2,
.fixed .ece #body .e2{ float:right;}

/* ----- Liquid 3 Column Layout ----- */
.liquid .cee #body .e1,
.liquid .cee #body .e2,
.liquid .ece #body .e1,
.liquid .ece #body .e2,
.liquid .eec #body .e1,
.liquid .eec #body .e2{ display:block; width:20%;}

.liquid .cee #body #content,
.liquid .ece #body #content,
.liquid .eec #body #content{ width:56%;}

.liquid .cee #body #content{ float:left; margin-right:2%;}
.liquid .ece #body #content{ float:left; margin-right:-100%; left:22%;}
.liquid .eec #body #content{ float:right;}

.liquid .ece #body .e1,
.liquid .eec #body .e1{ float:left; margin-right:2%;}

.liquid .cee #body .e1,
.liquid .eec #body .e2{ float:left;}

.liquid .cee #body .e2,
.liquid .ece #body .e2{ float:right;}

/* ----- Hybrid 3 Column Layout ----- */
.hybrid .cee #body .e1,
.hybrid .cee #body .e2,
.hybrid .ece #body .e1,
.hybrid .ece #body .e2,
.hybrid .eec #body .e1,
.hybrid .eec #body .e2{ display:block; width:220px;}

.hybrid .cee #body{ padding-right:480px;}
.hybrid .ece #body{ padding-left:240px; padding-right:240px;}
.hybrid .eec #body{ padding-left:480px;}

.hybrid .cee #body #content,
.hybrid .ece #body #content,
.hybrid .eec #body #content{ width:100%;}

.hybrid .cee #body #content,
.hybrid .ece #body #content{ float:left; margin-right:-100%;}
.hybrid .eec #body #content{ float:right;}

.hybrid .ece #body .e1,
.hybrid .eec #body .e2{ float:lef   t; left:-240px; margin-right:-220px;}
.hybrid .eec #body .e1{ float:left; left:-480px; margin-right:-220px;}

.hybrid .cee #body .e1,
.hybrid .ece #body .e2{ float:right; left:240px; margin-left:-220px;}
.hybrid .cee #body .e2{ float:right; left:480px; margin-left:-220px;}

/* 
A CSS framework ends here. We don't recommend modifying framework. You can override these properties by defining the styles outside the framework.
여기까지 CSS 프레임웍 입니다. 프레임웍 수정을 권장하지 않습니다. 스킨을 변형할 때 프레임웍 밖에서 선언된 속성으로 덮어쓰기 할 수 있습니다. 
*/


/* Element Reset */
body { font-family: Dotum, AppleGothic, Tahoma, Sans-serif; font-size:12px; margin:0; color:#000; height:100%; }
address { font-style:normal;}
legend{ position:absolute; width:0; height:0; font-size:0; line-height:0; visibility:hidden;}
fieldset{ border:0; padding:0; margin:0;}

/* Global Class */
.inputText{ border:1px solid #9c9c9c; border-right-color:#c2c2c2; border-bottom-color:#c2c2c2; color:#666; font-family:Tahoma;}
.inputTextarea{ border:1px solid #9c9c9c; border-right-color:#c2c2c2; border-bottom-color:#c2c2c2; color:#666; font-family:Tahoma; line-height:1.5;}
.inputCheck{ width:13px; height:13px;}
.inputRadio{ width:13px; height:13px;}

/* Skip To Content */
a.skipToContent{ display:block; position:relative; clear:both; overflow:hidden; width:1px; height:1px; text-decoration:none !important; margin:0 0 -1px 0;}
a.skipToContent:hover,
a.skipToContent:active,
a.skipToContent:focus{ width:100%; height:auto; margin-bottom:-23px; padding:5px 0;}

/* Layout */
#xe.fixed { }
.fixed #container { width:100%; }
.fixed #header{ width:990px; margin:0 auto; z-index:2; }
.fixed #body{ padding:15px 0 0 0; width:975px; height:100%; margin:0 auto; z-index:1; }
.fixed .ce #body{ background-image:none;}
.fixed .ce #body #content{ width:700px; }
.fixed .ce #body .e1{ width:254px; padding:0 0 20px 0; }
#footer{ width:100%; padding:15px 0;}
#footer address { width:865px; margin:0 auto; }


/* Header */
#header a{ text-decoration:none;}
#header a:hover,
#header a:active,
#header a:focus{ text-decoration:underline;}

#header h1 { margin:0 0 0 7px; padding:0; position:relative; top:0; left:0; height:68px; overflow:hidden; }
#header h1 a{ color:#000; }
#header h4 { display:none; }

#header #logo { position:relative; top:0; left:0; }

#header #d_day { position:absolute; top:24px; right:0; width:190px;
background:transparent url(../img/bg_dday.gif) 0 0px no-repeat; color:#000; display:block;
font-family:tahoma; font-size:42px; height: 38px ; padding:16px 9px; text-align:right; margin:0; }

#header #topmenu { display:block; position:absolute; text-align:right; top:40px; right:8px; width:800px; z-index:5; *zoom:1}
#header #topmenu:after { display:block; clear:both; content:"" }

#header #topmenu ul { display:block; position:relative; margin:0;}
#header #topmenu ul li { position:relative; display:inline; padding:7px 2px 0 8px; *padding:0 8px 0 8px; list-style:none; background: transparent url(../images/default/bg_topmenu.gif) left 0px no-repeat;  *background-position: 0 3px; z-index:6; *zoom:1}
#header #topmenu ul li.first { background: none; }
#header #topmenu ul li.last { background: none; z-index:5}

#header #topmenu ul li div.popup { display:none; position:absolute;  background: #fff url(../images/default/link_central_org.gif) 5px 9px no-repeat; *background-position:5px 12px; top:-15px; left:0px; margin:0; padding:36px 10px 10px; border:3px #f36800 solid; *zoom:1; z-index:6}
#header #topmenu ul li div.popup:after { display:block; clear:both; content:"" }
#header #topmenu ul li div.popup div { overflow:visible !important; }

#header #topmenu ul li div.popup ul { margin:0; padding:0; }
#header #topmenu ul li div.popup ul li{ float:left; clear:both; white-space:nowrap; background:none; line-height:150%; padding:0; margin:0}
#header #topmenu ul li div.popup ul a:hover { color:#f36800; text-decoration:none; }

#header .extension { position:relative; float:none; clear:both; padding:0; }
#header .extension * { margin:0; padding:0; }
#header .e1 { padding:18px 18px 19px 17px; height:230px; background: transparent url(../images/default/bg_header_extension1.gif) left 0px no-repeat;}
#header .e1 .hotissue { width:752px; height:230px; float:left; }
#header .e1 .loginfo { float:right;  padding:36px 20px 0 0px !important;}
#header .e2 { margin:0 0 0 7px; height:30px; padding:4px 0; background: transparent url(../images/default/bg_header_extension2.gif) left 0px no-repeat;}
#header .e2 .lineNotice { width:400px; float:left; margin-top:4px; padding-left:46px; background: transparent url(../images/default/bg_lineNotice.gif) 10px 2px no-repeat; }
#header .e2 .lineNotice a { color:#615b5a; }
#header .e2 .searchBox { float:right; }
#header .e2 .searchBox div { overflow:visible !important; }

#body .extension a{ text-decoration:none;}
#body .extension a:hover,
#body .extension a:active,
#body .extension a:focus{ text-decoration:underline;}
#body .extension h2 { height:20px; display:block; text-indent:-1000em; margin:0 0 10px 0;}
#body .extension h2.category { display:none; }

#body .e1 .section{ float:right; margin: 8px 0 0 0; width:100%; clear:both; }
#body .e1 .section a{ color:#666;}
#body .e1 .section a.more2 { position:absolute; display:block; left:270px; top:0;}

#body .e1 .section.link { margin-top:0; }
#body .e1 .section.link a { display:block; margin-top:10px; }

#body .e1 .section.sidomap { z-index:5 }

#body .e1 .section.todayphoto { background: #fafafa; margin-bottom:0; z-index:4}
#body .e1 .section.todayphoto .today_photo_simple .title{ line-height:14px; background:url("../images/default/today_photo_title.gif") no-repeat scroll left top transparent; }

#body .e1 .section.summary { border:1px #ddd solid; border-top:none; background: #fafafa; padding:15px; margin-top:0; width:222px;}

#body .e1 .section.summary ul.tab_list{ display:block; margin:0 0 15px 0px; padding:0; clear:both}
#body .e1 .section.summary ul.tab_list:after{ content:""; display:block; clear:both;}
#body .e1 .section.summary ul.tab_list li { list-style:none; height:29px; float:left; }
#body .e1 .section.summary ul.tab_list li div { text-indent:-1000em; height:29px; background: transparent url(../images/default/bg_summary_tab.gif) 0 0 no-repeat; }
#body .e1 .section.summary ul.tab_list li div.seq1{ width:106px; background-position: 0 -29px; }
#body .e1 .section.summary ul.tab_list li div.seq2{ width:114px; background-position: -106px -29px; }
#body .e1 .section.summary ul.tab_list li.active div.seq1{ background-position: 0 0; }
#body .e1 .section.summary ul.tab_list li.active div.seq2{ background-position: -106px 0; }

#body .e1 .section.summary div.thumb_list { clear:both; }


#body .e1 .section.social_widget {
    border:1px solid #DDDDDD;
}
#body .e1 .section.social_widget .switch a {
    display:block;
    float:left;
    width:50%;
    height:25px;
    text-indent:-1000em;
    overflow:hidden;
    border-width:0 1px 1px 1px;
    border-style:solid;
    border-color:#DDDDDD;
    margin-left:-2px;
    background:#FAFAFA url('../images/default/social_logo.gif') no-repeat center 5px;
}
#body .e1 .section.social_widget .switch a.first {
    margin:0;
    border-left:0 none;
    border-bottom:1px solid #DDDDDD;
    background-color:#FAFAFA;
}
#body .e1 .section.social_widget .switch a.first.active {
    border-bottom:0 none;
    background-color:#FFF;
}
#body .e1 .section.social_widget .switch a.last {
    border-right:0 none;
}
#body .e1 .section.social_widget .switch a.last.active {
    background-color:#FFF;
    border-bottom:0 none;
}
#body .e1 .section.social_widget .switch a:hover {
    background-color:#F3F3F3;
}
#body .e1 .section.social_widget .switch a.twitter {
    border-right:1px solid #DDD;
}
#body .e1 .section.social_widget .switch a.me2day {
    border-left:1px solid #DDD;
    background-position:center -45px;
}

#body .e1 .section.social_widget .twitter_head,
#body .e1 .section.social_widget .me2day_head {
    height:25px;
    text-indent:-1000em;
    background:#FAFAFA url('../images/default/social_logo.gif') no-repeat center 5px;
}
#body .e1 .section.social_widget .twitter_head {

}
#body .e1 .section.social_widget .me2day_head {
    background-position:center -45px;
}

#body .e1 .section.social_widget .section {
    clear:both;
}

#body .e1 .section.social_widget .twitter_box,
#body .e1 .section.social_widget .me2day_widget {
    border:0 none;
    margin:0;
}
#body .e1 .section.social_widget .twitter_box .twitter_logo,
#body .e1 .section.social_widget .twitter_box .twitter_bt,
#body .e1 .section.social_widget .me2day,
#body .e1 .section.social_widget .me2day .logo_me2day {
    display:none;
}



.fixed #body #content p { padding:0px; margin:0px}

#footer a{ text-decoration:none;}
#footer a:hover,
#footer a:active,
#footer a:focus{ text-decoration:underline;}

#footer .extension { background:#F0F0F0; border:1px solid #CBCBCB; border-width:1px 0;}
#footer .extension { display:block; }
#footer .extension .handypia { border-bottom:1px solid #DDDDDD; }
#footer .extension .city { border-top:1px solid #FFFFFF; }
#footer .extension ul { width: 855px; margin:0 auto; padding:20px 0 20px 120px; background-repeat:no-repeat; background-position:left center; }
#footer .extension .handypia ul { background-image:url('../images/default/footer_nav_handypia.gif'); }
#footer .extension .city ul { background-image:url('../images/default/footer_nav_city.gif'); }
#footer .extension .sitemap { width:100%; }
#footer .extension a { padding:1px 2px; border-left:1px solid #ADADAD; padding:0 3px 0 5px; color:#515151; font-size:9pt; font-family:돋움; }
#footer .extension .navigator .first a { border:0 none; }

#footer address{ position:relative;  margin:0 auto; text-align:left; font-size:11px; line-height:1.3em; color:#666666;
background:url('../images/default/handypia_logo_gray.gif') no-repeat left center;
padding:30px 0; padding-left:110px;
}
#footer address a.handypia { position:absolute; left:0; display:block; width:90px; height:40px; overflow:hidden; text-indent:-100em;}
#footer address p { margin-bottom:4px; }


#footer address a,
#footer address acronym,
#footer address abbr{ font-weight:bold; color:#666;}
#footer address .rss{ position:absolute; top:0; right:60px; white-space:normal; padding-left:13px; background:url(../images/default/iconRss.gif) no-repeat left center; font-size:10px; font-weight:normal;}
#footer .extension li { line-height:1.4em; }

/* modalWindow */ 
.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/default/bgLoginText.gif); background-repeat:no-repeat; background-position:right top;}
.loginWindow .loginLayer.loginTypeB .inputText{ background-image:url(../images/default/bgOpenidText.gif); 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-size:12px; font-weight:bold; display:inline-block; height:36px; line-height:36px; background-color:transparent; background-image:url(../images/default/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 .desc { color:#666666;font-size:11px;margin:0 0 10px;text-align:justify; line-height:1.5em;}
.loginWindow .loginLayer .desc span{ color:#F55600;}
.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/default/buttonCloseX.gif) no-repeat center center;}
.loginWindow .loginLayer .close span{ position:absolute; font-size:0; line-height:0; width:0; height:.; overflow:hidden; visibility:hidden;}


.sitemapWindow { display:none; position:fixed; left:0; top:0; position:absolute; width:100%; height:100%; z-index:100; } 
.sitemapWindow.open{ display:block;}
.sitemapWindow .modalWindow{ display:block; position:fixed; border:0; left:0; top:0; _position:absolute; width:100%; height:100%; background:transparent; }
.sitemapWindow .sitemapLayer{ position:absolute; width:880px; top:120px; left:50%; padding:30px; border:2px solid #737373; margin:0 0 0 -470px; background:#fff;}
.sitemapWindow .sitemapLayer h3 { margin:0; }
.sitemapWindow .sitemapLayer .close{ position:absolute; cursor:pointer; border:0; padding:0; top:0; right:0; width:27px; height:27px; background:transparent url(../images/default/buttonCloseX.gif) no-repeat center center;}
.sitemapWindow .sitemapLayer .close span{ position:absolute; font-size:0; line-height:0; width:0; height:.; overflow:hidden; visibility:hidden;}