@charset "utf-8";
/* CSS Document */
/*@font-face
{
font-family: myFirstFont;
src:url(font/msjh.ttf),
	url(font/msjhbd.ttf) / * IE9+ * /
	 }

div	{font-family:myFirstFont;}*/
html{	width:100%; height:100%; margin:0px; padding:0px; text-align:center }
body{	/* *position:relative; */
		/* _position:static; */
		/* font-family:myFirstFont,"微軟正黑體", "Microsoft JhengHei", 'MingLiu', 'Heiti TC', "黑體-繁","Heiti TC", "儷黑 Pro", "LiHei Pro", "新細明體", "PMingLiU", sans-serif;*/
		text-align:center;
		text-shadow:none;
		text-shadow:none !important;
		text-decoration:none;
		word-wrap:break-word;
		margin:0;
		padding:0;
		width:100%;
		max-width:960px;
		height:100%;
		height:100% !important;	
		min-height:100%; /* real browsers */	
		margin:0px;
		padding:0px;
		background:#f0f0f0;	
		}

.ui-page { background:#FFF;}
.ui-body-c, .ui-overlay-c { background:#FFF; }
.ui-body-c, .ui-overlay-c { text-shadow:none; }
		
a	{	font-size:1em;}
a:link {font-weight:normal;text-decoration: none}
a:visited {font-weight:normal;text-decoration: none}
a:active {font-weight:normal;text-decoration: none}
a:hover {font-weight:normal;text-decoration:none; color: red;}

h1	{	font-size:3.75em; font-weight:bold; line-height:150%; margin:0;}
h2	{	font-size:2.5em; font-weight:bold; line-height:150%; margin:0;}
h3	{	font-size:2em; font-weight:bold; line-height:150%; margin:0;}
h4	{	font-size:1.5em; font-weight:bold; line-height:150%; margin:0;}
h5	{	font-size:1.3em; font-weight:bold; line-height:150%; margin:0;}
h6	{	font-size:1.1em; font-weight:bold; line-height:150%; margin:0;}
p	{   font-size:1em;line-height:150%; text-indent:2.2em; letter-spacing:0.1em;}
p.nh	{  text-indent:0; }
.divp	{ text-align:justify; text-justify:distribute;}
.darkred {color:#990000}
.white	{ color:#FFFFFF; }
.grayblue	{ color:#336699}
.up1	{ margin-top:-1px;}

.space1	{ letter-spacing:1px;}
.space2	{ letter-spacing:2px;}
.space3	{ letter-spacing:3px;}

#topblack	{width:100%; height:20px; background-color:#000; display:inherit; padding:10px; font-size:0.7em}
#topblack2	{width:100%; height:20px; background-color:#000; display:none}
#top_menu a { color:#FFFFFF; font-weight:normal; text-decoration:none}
#top_menu a:hover { color:#FF0000; font-weight:normal; text-decoration:none}

#nav		{ float:right; padding:0px; margin:0px; width:auto; display:block}
.nav_div	{ float:left;margin-left:7px;background:url(images/tab/top_tabs.png) no-repeat; margin-top:10px}

div#container {
	/*position:relative; */ /* needed for footer positioning*/
	margin:0 auto; /* center, not in IE5 */
	width:100%;

	height:auto !important; /* real browsers */
	height:100%; /* IE6: treaded as min-height*/
	min-height:100%; /* real browsers */
	}

#header		{ width:100%; text-align:left; }
#content	{ 
    width:100%;
	max-width:960px;
	margin:0px auto 30px auto;
    padding:1em 2em;
	text-align:left;
	clear:both;
	display:block;
	height:auto !important; /* real browsers */
	height:100%; /* IE6: treaded as min-height*/
	min-height:100%; /* real browsers */
	padding:5em 1em 5em; /* bottom padding for footer */}
	
#content p	{ font-size:1em; text-align:justify; display:inline-block;}	

.content3 {
	background-color: #eee;
	display: block;
	float: left;
	padding: 10px;
	width: 150px;	
	}
.newspaper{
	margin: 50px auto 20px 0;
	font-size:1em; 
	font-family:Verdana; 
	line-height:2em;
    -webkit-column-gap: 40px; /* Chrome, Safari, Opera */
    -moz-column-gap: 40px; /* Firefox */
    column-gap: 40px;
    -webkit-column-rule: 2px outset #eee; /* Chrome, Safari, Opera */
    -moz-column-rule: 2px outset #eee; /* Firefox */
    column-rule: 2px outset #eee;
	}

.area1{	
	-webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
}
.area2{	
	-webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
}
.area3{	
	-webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
}


#footer 	{ 
position:absolute; 
bottom:0; /* stick to bottom */
clear:both; 
width:100%; 
margin:0 auto;
font-size:0.8em; 
padding:5px; 
color:#eee; 
font-family:"Times New Roman", Times, serif; 
background-color:#000; 
text-shadow:none; 
}
.footer_a	{ color:#FFFFFF; font-size:inherit; font-weight:normal; text-decoration:none;}

.clear	{ clear:both}

.slides_images	{ width:100%; height:auto; background-position:center top; background-repeat:no-repeat; background-size:100%; }
#menu_box	{ clear:both; width:100%; height:auto; padding:10px 0px;}
.menu_one	{ height:auto; text-align:left; line-height:150%; float:left; margin-right:5px}
.menu_one .list_title	{ clear:both; font-size:1.3em; color:#C00; margin:0px auto 0px 0px;}
.menu_one ul	{ float:left; width:100%; list-style:none; margin-left: 0; padding-left: 0; margin-top:5px; padding-top:0px; border:none; }
.menu_one ul li { font-size:1em; font-weight:normal; line-height:150%; font-family:"Times New Roman", Times, serif}
.menu_one ul li a { font-weight:normal; color:#000; font-size:1em; text-decoration:none;}
.menu_one ul li a:link { font-weight:normal; color:#000; font-size:1em; text-decoration:none;}
.menu_one ul li a:visited { color:#000;}
.menu_one ul li a:hover { color:#900; text-decoration:underline; font-weight:900}

.left_list_tr  td  a:link { color:#333333; text-decoration:none; font-weight:normal}
.left_list_tr  td  a:hover { color:#333333; text-decoration:none; font-weight:normal}
.left_list_tr  td  a:visited { color:#333333; text-decoration:none; font-weight:normal}

#onedata_list	{ width:100%; list-style:none; margin-left: 0; padding-left: 0; padding-top:0px; border:none; padding-left:10px;}
#onedata_list li { font-size:1em; font-weight:normal; line-height:200%; letter-spacing:2px; font-family:"Times New Roman", Times, serif; }
#onedata_list li a { font-weight:normal; color:#000; font-size:1em; text-decoration:none;}
#onedata_list li a:link { font-weight:normal; color:#000; font-size:1em; text-decoration:none;}
#onedata_list li a:visited { color:#000;}
#onedata_list li a:hover { color:#900; text-decoration:underline; font-weight:900}

.data_title_div	{ min-width:70px; height:auto; text-align:left; padding:0px 5px; display:inline-block}
.data_cont_div	{ width:auto; height:auto; text-align:left; padding:0px 5px; display:inline-block}
hr.spacehr	{ border-top:1px solid #666666; margin:10px 0; clear:both;}

#logo
{   float:left;
	border:none;
	display:block;
	background-repeat:no-repeat;
	background-position:left top;
	-moz-background-size:320px;
	-webkit-background-size:320px;
	-o-background-size:320px;
	background-size:320px;
}
	
.cont	{ padding-bottom:20px; }
#normal_content	{ text-align:left}
#pro_img_box { float:left; width:40%; height:auto ;  text-align:left; height:auto;*}
#pro_img_box .pro_img	{ margin:10px auto; width:100%}
#pro_img_box h5	{ line-height:200%;}
#pro_cont_box { float:right; width:56%; height:auto ; padding-top:20px;  text-align:left; height:auto;*}

/*灰線表格*/
.table_List {
    border: 1px solid #b4b4b4;
    padding: 0;}     
.table_List tr th { text-align:center; font-size:0.8em; font-weight:normal}
.table_List tr td {
    border-bottom: 1px solid #b4b4b4;
    border-right: 1px solid #b4b4b4;
    background-image: -webkit-linear-gradient(top, #fdfdfd, #eee);
}
.table_List tr td:last-child {border-right:none;}
.table_List tr:last-child td {border-bottom:none;}

/*入口意象*/
.flexslider		{  clear:both;margin:0 auto 40px auto; 
display: block;
position: relative; //fixed or absolute may be needed
height: 100%!important;
overflow:visible !important;
width: 100%!important;
}




/*檢查用*/
.border1	{ border:1px solid #F00}
.border2	{ border:1px solid #0000FF}
.border3	{ border:1px solid #006633}
.border4	{ border:1px solid #FF6600}


/*google map*/
#map_canvas {	width:100%; 
				height:100%;
				max-width:100% !important;
				padding:0px !important;
				margin:0px !important;
				text-align: center;
				vertical-align: middle; }
.rounded-corners10 { /*圓角矩形 按鈕*/
				-moz-border-radius: 10px; /* Firefox */
				-webkit-border-radius: 10px; /* Safari, Chrome */
				-khtml-border-radius: 10px; /* Konqueror */
				border-radius: 10px; /* Opera 10.50 and later (CSS3 standard) */
				behavior: url(system/border-radius.htc); /* IE6, IE7, IE8 */
}
.rounded-corners20 { /*圓角矩形 按鈕*/
				-moz-border-radius: 20px; /* Firefox */
				-webkit-border-radius: 20px; /* Safari, Chrome */
				-khtml-border-radius: 20px; /* Konqueror */
				border-radius: 20px; /* Opera 10.50 and later (CSS3 standard) */
				behavior: url(system/border-radius.htc); /* IE6, IE7, IE8 */

}
.rounded-corners30 { /*圓角矩形 按鈕*/
				-moz-border-radius: 30px; /* Firefox */
				-webkit-border-radius: 30px; /* Safari, Chrome */
				-khtml-border-radius: 30px; /* Konqueror */
				border-radius: 30px; /* Opera 10.50 and later (CSS3 standard) */
				behavior: url(system/border-radius.htc); /* IE6, IE7, IE8 */
}

/*漸層背景套件　　slight gradient */
.slight {
background: rgb(226,226,226); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2UyZTJlMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2RiZGJkYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2QxZDFkMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZWZlZmUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(226,226,226,1)), color-stop(50%,rgba(219,219,219,1)), color-stop(51%,rgba(209,209,209,1)), color-stop(100%,rgba(254,254,254,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(219,219,219,1) 50%,rgba(209,209,209,1) 51%,rgba(254,254,254,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(219,219,219,1) 50%,rgba(209,209,209,1) 51%,rgba(254,254,254,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(219,219,219,1) 50%,rgba(209,209,209,1) 51%,rgba(254,254,254,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(226,226,226,1) 0%,rgba(219,219,219,1) 50%,rgba(209,209,209,1) 51%,rgba(254,254,254,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0 ); /* IE6-8 */
}
.gradient { filter: none;}
/*漸層背景套件　　slight gradient */

/*p, div*/
.left	{ text-align:left}
.center	{ text-align:center}
.right	{text-align:right}
.justify	{ text-align:justify}
.red	{ color:#FF0000}
.075em	{ font-size:0.75em}
.mt20	{ margin-top:20px}

/*span*/
.spanT	{ display:block; background-color:#CCCCCC; font-weight:bold; padding:3px; text-align:center;}
.bold	{ font-weight:bold;}

/*ui*/
.ui-dialog .ui-header, .ui-dialog .ui-content, .ui-dialog .ui-footer { max-width: 100%; }

/*header的標題如果太多字，會被省略掉，加上以下css，則可以解決此問題*/
.ui-header .ui-title, .ui-footer .ui-title {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/*jQuery Mobile*/
	/*Content*/
	@media screen and (orientation: landscape) {
	html, body {
	  width: 100%;
	}
	
	.content h1.landscape { display: block }
	.content h1.portrait { display: none }
	}
	@media screen and (orientation: portrait) {
	html, body {
	  width: 100%;
	}
	
	.content .landscape { display: none }
	.content .portrait { display: block }
	}