﻿@import url("reset.css");

/* CSS Document */


body {
	font-family: 'Helvetica W01 Light', Helvetica, Arial, "微軟正黑體", "Microsoft Jhenghei", sans-serif;
	background-image: url("../image/bg-01.jpg");
	background-repeat:repeat-y;
	background-size:contain;

}
p {
	font-size: 18px;
	color:#666666;
	line-height: 1.5;
	letter-spacing: 0.5px;
	padding: 0px 30px 0 30px;
/*	text-align: justify;
	text-justify:inter-ideograph;*/
	text-align: center;
}

h1 {
	font-family: "微軟正黑體", Arial, sans-serif;
	color: #d80c18;
	font-size: 30px;
	line-height: 50px;
}

h2 {
	font-family: "微軟正黑體", Arial, sans-serif;
	color: #d80c18;
	font-size: 60px;
	text-align: center;
}
h3 {
	font-family: "微軟正黑體", Arial, sans-serif;
	color: #666;
	font-size: 15px;
	letter-spacing: 3px;
	margin: 0 30px;
	line-height: 1.7;
}
h4 {
	font-size: 19.3px;
	letter-spacing: 1px;
	color: #D20000;
	line-height: 2;
	padding: 5px 0 0 30px;
}
h5 {
	font-size: 19.3px;
	letter-spacing: 1px;
	color: #D20000;
	line-height: 2;
}
h6 {
	font-family: "微軟正黑體", Arial, sans-serif;
	color: #C00;
	margin-left: 40px;
	font-size: 20px;
	line-height: 50px;
}

.BAR {
	clear: both;
	width: 100%;
	height: 101px;
	background-image: url("../image/bar.png");
	background-position: top center;
	background-repeat: no-repeat;
}

a.hover{
	background-color: #FF0004;
	
}

/*==輪播====================================*/



#abgne_fade_pic {
	width: 100%;
}

#abgne_fade_pic .control {
text-indent: -9999px;
}
#abgne_fade_pic .control a {
	

}
#abgne_fade_pic .control a.on {

}


#BANNER img{
	position: absolute;
	width: 100%;
	padding-top: 100px;
}
/*======================================*/


#MENU{
	display: block;
	width:100%;
	height:100px;
	background-color:#FFFFFF;
	background-image: url("../image/bar.png");
	background-repeat: no-repeat;
	background-position: center;
	position: fixed;
	margin:0 auto;
	top:0;
	text-align:center;
	opacity: 0.9;
	z-index: 999;
	
}
#MENU ul{
	list-style:none;
	margin:0 auto; /*margin:(上下)(左右)*/
	padding:0;
	display:block;
	width:860px;  /*底圖寬900px扣除paddign-left往右推250px*/
	height:100px; /*底圖高120px扣除paddign-top往下推10px*/
	}
#MENU li{
	float:left;}
#MENU li a{
display:block;
width:121.5px;
height:100px;
font-family:"微軟正黑體",Arial, Helvetica, sans-serif;
font-size:20px;
line-height:100px;
text-align:center;
text-decoration:none;
color:#666666;}
#MENU li a:hover {
	color:#d80c18;}
#MENU .FB {
	display:block;
	width: 40px;
	height: 40px;
	position: fixed;
	top: 30px;
	right: 10px;
	}
#MENU .CONTECT {
	display:block;
	width: 40px;
	height: 40px;
	position: fixed;
	top: 40px;
	right:130px;
	}





#DATA{
	display: block;
	width: 100%;
	margin: 20px auto;
}
#DATA #TOP{
	display: block;
	width:800px;
	height: auto;
	margin:0 auto;
	}
#DATA #TOP ul{
	list-style:none;
	display:block;
	width:800px;  /*底圖寬900px扣除paddign-left往右推250px*/
	}
#DATA #TOP ul li{
	float:left;
	display:block;
	width: 200px;
	height: 200px;
}
#DATA #TOP ul li.T01{
	float:left;
	display:block;
	width: 400px;
	height: 400px;
}
#DATA #TOP ul li.T02{
	float:left;
	display:block;
	width: 400px;
	height: 200px;
}
#DATA #TOP ul li.T06{
	float: right;
	display:block;
	width: 200px;
	height: 400px;
}
#DATA #TOP ul li.T07{
	float: right;
	display:block;
	width: 400px;
	height: 400px;
}
#DATA #TOP ul li.T08{
	float: right;
	display:block;
	width: 200px;
	height: 200px;
}
#DATA img{ position:absolute;
  /* 淡出淡入效果2秒 */
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
 }
#DATA img:last-child:hover{
     /* 滑入時第一張透明度設0 */
      opacity:0;}





#AAA{
	clear: both;
	width: 100%;
	margin: 0 auto;}

#AAA-1{clear: both;

}
#AAA .ABOUTUS-BANNER{
}


	
.TITLE {
	width: 320px;
	margin: 60px auto 20px;
	margin-top: 60px;
	border: 2px #d80c18 solid;
	text-align: center;	}






.ActivityPlan {
	padding-top: 120px;
}
.ActivityPlan .BORDER{
	position: relative;
	width: 120px;
	margin: 10px auto 30px;
	border-bottom: 3px #d80c18 solid;
	}

#BBB {	display:block;
	width: 100%;
	margin: 0 auto;}

#BBB ul{
	list-style:none;
	display:block;
	width:788px;  /*底圖寬900px扣除paddign-left往右推250px*/
	margin: 0px auto;
	}
#BBB ul li{
	float:left;
	display:block;
	background-color: #FF0004;
	width: 197px;
	height: 400px;
}
#BBB ul li img{ position:absolute;
  /* 淡出淡入效果2秒 */
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
 }
#BBB ul li img:last-child:hover{
     /* 滑入時第一張透明度設0 */
      opacity:0;}


#CCC {	display:block;
	width: 100%;
	margin: 0 auto;}

#CCC .C-COVER{display: block; width: 800px; margin: 0 auto; }

#CCC .C-COVER ul{display: block; width: 200px; float: left;}

#CCC .C-COVER ul li{
	display: block;
	width: 200px;
}
#CCC .C-COVER ul li.C01{
	display: block;
	width: 200px;
	height: 247px;
	}
#CCC .C-COVER ul li.C02{
	display: block;
	width: 200px;
	height: 232px;
	}
#CCC .C-COVER ul li.C03{
	display: block;
	width: 200px;
	height: 330px;
	}	
#CCC .C-COVER ul li.C04{
	display: block;
	width: 200px;
	height: 188px;
	}
#CCC .C-COVER ul li.C05{
	display: block;
	width: 200px;
	height: 142px;
	}
#CCC .C-COVER ul li.C06{
	display: block;
	width: 200px;
	height: 330px;
	}
#CCC .C-COVER ul.C-COVER2{width: 600px;float: right;}
#CCC .C-COVER ul.C-COVER2  li.C07{
	display: block;
	float: left;
	width: 330px;
	height: 100px;
	}
#CCC .C-COVER ul.C-COVER2 li.C08{
	display: block;
	width: 270px;
	height: 100px;
	}
#CCC .C-COVER img{ position:absolute;
  /* 淡出淡入效果2秒 */
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
 }
#CCC .C-COVER img:last-child:hover{
     /* 滑入時第一張透明度設0 */
      opacity:0;}





#DDD {
	display:block;
	width: 100%;
	margin: 0 auto;;
}

#DDD ul{
	list-style:none;
	display:block;
	width:800px;  /*底圖寬900px扣除paddign-left往右推250px*/
	margin: 0 auto;
	}
#DDD ul li{
	display:block;
	width: 800px;
	height: 216px;
}
#DDD .COVER img{ position:absolute;
  /* 淡出淡入效果2秒 */
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
 }
#DDD .COVER img:last-child:hover{
     /* 滑入時第一張透明度設0 */
      opacity:0;}


#EEE {	display:block;
	width: 100%;
	margin: 0 auto;}



#FFF {
	display:block;
	width: 100%;
	margin: 0 auto;
}


#FFF #COVER{
	display: block;
	width:800px;
	height: auto;
	margin:0 auto;
	background-color: #000000;
	}
#FFF #COVER ul{
	list-style:none;
	display:block;
	width:800px;  /*底圖寬900px扣除paddign-left往右推250px*/
	}
#FFF #COVER ul li{
	float:left;
	display:block;
	background-color: #FF0004;
	width: 200px;
	height: 200px;
}
#FFF #COVER ul li.T02{
	float: left;
	display:block;
	background-color: #FF0004;
	width: 400px;
	height: 400px;
}
#FFF #COVER ul li.T05{
	clear: both;
	display:block;
	background-color: #FF0004;
	width: 400px;
	height: 200px;
}
#FFF img{ position:absolute;
  /* 淡出淡入效果2秒 */
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
 }
#FFF img:last-child:hover{
     /* 滑入時第一張透明度設0 */
      opacity:0;}




#GGG {	display:block;
	width: 100%;
	margin: 0 auto;}







#FOOTER {
	display: block;
	width: 100%;
	height: 326px;
	margin: 0 auto;
}
#FOOTER #FOOTERDATA {
	width: 1200px;
	height: 326px;
	margin: 0 auto;
	background-image: url(../images/index_07.jpg);
	position:relative;
	
}


#FOOTER #FOOTERDATA #ALL_TEL{
	position: absolute;
	width: 330px;
	height: 173px;
	padding: 0px 0px 0px 0px;
	line-height: 30px;
	color:#666666;
	left: 57px;
	top: 56px;
	z-index: 999;
	border-right:0.5px #666666 solid;
	}

#FOOTER #FOOTERDATA a{
	text-decoration: none;
	color:#666666;
	}

#FOOTER #FOOTERDATA #A_TEL{
	position: absolute;
	color: #666666;
	left: 450px;
	top: 55px;
	text-decoration:none;
	}

#FOOTER #FOOTERDATA #B_TEL{
	position: absolute;
	color: #666666;
	left: 450px;
	top: 150px;
	}
	
#FOOTER #FOOTERDATA #C_TEL{
	position: absolute;
	color: #666666;
	left: 850px;
	top: 55px;
	}

#FOOTER #FOOTERDATA #D_TEL{
	position: absolute;
	color: #666666;
	left: 850px;
	top: 150px;
	}
	

	
