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

body{
	margin:0 auto;
	font-family: '微軟正黑體','微软雅黑体',Helvetica, STHeiti, Tahoma, Arial, sans-serif;
	font-size: 16px;
}

a{
	color: #000;
}

a:hover{
	color: #000;
}

/*header */
	header{
		max-width: 1220px;
		width: 100%;
		margin: auto;
		padding:40px 10px;
	}

	@media screen and (max-width: 900px){
		header{
			position: fixed;
			height: 80px;
			z-index: 999;
			background: #fff;
			top: 0;
			left:0;
		}
	}

	header .logo{
		margin-right: 20px;
		width: 534px;
		height: 62px;
	}

	@media screen and (max-width: 900px){
		header .logo{
			padding:0;
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			margin: auto;
			padding-left: 30px;
			width: 300px;
		}
	}




	header .logo a{
		display: block;
		background: url(../img/logo.png)no-repeat center;
		background-size: contain;
		overflow: hidden;
		text-indent: -999px;
		width: 534px;
		height: 62px;
	}

	@media screen and (max-width: 900px){
		header .logo a {
			width: 300px;
			margin: auto;
		}
	}


	header h1,header h2{
		display: inline-block;
		vertical-align: middle;
		margin: 0;
	}

	header h2{
		font-size: 30px;
		font-weight: normal;
		position: relative;
		padding-left: 35px;
	}

	@media screen and (max-width: 900px){
		header h2{
			display: none;
		}

	}


	header h2:before{
		content:" ";
		position: absolute;
		display: block;
		width: 1px;
		height: 30px;
		background: #163771;
		position: absolute;
		margin: auto;
		top: 0;
		bottom: 0;
		left: 0;
	}

	header span{
		font-size: 14px;
		display: block;
	}

	.menu-toggle{
		width: 30px;
		height: 30px;
		position: absolute;
		top: 25px;
		left: 20px;
		cursor: pointer;
		display: none !important;
		background: url(../img/menu.png)no-repeat;
		background-size: 30px 30px;
	}

	.menu-toggle.active{
		background: url(../img/close.png)no-repeat;
		background-size: 30px 30px;
	}

	@media screen and (max-width: 900px){
		.menu-toggle{
			display: block !important;
		}
	}

	.menu-mobile{
		width: 100%;
		position: absolute;
		top: 80px;
		left: -100%;
		height: 100vh;
		background: rgba(0,0,0,0.7);
		transition: all 0.5s;
		z-index: 999;
	}

	@media screen and (min-width: 900px){
		.menu-mobile{
			display: none;
		}
	}

	.menu-mobile.active{
		left: 0;
		transition: all 0.5s;
	}

	.menu-mobile>ul{
		max-width:300px;
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		overflow-y:auto;
		background: #fff;
		padding:20px;
		height: 100%;
		list-style: none;
	}

	.menu-mobile>ul>li{
		border-bottom: 2px #DEDEDE solid; 
	}

	.menu-mobile>ul>li >a{
		padding:15px 0;
		display: block;
		color: #000;
	}

	.menu-mobile>ul>li >a.active{
		color: #163771;
	}

/*header */

#wrapper{
	max-width: 1220px;
	margin: auto auto 100px auto;
	width: 100%;
	padding:0 10px;
}

#wrapper:after {
	content: " ";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.kv{
	width: 100%;
	background: url(../img/banner.png)no-repeat center center;
	height: 250px;
	background-size:cover;
}

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

.mobile-title{
	display: none;
	margin: 80px 0 20px 0;
	font-weight: normal;
	font-size: 30px;
	text-align: center;
}

.mobile-title span{
	font-size: 14px;
	display: block;
}

@media screen and (max-width: 900px){
	.mobile-title{
		display:block;
	}
}

aside{
	max-width: 260px;
	width: 100%;
	float: left;
	margin-top: 40px;
}

@media screen and (max-width: 900px){
	aside{
		display: none !important;
	}
}

aside h3{
	background: #163771;
	font-size:18px;
	color: #fff;
	margin: 0;
	padding:15px;
	font-weight: normal;
}

aside ul{
	list-style: none;
	background: #F8F8F8;
	padding:0 10px;
}

aside ul li{
	border-bottom: 2px #DEDEDE solid; 
}

aside ul li:last-child{
	border-bottom: 0;
}

aside ul li a{
	color: #000;
	padding:15px;
	display: block;
}

aside ul li a:hover{
	color: #163771;
	text-decoration: none;
}

aside ul li a.active{
	color: #163771;
}

footer{
	box-shadow: 0 0 5px rgba(0,0,0,0.5);
	padding:20px 10px ;
}

footer p,footer a{
	display: inline-block;
	font-size: 14px;
	color: #000;
	margin: 0;
}

footer a{
	padding:0 10px;
}

#wrapper > article{
	width: calc( 100% - 260px);
	float: right;
	margin-top: 40px;
	padding-left: 55px;
}

@media screen and (max-width: 900px){
	#wrapper > article{
		width: 100%;
		padding:0;
	}
}

#wrapper > article >h1{
	font-size: 36px;
	font-weight: normal;
	margin: 0 0 30px 0;
}

table.list{
	width: 100%;
}

table.list thead{
	background: #163771;
	color: #fff;
	border-top: 1px #fff solid;
}

table.list thead th{
	padding:10px 0;
	text-align: center;
	border-right: 1px #fff solid;
}

table.list thead th:last-child{
	border-right: 0;
}

table.list tbody tr:nth-child(even){
	background: #ECECEC;
}

table.list tbody tr td{
	text-align: center;
	padding:10px 10px;
}

table.list tbody tr td:nth-child(2){
	text-align: left;
}

table.list tbody tr td.download a{
	text-align: left;
}

@media screen and (max-width: 767px){
	table.list tbody tr td.download font{
		text-align:center;
	}
}

table.list tbody tr td.download i.icons{
	position: absolute;
	top: -2px;
	left:0;
}

table.list tbody tr td font{
	display: none;
	width: 6em;
	float: left;
	background: #163771;
	color: #fff;
}

table.list tbody tr td a{
	color: #000;
	display: block;
}

table.list tbody tr td ul{
	list-style: none;
	margin: 0;
}

table.list tbody tr td ul li{
	margin: 5px 0;
	position: relative;
}

table.list tbody tr td ul a.file{
	position: relative;
	padding-left: 30px;
}

table.list.link tbody tr td a{
	display: block;
}

@media screen and (max-width: 767px){
	table.list thead{
		display: none;
	}

	table.list,table.list tbody,table.list tbody tr,table.list tbody tr td{
		width: 100%;
		display: block;
	}

	table.list tbody {
		border-top: 1px #fff solid;
	}

	table.list tbody tr{
		border-bottom: 2px #DEDEDE solid;
	}

	table.list tbody tr td:after {
		content: " ";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
	}

	table.list tbody tr td{
		padding:0;
		display: flex;
		text-align: left;
	}

	table.list tbody tr td font{
		display:flex;
  		align-items:center;
  		justify-content:center;
	}

	table.list tbody tr td ul{
		width: calc( 100% - 6em);
		float: left;
  		padding:10px ;
	}

	table.list tbody tr td span{
		width: calc( 100% - 6em);
		float: left;
  		padding:10px ;
	}

	table.list tbody tr td span.no-file{
		padding: 0;
	}

	table.list.link tbody tr td a{
		width: calc( 100% - 6em);
		float: left;
		padding:10px ;
	}
}

.article-title{
	width: 100%;
	background: #163771;
	font-size: 20px;
	padding:10px 20px;
	font-weight: normal;
	color: #fff;
	margin: 0;
}

.content{
	padding:20px;
}

.content ul{
	padding-left: 30px;
}

.content ul li{
	line-height: 30px;
}

ul.decima{
	list-style: decimal;
}

ul.cjk{
	list-style-type: none;
}

ul.cjk li{
	counter-increment: L1;
    margin-bottom: 1em;
    text-indent: -2em;
}

ul.cjk li:before{
    content: counter(L1, cjk-ideographic) "、";
}

ul.cjk>li>ol{
	list-style-type: none;
	margin-left: 30px;
}

ul.cjk>li>ol>li{
	counter-increment: L2;
    text-indent: -2em;
}

ul.cjk>li>ol>li:before{
    content: "(" counter(L2, cjk-ideographic) ") ";
}

ul.link{
	padding-left: 0;
	list-style: none;
	width: 100%;
}

ul.link a,ul.link span{
	display: block;
	position: relative;
	padding:5px 50px 5px 10px;
}

ul.link li:nth-child(1){
	background: #163771;
	color: #fff;
}


ul.link li:nth-child(even){
	background: #ECECEC;
}

ul.link i{
	width: 50px;
	height: 100%;
	position: absolute;
	top:0;
	right: 0;
}

ul.link span i{
	background: transparent;
	font-style: inherit;
	line-height: 40px;
	border-left: 1px #fff solid;
}

/*icon*/
	.icons{
		width: 25px;
		height: 25px;
		display: inline-block;
	}

	.icons.icons-file-pdf{
		background: url(../img/pdf.png)no-repeat center center;
		background-size: 20px 20px;
	}

	.icons.icons-file-mp4,.icons.icons-file-wmv,.icons.icons-file-video{
		background: url(../img/video.png)no-repeat center center;
		background-size: 20px 20px;
	}

	.icons.icons-file-ppt{
		background: url(../img/ppt.png)no-repeat center center;
		background-size: 20px 20px;
	}

	.icons.icons-file-zip{
		background: url(../img/zip.png)no-repeat center center;
		background-size: 20px 20px;
	}

	.icons.icons-file-xls,.icons.icons-file-xlsx{
		background: url(../img/xls.png)no-repeat center center;
		background-size: 20px 20px;
	}

	.icons.icons-file-url{
		background: url(../img/url.png)no-repeat center center;
		background-size: 23px 23px;
	}

	.icons.icons-file-rar{
		background: url(../img/rar.png)no-repeat center center;
		background-size: 20px 20px;
	}

	.icons.icons-file-doc,.icons.icons-file-docx{
		background: url(../img/rar.png)no-repeat center center;
		background-size: 20px 20px;
	}
/*icon*/