* {
	margin:0;
	padding:0;
}

body {
	top: 0px;
	text-align: left;
	background-color:#FFFFFF;
	width:100%;
}

body, div, td, p, form, a {
	font-size:12px;
	line-height:18px;
	color:#4B4B4B;
	font-family: Verdana, Arial, sans-serif, Helvetica, "�l�r �S�V�b�N", "Osaka�|����";
}

a {
	text-decoration:none;
	cursor:hand;
	color: #009900;
}
a:link {
	text-decoration:none;
	color:#009900;
}
a:visited {
	text-decoration:none;
	color: #009900;
}
a:active {
	text-decoration:none;
	color: #009900;
}
a:hover{text-decoration:underline; color:#009999}

h1 {
	text-align: left;
	font-size: 12px;
	font-weight: normal;
}
p {
	text-align: left;
	margin: 10px;
}
li {
	list-style-position: outside;
	margin: 0px 0px 0px 20px;
	text-align: left;
}

#container {
	background-image: url(img/bg.gif);
	background-repeat: repeat-y;
	background-position: left;
	background-color:#FFFFFF;
	width: 980px;
}
#na {
	text-align: center;
	margin-top: 60px;
	margin-right: auto;
	margin-bottom: 80px;
	margin-left: auto;
}

/*HEADER*/
#header {
	width:100%;
	background-image: url(img/bg_header.gif);
	background-repeat: no-repeat;
	background-position: left top;
	background-color:#FFFFFF;
	text-align: left;
	padding-top: 25px;
	padding-left: 20px;
	padding-bottom: 0px;
	margin: 0px;
}
#menu0 {
	position: absolute;
	left: 910px;
	top: 30px;
}
#menu1 {
	position: absolute;
	left: 700px;
	top: 30px;
}
#menu2 {
	font-size: 10px;
	position: absolute;
	left: 915px;
	top: 0px;
	width: 100px;
}
#menu2 a {
	font-size: 10px;
}

/*LEFT*/
#left {
	width: 175px;
	text-align: center;
	position: absolute;
	left: 20px;
	top: 90px;
	margin-bottom: 10px;
	font-size: 10px;
}
#left a {
	font-size: 10px;
}
#left h1 {
	padding: 5px;
	font-size: 12px;
	color: #666666;
	background-color: #84FF84;
	text-align: center;
	font-weight: bold;
	letter-spacing: 0.5em;
	border-top: 1px solid #C1C1C1;
	border-right: 1px solid #C1C1C1;
	border-bottom: 1px none #C1C1C1;
	border-left: 1px solid #C1C1C1;
}
#left h2 {
	text-align: left;
	padding: 5px 8px;
	font-size: 10px;
	font-weight: normal;
	line-height: 140%;
}
#left th {
	font-size: 10px;
	text-align: left;
	color: #009933;
}
#left td {
	font-size: 10px;
	text-align: left;
	color: #000000;
}
#profile {
	padding: 5px;
	text-align: center;
	font-size: 10px;
	background-color: #E3E9D8;
	border: 1px solid #C1C1C1;
}
#registration {
	padding: 5px;
	text-align: left;
	font-size: 10px;
	background-color: #E3E9D8;
	border: 1px solid #C1C1C1;
	line-height:14px;
}
#left #registration a {
	font-size: 10px;
	line-height:14px;
}
#left #notice {
	font-size: 10px;
	color: #000000;
	padding: 5px;
	border: 1px solid #C1C1C1;
	background-color: #E8FFFF;
	text-align: left;
	height: 80px;
	line-height:16px;
	overflow: auto;
	scrollbar-base-color: #BADBE0;
}

/*MAIN*/
#content {
	background-color:#FFFFFF;
	width: 740px;
	text-align: left;
	margin-top: 0px;
	margin-left: 210px;
}
#content h1 {
	height: 60px;
	margin-top: 0px;
	margin-bottom: 0px;
}
#content h1.static {
	color: #000000;
	height: auto;
	width: auto;
}
#content h2 {
	font-weight: bold;
	font-size: 12px;
	border: 2px dotted #999999;
	text-align: left;
	margin-top: 10px;
	margin-bottom: 10px;
	padding: 5px;
}
#content h3 {
	font-size: 12px;
	text-align: left;
	padding: 5px;
	margin: 10px 0px 5px 0px;
	background-color: #BFFFFF;
	color: #333333;
}
#main {
	margin: 0px 0px 10px 10px;
	padding: 0px 10px 10px 10px;
	text-align: center;
}

/*FOOTER*/
#footer {
	height: 40px;
	width:100%;
	font-size: 10px;
	clear: both;
	background-image: url(img/bg_footer.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	background-color: #FFFFFF;
	text-align: left;
	padding-top: 20px;
	padding-left: 20px;
}
#container div#footer a {
	font-size: 10px;
}

/* TABLE*/
#content th {
	color: #000000;
	font-weight: bold;
	text-align: right;
	padding: 5px;
	vertical-align: top;
}
#content td {
	color: #666666;
	font-weight: normal;
	text-align: center;
	padding: 3px;
}
#main th.list-header {
	text-align: center;
	background-color: #DBDBDB;
	vertical-align: middle;
}
#main td.left {
	text-align: left;
}
#main table.full {
	width: 100%;
	text-align: left;
	vertical-align:top;
	margin-right: auto;
	margin-left: auto;
}
#container #content #main table.top_search {
	background-image: url(img/top_search.gif);
	background-repeat: no-repeat;
	width: 610px;
	height: 60px;
	margin-right: auto;
	margin-left: auto;
}
#container #content #main td.top_search2 {
	text-align: left;
	padding-left: 160px;
	padding-top: 20px;
}
#container #content #main td.top_search3 {
	font-size: 10px;
	color: #333333;
	text-align: right;
}
#container #content #main td.top_search4 {
	text-align: left;
	width: 150px;
	padding-top: 10px;
}
#content table.top {
	padding: 0px;
	width: 100%;
}
#content .msg_community {
	color: #663300;
	padding: 10px;
	border: 1px dotted #CC6633;
	background-color: #F9DFBF;
	text-align: left;
	margin-left: 20px;
	height: 100px;
	line-height: 120%;
	overflow: auto;
	scrollbar-base-color: #F9DFBF;
}
#content .msg_welcome {
	color: #333333;
	padding: 10px;
	border: 1px dotted #333333;
	background-color: #EEEEEE;
	text-align: left;
	margin-left: 20px;
	height: 120px;
	line-height: 120%;
	overflow: auto;
	scrollbar-base-color: #EEEEEE;
}
#content table.top td {
	text-align: left;
	vertical-align:top;
	padding: 0px 10px 0px 0px;
}
#content table.top td h1 {
	font-weight: normal;
	color: #000000;
	font-size: 12px;
	height:auto;
	margin-right: 10px;
	margin-top: 10px;
}
#content table.top td.rank {
	width: 185px;
	height: 41px;
}
#content table.top td.main td {
	padding: 3px;
	text-align: center;
}
#content table.top td.rank table.rank {
	border: 1px solid #CCCCCC;
	border-collapse: collapse;
	width: 180px;
	margin: 0px;
}
#content table.top td.rank table.rank th {
	text-align: center;
	border-bottom: 1px solid #CCCCCC;
}
#content table.top td.rank table.rank td {
	border-bottom: 1px dotted #CCCCCC;
	text-align: center;
	padding: 3px;
}
#content table.top td.rank2 {
	text-align: center;
	vertical-align:top;
	width: 270px;
	padding: 10px 0px 0px 0px;
}
#content table.top td.rank2 div {
	margin: 0px;
	padding: 15px;
	border: 1px solid #CCCCCC;
	background-color: #FFFFCC;
	text-align: center;
	font-weight: bold;
}

#main table.fix {
	width: 650px;
	text-align: left;
	vertical-align:top;
	margin-right: auto;
	margin-left: auto;
}
#main th.fix {
	width: 100px;
}
#main td.fix {
	text-align: left;
}
#main table.fix2 {
	width: 500px;
	text-align: left;
	vertical-align:top;
	margin-right: auto;
	margin-left: auto;
	background-color: #FEFFD2;
	border: 1px solid #CCCCCC;
}
#main th.fix2 {
	text-align: left;
	color: #666600;
	padding: 5px;
	border: 1px solid #CCCCCC;
	font-size: 12px;
	background-color: #FEEEAD;
}
#main table.fix3 {
	width: 600px;
	text-align: left;
	vertical-align:top;
	margin-right: auto;
	margin-left: auto;
	background-color: #FEFFCC;
	border: 1px solid #CCCCCC;
}
#main table.fix3 th {
	width: 100px;
	text-align: left;
	vertical-align:top;
	color: #333333;
	font-size: 14px;
}
#main table.fix3 td {
	text-align: left;
}
#main table.border a {
	font-weight: bold;
	color:#0000CC;
}
#main table.border a:hover {
	text-decoration:none;
	background-color:#CCFFCC;
}
#main table.border td {
	padding:2px;
}
table.test {
	width: 80%;
	vertical-align:top;
	border: 1px dotted #0099CC;
	margin-top: 20px;
	margin-right: auto;
	margin-left: auto;
}

/* BUTTON*/
.btn {
	background-image: url(img/btn.gif);
	background-repeat: repeat-x;
	text-align: center;
	height: 20px;
	border: 1px solid #999999;
	padding-right: 5px;
	padding-left: 5px;
	margin-top: 10px;
	margin-bottom: 10px;
}

.btn01, .btn02, .btn03, .btn04, .btn05 {
	background-repeat: no-repeat;
	text-align: center;
	height: 25px;
	border: 0px;
	margin-top: 10px;
	margin-bottom: 10px;
	background-color: transparent;
}
.btn01 {background-image: url(img/btn01.gif); width: 42px;}
.btn02 {background-image: url(img/btn02.gif); width: 62px;}
.btn03 {background-image: url(img/btn03.gif); width: 82px;}
.btn04 {background-image: url(img/btn04.gif); width: 120px;}
.btn05 {background-image: url(img/btn05.gif); width: 150px;}

#main table.fix2 .btn02 {margin: 0px;}
#main table.fix2 .btn03 {margin: 0px 0px auto auto;}
#main table.fix2 .btn04 {margin: 0px;}

.btn_top, .btn_test, .btn_report, .btn_book, .btn_search, .btn_logout, .btn_listen, .na_test, .na_report, .na_book, .na_search, .na_listen {
	background-repeat: no-repeat;
	height: 48px;
	width: 40px;
	border: 0px;
	color: #666666;
	background-color: #FFFFFF;
	margin-top: 0px;
}
.btn_top {background-image: url(img/btn_top.gif);}
.btn_test {background-image: url(img/btn_test.gif);}
.btn_report {background-image: url(img/btn_report.gif);}
.btn_book {	background-image: url(img/btn_book.gif);}
.btn_search {background-image: url(img/btn_search.gif);}
.btn_logout {background-image: url(img/btn_logout.gif);}
.btn_listen {background-image: url(img/btn_listen.gif);}
.na_test {background-image: url(img/na_test.gif);}
.na_report {background-image: url(img/na_report.gif);}
.na_book {background-image: url(img/na_book.gif);}
.na_search {background-image: url(img/na_search.gif);}
.na_listen {background-image: url(img/na_listen.gif);}

.btn_invite, .btn_challenge, .btn_ranking, .btn_regi, .na_invite, .btn_download {
	background-repeat: no-repeat;
	height: 30px;
	width: 160px;
	border: 0px;
	color: #666666;
	margin-top: 5px;
	margin-bottom: 0px;
}
.btn_invite {background-image: url(img/btn_invite.gif);	background-color: #FFFFFF;}
.btn_challenge {background-image: url(img/btn_challenge.gif); background-color: #FFFFFF;}
.btn_ranking {background-image: url(img/btn_ranking.gif); background-color: #FFFFFF;}
.btn_regi {background-image: url(img/btn_regi.gif);	background-color: #E3E9D8; margin-bottom: 15px;}
.na_invite {background-image: url(img/na_invite.gif); background-color: #FFFFFF;}
.btn_download {background-image: url(img/btn_download.gif); background-color: #FFFFFF;}

.btn_forget {
	background-image: url(img/btn_forget.gif);
	background-repeat: no-repeat;
	height: 16px;
	width: 130px;
	border: 0px;
	background-color: #E3E9D8;
}
.btn_createBook, .btn_addQuiz {
	background-repeat: no-repeat;
	height: 25px;
	width: 116px;
	border: 0px;
	background-color: #FFFFFF;
	margin-top: 10px;
	margin-bottom: 10px;
}
.btn_createBook {background-image: url(img/btn_createBook.gif);}
.btn_addQuiz {background-image: url(img/btn_addQuiz.gif);}
.btn_deleteBook, .btn_updateBook {
	background-repeat: no-repeat;
	height: 25px;
	width: 98px;
	border: 0px;
	color: #666666;
	background-color: #FFFFFF;
}
.btn_deleteBook {background-image: url(img/btn_deleteBook.gif);}
.btn_updateBook {background-image: url(img/btn_updateBook.gif);}

.btn_delete, .btn_move, .btn_tobook, .btn_update, .btn_select, .btn_detail, .btn_next, .btn_back, .na_next, .na_back  {
	background-repeat: no-repeat;
	height: 22px;
	width: 42px;
	border: 0px;
	color: #666666;
	background-color: transparent;
}
.btn_delete {background-image: url(img/btn_delete.gif);}
.btn_move {background-image: url(img/btn_move.gif);}
.btn_tobook {background-image: url(img/btn_tobook.gif);}
.btn_update {background-image: url(img/btn_update.gif);}
.btn_select {background-image: url(img/btn_select.gif);}
.btn_detail {background-image: url(img/btn_detail.gif);}
.btn_next {background-image: url(img/btn_next.gif);}
.btn_back {background-image: url(img/btn_back.gif);}
.na_next {background-image: url(img/na_next.gif);}
.na_back {background-image: url(img/na_back.gif);}
.btn_ipod {
	background-repeat: no-repeat;
	height: 23px;
	width: 19px;
	border: 0px;
	color: #666666;
	background-color: transparent;
	background-image: url(img/btn_ipod.gif);
}

.btn_ipod01, .btn_ipod02, .btn_ipod03, .btn_csv01, .btn_csv02, .btn_pdf01, .btn_pdf02, .btn_pdf03, .btn_pdf04 {
	background-repeat: no-repeat;
	height: 27px;
	width: 121px;
	border: 0px;
	background-color: #FFFFCC;
}
.btn_ipod01 {background-image: url(img/btn_ipod01.gif);}
.btn_ipod02 {background-image: url(img/btn_ipod02.gif);}
.btn_ipod03 {background-image: url(img/btn_ipod03.gif);}
.btn_csv01 {background-image: url(img/btn_csv01.gif);}
.btn_csv02 {background-image: url(img/btn_csv02.gif);}
.btn_pdf01 {background-image: url(img/btn_pdf01.gif);}
.btn_pdf02 {background-image: url(img/btn_pdf02.gif);}
.btn_pdf03 {background-image: url(img/btn_pdf03.gif);}
.btn_pdf04 {background-image: url(img/btn_pdf04.gif);}


/*TEXT*/
.txt01 {
	color: #0066CC;
	font-weight: bold;
}
.txt02 {
	color: #333333;
	font-weight: bold;
}
.txt03 {
	color: #0033CC;
}
.txt04 {
	color: #FF3300;
}
.txt05 {
	color: #000000;
}
.quiz {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
}
.infoMessage {
  color: orange;
  font-weight: bold;
  font-size: 10px;
}
.warnMessage {
  color: orange;
  font-weight: bold;
  font-size: 10px;
}
.errorMessage {
  color: red;
  font-weight: bold;
  font-size: 10px;
}
.fatalMessage {
  color: red;
  font-style: italic;
  font-weight: bold;
  font-size: 10px;
}

/*LAYOUT*/
.left {text-align: left;}
.center {text-align: center;}
.right {text-align: right;}
.cola {width:auto;}
.col3 {width:60px;}
.col2 {width:45px;}
.col1 {width:30px;}
.col0 {width:20px;}
.scrl {
	overflow: auto;
	border: 0px;
	margin: 0px 0px 10px 0px;
}

.field {
	border: 1px solid #999999;
	background-color: #ECFFEC;
	padding: 5px;
}
.pop {
	display:none;
	width:150px;
	padding:3px;
	background-color: #FFFFCC;
	border:2px solid #CCCCCC;
	z-index:256;
	position:absolute;
	color: #666666;
	line-height:1.3;
}
.pop_l {
	display:none;
	width:200px;
	padding:0px;
	background-color: #66FFFF;
	border:2px solid #CCCCCC;
	z-index:256;
	position:absolute;
	left:490px;
}
div#left .help, div#main .help {
	display:none;
	width:300px;
	padding:8px;
	background: #FFFFCC;
	border:2px solid #CCCCCC;
	z-index:256;
	position:absolute;
	text-align:left;
	line-height:1.2;
	font-weight: normal;
	color:#333333;
	margin-left: 10px;
	top: 300px;
}
div#main .help {
	left:420px;
}

.border {
	border: 2px solid #666666;
	padding: 10px;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	background-color: #FEFFD2;
}
.table-highlight {
	color: #ff0000;
	font-weight: bold;
}
.list-header {
	color: #000000;
	font-weight: bold;
	text-align: center;
	border: 0px;
	background-color: transparent;
	padding: 5px;
	width: auto;
}
.list-paging-header {background-color: white;}
.list-paging-footer {background-color: white;}
.list-row-even {background-color: #eeeeee;}
.list-row-odd {background-color: #F3FED1;}
.must {background-color: #FFE9B9;}

/* Original*/
#container td.RbGrpClEv, #container span.RbSpn {text-align: left;}
.TxtFld, .TxtAra {padding: 2px;}