@charset "utf-8";
/* CSS Document */
/****************** GENERAL ELEMENTS **********************/
/*body {
  background:#E8E8E8;
  font-family:Verdana, Arial, Helvetica, sans-serif, Tahoma;
  font-size:small;
  background:#FFFFFF;
  background-image:url(../images/bg_body.gif);
  background-repeat:repeat-x;
  margin:0;
}*/

body {
margin: 8px;
padding: 0;
background-color:#FEFDFD;
background-image:url(/images/bg_body.gif);
background-repeat:repeat-x;
font-family:Tahoma;
font-size: 0.8em; 
color: #000;
}

form {
background:#E8F0F7;
border:#B5CEE1 solid 1px;
padding:8px;
}
p {
padding: 0;
margin: 4px 0;
}
label {
float: left;
position:relative;
width: 180px;
line-height: 20px;
text-align: right;
padding-right: 5px;
overflow:hidden;
}
p.sub {
padding-left: 185px;
}

#header_admin {
/*position: relative;*/
float: none;
width: 780px;
/*height: 54px;*/
margin: 0 auto;
padding: 0;
background-image:url(/images/bg_header_admin.png);
background-repeat:repeat-x;
border-top: 1px solid #999;
border-left: 1px solid #999;
border-right: 1px solid #999;
font-size:14px;
font-weight:bold;
color:#FFF;
}
#header_admin .header_bar {
padding:3px 4px;
margin:0px;
}
#header_admin .menu_admin {
background:#666;
text-align:right;
padding:3px;
margin:0px;
}
#header_admin .menu_admin a {
font-size:12px;
font-weight:bold;
text-decoration:none;
color:#FFF;
}
#header_admin .menu_admin a:hover {
text-decoration:underline;
color:#FFF;
}

#header {
position: relative;
float: none;
width: 780px;
/*height: 100px;*/
margin: 0 auto;
padding: 0;
border-top: 1px solid #999;
border-left: 1px solid #999;
border-right: 1px solid #999;
z-index:3;
}
#container {
width: 780px;
/*position: relative;*/
float: none;
margin: 0 auto;
border-left: 1px solid #999;
border-right: 1px solid #999;
background-color: #FFF;
/*เพิ่มเติมเข้ามา เพื่อป้องกันรูปภาพหลุด box ตัวนี้จะไม่มีผลกับ IE แต่ถ้าไม่ใส่่ จะมีปัญหากับ FF และ Opera*/
display:block;
overflow:hidden;
z-index:1;
}
#footer {
/*position: relative;*/
float: none;
width: 780px;
height: 40px;
margin:0 auto;
padding:8px 0px 0px 0px;
border-top:#666 solid 1px;
border-left:1px solid #999;
border-right:1px solid #999;
border-bottom:1px solid #999;
background-image:url(/images/bg_footer.png);
background-position:top;
color:#666;
letter-spacing:0.1em;
font-size:x-small;
text-align:center;
}
#content_box {
padding:8px;
clear:both;
/*position:relative;*/
z-index:2;
}
#content_box .admin_console {
width:600px;
margin:8px auto;
}
#content_box .admin_console ul {
padding:0px;
margin:0px;
list-style-type:none;
}
#content_box .admin_console li {
padding:3px 0px;
}
#content_box .admin_console li a {
color:#000;
text-decoration:underline;
}
#content_box .admin_console li a:hover {
color:#F30;
text-decoration:none;
}
#content_box .flash_left {
float:left;
display:inline;
background-color:#FFF;
padding:3px;
border:1px solid #CCC;
margin:0px 8px 8px 0px;
}
#content_box .txt_content {
/*position:relative;*/
overflow:hidden;
}
#content_box .txt_content a {
font-weight:bold;
font-size:14px;
color:#F30;
text-decoration:none;
border-bottom:#999 dotted 1px;
padding-bottom:4px;
width:540px;
display:block;
}
#content_box .txt_content a:hover {
color:#F60; text-decoration:none;
}
#content_box .txt_content label {
width:120px;
}
#content_box .img_right {
float:right;
display:inline;
background-color:#FFF;
padding:3px;
border:1px solid #CCC;
margin:0px 0px 8px 8px;
}
#content_box .img_left {
float:left;
display:inline;
background-color:#FFF;
padding:3px;
border:1px solid #CCC;
margin:0px 8px 8px 0px;
}
#content_box .login h3 {
background-image:url(/images/bg_menu.gif);
background-repeat:repeat-x;
text-align:center;
color:#FFF;
padding:6px 0px;
margin:0px;
}
#content_box .login {
display:block;
background-color:#FFF;
padding:4px;
border:2px solid #369;
width:480px;
margin:8px auto;
}
#content_box .webboard_topic {
display:block;
background-color:#FFF;
padding:8px;
border:3px solid #369;
}
#content_box .webboard_topic .toolbox {
margin:8px -8px -8px -8px;
padding:4px;
background:#E4E4E4;
text-align:center;
position:relative;
overflow:hidden;
display:block;
}
#content_box .webboard_ans {
display:block;
background-color:#FFF;
padding:8px;
border:2px solid #369;
width:680px;
margin:8px auto;
}
#content_box .webboard_ans .toolbox {
margin:-8px -8px 8px -8px;
padding:4px;
background:#E4E4E4;
text-align:center;
position:relative;
overflow:hidden;
}
#content_box .txt_list {
overflow:hidden;
}
#content_box .txt_list ul {
padding:0px;
margin:0 0 0 28px;
/*position:relative;*/
}
#content_box .txt_list li {
list-style-image:url(../images/ico_list.png);
list-style-position:outside;
}
#content_box .txt_list li img {
/*margin-left:-26px;*/
}
#content_box .txt_list li a {
padding:4px 0px 4px 4px;
font-weight:bold;
color:#009;
text-decoration:none;
}
#content_box .txt_list li a:hover {
color:#F30;
text-decoration:underline;
}
#content_box .list_box {
position:relative;
text-align:left
}
#content_box .list_box ul {
padding:0px;
margin:0px;
position:relative;
}
#content_box .list_box li {
/*padding:4px 0px 4px 28px;*/
list-style-image:url(../images/ico_list.png);
list-style-position:outside;
margin-left:48px;
}
#content_box .list_box li a {
font-weight:bold;
color:#009;
text-decoration:none;
}
#content_box .list_box li a:hover {
color:#F30;
text-decoration:underline;
}
#content_box .list_fac_box{
text-align:left;
/*border-bottom:#999 1px dotted;*/
}
#content_box .list_fac_box label{
width:108px;
text-align:right;
}
#content_box .content_center {
text-align:center;
overflow:hidden;
}
#content_box h3 {
background-image:url(/images/bg_h.gif);
background-repeat:repeat-x;
height:39px;
text-align:center;
color:#FFF;
padding:6px 0px;
margin:0px;
}
#content_box .head_fpage {
background-image:url(/images/bg_head_fpage.png);
background-repeat:repeat-x;
height:54px;
color:#FFF;
margin:0px;
}
#content_box .head_fpage span {
color:#000000;
font-weight:bold;
font-size:medium;
display:block;
padding:18px 8px 0px 8px;
}
#content_box .head_fpage img {
float:left;
}
#content_box .head_fpage a {
color:#339;
text-decoration:none;
font-weight:bold;
}
#content_box .head_fpage a:hover {
color:#F30;
text-decoration:none;
}

#column_box{
margin:6px; padding:3px;
width:30%; float:left;background:#D9E8EA; border:#6699CC 1px solid;
}
#column_box .headbar{
background:#FFF;
}

#tabnav { /* general settings */
text-align: left; /* set to left, right or center */
margin: 10px 0 10px 0; /* set margins as desired */
border-bottom:#92B8D3 1px solid; /* set border COLOR as desired */
font-weight:bold;
list-style-type: none;
padding: 3px 10px; /* THIRD number must change with respect to padding-top (X) below */
}

#tabnav li { /* do not change */
display: inline;
}

#tabnav li.active { /* settings for selected tab */
border-bottom: 1px solid #F8F8F8; /* set border color to page background color */
background-color:#F8F8F8; /* set background color to match above border color */
}

#tabnav li.active a { /* settings for selected tab link */
background-color:#F8F8F8; /* set selected tab background color as desired */
color: #000; /* set selected tab link color as desired */
position: relative;
top: 1px;
padding-top: 4px; /* must change with respect to padding (X) above and below */
}

#tabnav li a { /* settings for all tab links */
padding: 3px 8px; /* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
border:#92B8D3 1px solid; /* set border COLOR as desired; usually matches border color specified in #tabnav */
background-color:#D9E8F0; /* set unselected tab background color as desired */
color: #666; /* set unselected tab link color as desired */
margin-right: 0px; /* set additional spacing between tabs as desired */
text-decoration: none;
border-bottom: none;
}

#tabnav a:hover { /* settings for hover effect */
background:#fff; /* set desired hover color */
color:#000;
}

#endLine{display:block; margin:0 auto; background:none; clear:both;}

.imgTopLeft{margin:0 8px 8px 0; float:left;}

.menu {
padding:0 0 0 8px;
margin:0;
list-style:none;
height:35px;
width:772px;
background:#FFF url(/images/bg_menu.gif) repeat-x; 
position:relative;
border-width:0 1px;
border-bottom:1px solid #444;
}
.menu ul {
padding:0;margin:0;list-style-type:none;
}
.menu ul li {
float:left; position:relative;
}
.menu ul li a, .menu ul li a:visited {
float:left; display:block;
height:35px; line-height:35px; color:#FFF; text-decoration:none; font-size:12px; font-weight:bold; text-align:left; padding:0 14px; cursor:pointer;
}
.menu ul li:hover {
width:auto;
}
.menu ul li a:hover {
background:url(/images/bg_menu_hover.gif); color:#FFF;
}
.menu ul li:hover a {
background:url(/images/bg_menu_hover.gif); color:#FFF;
}
.menu ul li b a:hover {
background:url(/images/bg_menu_hover.gif) no-repeat right top; display:block; margin:0 -14px 0 0; padding:0 14px 0 0;
}
.menu ul li:hover a b {
background:url(/images/bg_menu_hover.gif) no-repeat right top; display:block; margin:0 -14px 0 0; padding:0 14px 0 0;
}
.menu ul li ul {
display: none;
}
.menu table {
margin:0; border-collapse:collapse; font-size:11px; position:absolute; top:0px; left:0;
}

/* specific to non IE browsers */
.menu ul li:hover ul {
display:block; position:absolute;top:34px; background:#E8E8E8; margin-top:1px; left:0; width:152px;
}
.menu ul li:hover ul li ul {
display: none;
}
.menu ul li:hover ul li a {
display:block; background:#E8E8E8; color:#000;height:auto;line-height:15px;padding:4px 8px; width:144px;
}
.menu ul li:hover ul li a.drop {
background:#D1DDEF;
}
.menu ul li:hover ul li a:hover {
color:#ff0; background: #666;
}
.menu ul li:hover ul li a:hover.drop {
background: #369; color:#ff0;
}
.menu ul li:hover ul li:hover ul {
display:block; position:absolute; top:0px; color:#000; left:160px; height:auto; width:160px; overflow:auto; background:#d4d8bd;
}
.menu ul li:hover ul li:hover ul li a {
background:#d4d8bd;
}
.menu ul li:hover ul li:hover ul.left {
left:-160px;
}
.menu ul li:hover ul li:hover ul li a:hover {
background:#949e7c; color:#FFF;
}


/* specific to IE5.5 and IE6 browsers */
.menu ul li a:hover ul {
display:block;position:absolute;top:34px; t\op:33px; background:#E8E8E8;left:0; marg\in-top:1px;
}
.menu ul li a:hover ul li a {
display:block; color:#000; height:1px; line-height:15px; padding:4px 8px; width:144px; w\idth:144px;
}
.menu ul li a:hover ul li a.drop {
background:#D1DDEF; padding-bottom:5px;
}
.menu ul li a:hover ul li a ul {
visibility:hidden; position:absolute; height:0; width:0;
}
.menu ul li a:hover ul li a:hover {
color:#ff0; background: #666;
}
.menu ul li a:hover ul li a:hover.drop {
 background: #369; color:#ff0;
}
.menu ul li a:hover ul li a:hover ul {
visibility:visible; position:absolute; top:0px; t\op:0px; color:#000; left:160px; height:auto; width:160px; overflow:auto; background:#d4d8bd;
}
.menu ul li:hover ul li:hover ul li a {
background:#d4d8bd;
}
.menu ul li a:hover ul li a:hover ul.left {
left:-160px;
}
.menu ul li a:hover ul li a:hover ul li a:hover {
background:#949e7c; color:#FFF;
}
.left {
clear:both;
}

.img_border {
background-color:#FFF;
padding:3px;
border:1px solid #CCC;
}
.hide {
display:none;
}
.more_txt {
float:left;
width:100%;
text-align:right;
}
.more_txt a {
font-weight:bold;
color:#069;
text-decoration:none;
}
.more_txt a:hover {
color:#F30;
text-decoration:none;
}
.left_pos {
float:left;
}
.right_pos {
float:right;
}
.td50p_left {
float:left;
width:50%;
text-align:left;
}
.td50p_right {
float:right;
width:50%;
text-align:right;
}
.link_addnew {
float:left;
width:50%;
text-align:right;
padding:8px 0px 0px 0px;
}
.link_addnew a {
color:#339;
text-decoration:none;
font-weight:bold;
}
.link_addnew a:hover {
color:#F30;
text-decoration:none;
}

.txt_black_sb {
color:#000;
font-weight:bold;
}
.txt_white_sb {
color:#FFF;
font-weight:bold;
}
.txt_blue_s {
color:#36C;
}
.txt_blue_sb {
color:#36C;
font-weight:bold;
}
.txt_dblue_sb {
color:#036;
font-weight:bold;
}
.txt_dblue_mb {
color:#036;
font-weight:bold;
font-size:medium;
}
.txt_orange_sb {
color:#F30;
font-weight:bold;
}
.txt_dred_sb {
color:#C00;
font-weight:bold;
}
.txt_gray_xs_space {
color:#666;
letter-spacing:0.1em;
font-size:x-small;
}
.txt_red_s {
	color:#F00;	
}
.txt_sel_page {
	color:#F30;
	font-size:medium;
	font-weight:bold;
}

.lnk_lblue_orange_sbu00 a {
	color:#339;
	text-decoration:none;
	font-weight:bold;
}
.lnk_lblue_orange_sbu00 a:hover {
	color:#F30;
	text-decoration:none;
}
.lnk_dblue_orange_sbu00 a {
	color:#036;
	text-decoration:none;
	font-weight:bold;
}
.lnk_dblue_orange_sbu00 a:hover {
	color:#F30;
	text-decoration:none;
}
.lnk_blue_lblue_su10 a {
	color:#00F;
	text-decoration:underline;
}
.lnk_blue_lblue_su10 a:hover {
	color:#06F;
	text-decoration:none;
}
.lnk_blue_orange_su00 a {
	color:#00F;
	text-decoration:none;
}
.lnk_blue_orange_su00 a:hover {
	color:#F30;
	text-decoration:none;
}
.lnk_blue_orange_su10 a {
	color:#00F;
	text-decoration:underline;
}
.lnk_blue_orange_su10 a:hover {
	color:#F30;
	text-decoration:none;
}
.lnk_white_white_bu01 a {
	color:#FFF;
	text-decoration:none;
	font-weight:bold;
}
.lnk_white_white_bu01 a:hover{
	color:#FFF;
	text-decoration:underline;
}