* {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

* a         { color: #0000ff; text-decoration: none;
	overflow: hidden;}
* a:hover   { color: #ff0000; }


/*====================================================================*
 * Main Frame
 *--------------------------------------------------------------------*/
html{
	margin: 0;
	padding: 0;
}
#top {
	margin: 0 ;
	padding: 0 ;
	background-color: #b3b3b3;
}

#mainwrapper_1 {
	width: 729px;
	margin: 0px auto;
	padding: 0;
	background: url(img/bg-mainwrapper.gif) repeat-y 0 0;
}
#mainwrapper_2 {
	width: 729px;
	margin: 0px 0 0 0;
	padding: 11px 0 0 0;
	background: url(img/bg-header.gif) no-repeat 0 0%;
}
#mainwrapper_3 {
	padding: 0 0 11px 0;

	background: url(img/bg-footer.gif) no-repeat 0 100%;
}

#main {
	width: 707px;
	margin: 0 11px;
	padding: 0 ;
}


/*====================================================================*
  * header
 *--------------------------------------------------------------------*/

#head {
	width: 707px;
	height: 360px;
	background: url(img/top-image.jpg) no-repeat 0 0px;
	position: relative;

}

#head #head-navi #head-1,
#head #head-navi #head-2,
#head #head-navi #head-3,
#head #head-navi #head-4,
#head #head-navi #head-5,
#head #head-navi #head-6,
#head #head-navi #head-7,
#head #head-navi #head-8 {
	position: absolute;
}

#head #head-navi #head-1 { top: 15px;  left:   0px; width: 150px; text-align: right; }
#head #head-navi #head-2 { top: 106px; left:   0px; width: 150px; text-align: right; }
#head #head-navi #head-3 { top: 196px; left:   0px; width: 150px; text-align: right; }
#head #head-navi #head-4 { top: 273px; left:  30px; width: 150px; text-align: right; }
#head #head-navi #head-5 { top: 15px;  right:  0px; width: 151px; text-align: left; }
#head #head-navi #head-6 { top: 106px; right:  0px; width: 151px; text-align: left; }
#head #head-navi #head-7 { top: 198px; right:  0px; width: 150px; text-align: left; }
#head #head-navi #head-8 { top: 273px; right: 12px; width: 200px; text-align: left; }

#head #head-navi #head-1 h3 { background: url(img/bg-button-i.gif) no-repeat 100% 0;}
#head #head-navi #head-2 h3 { background: url(img/bg-button-f.gif) no-repeat 100% 0;}
#head #head-navi #head-3 h3 { background: url(img/bg-button-m.gif) no-repeat 100% 0;}
#head #head-navi #head-4 h3 { background: url(img/bg-button-book.gif) no-repeat 100% 0;}
#head #head-navi #head-5 h3 { background: url(img/bg-button-u.gif) no-repeat 0% 0;}
#head #head-navi #head-6 h3 { background: url(img/bg-button-b.gif) no-repeat 0% 0;}
#head #head-navi #head-7 h3 { background: url(img/bg-button-l.gif) no-repeat 0% 0;}
#head #head-navi #head-8 h3 { background: url(img/bg-button-d.gif) no-repeat 0% 0; margin-left: 39px;}

#head #head-navi #head-1 h3 a{ display: block; padding-right: 31px; width:117px;}
#head #head-navi #head-2 h3 a{ display: block; padding-right: 31px; width:117px;}
#head #head-navi #head-3 h3 a{ display: block; padding-right: 31px; width:117px;}
#head #head-navi #head-4 h3 a{ display: block; padding-right: 40px; width:105px;}
#head #head-navi #head-5 h3 a{ display: block; text-indent: 30px; width:117px;}
#head #head-navi #head-6 h3 a{ display: block; text-indent: 30px; width:117px;}
#head #head-navi #head-7 h3 a{ display: block; text-indent: 30px; width:117px;}
#head #head-navi #head-8 h3 a{ display: block; text-indent: 30px; width:117px;}

#head #head-navi #head-1 h3 a:hover{ background: url(img/bg-button-i.gif) no-repeat 100% -25px; }
#head #head-navi #head-2 h3 a:hover{ background: url(img/bg-button-f.gif) no-repeat 100% -25px; }
#head #head-navi #head-3 h3 a:hover{ background: url(img/bg-button-m.gif) no-repeat 100% -25px; }
#head #head-navi #head-4 h3 a:hover{ background: url(img/bg-button-book.gif) no-repeat 100% -25px; }
#head #head-navi #head-5 h3 a:hover{ background: url(img/bg-button-u.gif) no-repeat 0px -25px; }
#head #head-navi #head-6 h3 a:hover{ background: url(img/bg-button-b.gif) no-repeat 0px -25px; }
#head #head-navi #head-7 h3 a:hover{ background: url(img/bg-button-l.gif) no-repeat 0px -25px; }
#head #head-navi #head-8 h3 a:hover{ background: url(img/bg-button-d.gif) no-repeat 0px -25px; }


#head #head-navi #head-1 .navi_box { margin-right:30px; }
#head #head-navi #head-2 .navi_box { margin-right:30px; }
#head #head-navi #head-3 .navi_box { margin-right:25px; }
#head #head-navi #head-4 .navi_box { margin-right: 0px; }
#head #head-navi #head-5 .navi_box { margin-left:30px; }
#head #head-navi #head-6 .navi_box { margin-left:30px; }
#head #head-navi #head-7 .navi_box { margin-left:10px; }
#head #head-navi #head-8 .navi_box { margin-left:20px; }

#head #head-navi h3 {
	line-height: 25px;
	height: 25px;
	font-family: "HGºÞ¼¯¸E", sans-serif;

}
#head #head-navi h3 a {
	color: #ffffff;
	font: bold 16px/1.5em serif;
	color: #ffffff; 
	padding-left: 2px;
	padding-right: 3px;
	text-decoration: none;
}

#head #head-navi .navi_box a {

	font: 10px/1.5em serif;
	color: #ffffff; 
	padding-left: 2px;
	padding-right: 3px;
	text-decoration: none;
}

#head #head-navi a:hover {
	text-decoration: underline;
}

#head #head-navi p {
	font: 10px/1.5em serif;
	color: #ffffff;
	padding-left: 3px;
	padding-right: 3px;
}

#head #head-indicator {
	position: absolute;
	top: 49px;
	left: 167px;
	background: url(img/bt-indicator.gif) no-repeat 0 0;
}

#head #head-indicator a{
	display: block;
	width: 90px;
	height: 27px;
	text-indent: -9999px;
	}

#head #head-indicator a:hover { background: url(img/bt-indicator.gif) no-repeat 0px -27px; }

#head #head-word {
	position: absolute;
	top: 324px;
	left: 253px;
	background: url(img/bt-word.gif) no-repeat 0 0;
}

#head #head-word a{
	display: block;
	width: 88px;
	height: 21px;
	overflow: hidden;
	text-indent: -9999px;
}

#head #head-word a:hover { background: url(img/bt-word.gif) no-repeat 0px -21px; }

#head #head-book {
	position: absolute;
	top: 324px;
	right: 257px;
	background: url(img/bt-book.gif) no-repeat 0 0;
}

#head #head-book a{
	display: block;
	width: 88px;
	height: 21px;
	overflow: hidden;
	text-indent: -9999px;
}

#head #head-book a:hover { background: url(img/bt-book.gif) no-repeat 0px -21px; }

#head #head-navi #head-4 #impression{
	float: left;

}

#head #head-navi #head-4 #impression a{
	display: block;
	margin: 3px 0px 0px 25px;
	width: 92px;
	height: 22px;
	overflow: hidden;
	text-indent: -9999px;
	background: url(img/impression.gif) no-repeat 0 0;
}

#head #head-navi #head-4 #impression a:hover{ background: url(img/impression.gif) no-repeat 0 -22px;}

/*====================================================================*
 * Contents
 *--------------------------------------------------------------------*/
#body {             
}
#body #search {
	width: 707px;
	background: url(img/bg-search.gif) repeat-x 0 0px;

}

/*====================================================================*
 * Link Buttons
 *--------------------------------------------------------------------*/
#body #search #links {
	float: left;
	width: 439px;
	height: 26px;
	margin: 1px 0px 1px 1px;
	padding: 3px 0px;
	background: url(img/bg-links.gif) no-repeat 0 0;
}
#body #search #links li {
	float: left;
	text-indent: -9999px;
}
#body #search #links li a {
	display: block;
	padding-right: 2px;
	height: 26px;

}
#body #search #links li a.li_01 { width: 72px; height: 26px; }
#body #search #links li a.li_02 { width: 96px; height: 26px; }
#body #search #links li a.li_03 { width: 114px; height: 26px; }
#body #search #links li a.li_04 { width: 88px; height: 26px; }
#body #search #links li a.li_05 { width: 55px; height: 26px; }

#body #search #links li a.li_01:hover { background: url(img/bg-links.gif) no-repeat 0px -35px; }
#body #search #links li a.li_02:hover { background: url(img/bg-links.gif) no-repeat -74px -35px; }
#body #search #links li a.li_03:hover { background: url(img/bg-links.gif) no-repeat -172px -35px; }
#body #search #links li a.li_04:hover { background: url(img/bg-links.gif) no-repeat -288px -35px; }
#body #search #links li a.li_05:hover { background: url(img/bg-links.gif) no-repeat -378px -35px; }


/*====================================================================*
 * Search Buttons
 *--------------------------------------------------------------------*/
#body #search #functions {
	margin: 5px 0 0 0 ;
	width: 260px;
	height: 25px;
	float: left;
	padding: 0px 2px;
	background: url(img/bg-buttons.jpg) no-repeat 0 0;
}

#body #search #functions li {
	float: left;
	border: 0;
	margin-top: 0px;
	margin-right: 0px;
	text-indent: -9999px;
}

#body #search #functions li a {
	display: block;
}

#body #search #functions li a.li_01 { width: 58px; height: 25px; }
#body #search #functions li a.li_02 { width: 58px; height: 25px; }
#body #search #functions li a.li_03 { width: 81px; height: 25px; }
#body #search #functions li a.li_04 { width: 60px; height: 25px; }

#body #search #functions li a.li_01:hover { background: url(img/bg-buttons.jpg) no-repeat -2px -25px; }
#body #search #functions li a.li_02:hover { background: url(img/bg-buttons.jpg) no-repeat -60px -25px; }
#body #search #functions li a.li_03:hover { background: url(img/bg-buttons.jpg) no-repeat -118px -25px; }
#body #search #functions li a.li_04:hover { background: url(img/bg-buttons.jpg) no-repeat -199px -25px; }




/*====================================================================*
 * Search Forms
 *--------------------------------------------------------------------*/
#body #search table {
	clear: left;
	margin: 0;
	padding: 0 0 2px 0;
	
}
#body #search table td {
	width: 225px;
	padding: 0 0 0 7px;
}
#body #search table td h3 {
	color: #333333;
	font-size: 13px;
}
#body #search table td h3 a {
	font-size: 12px;
	text-decoration: none;
}
#body #search table td input.text {
	width: 180px;
	height: 18px;
	margin-right: 2px;
}
#body #search table td input.submit {
	width: 35px;
	padding: 1px;
	
}


/*====================================================================*
 * News & Topics
 *--------------------------------------------------------------------*/


#body #left {
	float: left;
	width: 290px;
	padding: 0 0 5px 0;
}

#body #left h3 {
	margin: 0px 0px 0 10px;
	background: url(img/title-news_topics.gif) no-repeat 0px 0;
	text-indent: -9999px;
	width: 140px;
	float: left;
}

#body #left iframe {
	float: left;
	width: 270px;
	height: 97px;
	margin: 0 10px;
}

#body #left #DB_info {
	margin-top: 0px;
	font-size: 16px;
	font-weight: bold;
}

/*====================================================================*
 * Calender
 *--------------------------------------------------------------------*/
#body #right {
	float: left;
	width: 403px;
}

#body #right #calender_info {
	margin: 5px 10px 0 15px;
	width: 89px;
	height: 61px;
}

#body #right img {
	float: left;
}

#body #right iframe{
	float: left;
}

#body #right #calender a{
	display: block;
	margin: 3px 0px 0px 29px;
	background: url(img/bg-button-calenders.jpg) no-repeat 0 0;
	width: 82px;
	height: 25px;
	text-indent: -9999px;
	padding: 0 0 0px 0;
	float: left;
	}


#body #right #calender a:hover{ 
	background: url(img/bg-button-calenders.jpg) no-repeat 0 -25px;
	}


/*====================================================================*
 * Recommend
 *--------------------------------------------------------------------*/

#body #right #recommend{
	width: 92px;
	padding: 0 0 0 0px;
	float: left;
	margin: 3px 0px 0px 23px;
}


#body #right #recommend a{
	display: block;
	background: url(img/recommend-btn.gif) no-repeat 0 0;
	width: 92px;
	height: 25px;
	text-indent: -9999px;
	padding: 0 0 0px 0;
	float: left;
}


#body #right #recommend a:hover{ 
	background: url(img/recommend-btn.gif) no-repeat 0 -24px;
}

/*====================================================================*
 * Footer
 *--------------------------------------------------------------------*/
#foot {
	position:relative;
	width: 707px;
	height: 27px;
	background: url(img/bg-credit.gif) repeat-x 0 100%;
	line-height: 30px;
	/*text-align: center;*/
}

#foot address {
	position: absolute;
	left:10px;
	font-style: normal;
	font-size: 12px;
}

#foot #opinion{
	position: relative;
	left:530px;
	top:4px;
}

#foot #opinion a{
	display: block;
	text-indent: -9999px;
	width: 170px;
	height: 20px;
	overflow: hidden;
	background: url(img/bt-opinion.gif) no-repeat 0 0;
}

#foot #opinion a:hover { background: url(img/bt-opinion.gif) no-repeat 0px -20px; }

/*====================================================================*
 * add CSS
 *--------------------------------------------------------------------*/


#head #head-english {
	position: absolute;
	top: 14px;
	right: 160px;
	background: url(img/bt-english.gif) no-repeat 0 0;
}

#head #head-english a{
	display: block;
	width: 65px;
	height: 23px;
	text-indent: -9999px;
	}

#head #head-english a:hover { background: url(img/bt-english.gif) no-repeat 0px -23px; }


/*=========
 * telop
 *---------*/
#body #telop {
	float: left;
	padding-left: 10px;
	margin-top: 3px;
	}






