@charset "utf-8";
/* CSS Document */

body {background: #e6e6e6; margin: 0; padding: 0;font:11px/14px Arial, 新細明體;}
img {border: none;}
div, p, ul, h2, h3, h4, img{padding:0px; margin:0px;}
.clear {clear: both; margin: 0px; height:0}






#wrapper { width: 853px; margin: 0 auto; padding: 0 4px; background: url(../images/bg.jpg) repeat-y;}

#header{width: 845px; background: url(../images/headerbg.jpg) repeat-x; position: relative; clear:both; height: 115px;}
#header img a {position: absolute; top: 0 ; left: 0;}
#header ul.topnav{position:absolute; top:68px; left:235px; width:600px}
#header ul.topnav li {float: left; height:33px;list-style: none;}
#header ul.topnav li a{height:47px; display:block; /*text-indent:-20000px; */}

#header ul.topnav li.about a {width: 102px;  background: url(../images/about.jpg) 0 0 no-repeat;}
#header ul.topnav li.businessitem a {width: 100px;  background: url(../images/businessitem.jpg) 0 0  no-repeat;}
#header ul.topnav li.events a {width: 96px;  background: url(../images/events.jpg) 0 0  no-repeat;}
 li.news a {width: 100px;  background: url(../images/news.jpg) 0 0  no-repeat;}
#header ul.topnav li.contacts a {width: 99px;  background: url(../images/contacts.jpg) 0 0  no-repeat;}
#header ul.topnav li.links a {width: 98px;  background: url(../images/links.jpg) 0 0  no-repeat;}


li.news a:hover {width: 100px;  background: url(../images/news_hover.jpg) 0 0  no-repeat;}
#header ul.topnav li.about a:hover { background: url(../images/about_hover.jpg) 0 0  no-repeat;}
#header ul.topnav li.businessitem a:hover { background: url(../images/businessitem_hover.jpg) 0 0  no-repeat;}
#header ul.topnav li.events a:hover { background: url(../images/events_hover.jpg) 0 0  no-repeat;}
#header ul.topnav li.contacts a:hover { background: url(../images/contacts_hover.jpg) 0 0  no-repeat;}
#header ul.topnav li.links a:hover  { background: url(../images/links_hover.jpg) 0 0  no-repeat;}


#header ul.topnav li.aboutck a {width: 102px;  background: url(../images/about_hover.jpg) 0 0 no-repeat;}
#header ul.topnav li.businessitemck a {width: 100px;  background: url(../images/businessitem_hover.jpg) 0 0  no-repeat;}
#header ul.topnav li.eventsck a {width: 96px;  background: url(../images/events_hover.jpg) 0 0  no-repeat;}
 li.newsck a {width: 100px;  background: url(../images/news_hover.jpg) 0 0  no-repeat;}
#header ul.topnav li.contactsck a {width: 99px;  background: url(../images/contacts_hover.jpg) 0 0  no-repeat;}
#header ul.topnav li.linksck a {width: 98px;  background: url(../images/links_hover.jpg) 0 0  no-repeat;}











#header ul.topnav {
	list-style: none;
	position:absolute;
	top:68px; left:235px; 
}
#header ul.topnav li {
	margin: 0;	
	position: relative; /*--Declare X and Y axis base--*/
list-style: none;
	
	
}
#header ul.topnav li a{
	float: left;
display:block; /*text-indent:-20000px;*/
}






#header ul.topnav li ul.subnav {
	list-style: none;
	position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/
	left: 0; top: 45px;
	background: #fff;
	margin: 0; padding: 0;
	display: none;
	float: left;
	width: 100px;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	border: 1px solid #ddd;

	
}



#header ul.topnav li ul.subnav li{
	margin: 0; padding: 0;
	border-top: 1px solid #ddd; 
	/*--Create bevel effect--*/
	/*border-bottom: 1px solid #ddd; --Create bevel effect--*/
	clear: both;
	background: none;
	width: 100px;
	_margin: 0 0 -10px 0;
	}
	
	

html ul.topnav li.newsck li a {
	float: left;
	/**/width:100px;
	color: #000;
	font-size: 13px;
	padding: 9px 0 0 0px;
	text-align: center;
	background: url(../images/libg.jpg) repeat-x;
	text-decoration: none;
    letter-spacing: 2px;
	_margin: 0 0 -10px 0;
}


	
html ul.topnav li.news li a {
	float: left;
	/**/width:100px;
	color: #000;
	font-size: 13px;
	padding: 9px 0 0 0px;
	text-align: center;
	background: url(../images/libg.jpg) repeat-x;
	text-decoration: none;
    letter-spacing: 2px;
	_margin: 0 0 -10px 0;
}
html ul.topnav li ul.subnav li a:hover { /*--Hover effect for subnav links--*/
	font-size: 13px;
	background: none;
	_margin: 0 0 -10px 0;background: url(../images/icon.gif) 5px 15px no-repeat;
	color: #F30;
}






































#language {position:absolute; width: 100px; top: 10px; right: 0; }




#main_visual {width: 845px; height: 190px;}

#content {width: 845px; background: url(../images/contentbg.jpg);}

#leftPan{float: left;width: 230px; position: relative;}
#leftPan p{   display:block; margin-bottom:5px;  color:#2f2f2f;  padding:6px 15px 0 50px;  }
#leftPan p span{ height:18px;  display:block; margin-bottom:3px; font:12px/14px Trebuchet MS, sans-serif; color:#069; font-weight:bold; padding-top:3p;}
#leftPan p a{text-decoration: underline; color: #444;}
#rightPan{float: right;width: 607px; top: 0; left: 0;}

.index{font-size: 13px;line-height: 24px; padding: 5px 5px 10px 6px; letter-spacing: 0.3px;}

p.index img {float: right; border: 2px solid #CCC; width: 125px; height: 105px; margin: 10px 20px 15px 20px;}
p.index span.more {display:block; padding: 0; margin: 0;}
p.index span.more img { width: 60px; height: 16px;border:none; }


#footer {background:  url(../images/footerbg.jpg) 0 0 no-repeat;}

#footer p {text-align: center; line-height: 20px; border-bottom: 1px solid #aaa; margin: 0 6px 0 0; padding: 4px 0 7px; color: #666;}




ul.leftmenu li {list-style: none; margin: 5px 20px 10px 55px; border-bottom: 1px solid #ddd; padding: 0 0 2px 24px; background: url(../images/arrow+.gif) no-repeat center left;}
ul.leftmenu a {color: #333; font-size: 13px; text-decoration: none; letter-spacing: 4px;}
ul.leftmenu a:hover {color: #C60; font-size: 13px; text-decoration: none; }


p.subtitle {width: 605px; height: 35px; background: url(../images/subtitlebg.jpg) no-repeat ; }

p.subtitle span {color:#600; font-size: 13px;  letter-spacing: 5px; padding: 15px 0 0 30px; line-height: 30px; /*font-weight:*/}


#content2 {width: 845px; background: url(../images/contentbg2.jpg);}
#leftPan2{float: left;width: 325px; position: relative; padding: 0 0 30px 0;}
#rightPan2{float: right;width: 520px; top: 0; left: 0;}
p.subtitle2 {width: 520px; height: 35px;}
ul.leftmenu li.bgnone {list-style: none; margin: 5px 20px 10px 55px; border-bottom: 1px solid #ddd; padding: 0 0 2px 24px; background:none;}
ul.leftmenu li span {padding: 0 10px 0 0; color: #F30;font-size:bold; }
ul.leftmenu li.bgtop {list-style: none; margin: 5px 20px 10px 55px; border-bottom: 1px solid #ddd; padding: 0 0 2px 24px; background: url(../images/arrow+.gif) no-repeat 1px 3px;}
ul.leftmenu li.bgtop a{color: #333; font-size: 11px; text-decoration: none; letter-spacing: 0px;}
ul.leftmenu li.bgtop2 a{color: #333; font-size: 13px; text-decoration: none; letter-spacing: 0px;}



p.newsdate a {text-decoration: none; color: #3366FF;}
p.newsdate {padding: 0 0 0 22px; font-size: 14px; color: #555; margin: 5px 0 0 20px; background: url(../images/arrow+.gif) no-repeat 1px 3px;}
p.newsdate span{ color: #F30; /*font-weight: bold;*/padding: 0 15px 0 0; }
p.news {color: #333; font-size: 12px;  letter-spacing: 0.1em; padding: 12px 22px 3px; line-height: 18px;}
div.page {width: 120px; margin: 0px 0 0 200px; position: absolute; bottom: 0;}
img.link {border: 3px solid #ddd; padding: 1px;}



p.subtitle3 { padding: 0 0 0 22px;font-size: 14px; color: #555; margin: 5px 0 0 20px; background: url(../images/arrow+.gif) no-repeat 1px 10px;}

p.subtitle3 span {color:#600; font-size: 12px;  letter-spacing: 5px;  line-height: 30px; /*font-weight:*/}





#leftPan2 ul.leftmenu li a.mail{font-size: 12px; letter-spacing: 0;}























































input#checknum {width: 80PX;}

.cssform p{
width: 300px;
clear: left;
margin: 0 0 0 35px;
padding: 5px 0 8px 0;
padding-left: 155px; /*width of left column containing the label elements*/
border-top: 1px dashed gray;
height: 1%;
}

.cssform label{
/*font-weight: bold;*/
float: left;
margin-left: -155px; /*width of left column*/
width: 150px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
font-size: 13px;
color: #033;}

.cssform input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/
width: 180px;
height: 12px;
}

.cssform textarea{
width: 250px;
height: 150px;
}

/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/

* html .threepxfix{
margin-left: 3px;
}