﻿body {
    font-family: "Microsoft JhengHei", Helvetica, Arial, sans-serif;
    font-size: 1.4rem;
}

.glyphicon {
    line-height: inherit;
}

h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    font-weight: 600;
    color: #4e4e4e;
}

h1 {
    font-size: 1.8em;
}

h2 {
    font-size: 1.6em;
}

h3 {
    font-size: 1.4em;
}

h4 {
    font-size: 1.2em;
}

a {
    color: #c52d2f;
    -webkit-transition: color 300ms, background-color 300ms;
    -moz-transition: color 300ms, background-color 300ms;
    -o-transition: color 300ms, background-color 300ms;
    transition: color 300ms, background-color 300ms;
    text-decoration: none;
}

    a:hover, a:focus {
        color: #d43133;
        text-decoration: none;
        /*outline: none;*/
    }

    a:focus,
    btn:focus,
    button.chart-btn:focus {
        outline: 3px solid rgb(69, 133, 237);
    }	

@media print {
  a[href]:after {
    content: none !important;
  }
}
	
ol, ul {
    /*list-style: none;*/
}

p {
    margin: 10px 0px 5px 0px;
}

hr {
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #fff;
}

img { border: 0; }

.accesskey-holder {
    position: relative;
    height: 0;
}

.accesskey {
    position: absolute;
    color: #069;
    font-family: Helvetica, Arial, sans-serif;
	font-size: 1.4rem;
	line-height: 1;
}

.accesskey a {
    color: #f8f8f8;
    text-decoration: none;
}

.accesskey a:hover {
    color: #f8f8f8;
    text-decoration: none;
}

.accesskey a:focus {
    color: #ffffff;
    text-decoration: none;
}

/*==header==*/
/*--logo--*/

.logo {
    display: inline-block;
    height: 77px;
    width: 71px;
    position: absolute;
    left: 5%;
    top: 5px;
}

.logo a:link, .logo a:visited {
    display: inline-block;
    height: 77px;
    width: 71px;
    background: url(../img/logo.png) no-repeat;
}

.top-number {
    color: #fff;
    margin: 10px 0px;
}

.top-number p {
    margin: 15px 0px 0px 0px;
    position: relative;
}

/*橫式功能列*/
.navlink {
    list-style: none;
    padding: 0px 5px 0px 5px;
}

    .navlink li {
        display: inline-block;
        font-family: "微軟正黑體", "新細明體";
        font-size: 1.4rem;
        margin-left: 5px;
    }

        .navlink li a {
            color: #047384;
            padding: 0px 5px 0px 5px;
        }

            .navlink li a:hover {
                color: #105db4;
                text-decoration: none;
            }



@media(max-width:767.98px) {
    .navlink {
        margin: 10px 0px;
    }

    .navlink li {
        font-size: 1em;
    }

    .navlink li a {
        padding: 0px 8px;
    }

    .top-number {
        width: 100%;
        margin-top: 0;
    }

    .top-number img {
        width: 100%;
        height: auto;
    }
}


/*--search--*/
#header .search {
    display: inline-block;
}

.search {
    padding: 10px 0px 0px 0px;
}

.input-group .form-control:first-child {
    border-radius: 0px;
    height: 36px;
}

.input-group-btn:last-child > .btn {
    border-radius: 0px;
    background: #3d98f3;
    color: #ffffff;
}

.input-group {
    margin-bottom: 6px;
}

.form-group label {
    font-size: 1em;
    font-weight: normal;
    margin-right: 5px;
    color: #027383;
}

.search i {
    color: #fff;
}

/*檢索說明*/
.searchlink {
    color: #000000;
    font-size: 1.1em;
    padding-top: 5px;
}

    .searchlink a {
        color: #027f9d;
    }

        .searchlink a:hover {
            text-decoration: none;
            color: #105db4;
        }

.navbar-form {
    padding: 0px 0px;
}

.form-control {
    border-radius: 18px;
}

.btn {
    border-radius: 18px;
}

@media(max-width:991.98px) {
    .form-group {
        margin: 0px 20px;
    }

    .search {
        padding: 0px 0px 0px 0px;
    }
}

@media(max-width:767.98px) {
    .navbar-form {
        margin-top: 0px;
    }



    .form-group {
        margin: 0px 20px 0px 20px;
    }

    .searchlink {
        margin: 0px 0px 20px 5px;
        font-size: 1.2em;
    }
}



/*--menu--*/
.navbar {
    border-radius: 0;
    margin-bottom: 0;
    background: #003c7a;
    padding: 15px 0;
    padding-bottom: 0;
}

.navlink .navbar-toggle {
    margin-right: -8px;
}

    .navlink .navbar-toggle .icon-bar {
        background: #000000;
    }


/*--menu下拉選單--*/
.dropdown-menu {
    margin-top: -1px;
    min-width: 180px;
}

/*主選單置中*/
.navbar-nav {
    /*margin-top: 12px;*/
    font-size: 1.4em;
    display: table;
    float: none;
    margin: 0 auto;
    table-layout: fixed;
    padding: 0;
}

    .navbar-nav > li {
        margin: 0px 5px;
        padding-bottom: 15px;
    }

#navbar3 .navbar-nav > li {
    border-right: 1px solid #047386;
    margin: 5px 5px;
    padding-bottom: 0px;
}

.navbar-inverse .navbar-nav > li > a {
    padding: 2px 12px;
    margin: 0;
    color: #fff;
    line-height: 24px;
    display: inline-block;
    text-decoration: none;
    border-right: 2px solid #ffffff;
    font-weight: bold;
}

    .navbar-inverse .navbar-nav > li > a:hover {
        background-color: #c52d2f;
        color: #fff;
    }

.navbar-inverse {
    border: none;
}

    .navbar-inverse .navbar-brand {
        font-size: 3.6rem;
        line-height: 50px;
        color: #fff;
    }

    .navbar-inverse .navbar-nav > .active > a,
    .navbar-inverse .navbar-nav > .active > a:hover,
    .navbar-inverse .navbar-nav > .active > a:focus,
    .navbar-inverse .navbar-nav > .open > a,
    .navbar-inverse .navbar-nav > .open > a:hover,
    .navbar-inverse .navbar-nav > .open > a:focus {
        background-color: #c52d2f;
        color: #fff;
    }

    .navbar-inverse .navbar-nav .dropdown-menu {
        background-color: rgba(0,0,0,.85);
        -webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.125);
        -moz-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.125);
        box-shadow: 0 3px 8px rgba(0, 0, 0, 0.125);
        border: 0;
        padding: 0;
        margin-top: 0;
        border-top: 0;
        border-radius: 0;
        left: 0;
    }

        .navbar-inverse .navbar-nav .dropdown-menu:before {
            position: absolute;
            top: 0;
        }

        .navbar-inverse .navbar-nav .dropdown-menu > li > a {
            padding: 7px 15px;
            color: #fff;
            font-size: 1.2em;
        }

        .navbar-inverse .navbar-nav .dropdown-menu > li:hover > a,
        .navbar-inverse .navbar-nav .dropdown-menu > li:focus > a,
        .navbar-inverse .navbar-nav .dropdown-menu > li.active > a {
            background-color: #c52d2f;
            color: #fff;
        }

        .navbar-inverse .navbar-nav .dropdown-menu > li:last-child > a {
            border-radius: 0 0 3px 3px;
        }

        .navbar-inverse .navbar-nav .dropdown-menu > li.divider {
            background-color: transparent;
        }

    .navbar-inverse .navbar-collapse,
    .navbar-inverse .navbar-form {
        border-top: 0;
        padding-bottom: 0;
    }



@media(max-width:991.98px) {

    .navbar-nav {
        font-size: 1.2em;
    }
}

@media(max-width:767.98px) {

    .navbar {
        padding: 0px 0;
    }

    #navbar4 .navbar-nav {
        width: 100%;
        margin: 10px 0px;
    }

    .navbar-inverse .navbar-nav > .open > a {
        width: 100%;
    }

    .navbar-nav > li {
        margin: 0px 0px;
        padding-bottom: 0px;
    }

    .navbar-inverse .navbar-nav > li > a {
        border: none;
    }

    .navbar-inverse .navbar-toggle {
        border: 1px solid #ffffff;
    }
}





/*--menu下拉選單--*/
.menu {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.sub-product-sections span {
    font-size: 1.2rem;
    padding: 0px 5px 0px 0px;
}

#nav {
    position: relative;
    z-index: 6;
    height: 50px;
    line-height: 50px;
    background: #003c7a;
    width: 100%;
    margin: 0 auto;
    padding: 0;
}

#nav li {
/*height: 50px;
line-height: 50px;*/
}

#nav li a {
    font-weight: 400;
    font-size: 1.8rem;
    text-decoration: none;
    color: #fff;
    text-transform: uppercase;
}

/* Primary menu */
#menu-primary-shop-navigation {
    /*position: absolute;
    top: 0;
    left: 94px;
    z-index: 2;*/
    font-size: 1.4em;
    display: table;
    float: none;
    margin: 0 auto;
    table-layout: fixed;
    padding: 0;
}

#menu-primary-shop-navigation li,
#menu-primary-shop-navigation .sub-menu-area {
    float: left;
    /* background-color: #f11917;*/
}

#menu-primary-shop-navigation a {
    padding: 0 6px;
    border-right: 2px solid #fff;
}

#menu-primary-shop-navigation li:last-child a {
    border: none;
}

#menu-primary-shop-navigation a:hover {
    color: #f7cf00;
}

#menu-primary-shop-navigation .sub-menu-area {
    /*float: none;*/
    display: inline-block;
    background-color: transparent;
    line-height: 28px;
    width: 33%;
    padding: 2px 10px;
}

#menu-primary-shop-navigation .sub-menu-area a,
#menu-primary-shop-navigation .sub-menu-area > span {
    display: block;
    font-size: 1.6rem;
    line-height: 28px;
    color: #000000;
    border: none;
    text-transform: none;
    padding: 0 0 0 0px;
    background-repeat: no-repeat;
    background-position: 0 0;
}

#menu-primary-shop-navigation .sub-menu-area > span {   
    background-color: #ebebeb;
    margin-right: 30px;
    padding: 2px 2px 2px 15px;
}

#menu-primary-shop-navigation .sub-menu-area a:hover {
    background-position: 0 -28px;
    color: #3a6ba5;
}

#menu-primary-shop-navigation li:hover .nav-dropdown,
.menu-item.open_nav-dropdown > .nav-dropdown {
    display: block;
}

/* Sub menu */
.nav-dropdown {
    display: none;
    position: absolute;
	z-index: 1001;
    top: 50px;
    left: 15%;
    right: 15%;
    z-index: 1001;
    width: 70%;
    margin: 0 auto;
    box-shadow: 0 3px 8px -2px rgba(0,0,0,0.3);
    background: #ffffff;
}

.sub-product-sections {
    /* width: 138px;*/
    float: left;
    padding: 10px;
    border: 1px solid #cccccc;
    box-shadow: 0 0 36px rgba(0,0,0,0.5);
    width: 100%;
}

@media(max-width:767.98px) {
    #nav {
        height: auto;
    }

    #menu-primary-shop-navigation li {
        float: inherit;
        /* background-color: #f11917;*/
    }

    #menu-primary-shop-navigation {
        margin: 0px;
    }

    #menu-primary-shop-navigation a {
        border: none;
    }

    #menu-primary-shop-navigation .sub-menu-area {
        width: 100%;
    }

    .nav-dropdown {
        position: relative;
        width: 100%;
        top: 0px;
        left: 0px;
        right: 0px;
    }

    .sub-product-sections {
        background: #ffffff;
    }
}

/* Third-level menu */
#menu-primary-shop-navigation .third-level-menu {
    margin-bottom: 20px;
}
#menu-primary-shop-navigation .third-level-menu li {
    display: block;
    width: 100%;
    padding-left: 0;
    padding-right: 30px;    
}
#menu-primary-shop-navigation .third-level-menu li:not(:last-child) a {
    border-bottom: 1px dashed #cccccc;
}


/*--大圖輪播--*/
.box-shadow {
    position: relative;
    z-index: 1;
}

    .box-shadow:after {
        transform: rotate(3deg);
        right: 10px;
        left: auto;
    }

.carousel-inner img {
    width: 100%;
}

.header-text {
    position: absolute;
    top: 0;
    left: 1.8%;
    right: auto;
    width: 96.66666666666666%;
    color: #fff;
}

    .header-text h1 {
        font-size: 4rem;
        line-height: 1.2;
    }

        .header-text h1 a {
            color: #000000;
        }

.banner-title, .banner-title2 {
    font-size: 4rem;
    font-family: "WenQuanYi Zen Hei", "Heiti TC", "Microsoft JhengHei", "Arial", "Sans-serif";
    line-height: 1.2;
    font-weight: 700;
    margin-top: 20px;
    margin-bottom: 10px;
    color: #fff;
    text-shadow: 2px 2px 4px #666;
}

.banner-title2 {
    color: #0b4874;
    text-shadow: 2px 2px 4px #999;
}

.carousel-indicators {
    /*bottom:0px;*/
    top: 10px;
    height: 20px;
}



/*--四選項--*/
#list_4 {
    position: absolute;
    z-index: 9999;
    bottom: 0;
    /*width: 100%; 置中*/
}

    #list_4 .container {
        padding-right: 0px;
        padding-left: 0px;
        width: 80%;
    }

.list_4 {
    width: 620px;
    margin: 0 auto;
}

    .list_4 img {
        width: 50px;
        height: 50px;
    }

#list_4 .quick_link {
    font-size: 1.3rem;
    color: #076d7c;
    text-align: center;
    padding: 10px 5px;
    margin: 10px 0px 10px 0px;
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 0 36px rgba(0,0,0,0.22);
    font-weight: normal;
    width: 85px;
    height: 120px;
    line-height: 17px;
}

    #list_4 .quick_link:hover {
        background: #fff1cd;
    }

    #list_4 .quick_link a {
		display: block;
        color: #095c90;
    }



/*--統計圖表--*/

.chart {
    bottom: 10px;
    right: 2%;
    position: absolute;
    z-index: 9;
}

.chart .image {
	background: #ffffff;
	box-shadow: 0 0 36px rgba(0,0,0,0.22);
	width: 368px;
	height: 290px;
	float: right;
	border-radius: 10px;
	margin-right: 10px;
}

.chart img {
	width: 325px;
	height: 183px;
	margin: 12px 22px 5px 22px;
	border: 1px solid #000000;
}

.chart .image h2 {
	margin: 0px 20px 0px 20px;
	color: #595959;
	padding-top: 10px;
}

.chartbox {
	position: relative;
}
.chartbox > div {
	width: 325px;
	height: 183px;
	margin: 12px 22px 5px 22px;
	border: 1px solid #000000;        
}
.chartbox > a:link {
	color: #595959;
	font-size: 1.3rem;
	position: absolute;
	left: 30px;
	bottom: 10px;
}
.chartbox > a:visited {
	color: #676767;
	text-decoration: none;
}
.chartbox > a:hover {
	color: #000000;
	text-decoration: underline;
}
.chart .image h3 {
	margin: 0px 20px 0px 20px;
	color: #828282;
	padding-top: 10px;
}

.chart .image .glyphicon {
	margin: 0px 5px 0px 20px;
	color: #828282;
}

.chart .image p {
	margin: 0px 0px 0px 0px;
	color: #828282;
	float: left;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 270px;
}

.chart .more {
	background: #0093d9;
	width: 58px;
	height: 24px;
	float: right;
	text-align: center;
	color: #ffffff;
	margin-right: 20px;
}

.chart .more a {
    color: #ffffff;
}

.chart .select_block {
    display: flex;
    margin: 0 auto;
    width: 325px;
}

.chart .form-control {
    border-radius: 5px;
    text-align: center;
}

.chart select {
    flex: 1 1;
}

.chart .chart-btn {
    flex: 0 0 48px;
    height: 34px;
    margin-left: 2px;
    padding: .25rem .5rem;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    color: #555;
    background-color: #ffffff;
}

.select_block {
    padding-top: 10px;
}

@media(max-width:1157px) {
    #list_4 .container {
        width: 100%;
    }
}
@media(max-width:575.98px) {
    .chart {
        display: none;
        padding-left: 0;
        padding-right: 0;
    }

    .chart .image {
        width: 100% !important;
        padding-left: 5px;
        padding-right: 5px;
    }

    .chart .image h3 {
        margin: 0 auto;
        width: 100%;
    }

    .chart .select_block {
        width: 100%;
    }

    .chartbox {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .chartbox > div {
        width: 100%;
        height: 183px;
        margin: 12px 0 5px 0;
    }
}



/*
@media(max-width:1120px){ 
.chart {
	bottom:130px;
	right:0%;
	position:absolute;
	z-index:9;
}
}*/

@media(max-width:1000px) {
    #list_4 {
        position: relative;
        width: 100%;
    }

    /*.chart {
	bottom:150px;
}*/

    .chart {
        margin: 20px 0px;
        position: static;
    }

	.chart .image {
		background: #ffffff;
		box-shadow: 0 0 36px rgba(0,0,0,0.22);
		width: 368px;
		height: 290px;
		float: none;
		right: 0px;
		margin: 0 auto;
		border-radius: 10px;
		/*margin-bottom:30px;*/
	}

    .list_4 {
        width: 100%;
    }

    #list_4 .quick_link {
        width: auto;
        margin: 20px 0px;
    }
}


@media(max-width:800px) {

    .header-text h1 {
        font-size: 3rem;
    }
}


@media(max-width:730px) {

    .header-text h1, .banner-title, .banner-title2 {
        font-size: 1.2em;
        line-height: 1.2;
        background: rgba(255,255,255,0.7);
        text-align: center;
        bottom: 10px;
        margin-top: 40%;
        border-radius: 20px;
        padding: 5px 0px;
    }

    #list_4 .quick_link {
        margin: 20px 0px;
    }
}

/*--頁籤及多媒體--*/
#list {
    background: #e5e5e7;
    padding: 20px 0px;
}

#list .container {
    width: 98%;
    margin: 0 auto;
}
#list .container-fliud {
    padding-left: 45px;
	padding-right: 15px;
}

/*--頁籤--*/
.date {
    float: right;
    color: #595959;
}

.org {
    margin: 0px 0px 0px 20px;
    display: none;
}

.resp-tabs-container .glyphicon {
    width: 10px;
    height: 10px;
    float: left;
    font-size: 1.2rem;
}

.list {
	font-size: 1.15em;
	line-height: 1.4em;
	position: relative;
	left: 0;
	margin-top: 20px;
}

.list a {
	display: -ms-grid \9;
	padding: 0px 0px 0px 9px;
	text-decoration: none;
	text-align: justify;
	color: #696969;	
}
	
.list a:hover {
		color: #0092db;
}

.list ul {
	padding-left: 0px;
	margin-top: 20px;
}

.list ol {
	padding-left: 0px;
}

.list ul li {
	margin: 0px 0px 10px 0px;
	color: #696969;
	/* border-bottom: 1px solid #000; */
	width: 100%;
}

.list ul li {
	margin: 0px 0px 10px 0px;
	border-bottom: 1px dashed #cccccc;
	padding: 0px 0px 10px 0px;
	color: #696969;
	width: 100%;	
}

.list ul li:hover {
	color: #0092db;
}

.list img {
	float: none;
	width: 200px;
	margin: 0px auto;
	border: 1px solid #000000;
	display: block;
	margin-bottom: 20px;
}

.list .more {
	background: #1b3546;
	width: 58px;
	height: 24px;
	float: right;
	text-align: center;
	color: #ffffff;
	margin-top: 20px;
}

.list .more a {
	color: #ffffff;
	font-size: 1.4rem;
}

.red {
    color: #cb122c;
    font-weight: bold;
    margin: 0px 0px 20px 0px;
}

.resp-tab-item a {
    color: #000000;
}

.resp-tab-active a {
    color: #006699;
    display: block;
    font-size: 1em;
    font-weight:  normal;
}


@media(max-width:1000px) {
    #list .container {
        width: 95%;
        margin: 0 auto;
    }
	#list .container-fliud {
        padding-left: 30px;
		padding-right: 15px;
    }

    .date {
        float: none;
        display: initial;
        margin: 0px 0px 0px 10px;
    }

    .list a {
        padding: 0px 0px 0px 20px;
    }

    .list .more a {
        padding: 0px 12px;
    }
}

@media(min-width:992px) {
	.list ul li {
		border-bottom: 0;
		padding: 5px 0;
	}
	.list img {
		float: left;
		margin: 0px 20px 0px 0px;		
	}	
}

@media(min-width:992px) {	
	.list {
		font-size: 1.15em;
		line-height: 1.4em;
		position: absolute;
		left: 0;
		margin-top: 50px;
	}

    .list a {
        padding: 0px 40px 0px 10px;
    }
}
@media(min-width:1061px) {	
	.list {
		margin-top: 20px;
	}
}

/*--多媒體--*/
.media .more {
    background: #007ab3;
    width: 58px;
    height: 24px;
    float: right;
    text-align: center;
    color: #ffffff;
    margin-right: 0;
}

    .media .more a {
        color: #ffffff;
    }

.media .video {
    background: #58575c;
    box-shadow: 0 0 36px rgba(0,0,0,0.22);
    width: 288px;
    height: 232px;
    margin: 0 auto;
    margin-top: 15px;
    padding: 10px 10px 5px 10px;
}

.media .video h2 {
    font-size: 1.4em;
    margin: 0px;
    color: #ffffff;
    line-height: 24px;
    font-weight: 600;
}

.media .video h3 {
    margin: 0px 20px 0px 20px;
    color: #ffffff;
}

.media .video p {
    margin: 0px 0px 0px 0px;
    color: #ffffff;
    float: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 200px;
}

.media .video p > a {
    color: #ffffff;
}

.media .video .glyphicon {
    margin: 0px 5px 0px 20px;
    color: #ffffff;
}

.media .image {
    background: #ffffff;
    box-shadow: 0 0 36px rgba(0,0,0,0.22);
    width: 288px;
    height: 242px;
    margin: 0 auto;
}

.media .faceb {
    background: #ffffff;
    box-shadow: 0 0 36px rgba(0,0,0,0.22);
    width: 288px;
    height: 406px;
    margin: 0 auto 30px;
}

.media img {
    width: 318px;
    height: 157px;
    margin: 20px 20px 5px 20px;
    border: 1px solid #000000;
}

.media .image h2 {
    margin: 0px 20px 0px 20px;
    color: #595959;
    font-size: 1.4em;
    line-height: 24px;
}

.media .image h3 {
    margin: 0px 20px 0px 20px;
    color: #828282;
}

.media .image .glyphicon {
    margin: 0px 5px 0px 20px;
    color: #828282;
}

.media .image p {
    margin: 0px 0px 0px 0px;
    color: #828282;
    float: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 200px;
}


@media(max-width:767.98px) {
    #list {
        background: #e5e5e7;
        padding: 10px 0px;
    }
}
@media(max-width:575.98px) {
    .media {
		margin-left: -15px;
        padding-left: 0;
		padding-right: 0;
    }
}


/*--banner--*/
#banner_content {
    position: relative;
    background: #ffffff;
}

    #banner_content h3 {
        text-align: center;
    }


/*--fatfooter--*/
#bottom .container {
    padding-right: 0px;
    padding-left: 0px;
    width: 100%;
    border-top: 21px solid #087c8e;
}

.fatfooter {
    width: 92%;
    margin: 0 auto;
}

.fatfooter li a {
    display: block;
}
/*--設定 bottom title 大小--*/
#bottom p {
    margin: 0;
    font-size: 1.4em;
    color: #076d7c;
    text-align: left;
    padding: 0px 20px 10px 0px;
    line-height: 24px;
    font-weight: 600;
}

#bottom ul {
    list-style: none;
    padding: 0px 20px 0px 0px;
    margin: 0;
    min-height: 420px;
}

    #bottom ul li {
        display: block;
        padding: 2px 0;
    }

        #bottom ul li a {
            color: #676767;
            font-size: 1.5rem;
        }

            #bottom ul li a:hover {
                color: #000000;
                text-decoration: underline;
            }

#bottom .widget {
    border-right: 1px solid #086e7d;
    padding: 0px 10px;
    margin: 20px 0;
}

.widget {
    margin-bottom: 30px;
    padding-left: 0;
}


@media(max-width:767.98px) {

    #bottom .container {
        border: none;
    }

    #bottom h3 {
        background: #003c7a;
        padding: 5px 20px 6px 20px;
        color: #ffffff;
        margin: 0px 0px 5px 0px;
    }

    #bottom ul {
        padding: 0px 20px 0px 20px;
        height: auto;
        min-height: auto;
    }

        #bottom ul li {
            padding: 0px 0;
        }

    #bottom .widget {
        border: none;
    }

    .fatfooter {
        width: 100%;
        margin: 0 auto;
    }
}


/*--footer--*/
#footer {
    padding: 20px 0px;
    color: #ffffff;
    background:  #087c8e;
}

    #footer a {
        color: #ffffff;
    }

        #footer a:hover {
            color: #fffc00;
            text-decoration: none;
        }

    #footer ul {
        list-style: none;
        padding: 0;
        margin: 15px 0px 25px 0px;
        text-align: left;
    }

        #footer ul li {
            display: inline-block;
            margin-right: 10px;
            border-right: 1px solid #ffffff;
            padding: 0px 15px 0px 0px;
        }

    #footer img {
        margin: 0px 10px 15px 0px;
    }





/*==內容頁==*/

/*--path--*/
.path {
    margin: 10px 0px;
    font-size: 1em;
}

    .path a {
        color: #000000;
    }

    .path .glyphicon {
        padding: 0px 5px 0px 5px;
        font-size: 0.5em;
    }

    .path h2,
    .path h3,
    .path h4 {
        display: inline;
        margin: 0;
        color: inherit;
        font-family: inherit;
        font-size: 1.4rem;
        font-weight: normal;
    }

/*--內容--*/

/*--左邊--*/
.con-left {
    /*width:210px;*/
    margin: 0px 0px 0px 0px;
}

    .con-left h1 {
        background: url(../img/con_left-title.jpg) no-repeat #0c7b8f;
        height: 70px;
        line-height: 70px;
        color: #ffffff;
        font-size: 1.4em;
        padding: 0px 0px 20px 70px;
        font-weight: normal;
        margin: 0px;
    }

    .con-left h2 {
        background: url(../img/con_left-title.jpg) no-repeat #0c7b8f;
        height: 70px;
        line-height: 70px;
        color: #ffffff;
        font-size: 1.4em;
        padding: 0px 0px 20px 70px;
        font-weight: normal;
        margin: 0px;
    }

/*--menu--*/

.sidebar-nav {
    border-radius: 5px;
}

    .sidebar-nav li {
        padding: 0;
    }

        .sidebar-nav li a {
            background: #eeeeee;
            border-bottom: 1px solid #cbddf5;
            display: block;
            padding: 10px 20px;
            outline: none;
            color: #184d81;
            font-size: 1.15em;
            font-weight: 400;
        }

            .sidebar-nav li a:hover {
                text-decoration: none;
            }

        .sidebar-nav li ul {
            background: #fff;
            padding: 0;
            margin: 0;
            list-style: none;
        }

            .sidebar-nav li ul a {
                background: #fff;
                color: #555555;
                font-size: 1.05em;
                border-bottom: solid 1px #d8d8d8;
                padding: 5px 20px;
            }

    .sidebar-nav ul li:hover a,
    .sidebar-nav ul li.active a,
    .sidebar-nav ul li a:focus {
        color: #bc5e43;
        background: #FFFFCE;
    }

    /*--內容頁左側 navbar 聚焦顯示--*/
    .sidebar-nav li a:hover,
    .sidebar-nav li a:focus {
        background: #BEBEBE;
        font-weight: bold;
    }

    .sidebar-nav > li:last-child a {
        /*border: none;*/
    }

.list-group-item {
    border: none;
    border-bottom: 1px solid #1a72cb;
}

    .list-group-item li > .badge {
        float: right;
    }

.sidebar-nav span.badge {
    margin-top: 8px;
    margin-right: 10px;
}

.sidebar-nav .list-toggle > span.badge {
    margin-right: 25px;
}

.sidebar-nav ul li span.badge {
    margin-top: 0px;
    font-size: 1rem;
    padding: 3px 5px;
    margin-right: 20px;
    border-radius: 0 0 5px 5px;
    background: #c97e69;
}

/* 新版 - 內容導覽選單摺疊效果 */
.list-toggle > a:before {
   color: #777;
   font-family: 'Glyphicons Halflings';
   font-size: 1rem;
   content: "\e113";
   float: right;
   transition: all 0.5s;
}
.list-toggle > a.collapsed:before {
    -webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	transform: rotate(180deg);
} 

/* 舊版 - 內容導覽選單摺疊效果 */
/*.list-toggle:after {
    top: 8px;
    right: 20px;
    color: #777;
    font-size: 2.4rem;
    content: "\203A";
    position: absolute;
    font-weight: normal;
    display: inline-block;
}*/

.list-toggle.active:after {
    color: #fff;
    content: "\2039";
}
/* ===== */

.sidebar-nav li [class^="fa"],
.sidebar-nav li [class*=" fa"] {
    width: 1.25em;
    left: -2px;
    margin-right: 2px;
    text-align: center;
    position: relative;
    display: inline-block;
}

    .sidebar-nav li [class^="fa"].fa-lg,
    .sidebar-nav li [class*=" fa"].fa-lg {
        /* increased font size for fa-lg */
        width: 1.5625em;
    }



/*--右邊--*/
.top_img img {
    border: none !important;
    border-radius: 0px !important;
    padding: 10px 0px !important;
    width: 100%;
}

.con_imgs {
    width: 100%;
    text-align: center;
    margin: 20px 0px;
}

    .con_imgs img {
        border: 1px solid #cccccc;
        border-radius: 5px;
        padding: 10px;
    }

.con-right {
    font-size: 1.1em;
}

    .con-right p {
        text-align: justify;
    }

.info {
    text-align: right;
    color: #1872ca;
    margin: 20px 0px;
}

.date {
    margin: 0px 0px 0px 12px;
    /* width: 200px; */
    float: right;
}

.con_btn {
    margin: 30px 0px 20px 0px;
    text-align: right;
}

    .con_btn .btn {
        border-radius: 5px;
        margin: 0px 0px 0px 10px;
    }


.btn-primary {
    color: #fff;
    background-color: #0e91a5;
    border-color: #0e91a5;
}

    .btn-primary.focus, .btn-primary:focus {
        color: #fff;
        background-color: #0b6370;
        border-color: #0b6370;
    }

    .btn-primary:hover {
        color: #fff;
        background-color: #0b6370;
        border-color: #0b6370;
    }

    .btn-primary.active, .btn-primary:active, .open > .dropdown-toggle.btn-primary {
        color: #fff;
        background-color: #0b6370;
        border-color: #0b6370;
    }

        .btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover, .open > .dropdown-toggle.btn-primary.focus, .open > .dropdown-toggle.btn-primary:focus, .open > .dropdown-toggle.btn-primary:hover {
            color: #fff;
            background-color: #0b6370;
            border-color: #0b6370;
        }

    .btn-primary.active, .btn-primary:active, .open > .dropdown-toggle.btn-primary {
        background-image: none;
    }

    .btn-primary.disabled.focus, .btn-primary.disabled:focus, .btn-primary.disabled:hover, .btn-primary[disabled].focus, .btn-primary[disabled]:focus, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary.focus, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary:hover {
        background-color: #0b6370;
        border-color: #0b6370;
    }

    .btn-primary .badge {
        color: #337ab7;
        background-color: #fff;
    }

@media(max-width:991.98px) {
    .con-left {
        width: 100%;
        background: url(../img/con_left-title.jpg) no-repeat #0c7b8f;
        margin: 10px 0px 0px 0px;
        padding: 0px 20px 10px 20px;
    }
}


@media(max-width:767.98px) {

    .top_img img {
        height: auto;
    }

    .con_imgs img {
        width: 100%;
        height: auto;
    }

    .date {
        margin: 0px 0px 0px 20px;
        display: block;
    }
}


/*--表格：th在左邊--*/
.rwd-table_cp caption {
    text-align: center;
    color: #000000;
    font-size: 1.1em;
}

.rwd-table_cp {
    background: #EEE;
    border: 1px solid #d5d3d3;
}

    .rwd-table_cp tr:nth-of-type(2n) {
        background: #fff;
    }

    .rwd-table_cp th, .rwd-table_cp td {
        margin: 0.5em 1em;
    }

.rwd-table_cp {
    width: 100%;
    margin: 0px auto;
    margin-top: 0px;
    margin-bottom: 50px;
}

    .rwd-table_cp th {
        background: #003c7a;
    }

    .rwd-table_cp td {
        display: block;
        color: #000000;
    }

        .rwd-table_cp td:before { /*content:attr(data-th) " : ";font-weight:bold;width:6.5em;*/
            display: inline-block;
        }

    .rwd-table_cp th, .rwd-table_cp td {
        text-align: left;
    }

        .rwd-table_cp th, .rwd-table_cp td:before {
            color: #000000;
            font-weight: bold;
            text-align: center;
        }

            .rwd-table_cp th:before {
                color: #000000;
                font-weight: bold;
                text-align: center;
            }

        .rwd-table_cp td:before {
            color: #000000;
            font-weight: bold;
            text-align: left;
        }

        .rwd-table_cp th:first-child {
            padding: 10px;
            text-align: left;
            border-bottom: 1px solid #ffffff;
            font-weight: normal;
            width: 38%;
            font-family: "微軟正黑體", Arial, sans-serif;
            color: #ffffff;
        }

@media (min-width: 480px) {
    .rwd-table_cp td:before {
        display: none;
    }

    .rwd-table_cp th, .rwd-table_cp td {
        display: table-cell;
        padding: 0.25em 0.5em;
    }

        .rwd-table_cp th:first-child {
            padding-left: 0;
            text-align: left;
            border-bottom: 1px solid #ffffff;
            font-size: 1em;
            /*font-weight:bold;*/
            width: 23%;
        }

        .rwd-table_cp td:first-child {
            padding-left: 0;
        }

        .rwd-table_cp th:last-child, .rwd-table_cp td:last-child {
            padding-right: 0;
        }

    .rwd-table_cp th, .rwd-table_cp td {
        padding: 0.8em !important;
    }
}


/*lp頁表格-th在上*/
.rwd-table caption {
    text-align: center;
    color: #000000;
    font-size: 1.1em;
}

.rwd-table {
    background: #fff;
    border: 1px solid #d5d3d3;
}

    .rwd-table tbody tr:nth-of-type(2n + 1) {
        background: #eee;
    }

    .rwd-table th, .rwd-table td {
        margin: 0.5em 1em;
    }

.rwd-table {
    width: 100%;
    margin: 0px auto;
    margin-top: 20px;
    margin-bottom: 20px;
}

    .rwd-table th {
        display: none;
        background: #003c7a;
    }

    .rwd-table td {
        display: block;
        color: #000000;
    }

        .rwd-table td:before {
            content: attr(data-th) " : ";
            font-weight: bold; /*width:6.5em;*/
            display: inline-block;
        }

    .rwd-table th, .rwd-table td {
        text-align: left;
    }

        .rwd-table th, .rwd-table td:before {
            color: #000000;
            font-weight: bold;
            text-align: center;
        }

            .rwd-table th:before {
                color: #000000;
                font-weight: bold;
                text-align: center;
            }

        .rwd-table td:before {
            color: #000000;
            font-weight: bold;
            text-align: left;
        }

    .rwd-table th {
        padding: 10px;
        font-weight: normal;
        font-family: "微軟正黑體", Arial, sans-serif;
        color: #ffffff;
        text-align: left;
    }

@media (min-width: 480px) {
    .rwd-table td:before {
        display: none;
    }

    .rwd-table th, .rwd-table td {
        display: table-cell;
        padding: 0.25em 0.5em;
    }

        .rwd-table th:first-child, .rwd-table td:first-child {
            padding-left: 0;
        }

        .rwd-table th:last-child, .rwd-table td:last-child {
            padding-right: 0;
        }

    .rwd-table th, .rwd-table td {
        padding: 0.8em !important;
    }
}


/*--輪播大圖切換箭頭隱藏
.carousel-control.left {
    display: none;
}

.carousel-control.right {
    display: none;
}
--*/
/*--輪播控制項--*/
.carousel-control {
    width: 10%;
}
.carousel-control:focusfocus span {
    outline: 3px solid rgb(69, 133, 237);
}
.carousel-inner > .item > a:focus > .header-text p {
    display: inline-block;
    outline: 3px solid rgb(69, 133, 237);
}

/*--進階查詢下方 Web Link(中科FB、Youtube、Google+連結)--*/
ul#weblink li {
    display: inline;
}

/*--園區相關連結聚焦顯示--*/
.span3:hover .banner,
a:focus .banner {    
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
}


.tabPanelStyle ul li a {
	color:#000 !important;
	display: table;
	padding: 0px 10px;
}

.tabPanelStyle ul li a:hover {
	color:#0092db !important;
}

/*
#fh5co-tab-feature {
	height:700px;
}*/




@media (min-width: 480px) {
/*#fh5co-tab-feature {
	height:1200px;
}*/
}

/* Page Styles
==================================*/
.page-top {        
    margin-bottom: 30px;
    text-align: right;
    line-height: 1.4em;
}
.page-content {
    margin-bottom: 50px;
    padding-left: 5%;
    padding-right: 5%;
    line-height: 1.4em;
}

.page-bottom {    
    margin-bottom: 30px;
    padding-left: 5%;
    padding-right: 5%;
    text-align: right;
    line-height: 1.4em;
}

.search-bar {
    margin-left: 5%;
    margin-right: 5%;
    margin-bottom: 20px;
    text-align: center;
}

.topic-list {
    width: 100%; 
    border: none; 
    border-spacing: 0; 
    padding: 5px;    
}
.topic-list > thead > th,
.topic-list > tbody > th,
.topic-list-header > th {
    vertical-align: top;
}
.topic-list > thead > td,
.topic-list > tbody > td,
.topic-list-body > td {
    vertical-align: top;
}

.topic-list > tbody > tr:hover {
    background-color: #fbfbef;
}

.topic-subject {
    display: inline-block;
    background: 0 12px url('../img/icon_5.gif') no-repeat;
    margin-left: -15px;
    padding-left: 15px;
}
.topic-details-line {
    padding: 5px;
    padding-left: 15px;
}

.sp-mt-1 {
    margin-top: 5px;
}
.sp-mt-2 {
    margin-top: 15px;
}
.sp-mt-3 {
    margin-top: 30px;
}
.sp-mt-4 {
    margin-top: 50px;
}
.sp-mb-1 {
    margin-bottom: 5px;
}
.sp-mb-2 {
    margin-bottom: 12px;
}
.sp-mb-3 {
    margin-bottom: 30px;
}
.sp-mb-4 {
    margin-bottom: 50px;
}
.sp-pl-1 {
    padding-left: 8px;
}
.sp-pl-2 {
    padding-left: 16px;
}
.sp-pl-3 {
    padding-left: 24px;
}

ul.file-list {
    margin: 0;
    padding-left: 25px;
    list-style-image: url('../img/icon_file.gif')
}
ul.file-list > li {
    line-height: 1.6;
}

ul.ie-list {
    margin: 0;
    padding-left: 25px;
    list-style-image: url('../img/icon_ie.gif')
}
ul.ie-list > li {
    line-height: 1.6;
}

.category-row {
    background: url('../img/icon_7.gif') no-repeat;
    padding-left: 24px;
}
.title-row {
    background: url('../img/icon_6.gif') no-repeat;
    margin-bottom: 5px;
    padding-left: 24px;
}
.item-row {
    background: 0 8px url('../img/icon_5.gif') no-repeat;
    margin-bottom: 4px;
    padding-left: 16px;
}
.search-icon {
    display: inline-block;
    background: 0 4px url('../img/icon_search.gif') no-repeat;
    min-width: 15px;
    min-height: 15px;
}

.category-icon {
    display: inline-block; 
    background: url('../img/icon_7.gif') no-repeat; 
    min-width: 15px; 
    min-height: 15px;
}

.dropdown-icon {
    display: inline-block; 
    background: 0 7px url('../chinese/img/icon_14.gif') no-repeat; 
    min-width: 15px; 
    min-height: 15px;
}

td.item-icon,
.table-row-icons > tr > td:first-child,
.table-row-icons > tbody > tr > td:first-child {
    background: url('../img/icon_5.gif') no-repeat;
    padding-top: 15px;
}

@media (min-width: 480px) {
    th.item-icon-spacing,
    .table-row-icons > tr > th:first-child,
    .table-row-icons > thead > tr > th:first-child,
    .table-row-icons > tbody > tr > th:first-child {
        padding-left: 45px !important;
    }

    td.item-icon,
    .table-row-icons > tr > td:first-child,
    .table-row-icons > tbody > tr > td:first-child {
        padding-top: .8em;
        padding-left: 45px !important;
        background: 14px 26px url('../img/icon_5.gif') no-repeat;
    }
}

td.qa-icon {
    background: url('../chinese/img/icon_Q.gif') no-repeat;
    padding-top: 15px;
}

@media (min-width: 480px) {
    th.qa-icon-spacing {
        padding-left: 45px !important;
    }

    td.qa-icon {
        padding-top: .8em;
        padding-left: 45px !important;
        background: 14px 22px url('../chinese/img/icon_Q.gif') no-repeat;
    }
}

/* Flexbox
==================================*/
.flex-container {
    display: flex;
    flex-direction: column;
}

.justify-content-center {
    justify-content: center;
}

.justify-content-between {
    justify-content: space-between;
}


@media (min-width: 480px) {
    .flex-container {
        flex-direction: row;
    }
}

.flex-row {
    flex-direction: row !important;
}

/* pic-card
==================================*/
.pic-card {
    display: inline-block;
    padding: 8px;
    border: 1px solid #d1d1d1;
    border-radius: 8px;
    box-shadow: 0 0 0 3px #f2f2f2;
}

/* list
==================================*/
ul.list-horizontal li {
    display: inline-block;
    margin: 0;
    padding: 0;
}

/* pagination-bar & pager-nav & pager-info
==================================*/
.pagination-bar {
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.pagination-bar label {
    margin-bottom: 0;
    font-weight: inherit;    
}
.pager-info {
    line-height: 1.5;
}
.pager-nav {
    flex-shrink: 0;    
    margin-left: .5em;
    padding: 0;
    list-style-type: none;
}
.pager-nav > li { 
	float: left; 
}
.pager-nav > li > a,
.pager-nav > li > span {
    display: block;
    margin: 0 .15em;
	padding: .25em 0;
    color: #666;
	text-align: center;
}
.pager-nav > li > a,
.pager-nav > li.active > span {
	min-width: 2em;	
	padding: .25em .4em;
    border: 1px solid #aaa;
    border-radius: 2px;
	background-color: white;
	color: #666;
	text-decoration: none;
}
.pager-nav > li.active > span {
    border: 1px solid #ccc;
    border-radius: 2px;
    background-color: #ccc;
    color: #333;
}
.pager-nav > li > a:hover,
.pager-nav > li > a:focus {	
    border-color: #13a689;
	background-color: #13a689;
	color: white;
}
.pager-nav > li > a:focus { outline: 0; }

@media (max-width: 767.98px) {
    .pagination-bar {
        flex-direction: column;
    }
    .pager-info {
        margin-bottom: 1em;
        line-height: 2;
    }
    .pager-nav {
        float: none;        
        margin-bottom: 1em;
    }
}

/* 回至最上方按鈕
==================================*/
.gotop-btn {
    display: block;
    position: fixed;
    top: 80%;
    right: -90px;
    z-index: 1000;    
    padding: 10px 12px;
    font-size: 1.5em;
    font-weight: bold;
    line-height: 24px;    
    cursor: pointer;
    transition: 400ms ease-out;
}
.gotop-btn.visible {
    right: 15px;
    transition: 400ms ease-in;
}
.gotop-btn,
.gotop-btn:link,
.gotop-btn:visited {
    background-color: rgba(0,0,0,.25);
    color: white;
    transition: 150ms;
}
.gotop-btn:hover,
.gotop-btn:active {
    background-color: rgba(19,166,137,.95);
    color: white;
    transition: 150ms;
}

.circle {
    border-radius: 50%;
}

/* NOSCRIPT
==================================*/
.noscript {
    display: block;
    background-color: #000000;
    color: #ffffff;
    font-family: inherit;
    font-size: 1.6rem;
    line-height: 2;
    text-align: center;
}