html {
	height: 100%;
}

body {
	background-color: #E5E6EB;
	background-image: url("../images/bg.png");
}

ol, ul, li {
	list-style: none;
}

#page-top {
	height: 100%;
	font-family: "微軟正黑體", "Calibri", "Helvetica Neue", Helvetica, sans-serif;
	font-size: 16px;
	color: #555;
}

.wrapper {
	min-height: 100%;
	position: relative;
}

.sa-container {
	margin-left: -15px;
	margin-right: -15px;
}

.sa-position {
	position: relative;
}

.ul-pd-l {
	padding-left: 0;
}

.li-display {
	display: inline-block;
}

.a-decor:hover,
.a-decor:focus {
	text-decoration: none;
}

.a-decor:hover {
	color: #224a8e;
}

.a-inlineblock {
	display: inline-block;
}

.mob-display {
	display: none;
}

@media screen and (min-width: 768px) {
	.mob-display {
		display: inline-block;
	}
	.web-display {
		display: none;
	}
}

/*********** Header Css ***********/
.header {
	background-color: #fff;
}

.navbtn-nav {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 2000;
}

.navbtn-nav .btn-closenav {
	display: block;
	text-align: right;
	padding: 8px 0 0 0 ;
}

.navbtn-nav .btn-closenav i {
	font-size: 20px;
	color: #224a8e;
}

.navbtn-nav ul{
	list-style: none;
	padding-left: 0;
	padding: 0 15px;
	background-color: #fff;
}

.navbtn-nav ul li {
	letter-spacing: 1.5px;
	background-color: #fff;
	border-bottom: 1px solid #ccc;
}

.navbtn-nav ul li a {
	display: block;
	padding: 10px 0;
	font-weight: bold;
	font-size: 15px;
	color: #555;
}

.navbtn-nav ul li a:hover {
	background-color: #69c4e6;
	color: #fff;
	-webkit-transition: color .2s ease-in,background-color .2s ease-in;
    -moz-transition: color .2s ease-in, background-color .2s ease-in;
    -o-transition: color .2s ease-in, background-color .2s ease-in;
    transition: color .2s ease-in, background-color .2s ease-in;
}
.header-nav {
	list-style: none;
	text-align: right;
	margin-bottom: 10px;
	padding-left: 0;
}

.header-nav li {
	padding: 0 2px;
}

.header-nav li a {
	color: #8d8d8d;
	font-size: 13px;
	font-weight: bold;
}

.header .btn-opennav a {
	margin: 7px 7.5px;
}

.header .btn-opennav i{
	color: #224a8e;
	font-size: 20px;
}

.header-logo {
	float: left;
	margin-bottom: 15px;
}

.header-logo img{
	width: 100%;
	height: auto;
	padding: 0 10px;
}

@media screen and (min-width: 990px) and (max-width: 1200px) {
	.header-banner {
		clear: both;
	}
}

.header-search {
	position: absolute;
	right: 5px;
	top: 35px;
	border: 1px solid #69c4e6;
	display: none;
}

.input-search {
	height: 25px;
	width: 130px;
	outline: none;
	border: none;
	margin: 0 5px;
}

.header-search a {
	float: right;
	padding: 0 5px;
}

.header-search a i{
	color: #5675a9;
}

@media screen and (min-width: 768px) {
	.header-nav li a {
		font-size: 14px;
	}
}

@media screen and (min-width: 992px) {
	.header-nav {
		float: right;
		margin: 10px 0 5px 0;
	}
	.btn-opennav {
		display: none;
	}
	.header-logo {
		margin-bottom: 8px;
	}
	.header-logo img {
		padding: 10px;
	}
	.header-search {
		display: block;
	}
}
.nav {
	background-color: #69c4e6;
	box-shadow: 0 2px 3px rgba(13,31,81,.6);
}

.web-nav {
	display: none;
	padding-left: 0; 
	margin-top: 10px;
	table-layout: fixed;
	width: 100%;
}

.web-nav li {
	display: table-cell;
	width: auto;
	text-align: center;
}

.web-nav a {
	font-weight: bold;
	color: #fff;
}

.nav-search {
	text-align: center;
	margin: 8.5px 35px;
	background-color: #fff;
	overflow: hidden;
}

.nav-search .input-nav {
	float: left;
	width: 80%;
}

.nav-search a{
	float: right;
	display: inline-block;
	padding: 2px 10px;
}

.nav-search a i{
	color: #5675a9;
}

@media screen and (min-width: 768px) {
	.nav-search .input-nav {
		width: 90%;
	}
}

@media screen and (min-width: 992px) {
	.web-nav {
		display: block; 
	}
	.web-nav li {
		padding: 0 10px;
	}
	.nav-search {
		display: none;
	}
}

@media screen and (min-width: 1200px) {
	.web-nav {
		display: table;
	}
	.web-nav li{
		padding-left: 0;
		padding-right: 0; 
	}
}

/*********** slider&moesport Css ***********/
.slider-item {
	display: block;
	width: 100%;
}

.slider-item img {
	max-width: 100%;
	margin: 0 auto;
}

/*********** open-data Css ***********/
.open-data {
	text-align: center;
}

.open-data .data-card {
	margin: 10px 0;
}

.open-data .open-data-variable {
	font-size: 1.5em;
	font-weight: bold;
	color: #224a8e;
	margin: 0 8px;
}

.open-data .data-card p {
	margin-bottom: 0; 
	font-weight: bold;
	color: #224a8e;
	display: inline-block;
	margin: 0 8px;
}

@media screen and (min-width: 768px) {
	.open-data .open-data-variable {
		font-size: 2em;
	}
	.open-data .data-card {
		margin: 20px 0;
	}
}

@media screen and (min-width: 992px) {
	.open-data {
		margin-top: 80px;
	}
}

/*********** aside Css ***********/
.aside {
	margin: 15px 0;
	display: none;
}

.aside p {
	font-size: .8em;
	letter-spacing: 1px;
}

.aside p span {
	margin: 0 5px;
}

.sa-bread {
	background-color: inherit;
	font-size: 15px;
	margin-bottom: 0;
}

@media screen and (min-width: 992px) {
	.aside {
		display: block;
	}
}

/*********** Content-Panel Css ***********/
.content {
	padding-bottom: 250px;
}

.panel-card {
	text-align: center;
	margin-bottom: 20px;
}

.panel-card .a-decor {
	display: inline-block;
	width: 100%;
	height: auto;
}

.panel-card img {
	max-width: 130px;
	height: auto;
	transition: width .5s, height .5s, transform .5s;
}

.panel-card img:hover {
	transform: scale(1.1,1.1);
}

/*********** Content-aboutus Css ***********/
.sa-panel {
	border: none;
	border-radius: initial;
}

.panel-bor-bot {
	border-bottom: 1px solid #56AC2C;
}

.sa-panel img {
	max-width: 40px;
	height: auto;
	vertical-align: -15px;
	margin: 10px;
}

.sa-panel h1 {
	display: inline-block;
	font-size: 1.5em;
	font-weight: bold;
	margin: 10px 0;
	color: #156707;
}

.sitemap-link {
	margin: 10px 0 20px 0;
}

.sa-panel-b h2 {
	font-size: 20px;
	font-weight: bold;
	color: #56AA2C;
	margin: 20px 0;
}

.panel-table>thead>tr>td,
.panel-table>tbody>tr>td {
	padding: 5px 0;
	border: none;
}

/*********** Nav-tabs Css ***********/
.sa-panel .nav {
	background-color: inherit;
}

.sa-tabs {
	border-bottom: 1px solid #56AC2C;
	box-shadow: none;
}

.sa-tabs>li.active>a,
.sa-tabs>li.active>a:focus,
.sa-tabs>li.active>a:hover {
	border: 1px solid #56ac2c;
	border-bottom-color: transparent;
}

.sa-tabs>li>a {
	border: inherit;
}

.sa-tabs>li>a:focus,
.sa-tabs>li>a:hover {
	background-color: #f2f2f2;
}

.sa-panel .sa-tabs a {
	padding: 5px 10px;
}

.sa-panel .sa-tabs img {
	max-width: 25px;
	height: auto;
}

.sa-panel .sa-tabs h1 {
	font-size: 1.2em;
	margin: 5px;
}

/*********** content-data Css ***********/
.data {
	margin-bottom: 25px;
}

.data-p {
	text-align: center;
	font-weight: bold;
	margin-bottom: 0;
}

.data-span {
	padding: 0 5px;
	font-weight: bold;
	font-size: 18px;
}
/*********** content-form Css ***********/
.sa-panel-b .form-inline .w100 {
	width: 100%;
}

.btn-search {
	width: 100%;
	border-radius: 4px;
	background-color: #56AC2C;
	color: #fff;
	padding-left: 20px;
	padding-right: 20px;
	margin-top: 10px;
}
.btn-open {
	width:98%;
	border-radius: 4px;
	background-color: #56AC2C;
	color: #fff;
	padding-left: 30px;
	padding-right: 20px;
	margin-top: 10px;
}

.btn-search:hover {
	background-color: #79bd56;
	color: #fff;
}
.btn-open:hover {
	background-color: #79bd56;
	color: #fff;
}

.btn-search:focus {
	color: #fff;
}
.btn-open:focus {
	color: #fff;
}

.gray-border .form-control {
	border-color: #ccc;
}

@media screen and (min-width: 992px) {
	.btn-search {
		margin-top: 27px;
	}
    .btn-open {
		margin-top:35px;
	}
}

/*********** thumbnail Css ***********/
a.sa-thumbnail:hover{
	box-shadow: 3px 3px 5px rgba(221,221,221,.8);
	border-color: #bbb;
}

.sa-thumbnail h3 {
	font-size: 1.2em;
	font-weight: bold;
}

.sa-thumbnail p {
	font-size: 14px;
}

.sa-thumbnail .date {
	font-weight: bold;
	color: #d94f4f;
}

/*********** table Css ***********/
.rwd-table {
	width: 100%;
	overflow-x: auto;
	word-break: keep-all;
	text-align: center;
}

.sa-table {
	border: 1px solid #56ac2c;
	margin-bottom: 0;
}

.sa-table>thead>tr>th,
.sa-table>tbody>tr>th {
	background-color: #EEFFE4;
	border: 1px solid #56AC2C;
	padding: 10px;
	text-align: center;
}

.sa-table>thead>tr>td,
.sa-table>tbody>tr>td {
	font-size: 14px;
	padding: 10px;
	border: 1px solid #56AC2C;
	vertical-align: middle;
}

.sa-table-hover>tbody>tr:hover {
	background-color: #f2f2f2;
}

.table-text-l>thead>tr>td,
.table-text-l>tbody>tr>td {
	text-align: left;
}

.people-table {
	border: 1px solid #d94f4f;
}

.people-table>thead>tr>th,
.people-table>tbody>tr>th {
	border: 1px solid #d94f4f;
	background-color: #f8e0e0;
}

.people-table>thead>tr>td,
.people-table>tbody>tr>td {
	border: 1px solid #d94f4f;
}

.gov-table {
	border: 1px solid #F18C36;
}

.gov-table>thead>tr>th,
.gov-table>tbody>tr>th {
	border: 1px solid #F18C36;
	background-color: #ffedde;
}

.gov-table>thead>tr>td,
.gov-table>tbody>tr>td {
	border: 1px solid #F18C36;
}

.org-table {
	border: 1px solid #69C0E2;
}

.org-table>thead>tr>th,
.org-table>tbody>tr>th {
	border: 1px solid #69C0E2;
	background-color: #ddf5ff;
}

.org-table>thead>tr>td,
.org-table>tbody>tr>td {
	border: 1px solid #69C0E2;
}

/*********** Content-app Css ********/
.app-icon img {
	max-width: 80px;
	height: auto;
}

.app-title {
	font-size: 1.5em;
	font-weight: bold;
	color: #156707;
}

.btn-left {
	display: inline-block;
}

.rating {
	display: inline-block;
}

.rating img {
	margin: 0;
	vertical-align: middle;
}

.rating p {
	display: none;
	font-weight: bold;
	color: #d94f4f;
}

.btn-right-group {
	float: right;
}

@media screen and (min-width: 555px) {
	.rating p {
		display: inline-block;
	}
	.btn-left {
		margin-right: 20px;
	}
}

/*********** photo Css ***********/
.app-photo .item {
	display: block;
	padding: 10px;
}

.app-photo .item img {
	max-width: 100%;
	height: 0 auto;
}

/*********** enterprise Css ***********/
.enterprise {
	text-align: center;
}

.enterprise img {
	max-width: 100%;
	height: auto;
	text-align: center;
}

/*********** pagination Css ***********/
.sa-page {
	text-align: center;
}

.sa-page>.pagination-sm>li>a {
	border: 1px solid #eee;
}

.sa-page>.pagination-sm>li>a:hover {
	background-color: #f2f2f2;
}

/*********** footer Css ***********/
.footer {
	background-color: #69c4e6;
	border-top: 2px solid #5ab5d7;
	height: 225px;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}

.footer table {
	margin-top: 10px; 
}

.footer table>thead>tr>td,
.footer table>tbody>tr>td {
	padding: 5px;
	font-size: 12px;
	color: #fff;
}

@media screen and (min-width: 768px) {
	.content {
		padding-bottom: 225px;
	}
	.footer {
		height: 200px;
	}
}

@media screen and (min-width: 992px) {
	.content {
		padding-bottom: 145px;
	}
	.footer {
		height: 120px;
	}
}

/*********** gotop Css ***********/
.gotop-position {
	display: inline-block;
	position: fixed;
	bottom: 35px;
	right: 15px;
	z-index: 999px;
	visibility: hidden;
}
.gotop-visible{
	visibility: visible;
	opacity: 1;
}

.gotop-visible a{
	display: inline-block;
	padding: 12px 8px;
	background-color: #224a8e;
	color: #fff;
	font-weight: bold;
	border-radius: 5px;
}

.a-transition {
	opacity: .6;
    transform: translate3d(0px, 0px, 0px);
    transition: all 1s;
    box-shadow: 0 5px 5px rgba(70,70,70,.7);
}

.a-transition:hover {
	color: #fff;
	opacity: 1;
    transform: translate3d(0px, 0px, 0px);
    transition: all 1s;
}

/*********** Other Css ***********/
.btn-added {
	float: right;
}

.btn-added,
.btn-added:focus,
.btn-added:hover,
.white-color,
.white-color:focus,
.white-color:hover {
	color: #fff;
}

.btn-added:hover {
	background-color: #8acde5;
}

.btn-red:hover {
	background-color: #d96464;
}

.btn-black:hover {
	background-color: #4d4d4d;
}

.btn-green:hover {
	background-color: #b1cb5b;
}

.btn-white i {
	font-size: 16px;
}

.mg5 {
	margin: 5px
}

.mg-t5 {
	margin-top: 5px;
}

.mg-t20 {
	margin-top: 20px;
}

.mg-b10 {
	margin-bottom: 10px;
}

.mg-b20 {
	margin-bottom: 20px;
}

.mg-tp20 {
	margin-top: 20px;
	margin-bottom: 20px;
}

.mg-r10 {
	margin-right: 10px;
}

.mg-r20 {
	margin-right: 20px;
}

.pd10 {
	padding: 10px;
}

.pd-tb5 {
	padding-top: 5px;
	padding-bottom: 5px;
}

.pd-tb10 {
	padding-top: 10px;
	padding-bottom: 10px;
}

.pd-t10 {
	padding-top: 10px;
}

.pd-lr5 {
	padding-left: 5px;
	padding-right: 5px;
}

.pd-r5 {
	padding-right: 5px;
}

.a-pd {
	padding: 0 3px;
}

.w100 {
	width: 100%;
}

.red-bg {
	background-color: #d94f4f;
}

.blue-bg {
	background-color: #69C4E6;
}

.green-bg {
	background-color: #a4c639;
}

.black-bg {
	background-color: #333;
}

.symbol-position {
	padding: 5px;
	font-size: 20px;
}

.blue-color {
	color: #69C4E6;
}

.red-color {
	color: #dc4f4f;
}

.slick-prev:before, .slick-next:before {
	color: #333;
}