html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
}
body { 
	color: #555; 
	font: normal 1em/1.5em 微軟正黑體, Arial;
}
li { margin-left: 25px; padding-left: 5px; }
a { text-decoration: none; color: blue; }
a:link, a:visited, a:active { color: blue; }
a:hover {  text-decoration: underline; color: green; }
h1 {
	font-size: 1.5em;
	line-height: 140%;
	margin-bottom: 20px;
}
h2 {
	font-size: 1.3em;
	line-height: 130%;
	margin-bottom: 20px;
}
h3 {
	font-size: 1.25em;
	line-height: 130%;
	margin-bottom: 20px;
}
h4 {
	font-size: 1.2em;
	line-height: 125%;
	margin-bottom: 20px;
}
h5, .newstitle {
	font-size: 1.15em;
	line-height: 120%;
	margin-bottom: 20px;
}
h6 {
	font-size: 1.1em;
	line-height: 120%;
	margin-bottom: 20px;
}
.hide {
	left: -800px; top: -9999px; position: absolute;
}
.nodisplay {
	display: none;
}
.tablewidth {
	width: 100%; overflow-x:auto;
}
.flex-direction-nav a {
	line-height: 42px;
}
#wrapper {
	height: auto;
	min-height: 100%;

	padding:0;
	margin:0 auto;
	position:relative;
	-webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.6);
	-moz-box-shadow: 0 0 25px rgba(0, 0, 0, 0.6);
	-ms-box-shadow: 0 0 25px rgba(0, 0, 0, 0.6);
	-o-box-shadow: 0 0 25px rgba(0, 0, 0, 0.6);
	box-shadow: 0 0 25px rgba(0, 0, 0, 0.6);
	width:990px;
	border-top: 0 !important;
}
#header {
	
}

.func { height: 30px;  }
.func table { margin-top: 3px; float: right; }
.func td { padding: 0 4px; color: black; font: normal 16px/25px Tahoma, 微軟正黑體; }
.func td a, .func td a:link, .func td a:visited, .func td a:active { color: black; }
.toplink { float: left; }
.toplink a {
	font: normal 14px Tahoma, 微軟正黑體; color: black; margin-left: 8px;
}
.logo { /* background-color: #68B455; */ }
.logo a, .logo a:link, .logo a:visited, .logo a:active { color: black; }
.logo img { margin: 10px 0 0 20px; }

.mycolor_bg {
	 display: none;
	 width: 194px;
	 height: 36px;
	 position: absolute;
	 top:21px;
	 right:-42px;
	 z-index:501;
	 margin-left:40px;
}

.colorItem {
	position: left;
	float: left;
	display:inline;
	padding:25px 3px 0;
}

a.colorItem {
	margin:1px;
	text-decoration: none;
}
a.colorItem  img {
	width:35px;
	height:35px;
}
.mycolor_content{
	display: none;
	width: 194px;
	height: 36px;
	position: absolute;
	top:17px;
	right:-20px;
	z-index:502;
	margin-left:40px;
}

.colorpos {
	position: relative;
	z-index: 500;
}
#mycolour {
	vertical-align: top; width: 21px; height: 21px; margin: 2px 3px 0 3px;
}
.lang {
	line-height:0px; min-width: 40px; text-align: center;
}
.lang a {
	font-weight: bold;
}

#content {
	position: relative;
	margin: 20px;
	padding-left: 260px;
	font: normal 1em/1.5em 微軟正黑體, Arial;
}
#content li {
	margin-left: 30px;
}
table.std {
	border: 0; border-collapse: collapse; border-spacing: 0;
}
table.std  td, table.std  th {
	padding: 2px 5px;
}
table.std  th {
	border: 1px solid #888; background-color: #333; color: #fff;
}
table.std  td {
	border: 1px solid #333; font-size: .9em;
}

table.noborder {
	border: 0; border-collapse: collapse; border-spacing: 0;
}
table.noborder  td, table.noborder  th {
	padding: 2px 5px;
}
table.noborder  th {
	background-color: #333; color: #fff;
}
table.noborder  td {
	font-size: .9em;
}
table.higher  td {
	padding: 5px;
}

.newsdate {
	font-size: .85em;
	font-weight: bold;
}

#main-menu { margin-right: 20px; }

.latest-news { list-style: none; }
.latest-news-li { margin-top: 15px; }

.first {
	position: absolute;
	left: 0;
	margin-top: -1em;
}


/*
.app {
	border-radius: 15px;
	background: #73AD21;
	padding: 30px 20px;
	width: 30%;
	text-align: center;
	font: bold 20px Arial;
}
@media all and (max-width:850px){
	.app {
	    padding: 20px 17px;
		width: 28%;
		font: bold 16px Arial;
	}
}
.onlineReg {
	float: left;
}
.cpd {
	float: right;
}
*/

.footer {
	position:relative;
	z-index:100;
	padding:20px;
	background:#333;
	color: #eee;
	font: normal 12px Arial;
}
.footer a, .footer a:link, .footer a:visited, .footer a:active  { color: #eee; }
.footer a:hover {  text-decoration: underline; color: #bbb; }
.copyright { padding:10px 0; }
.footer-text { float:left; }
.w3c { 	float: right; }


#content ol.itemdot li {
  margin-left: 0;
}

ol.itemdot {
  list-style-type: none;
  counter-reset: item;
  margin: 0;
  padding: 0;
}

ol.itemdot > li {
  display: table;
  counter-increment: item;
  margin-bottom: 0.6em;
}

ol.itemdot > li:before {
  content: counters(item, ".") ". ";
  display: table-cell;
  padding-right: 0.6em;    
}

li ol.itemdot > li:before {
  content: counters(item, ".") " ";
}


ol.roman {
    counter-reset: roman;
}
ol.alpha {
    counter-reset: alpha;
}
ol.decimal {
    counter-reset: decimal;
}
ol.normal {
    counter-reset: normal;
}
ol.roman li, ol.alpha li, ol.decimal li, ol.normal li {
    list-style: none;
    position: relative;
}
ol.roman > li:before {
    counter-increment: roman;
    margin: 7px;
    padding: 0px;
    text-indent: 0em;
    margin-left: -2em;
    content:"(" counter(roman, lower-roman)") ";
}
ol.alpha > li:before {
    counter-increment: alpha;
    margin: 7px;
    padding: 0px;
    text-indent: 0em;
    margin-left: -2em;
    content:"(" counter(alpha, lower-alpha)") ";
}
ol.decimal > li:before {
    counter-increment: decimal;
    margin: 7px;
    padding: 0px;
    text-indent: 0em;
    margin-left: -2em;
    content:"(" counter(decimal, decimal)") ";
}
ol.normal > li:before {
    counter-increment: normal;
    content:counter(normal, decimal) ".  ";
}
li.cn-one, li.cn-two {
    list-style: none;
    position: relative;
}
li.cn-one:before, li.cn-two:before {
    margin: 7px;
    padding: 0px;
    text-indent: 0em;
    margin-left: -2em;
}
li.cn-one:before {
    content:"(一)";
}
li.cn-two:before {
    content:"(二)";
}


/* Responsive
---------------*/

@media all and (max-width:989px){
	#wrapper {
		max-width: 100%;
		height: auto;
	}
	.logo img { max-width: 100%; height: auto; }
}

@media all and (max-width:767px){
	#wrapper {
		max-width: 100%;
		height: auto;
	}
	.logo img { max-width: 100%; height: auto; }
	.pconly { display: none; }
	#main-menu { margin-right: 0; }


	.flipit {
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-orient: vertical;
		-moz-box-orient: vertical;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
	}

	.flipit #banner {
		-webkit-box-ordinal-group: 2;
		-moz-box-ordinal-group: 2;
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2;
		max-width: 100%;
		height: 50%;
	}

	.flipit #menu {
		-webkit-box-ordinal-group: 1;
		-moz-box-ordinal-group: 1;
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;
		width: 100%;
	}
	#content { padding-left: 0; }
}

@media all and (max-width:479px){
	.logo { width: 100%; min-width: 300px; text-align: center; }
	.logo img { margin: 5px; width: 300px; max-width: 300px; }
	.func { position: absolute; top: 70px; right: 10px; }
	.toplink { position: absolute; width: 80px; top: 5px; right: 170px; float: none; }
	.cd-top {
		height: 50px;
		width: 50px;
		right: 50px;
		bottom: 50px;
	}
	#content { padding-left: 0; }
}

/* Mobile first layout SmartMenus Core CSS (it's not recommended editing these rules)
   You need this once per page no matter how many menu trees or different themes you use.
-------------------------------------------------------------------------------------------*/

.sm{position:relative;z-index:799;}
.sm,.sm ul,.sm li{display:block;list-style:none;margin:0;padding:0;line-height:normal;direction:ltr;text-align:left;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.sm-rtl,.sm-rtl ul,.sm-rtl li{direction:rtl;text-align:right;}
.sm>li>h1,.sm>li>h2,.sm>li>h3,.sm>li>h4,.sm>li>h5,.sm>li>h6{margin:0;padding:0;}
.sm ul{display:none;}
.sm li,.sm a{position:relative;}
.sm a{display:block;}
.sm a.disabled{cursor:not-allowed;}
.sm:after{content:"\00a0";display:block;height:0;font:0px/0 serif;clear:both;visibility:hidden;overflow:hidden;}
.sm,.sm *,.sm *:before,.sm *:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}

.main-menu-btn {
  position: relative;
  display: inline-block;
  width: 28px;
  height: 28px;
  text-indent: 28px;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
/* hamburger icon */
.main-menu-btn-icon, .main-menu-btn-icon:before, .main-menu-btn-icon:after {
  position: absolute;
  top: 50%;
  left: 2px;
  height: 2px;
  width: 24px;
  background: #bbb;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
}
.main-menu-btn-icon:before {
  content: '';
  top: -7px;
  left: 0;
}
.main-menu-btn-icon:after {
  content: '';
  top: 7px;
  left: 0;
}
/* x icon */
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon {
  height: 0;
  background: transparent;
}
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:before {
  top: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:after {
  top: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
/* hide menu state checkbox (keep it visible to screen readers) */
#main-menu-state {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  overflow: hidden;
  clip: rect(1px,1px,1px,1px);
}
/* hide the menu in mobile view */
#main-menu-state:not(:checked) ~ #main-menu {
  display: none;
}
#main-menu-state:checked ~ #main-menu {
  display: block;
}
@media (min-width: 768px) {
  /* hide the button in desktop view */
  .main-menu-btn {
    position: absolute;
    top: -99999px;
  }
  /* always show the menu in desktop view */
  #main-menu-state:not(:checked) ~ #main-menu {
    display: block;
  }
}

/* Back to top 
---------------*/
.cd-top {
	z-index: 600;
	display: inline-block;
	height: 40px;
	width: 40px;
	position: fixed;
	bottom: 40px;
	right: 40px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
	/* image replacement properties */
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	font-size: 0;
	background: url(../images/back-to-top-s.png) no-repeat center 50%;
	visibility: hidden;
	opacity: 0;
	-webkit-transition: opacity .3s 0s, visibility 0s .3s;
	-moz-transition: opacity .3s 0s, visibility 0s .3s;
	transition: opacity .3s 0s, visibility 0s .3s;
}
.cd-top .cd-is-visible, .cd-top .cd-fade-out, .no-touch .cd-top:hover {
	-webkit-transition: opacity .3s 0s, visibility 0s 0s;
	-moz-transition: opacity .3s 0s, visibility 0s 0s;
	transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
	/* the button becomes visible */
	visibility: visible;
	opacity: 1;
}
.cd-top.cd-fade-out {
	/* if the user keeps scrolling down, the button is out of focus and becomes less visible */
	opacity: .7;
}
.no-touch .cd-top:hover {
	background-color: #e86256;
	opacity: 1;
}
.cd-top {
	height: 60px;
	width: 60px;
	right: 60px;
	bottom: 60px;
}