@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);  /*ΆΒΕι‘]«δ·½ΆΒΕι*/
@import url('bureau.css');
@import url('icons.css');
@import url('page.css');
@import url('padding.css');
@import url('basic.css');
@import url('form.css');

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}





body {
	margin: 0;
	padding: 0;
	font-size: 15px;
	color: #333333;
	background-color: #F5F5F5;
	line-height: 1.7;
	font-family: Arial, "Microsoft JhengHei UI", "Microsoft JhengHei", "HeiTi TC", sans-serif;
}






#container { width: 90% \9 }
@media only screen and (min-width: 200px) { 
#container { width: 98% ;font-size: 13px;}

.padding{
	padding: 10px;
}

}
@media only screen and (min-width: 900px) { 
#container { width: 96% ; font-size: 13px;}


.padding{
	padding:15px;
}

}

@media only screen and (min-width: 1300px) { 
    #container { width: 94%;font-size: 14px; }

.padding{
	padding: 20px;
}

}
@media only screen and (min-width: 1600px) { 
#container { width: 84%;font-size: 15px;}
	
.padding{
	padding-top: 40px;
	padding-right: 40px;
	padding-bottom: 40px;
	padding-left: 40px;
}
	

}






/* Header */
#container {
	margin-top: 0px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0px;

}



#header {
	width: 100%;
	padding-bottom: 10px;
	text-align: left;
	float: left;
}
.top {
	width: 100%;
	float: left;

}


.logo{	
    width: 52%;
	padding-top:1%;
	float: left;
	color: #333333;
	letter-spacing: 1px;
	text-shadow: 0.1px 1px 2px #ccc;

	}
	
.logo-img{	
    width: 15%;
	max-width: 110px;
	min-width: 90px;
	padding-right:12px;
	float: left;}	
	
.logo-text{
	width: calc(100% - 15%);
	padding-top:18px;
	font-size: 18px;
	line-height:1.3;
	font-family: "Microsoft Yahei", MyTitleChinese, sans-serif;
}		
.logo-text span{
	display:block;
	font-size: 22px;
    font-weight: 600;
}	
	
	
		
.top-img{
	float: left;
	width: 48%;
	height: 116px;
	position:relative;
	}



.top-img img{
position:absolute;
bottom:0px;
right:0px;

}



#menu  {
	width: 100%;
	float: left;
	height: 45px;
	text-align: left;
	padding-left: 20px;
	padding-right: 20px;
	border-radius: 8px;
	background-image: linear-gradient(to top, #3C7CBD 0%, #659ACF 100%);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);
	-moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);
	-o-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);


}
#menu ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	display:flex;

}
#menu ul li {
	margin: 0px;
	list-style-type: none;
	flex: 1;


}
#menu ul li a {
	text-decoration: none;
	padding: 10px;
	display: block;
	color: rgba(255,255,255,0.8);
	text-align: center;
	letter-spacing: 1px;
	font-weight: bold;
}
#menu ul li a:hover {
	color: #FFFFFF;
	height: 25px;


}
#menu ul li a.current{
	color: #FFFFFF;


}


#search {
	height: 37px;
	width: 270px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	float: left;

}

#search input{
	height: 25px;
	border: 0px solid #FFFFFF;
	background-image: url(../images/search-bg.jpg);
	background-repeat: repeat;
	background-position: center center;
	width: 170px;
	padding-top: 10px;
	float: left;
	padding-left: 20px;
	padding-bottom: 2px;
	color: #4073C6;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;


}




/* content */

#master{
	width: 100%;
	float: left;

}

#master-main{
	width: 100%;
	float: left;
	border-radius: 8px;
	overflow: hidden;
	background: #FFFFFF;
	background-image: linear-gradient(to top, #EEEEEE 0%, #FFFFFF 100%);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);
	-moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);
	-o-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);

}






#left{
	width: 20%;
	float: left;
	margin: 0px;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;


}


#submenu-title{
	padding-top: 20px;
	padding-bottom: 15px;
	font-size: 24px;
	font-weight: bold;
	padding-right: 10px;
	padding-left: 20px;
	letter-spacing: 1px;
}


#submenu{
	float: left;
	width: 180px;
	text-align: left;
	margin: 0px;
	behavior: url(../js/iepngfix.htc);
	padding-top: 10px;
	padding-right: 10px;
	padding-left: 10px;
	color: #666666;
	line-height: 1.4;

}


#submenu ul{
	list-style-type: none;
	float: left;
	width: 180px;
	margin: 0px;
	padding: 0px;
	padding-bottom: 20px;
}


#submenu ul li{
	width: 180px;
	float: left;
	margin: 0px;
	list-style-type: none;
	padding-top: 3px;
	padding-right: 0px;
	padding-bottom: 3px;
	padding-left: 0px;
}



#submenu ul li a{
	width: 180px;
	float: left;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #888888;
	padding-top: 8px;
	padding-right: 0px;
	padding-bottom: 8px;
	padding-left: 0px;
	color: #333333;

}
#submenu ul li a:hover{
	float: left;
	color: #008C46;
	width: 180px;
}




#submenu ul li a.current{
	color: #1864C0;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #1864C0;
	float: left;
	width: 180px;
	font-weight:bold;
}


#submenu ul li a.current:hover{
	color: #1864C0;
}


#submenu ul li ul{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #666666;
	width: 180px;
	padding-top: 5px;
	padding-bottom: 5px;
	font-weight: normal;

}

#submenu ul li ul li{
	padding-left: 12px;
	width: 168px;
	background-image: url(../images/menu-T.gif);
	background-repeat: no-repeat;

	background-position: left center];
	padding-top: 0px;
	padding-bottom: 0px;
	line-height: 1.6;

}

#submenu ul li ul li a{
	width: 168px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;


}

#submenu ul li ul li a:hover,#submenu ul li ul li a.current{

	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	width: 168px;
	padding: 0px;

}















.submenu{
	margin: 0px;
	padding: 0px;
}

.submenu ul{
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	padding-bottom: 30px;


}

.submenu ul li{
	margin: 0px;
	padding: 0px;
	width:100%;
	display: block;
	padding-top: 15px;
	padding-right: 5%;
	padding-bottom: 15px;
	padding-left: 10%;
	font-weight: bold;
	font-size: 15px;
}





.submenu ul li a{
	color: #000000;
	display: block;
	line-height: 1.5;


}


.submenu ul li i{
	font-size: 36px;
	margin-right: 8%;
	height: 65px;
	width: 65px;
	text-align: center;
	border-radius:10px;
	color:#000000;
	padding: 12px;
	background: #FFFFFF;
	background-image: linear-gradient(to top, #EEEEEE 0%, #FFFFFF 100%);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);
	-moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);
	-o-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13);

}





.submenu ul li a span{
	font-size: 10px;
	display: block;
	color: #666;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-weight: normal;
	text-transform: uppercase;
}


.submenu ul li a:hover, {
	font-weight: bold;
}


.submenu ul li a.current{

	color: #000000;
}



.submenu ul .current i{
	color:#FFFFFF;
	background: #9C1430;
	background-image: linear-gradient(to top, #E75F3D 0%, #EB7B61 100%);

}



.submenu ul li a.current i{
	color:#FFFFFF;
	background: #9C1430;
	background-image: linear-gradient(to top, #E75F3D 0%, #EB7B61 100%);

}








.submenu ul li ul{
	padding-top: 10px;
	padding-bottom: 10px;
	font-weight: normal;

	margin-top: 10px;
	margin-bottom: 5px;
	display:block;
	padding-right: 10%;
}

.submenu ul li ul li{
	padding-left: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	line-height: 1.6;
	font-weight: normal;
	font-size: 15px;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #CCCCCC;
}

.submenu ul li ul li a{



}

.submenu ul li ul li a:hover,.submenu ul li ul .current,.submenu ul li ul li a.current{
	color: #1864C0;
	font-weight: bold;
}



















@media screen and (max-width: 900px) { 



.submenu ul li{
	display: block;
	flex: 1;
	text-align: center;
	padding-top: 0px;
	padding-bottom: 10px;
}




.submenu ul li i{
	display: block;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 10px;

}



}












#content{
	float: left;
	width: 80%;
	padding: 20px;
	min-height:450px;
}

#content1{
	float: left;
	width: 80%;
	padding: 20px;
	min-height:450px;
}




#main{
	margin: 0px;
	padding-top: 20px;
	float: left;
	width: 100%;

}
h1{
	font-size: 24px;
	margin: 0px;
	font-weight: normal;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 15px;
	padding-left: 0px;
}

h3{
	font-size: 18px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
	margin-top: 0px;
	margin-right: 30px;
	margin-bottom: 0px;
	margin-left: 0px;
	letter-spacing: 1px;

}
h4{
	font-size: 15px;
	margin: 0px;
	padding: 0px;
}

#main div{
	padding-top: 5px;
	padding-bottom: 5px;

}




#main-menu{
	width: 720px;
	height: 20px;
	letter-spacing: 1px;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
}

#main-menu ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
	float: left;
	height: 21px;
	width: 715px;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #4073C6;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #4073C6;

}
#main-menu ul li {
	float: left;
	list-style-type: none;
	text-align: center;
	margin: 0px;
	padding: 0px;
	width: auto;

}
#main-menu ul li a:link,#main-menu ul li a:visited{
	color: #0066CC;
	text-decoration: none;
	height: 15px;
	width: auto;
	padding-top: 5px;
	float: left;
	background-color: #ECF0F3;
	border-top-width: 1px;
	border-right-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-top-color: #4073C6;
	border-right-color: #4073C6;
	padding-right: 20px;
	padding-left: 20px;

}

#main-menu ul li a:hover {
	text-decoration: none;
	float: left;
	font-weight: bold;
	background-color: #FFFFFF;

}


#main-menu ul li a.current {
	text-decoration: none;
	font-weight: bold;
	background-color: #FFFFFF;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-top-color: #4073C6;
	border-right-color: #4073C6;
	border-bottom-color: #FFFFFF;

}













/* footer */

#footer {
	width: 100%;
	text-align: center;
	line-height: 1.5;
	padding-top: 30px;
	padding-bottom: 30px;
	float: left;
}





#page {
	TEXT-ALIGN: center;
	width: 720px;
	font-size: 13px;
	letter-spacing: 1px;
	margin: 0px;
	padding-top: 10px;
	font-weight: bolder;
	padding-bottom: 10px;
}
#page a {
	PADDING-RIGHT: 3px;
	PADDING-LEFT: 3px;
	PADDING-BOTTOM: 3px;
	PADDING-TOP: 2px;
	TEXT-DECORATION: none;
	font-size: 13px;
	letter-spacing: 1px;
	font-weight: bold;
}
#page a:hover {
	COLOR: #0B9F9F;
}
#page a:active {
}
#page span.current {
	PADDING-RIGHT: 5px;
	PADDING-LEFT: 5px;
	FONT-WEIGHT: bold;
	PADDING-BOTTOM: 2px;
	COLOR: #669900;
	MARGIN-RIGHT: 2px;
	PADDING-TOP: 2px;
	font-size: 16px;
}
#page-focus{
	float: left;
	width: 120px;
	font-size: 13px;
	font-weight: bold;
	letter-spacing: 2px;
	height: 20px;
	padding-top: 10px;
}






.left-icon{
	float: left;
	margin-top: -12px;
	margin-right: 8px;
}
.color-1{
	color: #1864C0;
	font-weight: bold;

}
.color-2{
	color: #DA8025;


}

.color-3{	color: #FF3300;}

.font-15{
	font-size: 15px;
}
.font-18{
	font-size: 18px;
}

/* signin */
#login{
	height: 300px;
	width: 980px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 120px;




}
#signin{
	background-image: url(../images/signin-bg.jpg);
	background-repeat: no-repeat;
	padding-left: 220px;
	padding-top: 20px;
	padding-bottom: 10px;
	color: #1C2835;
	width: 380px;
	height: 190px;



}
#signin h3{
	font-size: 30px;
	color: #2D455F;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: normal;



}
#signin div{
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;




}
#signin input{
	border: 1px solid #FFFFFF;
	font-weight: bold;
	color: #003333;



}






.leftimg {
	float: left;
	border: none;
	margin-right: 30px;
}
.rightimg {
	float: right;
	border: none;
	clip:  rect(auto,auto,auto,auto);
}






.list{
	background-image: url(../images/line.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
	padding-top: 5px;
	padding-bottom: 5px;
	float: left;
	width: 90%;
	font-size: 13px;
	line-height: 1.5;
}
.ps{
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #D56F51;
	color: #D56F51;

}

















.datatable {
	border-collapse: collapse;
	width: 100%;
	margin-bottom: 5px;

}

.datatable th {
	color: #333333;
	background-color:#CCCCCC;
	text-align:center;
	border: 1px solid #CCCCCC;
	font-weight: bold;
	padding: 8px;
	letter-spacing: 1px;


}
.datatable td {
	color: #333333;
	text-align: left;
	background-color: #FFFFFF;
	border: 1px solid #CCCCCC;
	padding: 8px;

}

.datatable tr.altrow  {	background-color: #DFDFE1;}


.datatable-table {
	border-collapse: collapse;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

.datatable-table td {
	height: 20px;
	color: #333333;
	text-align: left;
	background-color: #FFFFFF;
	padding: 10px;
	font-size: 13px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}




/*end table*/








.print{
	text-align: right;
}



legend{

	color: #FFFFFF;
	font-weight: bold;
	background-color: #1864C0;
	letter-spacing: 1px;
	padding-top: 4px;
	padding-right: 15px;
	padding-bottom: 4px;
	padding-left: 15px;
	border-radius:4px;
	margin-left: 5px;
}
fieldset{
	border: 1px solid #1864C0;
	margin-top: 10px;
	margin-bottom: 20px;
	border-radius:4px;
	background-color: #FFFFFF;
	padding: 20px;
}










.title {
	color: #FFFFFF;
	text-shadow: 0 2px 2px rgba(0, 0, 0, .3);
	text-align: center;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
	margin: 0px;
	width: 100%;
	border-radius: 8px 8px 0px 0px;
	background-color:#586481;
	-moz-box-shadow: inset 0 15px 15px -15px rgba(255, 255, 255, .1), 0 0 20px rgba(0, 0, 0, .1);
	-webkit-box-shadow: inset 0 15px 15px -15px rgba(255, 255, 255, .1), 0 0 20px rgba(0, 0, 0, .1);
	box-shadow: inset 0 15px 15px -15px rgba(255, 255, 255, .1), 0 0 20px rgba(0, 0, 0, .1);
	letter-spacing: 3px;
	font-family: 'Noto Sans TC', sans-serif;
	font-weight:400;

}
.box {
	overflow-x: auto;
	width: 100%;
	background: #FFFFFF;
	border-radius: 0px 0px 7px 7px;
	background: #FFFFFF;
	-moz-box-shadow: inset 0 15px 15px -15px rgba(255, 255, 255, .1), 0 0 20px rgba(0, 0, 0, .1);
	-webkit-box-shadow: inset 0 15px 15px -15px rgba(255, 255, 255, .1), 0 0 20px rgba(0, 0, 0, .1);
	box-shadow: inset 0 15px 15px -15px rgba(255, 255, 255, .1), 0 0 20px rgba(0, 0, 0, .1);
	padding: 10px;


}

.selbox{
	overflow: hidden;
	text-overflow : ellipsis ;
	white-space : nowrap ;
	width : 300px ;
}