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

	body{
	font-family:"微軟正黑體","Myriad Pro","Lucida Sans Unicode", "Lucida Grande", sans-serif;
	letter-spacing:0.05em;
	height: 100%;
	width: 100%;
	background-image: url(../images/bg.jpg);

	}
	a{
		color: black;
	}
	#container{
	width: 945px;
	margin: 0px auto;
	position: relative;
	top: -90px;
	min-height: 350px;

	}
	.bxslider{
	width: 100%;
	max-height: 450px;
	float: left;
	position: absolute;
	top: 0;
	z-index: 10;

	}
.bx-wrapper {
margin: 0 auto;
top: -140px;
padding: 0;
position: relative;
}
	.bxslider li{
		width: 100%;
		max-height: 625px;
	}
	.bxslider li img{
		width: 100%;	
	}

	.bxslider .word{
position: absolute;
z-index: 15;
background-color: white;

margin-left: -470px;
bottom: 29px;
left: 50%;
padding: 30px;
width: 200px;
box-shadow:4px 4px 12px 4px rgba(20%,20%,40%,0.5);
	}

	.bxslider .word h1{
	font-size: 40px;
	float: left;
	}
	.bx-wrapper .bx-pager{
		padding-top: 0;
		bottom: 20px;
	}
	.summary{
	font-size: 14px;
	margin-top:20px;
	float: left;
	}
  

	#search{

	}
	#search #form1,.search #form1{
border: 1px solid #b4b4b4;
float: right;
width: 194px;
height: 34px;
padding-left: 9px;
	}
	#search a,.search a{
		height: 34px;
		background-image: url(../images/search.jpg);
		background-repeat: no-repeat;
		width: 36px;
		float: left;
		cursor: pointer;
	}
	#search input,.search input{
border: 0;
float: left;
width: 150px;
height: 34px;padding-left: 8px;
	}
	#container h1{
font-size: 30px;
float: left;
	}
#news{
	float: left;
	width: 464px;
	height: 267px;
	clear: both;
	margin-top: 15px;
}
#news #newstop{
float: left;
width: 90%;
font-size: 20px;
line-height: 23px;
font-weight: bold;	
margin-bottom: 27px;
height: 105px;
}
#news #newstop a{
float: left;

width: 354px;
font-size: 17px;
}
#news #newstop .date{
float: right;
background-image: url(../images/line.jpg);
padding-left: 24px;
width: 28px;
font-size: 14px;
background-repeat: no-repeat;
color: #5d5d5d;
height: 35px;
margin-top: 5px;
}
#news #newstop .date span:first-child{
float: left;
font-size: 12px;
position: relative;
height: 18px;
top: -4px;
}
#news #newstop .date span:last-child{
width: 100%;
position: relative;
float: left;
text-align: center;
top: -5px;
font-weight: bold;
font-size: 16px;
color: black;	
}
#news a:hover{
	color: gray;
}

.news_block{
float: left;
font-size: 15px;
color: #5d5d5d;
width: 90%;
border-bottom: 1px solid #dcdcdc;
padding-bottom: 15px;
padding-top: 15px;

}

#news .news_block a{
	float: left;
	color: #5d5d5d;
	text-overflow: ellipsis;
		   -webkit-transition: all 0.5s ease;
   -moz-transition: all 0.5s ease;
   -o-transition:all 0.5s ease;
   -ms-transition: all 0.5s ease ;
   transition: all 0.5s ease ;
}
#news .news_block a:hover{
	color: #a38804;
}
.news_block .date{
float: right;
font-size: 12px;
color: #292929;
}

.news_block:last-child{
border-bottom: 0;
}

#black_block{
	max-width: 480px;
	float: right;
	height: 455px;
	width: 100%;
	margin-top: 15px;
}


#black_block .block{
background-color: #2e2e2e;
float: left;
border-right: 1px solid white;
width: 49%;
height: 100%;
position: relative;
color: white;
	 -webkit-transition: all 0.5s ease;
   -moz-transition: all 0.5s ease;
   -o-transition:all 0.5s ease;
   -ms-transition: all 0.5s ease ;
   transition: all 0.5s ease ;
}
#black_block .block:hover{
	background-color: #016cb8;
}
#black_block .block h2{
float: left;
margin: 25px;
font-weight: bold;
width: 184px;
line-height: 20px;
min-height: 40px;
}

#black_block .block h3{
	float: left;
	margin: 25px;
	font-weight: bold;
	width: 184px;
	line-height: 20px;
	min-height: 10px;
	font-size: 28px;
}

#black_block .block div{
	float: left;
	font-size: 14px;
	line-height: 19px;
	margin-top: 10px;
	margin-right: 25px;
	margin-bottom: 25px;
	margin-left: 25px;
}
#black_block .block img{
	float: left;
width: 100%;
position: absolute;
bottom: 0;
left: 0;
}
#online{
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition:all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
	background-color: #cfad03;
	float: left;
	width: 481px;
	height: 195px;
	color: white;
	margin-top: 30px;
}
#online:hover{
	/*background-color: white;*/
}
#online:hover .word{
	/*color: #67b220;*/
}
#online a{
	color: white;
}
#online img{
	float: left;
	margin-right: 20px;
}
#online .word{
	float: left;
width: 222px;
margin-top: 53px;
}
#online .word span{
	float: left;
font-size: 14px;
margin-top: 10px;
width: 207px;
line-height: 16px;
}
#online .word h2{
	float: left;
font-size: 30px;
font-weight: bold;
}



#aboutus{
float: left;
width: 464px;
height: 195px;
border-right: 1px solid #c8cacf;
}
#aboutus img{
float: left;
margin: 45px 36px;
}
#aboutus .word{
float: left;
width: 56%;
margin-top: 59px;
	   -webkit-transition: all 0.5s ease;
   -moz-transition: all 0.5s ease;
   -o-transition:all 0.5s ease;
   -ms-transition: all 0.5s ease ;
   transition: all 0.5s ease ;
}
#aboutus .word:hover,#video .word:hover{
color: #066db5;	
}
#aboutus .word span{
	float: left;
font-size: 12px;
margin-top: 10px;
color: #5d5d5d;
line-height: 16px;
}
#aboutus .word h2{
float: left;
font-size: 17px;
font-weight: bold;
}


#video{
float: left;
width: 471px;
height: 195px;
}
#video img{
float: left;
margin:28px 36px;
}
#video .word{
float: left;
width: 56%;
margin-top: 59px;
	   -webkit-transition: all 0.5s ease;
   -moz-transition: all 0.5s ease;
   -o-transition:all 0.5s ease;
   -ms-transition: all 0.5s ease ;
   transition: all 0.5s ease ;
}
#video .word span{
	float: left;
font-size: 12px;
margin-top: 10px;
color: #016cb8;
line-height: 16px;
}
#video .word h2{
float: left;
font-size: 17px;
font-weight: bold;

}




@media screen and (max-width: 1024px) {
#foot_right .btn img:last-child{
opacity: 1 !important;
}
#foot_right .btn img:first-child{
opacity: 0 !important;
}
#menu{
	display: none;
}	
#menu_mobile{
	display: block;
	position: relative;
	float: left;
	width: 100%;
}
.bx-wrapper{
top: 0;
float: left;
width: 90%;
margin: 0 5%;
}

#top_link{
float: left;
width: 90%;
position: relative;
margin: 0 5%;
}
#top_link #home{
float: left;
margin: 20px 50px 20px 0;
}

#top_link #search{
float: right;padding-left: 9px;
border:1px solid #b4b4b4;
margin-top: 35px;
}
#top_link .toggle{
float: right;
margin-top: 38px;
cursor: pointer;
margin-left: 10px;
}
#container{
	float: left;
	top:0;
	width: 90%;
margin: 30px 5% 0;
}
#container h1{
	font-size: 19px;
}
#container #search{
	display: none;
}
#menu_mobile #nav{
float: left;
width: 90%;
margin: 10px 5%;

}
#menu_mobile #nav span{
float: left;
width: 32.5%;
height: 65px;
background-color: red;
line-height: 65px;
text-align: center;
}

#menu_mobile #nav span a{
	color: white;
	float: left;
	width: 100%;
	height: 100%;
}
#menu_mobile #nav .m01{background-color: #cfad03}
#menu_mobile #nav .m02{background-color: #a60175}
#menu_mobile #nav .m03{background-color: #67056e}
#menu_mobile #nav .m04{background-color: #284591}
#menu_mobile #nav .m05{background-color: #05b4d5}
#menu_mobile #nav .m06{background-color: #5a9d1d}
#menu_mobile #nav .search{display: none;}

.bxslider .word{
left: 0;
margin: 3%;
padding: 2%;
height: 54%;
top: 0;
}
.bxslider .word h1{
font-size: 30px;	
}
.bxslider .word .summary{
	
}

#news{
width: 49%;
height: 220px;
}

#news #newstop a{
float: left;
width: 81%;
font-size: 12px;
}

#news #newstop .date span:last-child{
	font-size: 14px;
}
#news #newstop .date{
	padding-left: 21px;
}
#news #newstop{
margin-bottom: 0;
height: 80px;
}
.news_block a{
	white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 65%;
}
#black_block{
	height: 359px;
}
#black_block .block{

}
#black_block{
	width: 51%;
}
#black_block .block h2{
	width: 80%;
	margin: 10%;
}

#black_block .block h3{
	width: 80%;
	margin: 10%;
}
#black_block .block div{
	margin: 10%;
	font-size: 12px;
}
#black_block .block span{
float: left;
height: 139px;
width: 100%;
position: absolute;
bottom: 0;
overflow: hidden;
left: 0;
}
#online{
width: 49%;
height: 138px;
}

#online img{
	float: left;
height: 85%;
margin: 4%;
}
#online .word{
width: 48%;
margin-top: 7%;

}




#online .word:hover{

}
#online .word h2{
	font-size: 22px;
}

#online .word span{
	width: 100%;
}


#aboutus{
width: 49%;
height: 165px;
}
#aboutus img,#video img{
float: left;
margin: 46px 18px;
width: 22%;
}
#aboutus .word{
	float: left;
width: 66%;
margin-top: 15%;
}
#video img{
	margin: 34px;
}

#video{
width: 50%;
height: 165px;
}

#stiemap{
	display: none;
}

#footerblock{
	width: 90%;
	margin: 0 5%;
}
#foot_right{
	float: left;
	width: 100%
}
#foot_right .btn{
	width: 70%;
}
#foot_right .btn a{
	opacity: 1;
}

#foot_right .info{
border-top: 1px solid #505050;
padding-top: 50px;
width: 70%;
}
#foot_right .gbtn{
border-top: 1px solid #505050;
padding-top: 50px;
margin-top: 50px;
width: 30%;
}
#foot_right .gbtn a{
float: right;
width: 80%;
font-size: 13px;
margin-bottom: 4px;
}
#footer{
	top:0;
}
#down{
	margin-top: 50px;
}
.bx-wrapper,.bxslider li{
height:450px;
background-size: cover;
background-position: center;
}

.bxslider li img{
height: 100%;
width: auto;
max-width: none;
position: relative;
opacity: 0;
}





}

@media screen and (max-width: 720px) {
	
#top_link #search{
	display: none;
}
#top_link #home{

	margin-right: 0;
}
#menu_mobile #nav .search{
border: 1px solid #b4b4b4;
/* float: right; */
width: 194px;
height: 34px;
margin: 26px auto;
padding-left: 9px;
display: block;
}
#menu_mobile #nav span a{
	font-size: 16px;
	font-weight: bold;
}

#menu_mobile #nav span{
	height: 55px;
line-height: 55px;
}
.bx-wrapper,.bxslider li{
height: 352px;
background-size: cover;
background-position: center;
}

.bxslider li img{
height: 100%;
width: auto;
max-width: none;
position: relative;
opacity: 0;
}
#news,#news #newstop,.news_block{
width: 100%;
height: auto;
}
#black_block{
width: 100%;margin-top: 10px;
max-width: none;
float: left;
}
#online{
width: 100%;
height: auto;
margin-top: 30px;padding-bottom: 10px;
}
#black_block .block div{
	width: 80%;
}
#online img{
	margin: 2% 4%;
	width: 40%;
	height: auto;
}
#aboutus{
width: 100%;
border: 0;
height: auto;
border-bottom: 1px solid #e1e1e1;padding: 30px 0;
}
#aboutus img, #video img{
margin: 0 4%;
width: 25%;
height: auto;
}
#aboutus .word{
	margin-top: 3%;
}
#video{
width: 100%;
border: 0;	
height: auto;padding: 30px 0;
}
#video .word{
	margin-top: 3%;
}
#foot_right h1{
	font-size: 18px;
}
#foot_right .btn{
	width: 100%;

}
#foot_right .btn img{
width: 100%;
max-width: 116px;
}

#foot_right .fb{
	width: 100%;
	text-align: center;
}

#foot_right .info{
border-top: 0;
width: 100%;
margin-top: 0;
}
#foot_right .gbtn{
border-top: 0;
width: 100%;
margin-top: 0;
}
#foot_right .gbtn a{
	float: left;
width: 48%;
}

.bxslider .word h1{
	font-size: 30px;
float: left;
}

.bxslider .word .summary{
float: left;
line-height: 17px;
}
.bxslider .word {
left: 0;
margin: 5%;
padding: 4%;
height: 61%;
width: 136px;
}


#online .word h2{
	font-size: 20px;
}















}