﻿@import url("/fourthRiverV3/css/cwtexyen-local.css");s
body {
	font-family: 'Microsoft JhengHei';
	font-size:0.95rem;
	background: #fdfcfb; /* Old browsers */
	background: -moz-linear-gradient(top, #fdfcfb 0%, #e6e6e6 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #fdfcfb 0%, #e6e6e6 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #fdfcfb 0%, #e6e6e6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdfcfb', endColorstr='#e6e6e6', GradientType=0 ); /* IE6-9 */
	background-image: url(../images/wave.png);
	background-repeat: repeat-x;
	background:url(../images/curve3.jpg) right top no-repeat;
	background-size:cover;
}
hr{border-top:1px solid #c3ea62}
.navbar-inverse .navbar-toggler{margin:0 auto;}
.navbar-toggler{display:block}
.row {
	max-width: 1400px;
	margin: 0 auto;
}
.row.top {
    max-height: 150px;
	max-width: none;
}
.col-md-12{padding-left:0;padding-right: 0;}
/*20181005修改高度*/
.logo {
	margin: 0rem auto 0rem auto;
    display: block;
    max-width: 100%;
    max-height: 80px;
}
.breadcrumb {
	background-color: transparent;
	border-radius: 0;
	
}
.breadcrumb ::before{content:url(../images/home.png)}
.breadcrumb-item ::before{content:none;}
.breadcrumb-item.active, .breadcrumb-item a {
	color: #7c9aca;
	font-size: 0.85em;	
}
.breadcrumb-item.active {
	color: #235ab2;
	font-weight: bold;
}
dt {
	font-family: 'cwTeXYen';
	color:#2f78ed;
	font-size:1.2rem;
    margin: 1rem 0 0 0;	
	text-indent:22px;
	background:url(../images/li.png) no-repeat 0 5px;
}
dd {
	padding:0 0 0 22px;
}
.logo-s {	
	margin: -7px 0 0 0;
	transform: scale(0.5)
}
.show>.dropdown-menu {
    z-index:400;
	background: #235ab2;
	border-radius: 0;
	color: #fff;
}
.dropdown a:hover,.dropdown a:focus{color:#fff;}
.dropdown-toggle::after{display:none;}
.btn{background:#4eaf52;border:0;margin:0.1rem;font-size:0.8rem;font-family: 'Microsoft JhengHei';}
.btn-excel,.btn-excel:hover{background-image: url(../images/xls.png);background-repeat:no-repeat;background-position:3px 3px;text-indent:15px;float:right;margin-bottom:0.5rem;}
.btn-group{display:block;}
.btn-secondary{background:#1bc1ff;color:#fff;border:0;margin:0 0.05rem 0.1rem 0;border-radius:0;font-family: 'cwTeXYen';font-size:1.1rem;}
.nav {
	background: #2f78ed;
	color: #fff;
}
.nav li{background: -moz-linear-gradient(-45deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.2) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0.2) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0.2) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}
@media (min-width:576px){.nav-item{
	    margin: 0 auto;
    width: 100%;
    text-align: center;
}
.nav-item.home{max-width:80px;}
	}
/*下行放白字*/
.btn,.dropdown-item, .nav-pills, .nav-link {
	color: #fff;font-size: 1.05rem;
}
.dropdown-divider {
	background: rgba(0,0,0,0.1)
}
.carousel{      
    }
.carousel-item img{margin: 0 auto;}

.carousel-caption{background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%,   rgba(0,0,0,0.7) 25%, rgba(0,0,0,0.7) 75%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 25%,rgba(0,0,0,0.7) 75%, rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 25%,rgba(0,0,0,0.7) 75%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */}

.carousel-control-next-icon, .carousel-control-prev-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-color: #0561f5;
    -webkit-background-size: 50% 50%;
    background-size: 50% 50%;
    box-shadow: 0 0 6px #fff;
    padding: 1rem;
    border-radius: 50%;
}
/*footer*/
.footer {
	color: #808080;
	font-size: 0.9rem;
	background:#fff;
	background-image: url(../images/wave.png);
	background-repeat: repeat-x;
}
.footer .col-md-12 {
	max-width: 700px;
	margin: 0 auto;
}
.footer h3 {
	    color: #2f78ed;
    font-size: 1rem;
    font-weight: bold;
    padding: 1.7rem 0 0.7rem 0;
    line-height: 0px;
}

@media (max-width:575px) {
.footer,.footer ul li {
	text-align: center;
}
}
/*horizon scroll table 水平表格*/
td.large {
    font-weight: bold;
}
#demo-table,.css-table{
	width: 99.9%;
	background-color: #ffffff;
	border-collapse: collapse;
	margin-bottom: 20px;
	font-size:0.9rem;
}

#demo-table td, #demo-table th,
.css-table .td, .css-table .th{
	padding: 5px;
}

#demo-table td,
.css-table .td{
	color: #1a7dd6;
	border: #ddd 1px solid;
}

#demo-table th,
.css-table .th{
	background-color: #1a1a1a;
	color:#ffffff;
	border: #5cbdf1 1px solid;
	text-align: center;
	text-shadow:0 0 2px #3e75a9, 0 0 4px #15222d;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#76d9f7+1,207ce5+100 */
background: rgb(118,217,247); /* Old browsers */
background: -moz-linear-gradient(top, rgba(118,217,247,1) 1%, rgba(32,124,229,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(118,217,247,1) 1%,rgba(32,124,229,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(118,217,247,1) 1%,rgba(32,124,229,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#76d9f7', endColorstr='#207ce5',GradientType=0 ); /* IE6-9 */
}


.css-table{
	display: table;
	display: none;
}
.css-table .thead{
	display:table-header-group;
}
.css-table .tbody{
	display:table-row-group;
}
.css-table .tr{
	display:table-row;
}
.css-table .th,
.css-table .td{
	display:table-cell;
}
tr:nth-child(even){background-color: #f2f2f2}

.color4 td,td.time{    font-size: 0.91rem;
    word-break: break-all;
    word-wrap: break-word; }
@media only screen and (max-width: 960px) {
	.hide-column .large{
		display: none;
	}
	.css-table{
		background-color: transparent;
	}
	.css-table .thead{
		display: none;
	}
	.css-table .tr{
		display:block;
		border: #ddd 1px solid;
		margin-bottom: 5px;
		background: #ffffff;
	}
	.css-table .th,
	.css-table .td{
		display:inline-block;
		width: 48%;
		border: none;
	}
}
table .red{    background: #fd4e4e;
    color: #fff;
    padding: 0.1rem 0.4rem;
    border-radius: 8px}
@media only screen and (max-width: 720px) {
	.hide-column .mobile{
		display: none;
	}

	.scroll-left:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
	.scroll-left thead:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
	.scroll-left{ width: 100%; border-collapse: collapse; border-spacing: 0; }
	.scroll-left th,
	.scroll-left td { margin: 0; vertical-align: top; }
	.scroll-left th { text-align: left; }
	.scroll-left{ display: block!important; position: relative; width: 100%; }
	.scroll-left thead { display: block; float: left; }
	.scroll-left tbody { display: block; width: auto; position: relative; overflow-x: auto; white-space: nowrap; }
	.scroll-left thead tr { display: block; }
	.scroll-left th { display: block; text-align: right; }
	.scroll-left tbody tr { display: inline-block; vertical-align: top; margin:0px -2px;}
	.scroll-left td {display: block;
    min-height: 1.25em;
    text-align: left;
    }

	/* sort out borders */
	.scroll-left th { border-bottom: 0; border-left: 0; }
	.scroll-left td { border-left: 0; border-right: 0; border-bottom: 0; }
	.scroll-left tbody tr { /*border-left: 1px solid #babcbf;*/ }
	.scroll-left th:last-child,
	.scroll-left td:last-child { border-bottom: 1px solid #babcbf; }


	/* Force table to not be like tables anymore */
	.break-table{
		background-color: transparent !important;  
	}
	.break-table, 
	.break-table thead, 
	.break-table tbody, 
	.break-table th, 
	.break-table td, 
	.break-table tr { 
		display: block; 
	}

	/* Hide table headers (but not display: none;, for accessibility) */
	.break-table thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	.break-table tr { border: 1px solid #ccc; margin-bottom: 10px; background-color: #ffffff;}

	.break-table td { 
		/* Behave  like a "row" */
		border: none !important;
		border-bottom: 1px solid #eee !important;  
		position: relative;
		padding-left: 35% !important; 
		white-space: normal;
		text-align:left;
	}

	.break-table td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 30%; 
		padding-right: 10px; 
		white-space: nowrap;
		text-align:left;
		font-weight: bold;
		color: #1a1a1a;
	}
	.break-table td:before { content: attr(data-title); }

	.css-table .th,
	.css-table .td{
		display:block;
		width: 100%;
	}
}
@media only screen and (max-width: 480px) {
	.hide-column .small{
		display: none;
	}
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus{background-color: transparent;color:#4ea2fe;}
.navbar-default .navbar-nav>li>a{color:#4ea2fe;}
.navbar-inverse .navbar-nav .nav-link:focus, .navbar-inverse .navbar-nav .nav-link:hover{
	text-shadow: 0 0 10px #dafaf4;color:#fff;
}
/*table 結束*/
.modal-content{background:rgba(0,0,0,0.85);color:#fff;}

.btn-secondary:hover {
    color: #fff;
	background-color: #2d73e3;}
.bg-danger{background: rgb(250,63,86); /* Old browsers */
background: -moz-linear-gradient(top, rgba(250,63,86,1) 1%, rgba(250,37,64,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(250,63,86,1) 1%,rgba(250,37,64,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(250,63,86,1) 1%,rgba(250,37,64,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fa3f56', endColorstr='#fa2540',GradientType=0 ); /* IE6-9 */}
.bg-grey{
	background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,246,248,1) 7%, rgba(255,255,255,1) 18%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 80%, rgba(238,246,248,1) 96%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(238,246,248,1) 7%,rgba(255,255,255,1) 18%,rgba(255,255,255,1) 80%,rgba(255,255,255,1) 80%,rgba(238,246,248,1) 96%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(238,246,248,1) 7%,rgba(255,255,255,1) 18%,rgba(255,255,255,1) 80%,rgba(255,255,255,1) 80%,rgba(238,246,248,1) 96%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.card{margin: 1rem 0;text-align:center;border: 1px solid #c6ebff;
    box-shadow: 0 0 10px rgba(89,105,132,0.2);
    border-radius: 27px;padding:20px 0;}
.card.red{border: 1px solid #ffc9b2;
    box-shadow: 0 0 10px rgba(214, 162, 129, 0.2);}
.red.bg-grey{
	background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(251,243,238,1) 7%, rgba(255,255,255,1) 18%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 80%, rgba(251,243,238,1) 96%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(251,243,238,1) 7%,rgba(255,255,255,1) 18%,rgba(255,255,255,1) 80%,rgba(255,255,255,1) 80%,rgba(251,243,238,1) 96%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(251,243,238,1) 7%,rgba(255,255,255,1) 18%,rgba(255,255,255,1) 80%,rgba(255,255,255,1) 80%,rgba(251,243,238,1) 96%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.card-body{width:100%}
.card-body h3 span{font-size:0.95rem;}
.card-body img{max-width:100%;}
.card-header, .card-footer {
    background: transparent;
    color: #579fe5;
	border-top:0;border-bottom:0;
}
h5.card-header img{vertical-align: baseline;}
.card-footer{text-align: left;
    padding: 0 0 0 20px;
    color: #4d4d4d;}

.card h5{    font-size: 24px;
    padding: 0;
    font-weight: bold;
    text-align: center;}
.card h5{color:#4ba6ff;padding:0 0 0.9rem 0; border-bottom:1px solid #c7eff5;}
.card.red h5{color:#e0554d; border-bottom:1px solid #ffe6db;}
.card .card-footer{color: dodgerblue;
    padding: 1rem 2rem 0 2rem;
    border-top: 1px solid #c7eff5;}
.card.red .card-footer{color: #e0554d;    
    border-top: 1px solid #ffe6db;}
.card-footer span::before{content: url(../images/u2.png);    vertical-align: middle;}
.red .card-footer span::before{content: url(../images/u.png); }
.card .rightIcon{ color: #e0554d;
    padding: 0;
    /*line-height: 1rem;*/
    position: absolute;
    /*top: 4rem;*/
    right: 1.8rem;
    z-index: 200;
}
.card .rightIcon a{    text-decoration: none;
    color: dodgerblue;
    font-size: 13px;
    font-weight: bold;}
.card.red .rightIcon a{    text-decoration: none;
    color: #ff5148;
    font-size: 13px;
    font-weight: bold;}



a.more{    display: inline-block;
    padding: 2px 0 0 0;
   color:#4d4d4d;
    float: right;}
/* navbar*/
.navbar{background: #2e7fff;padding:0;
    color: #fff;text-align:center}
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form{border:none;}
.navbar-inverse .navbar-nav .nav-link{color:#fff;background: -moz-linear-gradient(-45deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0) 74%, rgba(0,0,0,0) 76%); /* FF3.6-15 */	
background: -webkit-linear-gradient(-45deg, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 74%,rgba(0,0,0,0) 76%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 74%,rgba(0,0,0,0) 76%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}
a.navbar-brand{display:none;}
.navbar-brand img{height:30px}
.navbar-inverse{border-color:transparent;}
.show>.dropdown-menu {
    background: rgba(0, 21, 53, 0.8);
    border-radius: 0;
    color: #fff;
    border: 0;
    box-shadow: 0 0 15px rgba(0,0,0,0.5);
	text-align: center;
    width: 100%;	      
}
.dropdown-item:focus, .dropdown-item:hover{background-color:transparent;}
.dropdown-menu{margin:0.5rem 0;	
	}
.chartNumber{    position: absolute;
    top: 76px;
    /*margin: 0 auto;*/
    /*width: 100%;*/
    /*2018-09-26 會擋到外圍的環狀圖*/
    margin: 0 75px;
    width:180px;
    z-index: 0;
    width:50%;
}
.chartNumber h2{display:inline;}
.chartNumber p{    color: #4d4d4d;
    font-size: 30px;
    font-weight: bold;}
.chartNumber>p{padding-top: 0.45rem;
    line-height: 1.5rem;}
.chartNumber .counter {
    font-size: 20px;
    font-weight: bold;
}
.count-title{font-family:Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"}
.color1{color:#d65b58;}
.color2{color:#eaa553;}
.color3{color:#f2e586;}
.marquee{ background:#eef7ff; color:#54697a;padding:20px 5px;}
.red .marquee{background:#fbe5e4;}
.red .cBox{background:#f3a5a1}
.cBox{padding:30px}
.cBox h3{color:#fff;font-size:22px;font-weight:bold;}
.cBox .count-title{ font-size: 80px;
    color: rgba(0,0,0,0.7);
    font-weight: bold;
    display: inline-block;
    line-height: 8rem;}
.cBox{background:#c6e3ff;}
h5.modal-title{text-align:center;}
table#demo-table.color4{margin-top:20px;}
table#demo-table.color4 th{background: #c6e3ff;
    border: 1px solid #ecfcfa;
    text-shadow: 0 0 0 transparent;
    color: #46729c;}
#demo-table.color4 tr:nth-child(even){background-color:transparent;}
.card table{text-align: left;
    width: 100%;
    margin: 2rem auto;}
.card.red table th, .card.red table td{padding:4px 6px;border:1px solid #fbc9c7;color: #715947;text-align:center;}
.card table th    , .card table td    {padding:4px 6px;border:1px solid #d2e8fd;color: #4b96d8;min-width: 72px;}
.card.red table th{background:#fbe5e4;color:#ef584f;}
.card table th{background: #c6e3ff;color: #46729c;}
.card.red table tr:nth-child(even){background:#fffbfb;}
.card table tr:nth-child(even){background:#f0f8ff;}
.card.red table tr:hover{background:#fbcfcd;color:#fff;}
.subMenu.navbar{background:#c6e3ff;}
.subMenu .collapse {display:block}
.subMenu .nav{background: transparent;margin:0 auto}
.subMenu .nav li{background: -moz-linear-gradient(-45deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}
.subMenu .nav-link{color: #4ea2fe;
    font-weight: bold;
    font-size: 0.97rem;}
@media (max-width: 576px){
	.subMenu .navbar-nav .nav-link{border-bottom:1px solid #ecf6ff;}
}
@media (max-width:720px){
	.Noshow{display:none;}}
.carousel.svgBox{width:100%;max-height:none;height:auto;}
.carousel-inner svg{width:100%;}
.solo{width:auto;max-height:500px;}
.carousel h4{    color: #134a8a;
    font-size: 1.2rem;
    font-weight: bold;}
.carousel .solo img{}
.gracolor{
	background: -moz-linear-gradient(left, rgba(232,243,255,1) 4%, rgba(255,255,255,0) 13%, rgba(255,255,255,0.5) 24%, rgba(255,255,255,0) 35%, rgba(255,255,255,0.36) 60%, rgba(255,255,255,0.5) 70%, rgba(255,255,255,0) 86%, rgba(255,255,255,0.5) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(232,243,255,1) 4%,rgba(255,255,255,0) 13%,rgba(255,255,255,0.5) 24%,rgba(255,255,255,0) 35%,rgba(255,255,255,0.36) 60%,rgba(255,255,255,0.5) 70%,rgba(255,255,255,0) 86%,rgba(255,255,255,0.5) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(232,243,255,1) 4%,rgba(255,255,255,0) 13%,rgba(255,255,255,0.5) 24%,rgba(255,255,255,0) 35%,rgba(255,255,255,0.36) 60%,rgba(255,255,255,0.5) 70%,rgba(255,255,255,0) 86%,rgba(255,255,255,0.5) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8f3ff', endColorstr='#80ffffff',GradientType=1 ); /* IE6-9 */
}
img.gra{position: absolute;
    width: 163px;
    height: 230px;
    z-index: 10;
    top: 31px;
    right: 30%;
    margin: 0 auto;
    left: 27%;
    padding: 0;}
@media(max-width:720px){
	img.gra{width:150px;}
}

.cupchart {
                width: 250px;
                height: 230px;
                display:inline-block;
				box-shadow:0 0 0 transparent;
            }  
.cupchart::before{    content: url(../images/bcup3.svg);
    position: absolute;
    left: 27%;
    right: 30%;
    width: 168px;
    z-index: 10;
    top: 61px;}
@media(min-width:1200px){	
	.cupchart::before{left:26%;}
}
@media (max-width: 1199px) and (min-width: 992px){
	.cupchart::before{left:21%;}
}
@media(max-width:519px){
	img.gra{width:130px;}
	.cupchart::before{left:27%;}
}
@media (width: 767px){	
	.cupchart::before{left:31%;}
}
@media (max-width: 766px) and (min-width: 751px){	
	.cupchart::before{left:32%;}
}
@media (max-width: 750px) and (min-width: 650px),(max-width: 649px) and (min-width: 520px),(max-width: 578px) and (min-width: 563px){	
	.cupchart::before{left:31.5%;}
}
@media (max-width: 577px) and (min-width: 573px){
	.cupchart::before{left:30.5%;}
}
/*2018-08-29 新增置中的CSS屬性*/
.jq22-container{
    margin:0 auto;
}
td 
{
    text-align: center; 
    vertical-align: middle;
}
/*2018-09-26 新增自製彈跳視窗樣式*/
        .DraggableDiv {
            position: absolute;
            z-index: 500;
            background-color: #f1f1f1;
            text-align: center;
            border: 1px solid #d3d3d3;
            width:95%;
            max-width:800px;
        }

        .mydivheader {
            padding: 10px;
            cursor: move;
            z-index: 10;
            background-color: #2196F3;
            color: #fff;
        }

        .BtnClose{
            height: 25px;
            width: 25px;
            background-color: #0275d899;
            border-radius: 50%;
            display: inline-block;
            float: right;
            cursor: pointer;
        }
          
        .BtnClose:after{
            content: "\00d7";
        }

        
/* .wbg1 紅底色 最嚴重警戒*/
.wbg1{background: #ff708f; /* Old browsers */
background: -moz-linear-gradient(top, #ff708f 15%, #ff424d 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ff708f 15%,#ff424d 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ff708f 15%,#ff424d 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff708f', endColorstr='#ff424d',GradientType=0 ); /* IE6-9 */}
/* .wbg2 橙底色 次級警戒*/
.wbg2{background: #fcca88; /* Old browsers */
background: -moz-linear-gradient(top, #fcca88 15%, #fd7247 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #fcca88 15%,#fd7247 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #fcca88 15%,#fd7247 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcca88', endColorstr='#fd7247',GradientType=0 ); /* IE6-9 */}
/* .wbg3 黃底色 較輕警戒*/
.wbg3{background: #f9f09a; /* Old browsers */
background: -moz-linear-gradient(top, #f9f09a 15%, #ffd247 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f9f09a 15%,#ffd247 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f9f09a 15%,#ffd247 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f09a', endColorstr='#ffd247',GradientType=0 ); /* IE6-9 */}

table.weather{/*font-size:18px;*/font-weight:bold;}
.wT{ padding: 0px; height: 60px;}
.w1{background: url(../images/w1.svg) no-repeat 5px 5px;}
.w2{background: url(../images/w2.svg) no-repeat 5px 5px;background-color: rgba(0,0,0,0.3);}
.w3{background: rgba(0,0,0,0.3) url(../images/w3.svg) no-repeat 5px 5px;}
.w4{background: rgba(0,0,0,0.3) url(../images/w4.svg) no-repeat 5px 5px;}
.wbg1 .w2{background: rgba(0,0,0,0.3) url(../images/w6.svg) no-repeat 5px 0;}
.wbg2 .w2,.wbg3 .w2,.wbg4 .w2{background: rgba(0,0,0,0.3) url(../images/w6.svg) no-repeat 5px 0;}
.wbg2 .w3,.wbg3 .w3,.wbg4 .w3{background: rgba(0,0,0,0.3) url(../images/w7.svg) no-repeat 5px 0;}
.wbg2 .w4,.wbg3 .w4,.wbg4 .w4{background: rgba(0,0,0,0.3) url(../images/w8.svg) no-repeat 5px 0;}
.wbg{background:#C6E3FF;}
.wbg .w1,.wbg .w2,.wbg .w3,.wbg .w4{background-color: #C6E3FF}
.wbg1 .w1,.wbg2 .w1,.wbg3 .w1{background-color: rgba(0,0,0,0.3);}
.wbg1 .wCnt,.wbg2 .wCnt,.wbg3 .wCnt{background:transparent;}
.card.red table.weather th, .card.red table.weather td{border:0;}
.card.red table td.wbg{border:0;}
.card.red table.weather tr:hover{background:transparent;}
.wCnt{background:#e6e6e6; padding: 0px; height: 80px;line-height:1rem}
.TableDivText{color:#7996B2;}
.wbg1 .TableDivText,.wbg2 .TableDivText,.wbg3 .TableDivText{color:rgba(0,0,0,0.5);}
.TableDivTextTitle{    color: rgba(0,0,0,0.5);
    text-align: right;
    padding: 22px 12%;
    line-height: 1rem;}
.wbg1 .TableDivTextTitle,.wbg2 .TableDivTextTitle,.wbg3 .TableDivTextTitle{color:#fff;}

.MapCanvas {
z-index:200;
}
@media (max-width: 1199px){
    .navbar-toggleable-lg .navbar-nav .dropdown-menu {
        position: absolute;
        float: none;
    }
}

@media (max-width: 767px) {
    .navbar-nav .open .dropdown-menu {
    position: static !important;
    float: none;
    width: auto;
    margin-top: 0;
    /* background-color: transparent; */
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

}
