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

/* html{ overflow:auto;} */

#header h1 a { text-decoration:none; }
#footer address { font-style:normal; }
#footer address a { text-decoration:none; }

/* Skip To Content */
a.skipToContent{ display:block; position:relative; top:0; clear:both; overflow:hidden; height:0; text-decoration:none;}
a.skipToContent:hover,
a.skipToContent:active,
a.skipToContent:focus{ height:auto; margin:0 0 10px 0; padding:5px;}

/* Hr */
hr{ display:none; position:absolute;}

/* Heading 
h1{ position:relative; float:left; margin:0;}
h2{ position:relative; margin:0 0 10px 0; border-bottom:2px solid;}
h3{ position:relative; margin:0;}*/

/* Container + Header + Body + Footer */
#container{ position:relative; margin:0;}
#header{ position:relative; *zoom:1; overflow:hidden; }
#header:after{ content:""; display:block; clear:both;}
#body{ position:relative; *zoom:1;}
#body:after{ content:""; display:block; clear:both;}
#content{ position:relative; text-align:justify; padding:0;}
#footer{ position:relative; *zoom:1; padding:10px 0 10px 0; }
#footer address{ text-align:center;}

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

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

/* Neck */
#neck{ position:relative; clear:both; *zoom:1;}/* overflow:hidden;}*/
#neck .extension{ /* margin-right:-30px;*/ *zoom:1;}
#neck .extension:after{ content:""; display:block; clear:both;}

/* Knee */
#knee{ position:relative; clear:both; *zoom:1;}/* overflow:hidden;}*/
#knee .extension{ /* margin-right:-30px;*/ *zoom:1;}
#knee .extension:after{ content:""; display:block; clear:both;}

/* Extension */
#body .extension{ position:relative; display:none; }

/* ----- Fixed 2 Column Layout ----- */
.fixed .ce #body .e1,
.fixed .ec #body .e1{ width:200px; padding:10px;}

.fixed .ce #body #content{ width:730px; padding:10px 0 10px 10px;}
.fixed .ec #body #content{ width:730px; padding:10px 10px 10px 0;}

.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;}

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

.fixed .cee #body #content { width:510px; padding:10px 0 10px 10px; }
.fixed .ece #body #content { width:520px; padding:10px 0 10px 0; }
.fixed .eec #body #content { width:510px; padding:10px 10px 10px 0; }

.fixed .cee #body #content{ float:left; }
.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; }

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

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

/* ----- Liquid 2 Column Layout ----- */
.liquid .ce #body .e1,
.liquid .ec #body .e1{ width:20%;}
.liquid .ce #body #content,
.liquid .ec #body #content{ width:80%;}
.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;}

/* ----- 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:21%;}

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

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

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

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

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

/* ----- Hybrid 2 Column Layout ----- */
.hybrid .ce #body{ padding-right:230px;}
.hybrid .ec #body{ padding-left:230px; }
.hybrid .ce #body .e1,
.hybrid .ec #body .e1{ width:200px; padding:10px;}
.hybrid .ce #body #content{ width:100%; padding:10px 0 10px 10px; }
.hybrid .ec #body #content{ width:100%; padding:10px 10px 10px 0; margin-left:-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:-220px; right:-220px;}
.hybrid .ec #body .e1{ float:left; clear:left; margin-right:-230px; left:-230px;}

/* ----- 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:200px; padding:10px; }

.hybrid .cee #body{ padding-right:440px; padding-left:10px; }
.hybrid .ece #body{ padding-left:220px; padding-right:220px;}
.hybrid .eec #body{ padding-left:440px; padding-right:10px;}

.hybrid .cee #body #content{width:100%;padding:10px 0 10px 0; }
.hybrid .ece #body #content{width:100%;padding:10px 0 10px 0; }
.hybrid .eec #body #content{width:100%;padding:10px 0 10px 0; }

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

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

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

