@charset "utf-8";
/* CSS Document */
html,body{margin:0;height: 100%;}
body {height: 100%;width: 100%;margin: 0;padding: 0;}
body{font-size:100%;line-height: 1.5; font-family: "微軟正黑體", "LiHei Pro", Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";  color: #fff; position: relative; background-color:#c30d23;}
a:focus{outline:0;}
a{text-decoration:none; color: #333;}
a:hover{text-decoration:none; color: #000;}
img{border: 0 none; line-height:0; display: block;}
form {margin:0;	padding:0;}
ul, ul li ,ol, ol li {margin: 0;padding: 0;  list-style-type: none;}
dl, dt, dd {margin: 0;padding: 0;}
dl {height: 1%;}
button{border:0 none; cursor:pointer;padding: 0;margin: 0;background: transparent;}
.clearfix:before,.clearfix:after {content: "";display: table;height: 0;overflow: hidden;}
.clearfix:after {clear: both;}
.clearfix {	zoom: 1;}
h1,h2,h3,h4,p{margin:0;padding: 0;}
/*-------------------------------------Globe------------------------------------------------*/
.Wrapper{width: 1000px; margin:auto;}
.Header .Wrapper{ position: relative;}
.Header{background: url(../images/Bg.jpg) no-repeat center top; display: block; width: 100%; height: 705px;}
.Header .Title{background: url(../images/Title.png) no-repeat;width: 705px;height: 180px;margin: 42px auto 0;position: relative;z-index: 2;}
.Header .LinkActivity {margin-top: -43px;z-index: 3; position: relative;}
.Header .LinkActivity a{background: url(../images/LinkActivity.png) no-repeat; width: 530px; height: 100px; margin: auto; display: block; text-indent: -9999px;}
.BannerBlock .Wrapper{width: 940px;}
.ImgChange{margin: auto;width: 400px;height: 360px;position: relative;top: 170px;}
.ImgChange div{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	background: url(../images/imgBg.jpg) no-repeat;
	right: 0;
	visibility: hidden;
}
.ImgChange div {
	-webkit-animation: fade 30s linear infinite;
	animation: fade 30s linear infinite;
}
@-webkit-keyframes fade {
	4% {visibility: visible; }
	20% {visibility: visible;}
	24% {visibility: hidden;}
}
@keyframes fade {
	4% {visibility: visible;}
	20% {visibility: visible;}
	24% {visibility: hidden;}
}


.ImgChange div:nth-of-type(1) {
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}

.ImgChange div:nth-of-type(2) {
	-webkit-animation-delay: 5s;
	animation-delay: 5s;
}
.ImgChange div:nth-of-type(3) {
	-webkit-animation-delay: 6s;
	animation-delay: 6s;
}
.ImgChange div:nth-of-type(4) {
	-webkit-animation-delay: 11s;
	animation-delay: 11s;
}
.ImgChange div:nth-of-type(5) {
	-webkit-animation-delay: 12s;
	animation-delay: 12s;
}
.ImgChange div:nth-of-type(6) {
	-webkit-animation-delay: 17s;
	animation-delay: 17s;
}
.ImgChange div:nth-of-type(7) {
	-webkit-animation-delay: 18s;
	animation-delay: 18s;
}
.ImgChange div:nth-of-type(8) {
	-webkit-animation-delay: 23s;
	animation-delay: 23s;
}

.ImgChange div:nth-of-type(9) {
	-webkit-animation-delay: 24s;
	animation-delay: 24s;
}

.ImgChange div:nth-of-type(10) {
	-webkit-animation-delay: 29s;
	animation-delay: 29s;
}
/*.ImgChange div:nth-of-type(11) {
	-webkit-animation-delay: 30s;
	animation-delay: 30s;
}
*/
/*.ImgChange div:nth-of-type(12) {
	-webkit-animation-delay: 35s;
	animation-delay: 35s;
}*/

/*
.ImgChange div:nth-of-type(13) {
	-webkit-animation-delay: 36s;
	animation-delay: 36s;
}
.ImgChange div:nth-of-type(14) {
	-webkit-animation-delay: 41s;
	animation-delay: 41s;
}

.ImgChange div:nth-of-type(15) {
	-webkit-animation-delay: 42s;
	animation-delay: 42s;
}
.ImgChange div:nth-of-type(16) {
	-webkit-animation-delay: 47s;
	animation-delay: 47s;
}
*/
/*.ImgChange div:nth-of-type(16) {
	-webkit-animation-delay: 47s;
	animation-delay: 47s;
}*/
/*.ImgChange div:nth-of-type(17) {
	-webkit-animation-delay: 43s;
	animation-delay: 43s;
}
*/


.BannerBlock ul li{float: left; width: 24%; margin: 0 .5%;}
.BannerBlock ul li img{width: 100%; height: auto;}
@media screen and (max-width:999px){
	.Header .Wrapper{width:100%;}
}
@media screen and (max-width:768px){
	img{width: 100%; height: auto;}
	.Wrapper{width:100%;}
	.Header{background:none; height: auto;}
	.BannerBlock .Wrapper{width: 100%;}
	.BannerBlock ul li{width: 48%;margin: 0 1% 2%;}
	.Header .LinkActivity{margin-top: inherit;}
	.Header .Title{width: 100%;height: auto;padding-bottom: 20%;background-size: 100%;margin: inherit;}
	.Header .LinkActivity a{width: 70%;height: auto;background-size: 100%;padding-bottom: 14%;}
	.ImgChange div{background: url(../images/imgBg_m.jpg) no-repeat;background-size: 100%;}
	.ImgChange{margin: auto;width: 100%;height: auto;position: relative;top: inherit;padding-bottom: 57%;}
	.ImgChange div img{width: 57%;height: auto;margin: auto;margin: 24% auto;}


}