/*-------------------------------基本設定-----------------------------------*/
body, div, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td ,img {
	margin: 0;
	padding: 0;
	border-top-width: 100%;
	border-right-width: 100%;
	border-bottom-width: 100%;
	border-left-width: 100%;
	border-top-style: 0;
	border-right-style: 0;
	border-bottom-style: 0;
	border-left-style: 0;
	border: 0px;
}

body {
	
/*	background: url(images/bg-s.jpg) 50% 50%;*/
	overflow:hidden;
	min-width: 1002px;/*最小寬度設定*/
 	width: expression(document.body.clientWidth < 1002? "1002px": "auto" );
	background-color: #000;
	/*background:url(images/bg.jpg)  top center;*/
}
.img-responsive {/*圖片自動伸縮 chrome才有用*/
height: auto;max-width: 100%;

}


*{	/*解決用了padding後版面亂掉的問題,ie8不支援*/
	-webkit-box-sizing: border-box;
 	-moz-box-sizing: border-box;   
 	box-sizing: border-box;         
	
	}

/*-----------------------------內容區-------------------------------------*/
.BOX {
	background-image:url(images/text_bg.jpg);
	margin:0 auto;
	margin-top:570px;
	width:889px;
	position: relative;
	z-index:10;

	left:0.6%;
	padding: 0 10% 10% 7%;
}

/*#BOX1,#BOX2,*/  #BOX3, #BOX4 {
	display: none;
}
#BOX1{
	/*display:inline-block;
	padding: 840px 0% 5px 10%; 表格與外部的間距*/
	}
#BOX2{	padding: 1120px 14% 5px 21%; /*表格與外部的間距*/
	}


/*-----------------------------切版-------------------------------------*/
.TOP_BG {/*上方背景用*/
	background:url(images/index_01.jpg) no-repeat    top center;
	/*background: #F60;*/
}



.content {/*頁首*/
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-width: 1002px;/*最大寬度設定*/
 	width: expression(document.body.clientWidth > 1002? "1002px": "auto" );
/*	height:837px;*/
}





.article2 {/*內容區*/
	height: 130px;
		background:url(images/text_bg2.png) no-repeat 50% top;

}


.footer {/*頁尾*/
	background: url(images/footer.jpg) no-repeat 40% top;
	height: 73px;
	width: 100%;
	margin: 0 auto;
}


/*-----------------------------預設文字設定---------------------------------*/	
body, td, th ,.BOX  ,ul ,li,ol   p  {
	color: #000000;
	font-size: 15px;
	line-height: 1.8;
	text-align: justify;
	letter-spacing: 0.02em;
	font-weight:bold;
	/*text-align:center;*/
	
	font-family: "微軟正黑體", "新細明體", "Arial";	/*font-weight: bold;*/
}

.BOX   p {
	font-size: 15px;
	line-height: 1.8;
	text-align: justify;
	letter-spacing: 0.02em;
	font-weight:bold;
	color: #000000;
	text-align:center;
}

	
	font-family: "微軟正黑體", "新細明體", "Arial";	/*font-weight: bold;*/
}
a {
	text-decoration: none;
	color: #09F;
	outline: none; /* for Firefox 清虛線*/
 	hlbr:expression(this.onFocus=this.blur()); /* for IE 清虛線*/
}

h5 {/*文字下間距*/
	padding-left: 1em;
	font-size: 1.5em;
	color: #084341;
	padding-bottom: -5px;/*font-weight: bold;*//*text-shadow: 0px 0px 1px rgba(0,0,0,0.3);*/	/*letter-spacing: 0.1em;*/
}
h6 {/*文字前有小圖*/
	font-size: 1.2em;
	line-height:1.8;
	text-align: left;
	color: #FF6600;
	padding-left: 0em;
}
.red {/*變紅色*/
	font-size: 1em;
	color: #FF0000;
}
.green {/*變綠色*/
	font-size: 1em;
	color: #638EAB;
}
h4 {/*文字註解*/
	padding-top: 98px;
	font-size: 1.7em;
	color: #990000;
	font-weight: bold;
}
/*------------------------------浮動區塊------------------------------------*/


.fb_ {/*按讚*/
	position: absolute;
	z-index: 99;
	margin-top: 10px;
	left: 90px;
}


.BB {
	position: absolute;
	z-index: 105;
	left:40%;
	top: 110px;
-webkit-animation:fadeInLeftBig 1s .2s ease both;
-moz-animation:fadeInLeftBig 1s .2s ease both;}


.logo {
	position: absolute;
	z-index: 900;
		left:25%;
	top: 230px;

}

#download {
	position: absolute;
	z-index: 100;
	left: 79%;
	top: 780px;

}	
/*		background-color: #FFFFFF;
	background-color: rgba(255,102,102,0.1);*/
	
	
#gotop {/*回頂端*/
	display: none;/*預設隱藏*/
	position: fixed;/*固定在右下角*/
	right: 20px;
	bottom: 100px;


	
	cursor: pointer;
	z-index: 900;
}


#NEW{/*半透明背景*/
	position: absolute;
	top:700px;
	z-index: 910;
	width: 100%;
	height: 2000px;
	opacity:0.9;
	display: none;/*隱藏用*/
	background-color:#000;
	}
	
.pic1{/*跳出圖1*/
	position:absolute;
	top:1200px;
	left:25%;
				
	background:url(images/pic1.jpg) no-repeat top center;

	width:600px;
	height:398px;
	display: none;/*隱藏用*/
	z-index:911;
}
.pic2{/*跳出圖2*/
	position:absolute;
	top:1200px;
	left:25%;
				
	background:url(images/pic2.jpg) no-repeat top center;

	width:600px;
	height:398px;
	display: none;/*隱藏用*/
	z-index:911;
}

.firework{/*火花*/
	position: absolute;	
	left: -15%;
	z-index: 10;
	top: 80px;


-webkit-animation:pulse 3s 3s ease both;
-moz-animation:pulse 3s 3s ease both;
	-webkit-animation-iteration-count:infinite;/*播放次數*/
    -moz-animation-iteration-count:infinite;}
@-webkit-keyframes pulse{
0%{-webkit-transform:scale(1)}
50%{-webkit-transform:scale(1.1)}
100%{-webkit-transform:scale(1)}
}
@-moz-keyframes pulse{
0%{-moz-transform:scale(1)}
50%{-moz-transform:scale(1.1)}
100%{-moz-transform:scale(1)}
}
	
	

/*------------------------------選單1（按鈕）-----------------------------------*/
/*共通屬性*/
.sp{
	position:relative;/*相對定位,為了下面hover的絕對定位*/
	display:block;
	text-indent:-9999px;
	z-index:900;
	/*注意這裡高度*/
	}
	
/*以下第二個按鈕*/
#sp2{	
	top:1496px;/*定位*/
	left:25.7%;
	width:294px;
	height:86px;	
	background:url(images/sp2.png) left top no-repeat;/*設置背景圖*/
}
#sp2 .hover{/*為JQ准備*/
	background:url(images/sp21.png) left bottom no-repeat;/*換圖*/
	position:absolute;/*為了使兩張圖片重疊在一起*/
	top:0;
	left:0;
	width:294px;
	height:86px;
    } 




/*-----------------------------表格-------------------------------------*/

.table {	           /*整體表格*/
	width: 90%;
	margin: 10px 0% 10px 10%; /*表格與外部的間距*/
	/*text-shadow: 1px 1px 2px #333;  文字陰影*/
	border: 1px dashed #FFF;
	border-collapse: collapse; /*允許框線重疊*/
	background-color: #FFC8C8;
}
.table td {
	color: #000;/*第1列_文字顏色*/
	text-align: center;	   /*文字置中*/
	height: 1.6em;
	line-height: 1.6em;/*列_高度*/
	padding: 0.2em;/*列_文字與框的距離*/
	border: #FFF dashed;/*框線顏色,樣式*/
	/*內_框線粗細*/
	border-top-width: 0px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-width: 0px;
}
.table th {
	line-height: 2em;/*第1列_高*/
	color: #FFF;/*第1列_文字顏色*/
	text-align: center;/*第1列_文字置中*/
	font-weight: bold;/*第1列_粗體*/
	letter-spacing: 2px;
	background-color: #FF3333;/*第1列_底色*/
	border: #FFF dashed;/*框線顏色,樣式*/
	/*首_框線粗細*/
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-width: 0px;
}
.table tr:hover {   /*滑鼠滑過*/
	background-color: #FFFFFF;
	background-color: rgba(255,102,102,0.4);
}

/*------------------------------- 手機版本 -----------------------------------------*/
@media screen and (max-width: 1024px) {

body, td, th ,.BOX{
	color: #FFF;
	font-size: 17px;
	line-height: 1.3;
	text-align: justify;
	letter-spacing: 0.02em;
	font-family: "微軟正黑體", "新細明體", "Arial";
}
h5 {/*文字下間距*/
	font-size: 1.5em;line-height: 1.3;
	color: #084341;
	padding-top: 0px;/*font-weight: bold;*//*text-shadow: 0px 0px 1px rgba(0,0,0,0.3);*/	/*letter-spacing: 0.1em;*/
}
h6 {/*文字前有小圖*/
	font-size: 1.1em;
	text-align: left;
	color: #FF6600;
	padding-left: 0em;
}


}