/* reset start
--------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;	padding: 0;	border: 0; outline: 0; font-size: 100%; vertical-align: top; background: transparent;}

html, body  {margin:0; padding:0; height:auto; font-family: 'dotum',Arial;}
body {line-height: 1; clear:left} 
ol, ul {list-style: none;} 
blockquote, q {quotes: none;} 
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;} 

/* remember to define focus styles! */
:focus {outline: 0;}

/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}

/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: collapse; border-spacing: 0;}
/* reset end
--------------------*/

/* footer start 
--------------------*/
#footer {float:left; padding-top:50px}
.family {border-top: 1px solid #d8d9da; border-bottom: 1px solid #d8d9da;}
.family ul {overflow: auto; width: 952px;}
.family li {float: left; padding: 0 10px;}
.info {color: #6e6e6e; padding-top: 15px; text-align: center; position: relative; height: 100px;}
.info a {color: #6e6e6e;}
.info a:hover {text-decoration: underline;}
.info ul {overflow: auto; font-size: 11px; width: 260px; margin: 0 auto;}
.info li {float: left; padding: 0 5px; background: url(../img/line-v-footer.gif) no-repeat 0 50%;}
.info li.first {background: none;}
.info p {padding-top: 10px;}
.info p .copy {font-size: 9px; color: #858585; font-family: verdana;}
.info .logo-etc {position: absolute; bottom: 10px; right: 25px;}
.info .logo2 {position: absolute; bottom: 45px; left: 30px;}
/* footer end
--------------------*/


/* Button Reset */
.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(../img/buttonWhite.gif) no-repeat; overflow:visible; color:#333;}
.button { height:23px; 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.large { height:29px; background-position:left -30px; }
.button.xLarge { height:35px; background-position:left -65px; }
.button.small { height:18px; background-position:left -107px; }
.button a,
.button button,
.button input { height:23px; padding:0 10px 0 8px; font-size:12px; line-height:23px; background-position:right top;}
.button.large a,
.button.large button,
.button.large input { height:30px; padding:0 10px 0 8px; font-size:16px; line-height:29px; background-position:right -30px;}
.button.xLarge a,
.button.xLarge button,
.button.xLarge input { height:35px; padding:0 10px 0 8px; font-size:20px; line-height:35px; background-position:right -65px;}
.button.small a,
.button.small button,
.button.small input { height:18px; padding:0 6px 0 4px; font-size:11px; line-height:18px; background-position:right -107px;}

/* Button Text Color */
.button *:hover,
.button *:active,
.button *:focus{ color:#690;}
.button.green,
.button.green a,
.button.green button,
.button.green input { background-image:url(../img/buttonGreen.gif); color:#fff;}
.button.green *:hover,
.button.green *:active,
.button.green *:focus{ color:#ff0;}
.button.black,
.button.black a,
.button.black button,
.button.black input { background-image:url(../img/buttonBlack.gif); color:#fff;}
.button.black *:hover,
.button.black *:active,
.button.black *:focus{ color:#ff0;}
.button.red,
.button.red a,
.button.red button,
.button.red input { background-image:url(../img/buttonRed.gif); color:#fff;}
.button.red *:hover,
.button.red *:active,
.button.red *:focus{ color:#ff0;}
.button.blue,
.button.blue a,
.button.blue button,
.button.blue input { background-image:url(../img/buttonBlue.gif); color:#fff;}
.button.blue *:hover,
.button.blue *:active,
.button.blue *:focus{ color:#ff0;}

/* Button Text Strong */ 
.button.strong * { font-weight:bold !important;}

.right {text-align:right !important;}
.left {text-align:left !important;}
.font-red {color:#d91516 }
.font-blue {color:#56a4f9}
.ClearLine {border:0px !important}
.nomargin {margin-right:0px !important}
.tab li {width:115px; height:31px; float:left; text-align:center; font-weight:900; border:1px solid #d7e8fa; border-top-right-radius: 7px;border-top-left-radius: 7px; border-bottom:0px; line-height:3; cursor:pointer}
.tab li.on {background:#eff6fe}

a {text-decoration: none; color: #4a4a4a;}
button {border: none; background: none; padding: 0; cursor: pointer;}
input {background:#fff;}
input[type=radio] {vertical-align:-2px}
#body {margin: 0} 
#wrap {width: 959px; margin: 0 auto; font-size: 12px; line-height: 150%; color: #4a4a4a;}

#hearder {width:100%; height:30px; clear:left}
#hearder #joinform-ok {width:258px; height:21px; background:#f7f7f7; text-align:center; border-radius:5px; border:1px solid #e8e8e8; padding-top:7px; margin-left:699px}
#hearder #joinform-no {width:140px; height:21px; background:#f7f7f7; text-align:center; border-radius:5px; border:1px solid #e8e8e8; padding-top:7px; margin-left:815px}

#bodyL {width:183px; float:left}
#bodyL ul {margin:5px 0; border:1px solid #e5e5e5; border-radius:5px;}
#bodyL ul a:hover {text-decoration: underline;} 
#bodyL ul .arrow {vertical-align:-4px}
#bodyL ul .line {width:160px; height:1px}
//#bodyL ul li:nth-child(odd) {border-bottom:1px solid #e5e5e5; padding:5px 0 0 10px; font-weight:900}
#bodyL ul li:nth-child(odd) {padding:5px 0 0 10px; font-weight:900}
#bodyL ul li:nth-child(even) {padding:5px 0 0 23px}
#bodyL #Left-img img {margin-bottom:5px}

#bodyR {width:748px;  float:right}
#bodyR #title {width:100%; height:32px; border-bottom:2px solid #d8e7fa; margin-bottom:34px}
#bodyR #title span {float:left; font-size:16px} 
#bodyR #title span img {vertical-align:-4px}
#bodyR #title #tree-structure {width:50%; height:30px; margin-left:50%; text-align:right; line-height:3.5; font-size:11px}
#bodyR #content #confirmbtnArea {width:100%;  margin-top:10px; text-align:center}
#bodyR #content #confirmbtnArea img {margin-right:5px}

#bodyR #content #ListTitle {width:100%; margin-bottom:10px}
#bodyR #content #Position #ListTitle img {vertical-align:-5px}
#bodyR #content #Position #ListTitle #serarchbtn {vertical-align:-7px}

#bodyR #content #BoardTable {width:100%}
#bodyR #content #BoardTable thead { background:#eff6fe; height:33px; border:1px solid #d7e8fa}
#bodyR #content #BoardTable th {vertical-align:middle; font-weight:400} 
#bodyR #content #BoardTable td {text-align:center; height:33px; vertical-align:middle; border-bottom:1px solid #d7e8fa}
 

#bodyR #content #GraphTable {width:100%}
#bodyR #content #GraphTable thead,.menu { background:#eff6fe; height:33px; border:1px solid #d7e8fa}
#bodyR #content #GraphTable th {vertical-align:middle; font-weight:400} 
#bodyR #content #GraphTable td {text-align:center; height:33px; vertical-align:middle; border:1px solid #d7e8fa; padding:0 20px}
#bodyR #content #GraphTable tfoot tr td {border:0px ; text-align:right;}

