@charset "UTF-8";

/*-------------------about-------------------*/
#container .leftContent .aboutTitle{
	width: 590px;
	height: 127px;
	background: url(../images/about/content.png) no-repeat;
}

#container .leftContent .moreService{
	width: 590px;
	height: 67px;
	text-align: center;
}

#container .leftContent .moreService a{
	display: inline-block;
	width: 210px;
	height: 67px;
	background: url(../images/about/content.png) no-repeat -78px -127px;
}

#container .leftContent .moreService a:hover{
	background-position: -308px -127px;
}

#container .leftContent .hr{
	width: 590px;
	height: 1px;
	margin: 6px 0 22px 0;
	background: url(../images/about/content.png) no-repeat 0 -199px;
}

#container .leftContent h1{
	width: 590px;
	height: 15px;
	background: url(../images/about/content.png) no-repeat 0 -223px;
}

#container .leftContent h2{
	width: 590px;
	height: 15px;
	background: url(../images/about/content.png) no-repeat 0 -321px;
}

#container .leftContent h3{
	width: 590px;
	height: 15px;
	margin: 0 0 10px 0;
	background: url(../images/about/content.png) no-repeat 0 -401px;
}

#container .leftContent .h1 , #container .leftContent .h2{
	margin: 5px 0 25px 10px;
	color: #373737;
	font-size: 12px;
	line-height: 20px;
}

#container .leftContent .h1 span, #container .leftContent .h2 span{
	color: #3C146A;
}

#container .leftContent .cis{
	float: left;
	width: 210px;
	height: 205px;
	margin: 0 0 0 10px;
	background: url(../images/about/content.png) no-repeat -10px -425px;
}

#container .leftContent .cisIntro{
	float: right;
	width: 345px;
	height: 205px;
	margin: 0 0 0 25px;
	list-style-image: url(../images/about/item.png);
}

#container .leftContent .cisIntro li{
	margin: 0 0 20px 0;
}

/*-------------------traffic-------------------*/
#container .leftContent .trafficTitle{
	width: 590px;
	height: 40px;
	background: url(../images/traffic/content.png) no-repeat;
}

.map{
	position: relative;
	width: 590px;/*width: 580px;*/
	height: 690px;/*height: 630px;*/
	margin: -15px 0 0 -5px;
	/*padding: 0 0 0 10px;*/
	color: #373737;
	font-size: 12px;
	line-height: 20px;
	background: url(../images/traffic/content.png) no-repeat 0 -40px;
}

.map .info {
	position: absolute;
	width: 582px; height: auto;
	left: 8px; top: 50px;
}

.map p {
	margin: 10px 0;
}

.printBtn {
	display: block; position: absolute;
	width: 93px; height: 43px;
	right: 0; bottom: 20px;
	background: url(../images/traffic/print.png) no-repeat;
	border: none; cursor: pointer;
}

/*-------------------contact-------------------*/
#container .leftContent .contactTitle{
	width: 590px;
	height: 40px;
	background: url(../images/contact/content.png?20221115) no-repeat;
}

#container .leftContent .msg{
	width: 480px;
	height: 60px;
	padding: 30px 0 0 110px;
	color: #FFF;
	font-size: 12px;
	line-height: 20px;
	background: url(../images/contact/content.png?20221115) no-repeat 0 -40px;
}

#container .leftContent .contactForm{
	width: 580px;
	height: 560px;
	padding: 10px 0 0 10px;
	background: url(../images/contact/content.png?20221115) no-repeat 0 -130px;
}

#container .leftContent .contactForm li b{
	color: #828200;
}

#container .leftContent .contactForm li .inputA{
	font-family: "微軟正黑體", Tahoma, Arial, Helvetica, sans-serif !important;
	width: 226px;
	height: 16px;
	padding: 5px;
	margin: 5px 0 5px 0;
	border: none;
	background: url(../images/contact/form.png) no-repeat -10px -160px;
}

#container .leftContent .contactForm li.sex{
	margin: 5px 0 5px 0;
}

#container .leftContent .contactForm li.sex span{
	margin: 0 10px 0 2px;
}

#container .leftContent .contactForm li textarea{
	font-family: "微軟正黑體", Tahoma, Arial, Helvetica, sans-serif !important;
	width: 226px;
	height: 136px;
	padding: 5px;
	margin: 5px 0 5px 0;
	border: none;
	background: url(../images/contact/form.png) no-repeat -10px -411px;
	overflow: hidden;
}

#container .leftContent .contactForm li select{
	font-family: "微軟正黑體", Tahoma, Arial, Helvetica, sans-serif !important;
}

#container .leftContent .contactForm li.sysBtn{
	margin: 5px 0 5px 0;
	padding: 0 0 0 16px;
}

#container .leftContent .contactForm li.sysBtn .resetBtn{
	width: 106px;
	height: 36px;
	border: none;
	background: url(../images/contact/form.png) no-repeat -30px -562px;
}

#container .leftContent .contactForm li.sysBtn .submitBtn{
	width: 106px;
	height: 36px;
	margin: 0 0 0 7px;
	border: none;
	background: url(../images/contact/form.png) no-repeat -141px -562px;
}

#container .leftContent .contactForm li input.pwd, .commonPwd {
	float: left;
	font-family: "微軟正黑體", Tahoma, Arial, Helvetica, sans-serif !important;
	width: 70px; 
	height: 28px;
	line-height: 30px;
    text-indent: 1px;
	border: 0;
	padding: 0 0 0 5px;
	background: transparent url(../images/contact/form_pwd.png) 0 0 no-repeat;
}

#container .leftContent .contactForm li .number, .commonNumber {
	float: left;
	width: 90px;
    height: 30px;
	margin: 0 6px 0 6px;
	overflow: hidden;
}

#container .leftContent .contactForm li input.btn {
	float: left;
	width: 60px; height: 30px;
	font-family: "新細明體";
	background: #d4d0c8;
	border-left: 2px solid #FFF;
	border-top: 2px solid #FFF;
	border-right: 2px solid #404040;
	border-bottom: 2px solid #404040;
}

/*-------------------faq-------------------*/
#container .leftContent .faqTitle{
	width: 590px;
	height: 40px;
	background: url(../images/faq/content.png) no-repeat;
}

#container .leftContent .faqList{
	width: 535px;
	height: auto;
	margin: 20px 45px 0 10px;
}

#container .leftContent .faqList li.qq{
	width: 490px;
	height: 40px;
	padding: 0 0 0 45px;
	font-size: 12px;
	line-height: 39px;
	background: url(../images/faq/content.png) no-repeat -10px -53px;
	overflow: hidden;
}

#container .leftContent .faqList li.aa{
	width: 490px;
	height: auto;
	padding: 8px 0 10px 45px;
	font-size: 12px;
	line-height: 19px;
	background: url(../images/faq/content.png) no-repeat -10px -95px;
	overflow: hidden;
}

#container .leftContent .faqList li.aa ul{ list-style-type: disc; margin: 0 0 0 20px; }
#container .leftContent .faqList li.aa ol{ list-style-type: decimal; margin: 0 0 0 20px; }
#container .leftContent .faqList li.aa strong{ font-weight:bold; }

#container .leftContent .faqList li.aa a , #container .leftContent .faqList li.qq a{
	color: #868100;
	text-decoration: underline;
}

#container .leftContent .faqList li.aa a:hover , #container .leftContent .faqList li.qq a:hover{
	text-decoration: none;
}

/*-------------------news-------------------*/
#container .leftContent .newsTitle{
	width: 590px;
	height: 40px;
	background: url(../images/news/content.png) no-repeat;
}

#container .leftContent .topNews{
	width: 570px;
	height: 110px;
	margin: 10px 0 10px 0;
	padding: 10px;
	border-bottom: 1px dashed #FFF;
	overflow: hidden;
	cursor: pointer;
}

#container .leftContent .topNews .txt ul{ list-style-type: disc; margin: 0 0 0 20px; }
#container .leftContent .topNews .txt ol{ list-style-type: decimal; margin: 0 0 0 20px; }
#container .leftContent .topNews .txt strong{ font-weight:bold; }

#container .leftContent .topNews .pic{
	float: left;
	width: 200px;
	height: 100px;
	margin: 0 20px 0 0;
	border: 5px solid #FFF;
	overflow: hidden;
}

#container .leftContent .topNews .pic img{
	width: 200px;
	height: 100px;
}

#container .leftContent .topNews .mask{
	position: absolute;
	width: 53px;
	height: 53px;
	margin: 63px 0 0 138px;
	*margin: 33px 0 0 -91px;
	background: url(../images/news/new.png) no-repeat;
}

#container .leftContent .topNews .date{
	float: right;
	width: 340px;
	height: 15px;
	font-size: 10px;
	color: #3A1467;
	overflow: hidden;
}

#container .leftContent .topNews .title{
	float: right;
	width: 340px;
	height: 17px;
	font-size: 12px;
	line-height: 17px;
	color: #000;
	text-decoration: underline;
	overflow: hidden;
}

#container .leftContent .topNews .txt{
	float: right;
	width: 340px;
	height: 65px;
	margin: 8px 0 0 0;
	font-size: 12px;
	overflow: hidden;
}

#container .leftContent .newsList{
	width: 490px;
	height: 15px;
	margin: 15px 0 0 0;
	padding: 5px;
	border-bottom: 1px dotted #868686;
	overflow: hidden;
	cursor: pointer;
}

#container .leftContent .newsList .date{
	float: left;
	width: 80px;
	height: 15px;
	margin: 0 20px 0 0;
	font-size: 10px;
	line-height: 16px;
	color: #3A1467;
	text-align: center;
	overflow: hidden;
}

#container .leftContent .newsList .title{
	float: right;
	width: 390px;
	height: 15px;
	font-size: 12px;
	overflow: hidden;
}

#container .leftContent .newsList .title:hover{
	color: #000;
	text-decoration: underline;
}

/*-------------------news detial-------------------*/
#container .leftContent .newsDetail{
	width: 570px;
	height: 495px;
	margin: 10px 0 10px 0;
	padding: 10px;
	border-bottom: 1px dashed #888;
	overflow: hidden;
}

#container .leftContent .newsDetail .pic{
	float: left;
	width: 200px;
	height: 240px;
	margin: 0 20px 0 0;
	border: 5px solid #FFF;
	overflow: hidden;
}

#container .leftContent .newsDetail .pic img{
	width: 200px;
	height: 240px;
}

#container .leftContent .newsDetail .zoomIn a{
	display: block;
	position: absolute;
	width: 50px;
	height: 16px;
	margin: 255px 0 0 0;
	*margin: 255px 0 0 -230px;
	cursor: pointer;
	background: url(../images/news/detail.png) no-repeat -10px -297px;
}

#container .leftContent .newsDetail .date{
	float: right;
	width: 340px;
	height: 15px;
	*margin: -18px 0 0 0;
	font-size: 10px;
	color: #3A1467;
	overflow: hidden;
}

#container .leftContent .newsDetail .title{
	float: right;
	width: 340px;
	height: 17px;
	margin: 0 0 10px 0;
	font-size: 12px;
	line-height: 17px;
	color: #000;
	overflow: hidden;
}

#container .leftContent .newsDetail .newsDetailPanel{
	float: right;
	width: 340px;
	height: 380px;
	font-size: 12px;
	line-height: 20px;
	overflow: hidden;
}

#container .leftContent .newsDetail .newsDetailPanel ul{ list-style-type: disc; margin: 0 0 0 20px; }
#container .leftContent .newsDetail .newsDetailPanel ol{ list-style-type: decimal; margin: 0 0 0 20px; }
#container .leftContent .newsDetail .newsDetailPanel strong{ font-weight:bold; }

#container .leftContent .newsDetailList{
	float: left;
	width: 425px;
	height: 15px;
	margin: 0 0 5px 0;
	overflow: hidden;
	cursor: pointer;
}

#container .leftContent .newsDetailList .sub{
	float: left;
	width: 50px;
	height: 15px;
	font-size: 12px;
	color: #AAA;
	text-align: center;
	overflow: hidden;
}

#container .leftContent .newsDetailList .date{
	float: left;
	width: 70px;
	height: 15px;
	font-size: 10px;
	line-height: 16px;
	color: #3A1467;
	text-align: center;
	overflow: hidden;
}

#container .leftContent .newsDetailList .title{
	float: right;
	width: 305px;
	height: 15px;
	font-size: 12px;
	overflow: hidden;
}

#container .leftContent .newsDetailList .title:hover{
	color: #000;
	text-decoration: underline;
}

#container .leftContent .newsBackList{
	display: block;
	float: right;
	width: 142px;
	height: 32px;
	background: url(../images/news/detail.png) no-repeat -445px -575px;
}

/*-------------------service-------------------*/
#container .leftContent .serviceTitle{
	width: 590px;
	height: 40px;
	background: url(../images/service/content.png) no-repeat;
}

#container .leftContent .iMenu{
	width: 564px;
	height: 62px;
	margin: 20px 13px 0 13px;
}

#container .leftContent .iMenu li { 
	float:left; 
}

#container .leftContent .iMenu .s1{
	float: left;
	display: block;
	width: 188px;
	height: 62px;
	background: url(../images/service/menu.png) no-repeat -13px -11px;
}

#container .leftContent .iMenu .s1:hover , #container .leftContent .iMenu .s1.current{
	background-position: -13px -80px;
}

#container .leftContent .iMenu .s2{
	float: left;
	display: block;
	width: 188px;
	height: 62px;
	background: url(../images/service/menu.png) no-repeat -201px -11px;
}

#container .leftContent .iMenu .s2:hover , #container .leftContent .iMenu .s2.current{
	background-position: -201px -80px;
}

#container .leftContent .iMenu .s3{
	float: left;
	display: block;
	width: 188px;
	height: 62px;
	background: url(../images/service/menu.png) no-repeat -389px -11px;
}

#container .leftContent .iMenu .s3:hover , #container .leftContent .iMenu .s3.current{
	background-position: -389px -80px;
}

#container .leftContent .iMsg{
	width: 510px;
	height: 70px;
	padding: 10px 0 0 80px;
	color: #FFF;
	font-size: 12px;
	line-height: 21px;
	background: url(../images/service/service.png) no-repeat 0 -115px;
}

#container .leftContent .iMsg a{
	color: #383838;
	text-decoration: underline;
}

#container .leftContent .iMsg a:hover{
	text-decoration: none;
}

#container .leftContent .iMsg span{
	color: #3B1568;
}

#container .leftContent .content{
	width: 570px;
	height: 470px;
	padding: 10px 0 0 20px;
	background: url(../images/service/service.png) no-repeat 0 -194px;
	overflow: hidden;
}

#container .leftContent .content .iList{
	float: left;
	width: 245px;
	height: 470px;
	margin: 0 0 20px 0;
	overflow: hidden;
}

#container .leftContent .content .iList ul{
	float: left;
	width: 220px;
	height: auto;
	padding: 0 0 0 20px;
	margin: 0 0 10px 0;
	overflow: hidden;
}

#container .leftContent .content .iList ul b{
	display: block;
	margin: 0 0 6px 0;
	color: #3B1568;
	font-weight: normal;
	text-transform: uppercase;
	text-decoration: underline;
}

#container .leftContent .content .iList ul div{
	display: block;
	margin: 1px 0 1px 0;
	color: #838300;
	font-size: 12px;
	text-decoration: underline;
}

#container .leftContent .content .iList ul li{
	padding: 0 0 0 10px;
	margin: 1px 0 1px 0;
	color: #474747;
	font-weight: normal;
	font-size: 12px;
	background: url(../images/seviceItem.png) no-repeat top left;
}

#container .leftContent .pdfDownload{
	display: block;
	position: absolute;
	width: 83px;
	height: 17px;
	margin: -50px 0 0 420px;
	background: url(../images/service/download.png) no-repeat;
}

#container .leftContent .serviceTB{
	width: 530px;
	margin: 10px 0 0 15px;
	border: 1px solid #6D6D6D;
}

#container .leftContent .serviceTB thead th{
	padding: 10px;
	text-align: center;
	color: #FFF;
	background: #300F56;
	border: 3px solid #3C3C3C;
}

#container .leftContent .serviceTB tbody th{
	padding: 10px 10px 10px 15px;
	background: #EAEAEA;
	border-left: 1px solid #6D6D6D;
}

#container .leftContent .serviceTB tbody th ol{
	list-style-type: decimal;
	margin: 0 0 0 20px;
}

#container .leftContent .serviceTB tbody th a{
	color: #838300;
}

#container .leftContent .serviceTB tbody th a:hover{
	text-decoration: none;
}

#container .leftContent .serviceTB tbody td{
	height: 50px;
	padding: 10px;
	text-align: center;
	vertical-align: middle;
	border-top: 1px dotted #6D6D6D;
	border-left: 1px dotted #6D6D6D;
}

#container .leftContent .ps{
	width: 560px;
	height: 20px;
	margin: 20px 0 0 30px;
	font-size: 12px;
}

#container .leftContent .ps .hr{
	width: 400px;
	height: 0;
	border-top: 1px dotted #FFF;
	border-bottom: 1px dotted #767676;
}

#container .leftContent .ps ol{
	list-style-type: decimal;
	margin: 15px 0 0 35px;
}

#container .leftContent .ps b{
	color: #838300;
	font-weight: normal;
}

#container .leftContent .panes{
	width: 590px;
	height: auto;
}

#container .leftContent .panes h4 {
	display: none;
}

/*-------------------空間導覽-------------------*/
#container .leftContent .spatialTitle{
	width: 590px;
	height: 40px;
	background: url(../images/spatial/content.png) no-repeat;
}

#container .leftContent .flowtabs {
	width: 580px;
	height: 25px;
	padding: 0 5px 0 5px;
	margin: 15px 0 15px 0;
	border-bottom: 1px solid #373737;
}

#container .leftContent .flowtabs li { 
	float: left;
}

#container .leftContent .flowtabs li a {
	display: block;
	width: auto;
	height: 20px;
	margin: 0 1px 0 0;
	padding: 2px 5px 2px 5px;
	color: #373737;
	font-size: 12px;
	line-height: 24px;
	text-align: center;
	text-decoration: none;
	border: 1px solid #373737;
}
 
#container .leftContent .flowtabs li a:hover {
	color: #39166A;
}

#container .leftContent .flowtabs a.current {
	color: #39166A;
	border-bottom: 1px solid #D6D6D6;
}

#container .leftContent .flowpanes {	
	width: 590px;
	height: auto;	
}

#container .leftContent .flowpanes h4 {
	display: none;
}

#container .leftContent .flowpanes h4 .titleP{
	width: 572px;
	padding: 0 0 0 18px;
	color: #39166A;
	font-size: 16px;
	font-weight: bold;
	background: url(../images/spatial/content.png) no-repeat -10px -98px;
}

#container .leftContent .flowpanes h4 .introP{
	width: 590px;
	height: 140px;
	margin: 5px 0 20px 0;
	font-size: 12px;
	line-height: 20px;
	overflow: hidden;
}

#container .leftContent .flowpanes h4 .spacegallery {
	width: 470px;
	height: 340px;
	margin: 0 60px 0 60px;
	background: url(../images/spatial/bar.png) #000 repeat-x bottom;
}

#container .leftContent .flowpanes h4 .spacegallery .images {
	position: relative;	
	width: 470px;
	height: 340px;
	overflow: hidden;
}

#container .leftContent .flowpanes h4 .spacegallery .images div {
	display:none;
	position:absolute;
	top:0;
	left:0;		
	width: 470px;
	height: 340px;
	overflow: hidden;
}

#container .leftContent .flowpanes h4 .spacegallery .images div img{	
	width: 470px;
	height: 310px;
}

#container .leftContent .flowpanes h4 .spacegallery .images div p.spec{
	width: 470px;
	height: 30px;
	margin: 0;
	*margin: -4px 0 0 0;
	padding: 0;
	background: url(../images/spatial/bar.png) repeat-x;
	overflow: hidden;
}

#container .leftContent .flowpanes h4 .spacegallery .images div p.spec .order{
	display: block;
	float: left;
	width: 95px;
	height: 30px;
	padding: 0 5px 0 0;
	color: #999;
	text-align: right;
	font-size: 12px;
	letter-spacing: 2px;
	line-height: 29px;
	background: url(../images/spatial/barer.png) no-repeat right;
}

#container .leftContent .flowpanes h4 .spacegallery .images div p.spec .title{
	display: block;
	float: left;
	width: 335px;
	height: 30px;
	padding: 0 0 0 5px;
	color: #FFF;
	text-align: left;
	font-size: 12px;
	line-height: 30px;
	overflow: hidden;
}

#container .leftContent .flowpanes h4 .spacegallery .images div p.spec .sreen{
	float: right;
	display: block;
	width:30px;
	height:30px;
	background: url(../images/spatial/playBtn.png) no-repeat 0 -60px;
	cursor:pointer;
}

#container .leftContent .flowpanes h4 .spacegallery .images div p.spec .sreen:hover{
	background-position: -30px -60px;
}

#container .leftContent .flowpanes h4 .spacegallery .slidetabs {
	clear:both;
	display: none;
}

#container .leftContent .flowpanes h4 .spacegallery .slidetabs a{
}

#container .leftContent .flowpanes h4 .spacegallery .slidetabs a:hover , #container .leftContent .flowpanes h4 .spacegallery .slidetabs a.current {
}

#container .leftContent .flowpanes h4 .spacegallery .forward{
	display: block;
	position: absolute;
	width:235px;
	height:310px;
	margin: -340px 0 0 235px;
	background: url(../images/spatial/btn.png) no-repeat -235px 0;
	cursor:pointer;	
}

#container .leftContent .flowpanes h4 .spacegallery .forward:hover{
	background-position: -235px -310px;
}

#container .leftContent .flowpanes h4 .spacegallery .backward{
	display: block;
	position: absolute;
	width:235px;
	height:310px;
	margin: -340px 0 0 0;
	background: url(../images/spatial/btn.png) no-repeat;
	cursor:pointer;	
}

#container .leftContent .flowpanes h4 .spacegallery .backward:hover{
	background-position: 0 -310px;
}

#container .leftContent .flowpanes h4 .spacegallery .disabled {
	visibility:hidden !important;		
}

#container .leftContent .flowpanes h4 .spacegallery .playBtn{
	display: block;
	position: absolute;
	width:30px;
	height:30px;
	margin: -30px 0 0 0;
	background: url(../images/spatial/playBtn.png) no-repeat 0 -30px;
	border: none;
	cursor:pointer;	
}

#container .leftContent .flowpanes h4 .spacegallery .playBtn:hover{
	background-position: -30px -30px;
}

#container .leftContent .flowpanes h4 .spacegallery .stopBtn{
	display: none;
	position: absolute;
	width:30px;
	height:30px;
	margin: -30px 0 0 0;
	background: url(../images/spatial/playBtn.png) no-repeat;
	border: none;
	cursor:pointer;		
}

#container .leftContent .flowpanes h4 .spacegallery .stopBtn:hover{
	background-position: -30px 0;
}