@charset "utf-8";
/* CSS Document */

/* ---------------------共用設定開始------------------------*/

*{box-sizing: border-box;}

html , body{
	width: 100%;
	height: 100%;
	-webkit-text-size-adjust:none;
}

body{
	-webkit-font-smoothing: antialiased;
	-webkit-overflow-scrolling: touch;
	font-family:微軟正黑體, Arial, Helvetica, sans-serif;
	line-height: 1.8;
}

.clear{	
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

#gotop,#mobile-gotop{
	cursor: pointer;
	display: none;
}
#gotop{
	position: fixed;
	right: 10px;
	bottom: 35px;
	width: 50px;
	line-height: 40px;
	height: 40px;
	text-align: center;
	background: #474747;
	border-radius: 5px;
}
a, a:hover{
	transition: all 0.5s ease;
}
.container-fluid{
	padding: 0;
	position: relative;
	background: #fff;
}
.container-fluid>img{
	width: 50%;
	max-width: 250px;
	position: absolute;
	left: 20px;
	top: 20px;
	z-index: 800;

}

footer{
	color: #eee;
	background: #474747;
	padding: 15px 10%;
}
.row{
	margin: 0;
}
ul{
	padding: 0;
	margin-bottom:0;
}
li{
	list-style: none;
}
.panel{
	margin-bottom: 15px;
}
.panel:last-child{
	margin-bottom: 0;
}
.btn-success{
	background-color: #32ABA8;
	border: none;
}
.btn-success:hover{
	background: #177373;
}
.table-responsive{
	-webkit-overflow-scrolling: touch;
}
h4{
	margin: 0;
}
/* ---------------------header開始------------------------*/
.navbar-collapse{
	padding: 0;
}
header{
	text-align: center;
	padding: 10px 0;
	position: relative;
	background: url(../images/header-bg.png);
}
}
header .title,header .main{
	display: inline-block;
}
header .id{
	position: absolute;
	right: 25px;
	bottom: 10px;
	font-size: 16px;
}
header img.title{
	width: 30%;
	max-width: 365px;
}
header img.main{
	width: 100%;
	max-width: 183px;
}
.navbar-right{
	margin:5px 5% 0 0;
}
#main-menu{
	background: #1c77b6; /* Old browsers */
	background: -webkit-linear-gradient(left, #1c77b6 0%,#1d9d72 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #1c77b6 0%,#1d9d72 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	width: 100%;
	text-align: center;
}
#main-menu ul{
	width: 100%;
}
#main-menu li{
	float: initial;
	display: inline-block;
	position: relative;
}
#main-menu li.now:before{
	content: "";
	display: block;
	width: 100%;
	height: 5px;
	background: #EB6161;
	position: absolute;
	bottom: -5px;
	left:0;
	z-index: 900;
}
#main-menu a{
	color: #fff;
	font-size: 16px;
}
#main-menu a:hover,ul#main-menu a:focus{
	background: #166D7A;
}
.infotext{
	font-weight: bold;
	color: #333;
	margin-top: 20px;
}
/*-----------------------左側選單開始----------------------------*/
nav.left-box{
	width: 280px;
	position: absolute;
	left: 0;
	top: 0;
	padding: 25px;
}
nav.left-box>div{
	width: 100%;
	padding: 8px;
	border-radius: 8px;
	box-shadow: 0 0 8px #888;
}
nav.left-box>div.function{
	width: 28px;
	height: 75px;
	position: absolute;
	right: 0;
	top: 100px;
	background: #fff;
	border-radius: 0 6px 6px 0;
	box-shadow: 2px 0 4px #777;
	cursor: pointer;
}
nav.left-box>div.function:hover i{
	color: #EB6161;
}
nav.left-box>div.function i{
	color: #666;
	margin-left: 3px;
}
nav.left-box .panel-heading{
	padding: 0;
}
nav.left-box .panel-title a{
	display: block;
	padding: 20px 15px;
	background: #1D8E8E;
	color: #fff;
	font-weight: normal;
}
nav.left-box .panel-body{
	padding: 0;
}

nav.left-box a{
	position: relative;
	font-weight: bold;
	font-size: 16px;
}
nav.left-box a:hover,nav.left-box a:focus{
	text-decoration: none;
}
nav.left-box .panel-body a{
	display: block;
	padding: 10px 15px;
	background: #ececec;
	color: #666;
	font-size: 15px;
	border-bottom: 1px solid #fff;
}
nav.left-box .panel-body a:hover{
	background: #fff;
}
nav.left-box a.collapsed{
	display: block;
	padding: 20px 15px;
	background: #27AD9F;
	font-size: 16px;
	color: #fff;
	border-bottom: 1px solid #fff;
}
nav.left-box a i{
	position: absolute;
	color: #1D8E8E;
	right: 15px;
	top: 50px;
	margin-top: -30px;
}
nav.left-box a.collapsed i{
	color: #fff;
}
/*-----------------------右側內頁開始----------------------------*/
.right-box{
	width: auto;
	margin-left: 280px;
	padding: 25px 40px 25px 20px;
}
h1{
	font-size: 28px;
	position: relative;
	background: url(../images/title-bg.gif) repeat-x left 5px;
	margin-bottom: 20px;
}
h1:before{
	content: "";
	display: block;
	position: absolute;
	border-radius: 5px;
	background: -webkit-linear-gradient(top, #1c77b6 0%,#1d9d72 100%);
	background: linear-gradient(to bottom, #1c77b6 0%,#1d9d72 100%);
	width: 10px;
	height: 30px;
	left: 0;
}
h1 span{
	display: inline-block;
	background: #fff;
	padding: 0 25px;
}
h2{
	color: #1D8E8E;
	font-size: 20px;
	font-weight: bold;
}
.nav-tabs{
	border-bottom: none;
}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus{
	background: #EB6161;
	border: none;
	color: #fff;
	text-align: center;
}
.nav-tabs>li>a{
	border-radius: 5px;
	font-size: 16px;
	border: none;
	color: #fff;
	background: #A0A2A2;
	text-align: center;
}
.nav-tabs>li>a:hover{
	background: #666;
}

.tab-content{
	padding: 30px 0;
}
#t1 p {
	font-weight: bold;
	color: #333;
}
#t1 p span{
	font-size: 18px;
	color: #E27679;
}
.button-group{
	text-align: center;
	margin-top: 20px;
}
.button-group button{
	display: inline-block;
}
/* ---------------------登入頁開始------------------------*/
.login button{
	display: inline-block;
	width: 48%;
	background: #1c77b6; /* Old browsers */
	background: -webkit-linear-gradient(left, #1c77b6 0%,#1d9d72 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #1c77b6 0%,#1d9d72 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	color: #fff;
	border: none;
	font-size: 18px;
}
.login button:hover{
	background: #055daa; /* Old browsers */
	background: -webkit-linear-gradient(left, #055daa 0%,#087a45 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #055daa 0%,#087a45 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	color: #fff;
}
.login button:last-child{
	margin-left: 2%;
}
.login .row *{
	margin-bottom: 15px;
}
.login .row .title img{
	width: 100%;
	max-width: 505px;
	margin-bottom: 40px;
}
.login .row img{
	width: 100%;
	max-width: 550px;
}
.login .row form{
	padding-right: 30%;
}
.login{
	background: url(../images/login-bg.png) no-repeat right top;
	background-size: cover;
	height: 100%;
}
.login>div{
	margin-top: 10%;
	height: 570px;
}
.login footer{
	position: fixed;
	bottom: 0;
	width: 100%;
}
/*----------------------區塊設計------------------------*/
.box{
	background: #CEECDB;
	border-radius: 10px;
	padding: 20px 20px 10px 20px;
}
.box select{
	display: inline-block;
	width: 33%;
}
.box .form-group>div{
	vertical-align: middle;
}
.box .form-group div:nth-child(odd){
	font-size: 17px;
	color: #1D8E8E;
	text-align: right;
}
.box span.now{
	display: inline-block;
	background: #FC8C49;
	color: #fff;
	border-radius: 20px;
	padding: 0 15px;
}
/* ---------------------表格共用------------------------*/
.table{
	margin-bottom: 0;
}
.table tr:nth-child(odd){
	background: #ececec;
}
.table a{
	text-decoration: underline;
}
.table .form-control{
	display: inline-block;
	width: auto;
	margin: 3px 0;
}
.page{
	text-align: center;
}
.page select{
	display: inline;
	width: 80px;
}
.table span.mode1{color: #D56C0F; font-weight: bold;}
.table span.mode2{color: #B1334A; font-weight: bold;}
.table span.mode3{color: #177373; font-weight: bold;}
.table span.notice{
	color: #E07272;
	font-weight: bold;
}

/* ---------------------左右版表格------------------------*/

.table1>tbody>tr>td:first-child,.table1>tbody>tr>td:nth-child(3){
	background: #DB83AE;
	color: #fff;
	font-size: 16px;
}
.table1 i.fa-calendar-alt{
	color: #D95E61;
	margin:5px;
	cursor: pointer;
}
.table1 span{
	color: #FFF259;
}
.table1>tbody>tr:first-child th{
	background: #5395D1;
	color: #fff;
	font-weight: normal;
}
/* ---------------------上下版表格------------------------*/
.table2{
	background: #fff;
}
.table2 tr:first-child td{
	background: #DB83AE;
	color: #fff;
	font-size: 16px;
}
/* ---------------------表格內上下表格------------------------*/
.table3 {
	border: 2px solid #ccc;
}
.table3 tr:first-child>td{
	background:#E07272; 
	color: #fff;
}
.table3 tr:nth-child(odd){
	background: #F3F3F3;
}
/*-----------------------儀表版開始---------------------------*/
.board-con{
	background: #F0F0F0;
}
.board-con .row{
	width: 85%;
	max-width: 1100px;
	margin: 0 auto;
}
.board #main-menu{
	background: #666;
	color: #fff;
}
.board #main-menu ul{
	display: inline-block;
	width: 85%;
	text-align: left;
	float: initial;
	line-height: 45px;
	font-size: 16px;
	max-width: 1100px;
}
.board header img.title{
	width: 30%;
	max-width: 200px;
}
.board header img.main{
	width: 100%;
	max-width: 150px;
}
.board #main-menu ul li.navbar-right{
	margin: 0;
}
.board #main-menu ul li.navbar-right a{
	background: #1c77b6; /* Old browsers */
	background: -webkit-linear-gradient(left, #1c77b6 0%,#1d9d72 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #1c77b6 0%,#1d9d72 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	line-height: 45px;
	padding: 0 20px;
}
.board #main-menu ul li.navbar-right a:hover{
	background: #207965;
}
.board-con{
	padding: 30px 0;
	font-size: 16px;
	font-weight: bold;
	letter-spacing: 1px;
}
.board-con .board-box{
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 0 10px #aaa;
	height: 350px;
	margin-bottom: 20px;
	position: relative;
}
.board-box>span{
	display: block;
	color: #fff;
	border-radius: 5px 5px 0 0;
	padding: 12px 20px;
	position: relative;
}
.board-box>span a{
	display: block;
	width: 15px;
	height: 15px;
	position: absolute;
	right: 10px;
	top: 8px;
	color: #fff;
}
.board-box span a:hover{
	color: #FFF759;
}
.board-con .board-box.b1>span{background: #43A775;}
.board-con .board-box.b2>span{background: #E78657;}
.board-con .board-box.b3>span{background: #4482B7;}
.board-con .board-box.b4>span{background: #8A75B6;}
.board-con .board-box.b5>span{background: #549BB2;}
.board-con .board-box.b6>span{background: #DA6572;}
.board-con .board-box.b7>span{background: #8A75B6;}
.board-con .board-box.b8>span{background: #DB6AA7;}
.board-con .board-box.b9>span{background: #609436;}

.board-con .board-box.b1 ul{
	padding: 15px;
	height: 100%;
}
.board-con .board-box.b1 ul li{
	margin-bottom: 7px;
}
.board-con .board-box.b1 ul li a{
	display: block;
	background: #C8EDF0;
	color: #333;
	position: relative;
	padding: 0 20px;
	border-radius: 5px;
	font-weight: bold;
	line-height: 63px;
}
.board-con .board-box.b1 ul li a:hover{
	text-decoration: none;
	background: #3CBFCA;
	color: #fff;
}
.board-con .board-box.b1 ul li a i{
	position: absolute;
	right: 15px;
	top: 50%;
	margin-top: -8px;
	color: #666;
}
.board-con .board-box.b2 h5{
	color: #E78657;
	font-size: 18px;
	padding: 0 0 0 20px;
	margin: 30px 0 0 0;
	font-weight: bold;
}
.board-con .board-box.b2 ul{
	padding: 10px 20px 20px 20px;	
}
.board-con .board-box.b2 ul li{
	border-bottom: 1px dashed #C3C3C3;
	line-height: 75px;
}
.board-con .board-box.b2 ul li:last-child{
	border: none;
}
.board-con .board-box.b2 ul li span{
	font-size: 24px;
	color: #E06A62;
}

.board-con .board-box.b3 .calendar{
	padding: 20px;
}
.board-con .board-box.b3 .calendar p{
	font-size: 24px;
	color: #4482b7;
}
.board-con .board-box.b3 .calendar p span{
	border-left: 1px solid #4482b7;
	padding: 0 15px;
	margin-left: 10px;
}
.board-con .board-box.b3 .calendar .table td{
	color: #999;
	text-align: right;
}
.board-con .board-box.b3 .calendar .table tr td:first-child,.board-con .board-box.b3 .calendar .table tr td:last-child{
	color: #CD6767;
}
.board-con .board-box.b3 .calendar .table tr:nth-child(odd){
	background: #fff;
}
.board-con .board-box.b3 .calendar .table th,.board-con .board-box.b3 .calendar .table{
	border:none;
	color: #333;
}
.board-con .board-box.b3 .calendar .table td.today{
	color: #00642B;
	background: #E8FDE7;
	font-size: 22px;
	line-height: 18px;
	font-weight: normal;
}
.board-con .board-box p{
	padding:10px 0 0 20px;
	line-height: 30px;
	margin-bottom: 0;
	text-align: left;
} 
.board-con .board-box p span{
	font-size: 24px;
	color: #E06A62;
}
.board-con .board-box.b4 div{
	text-align: center;
}
.board-con .board-box.b4 img{
	width: 192px;
	margin: 0 auto;
}
.board-con .board-box.b5 div{
	padding: 10px;
}
.board-con .board-box.b6 div{
	
}
.board-con .board-box.b7 ul{
	width: 100%;
	padding: 20px;
}
.board-con .board-box.b7 ul li{
	display: inline-block;
	width: 17%;
	margin: 0 2.5%;
}
.board-con .board-box.b7 ul li img{
	width: 100%;
	max-width: 60px;
}
.board #main-menu li{
	border-bottom: none;
}
.items{
	padding: 0 20px;
	margin-top: -15px;
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 10px;
}
.items li{
	width: 50%;
	float: left;
	font-size: 14px;
	line-height: 20px;
}
.items.long li{
	width: 100%;
}
.items li span{
	display: inline-block;
	font-size: 30px;
	vertical-align:top;
}
/*----委辦案件計畫比例圖----*/

#pieChart .highcharts-button,.highcharts-credits{
	display: none!important;
}
#pieChart .highcharts-color-0,.highcharts-color-0 rect{
	fill: #F8565A;
}
#pieChart .highcharts-color-1,.highcharts-color-1 rect{
	fill: #46BFBD;
}
#pieChart .highcharts-color-2,.highcharts-color-2 rect{
	fill: #FDB45C;
}
#pieChart .highcharts-color-3,.highcharts-color-3 rect{
	fill: #4D5360;
}

text{
	font-size: 16px!important;
	font-family:微軟正黑體, Arial, Helvetica, sans-serif;
	font-weight: normal;
}
.highcharts-yaxis .highcharts-axis-line {
	stroke-width: none;
}
.highcharts-root{
	width: 100%;
	height: 290px;
}
#pieChart .highcharts-legend{
	display: none;
}
/*-----------進度達成率/計畫經費執行分析------------*/
#lineChart .highcharts-background,#lineChart1 .highcharts-background{
	fill: none;
}

#lineChart .highcharts-legend,#lineChart1 .highcharts-legend{
	display: none;
}
#lineChart .highcharts-legend-item,#lineChart1 .highcharts-legend-item{
	display: inline-block;
}
#lineChart .highcharts-legend-item text,#lineChart1 .highcharts-legend-item text{
	font-size: 14px!important;
}
#lineChart .highcharts-root,#lineChart1 .highcharts-root{
	padding: 15px;
}
#lineChart .highcharts-data-label,#lineChart1 .highcharts-data-label{
	display: none;
}
#lineChart .highcharts-root,#lineChart1 .highcharts-root{
	height: 330px;
}
#lineChart .highcharts-grid{
	height: 200px;
}
#lineChart .highcharts-button-symbol,#lineChart1 .highcharts-button-symbol{
	display: none;
}

#left-menu > .navbar-nav{
    transition: 0.5s;
}