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

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	padding:0;
	margin:0;
	/*list-style-type:none;*/
	}	
a,img{
	outline: none; /* for Firefox */
    hlbr:expression(this.onFocus=this.blur()); /* for IE */	
	}
img, div{
	border:0px;
	}	
input,textarea{outline:none} /*消除chrome黃色框*/
textarea{resize:none} /*不要縮放*/
a:link {
	color: #ff004e;
	text-decoration: none;
}
a:visited {
	color: #ff004e;
	text-decoration: none;
}
a:hover {
	color: #F60;
	text-decoration: none;
}
a:active {
	color: #F60;
	text-decoration: none;
}


/**/
#hbg {/*background-image: url(../images/bg.jpg);*/ background-color:#1d2127;}
#ba {
	position:absolute;
	width:100%;
	height:100%;
	min-width:1000px;
	background-attachment: scroll;
	background-image: url(../images/index.jpg);
	background-repeat: no-repeat;
	background-position: 50% 0%;
	}	
#soo{
	position:absolute;
	width:100%;
	height:100%;
	overflow:auto;
	}
#content{
	position: relative;
	margin: 0px auto;
	width: 1000px;
	}
#content2{
	padding:10px 38px 10px 38px;
	font-family:Arial,"微軟正黑體",Helvetica,sans-serif;
	font-size:16px;
	line-height:25px;
	color: #473d34;
	}
#cto{
	position: relative;
	margin: 0px auto;
	width: 1000px;
	height:720px;
	/*background-color:#0F0;*/
	}
.img1{
	float:left;
	border-radius:10px;
	margin:0 15px 15px 10px;
	}
.img2{
	float:right;
	border-radius:10px;
	margin:0 10px 15px 15px;
	}
.img3{
	border-radius:10px;
	display:block;
	margin:0 auto;
	margin-bottom:15px;
	}
.f1{
	font-size: 20px;
	line-height: 30px;
	color: #473d34;
	font-weight: bold;
	display: inline-block;
	padding:3px 8px 0 8px;
	margin:15px 0 10px 0;
	border: 1px solid #473d34;
}
.f2{font-size:18px;
	line-height: 30px;
	margin:10px 0 3px 0;
	display: inline-block;
	}
.f3{font-size:22px;
	line-height: 35px;
	margin:25px 0 8px 0;
	display: inline-block;
	color:#282727;/*#606*/
	}
.tt{padding:10px 0 10px 0; }
.tt td{border-radius:8px; padding:5px; font-size:14px; line-height:18px;}
.zbox{
	width:425px;
	padding:0 10px 5px 10px;
	margin:5px;
	display: inline-block;
	border-radius:10px;
	border: 1px solid #beb193
	}
/*LOGO*/
#logo {
	position:absolute;
	width:100%;
	width:272px;
	height:145px;
	display:block;
	cursor:pointer;
	top:0;
	left:0;
	}
.ac {
	position:absolute;
	width:121px;
	height:33px;
	display:block;
	background-image: url(../images/ac.png);
	background-position:0 0;
	cursor:pointer;
	top:47px;
	left:272px;
	}
.ac:hover{background-position:0 33px;}
.dw {
	position:absolute;
	width:121px;
	height:30px;
	background-image: url(../images/dw.png);
	cursor:pointer;
	top:82px;
	left:272px;
	}
.dw:hover{background-position:0 30px;}
/*mu*/
#mubox {
	position: absolute;
	width:460px;
	height:175px;
	top:567px;
	left: 0;
	z-index:3;
	}
#mubox > a{
	float: left;
	width: 57px;
	height: 175px;
	display: block;
	cursor: pointer;
	background-position: 0 0;
	background-attachment: scroll;
	background-repeat: no-repeat;
	}
#mubox > a:hover{background-position: 0 -175px;}
.m1{background-image: url(../images/mu1.png);}
.m2{background-image: url(../images/mu2.png);}
.m3{background-image: url(../images/mu3.png);}
.m4{background-image: url(../images/mu4.png);}
.m5{background-image: url(../images/mu5.png);}
.m6{background-image: url(../images/mu6.png);}
.m7{background-image: url(../images/mu7.png);}
.m8{background-image: url(../images/mu8.png);}
/**/
.tlg{
	position:fixed;
	width:57px;
	height:56px;
	left:10px;
	bottom:10px;
	background-image: url(../images/tlg.png);
	z-index:1;
	}
#strbox{
	position:absolute;
	width:230px;
	height:52px;
	top:13px;
	right:5px;
	z-index:2;
	}
#strbox a img{width:100%;}
#strbox a{
	float: left;
	display: block;
	width: 48px;
	height: 48px;
	cursor: pointer;
	border-radius: 99px;
	overflow: hidden;
	background-color: #776980;
	margin: 0 8px 0 0;
	/*border: 2px solid #000;*/
	} 
#strbox a:hover{background-color:#9b80ad;}
/**/
#cttbox{
	position:relative;
	width:100%;
	display:none;/**/
	margin-top:200px;
	}
.ctop{
	position:relative;
	width:100%;
	height:256px;
	background-image: url(../images/in_02.png);
	background-position:50% 100%;
	background-repeat: no-repeat;
	}
.tit{
	position:relative;
	width:303px;
	height:86px;
	background-image: url(../images/tit.png);
	background-position:50% 0%;
	background-repeat: no-repeat;
	margin:0 auto;
	top:83px;
	}
.cco{
	position: relative;
	width: 100%;
	/*min-height:300px;*/
	background-image: url(../images/in_03.jpg);
	background-position: 50% 0%;
	background-repeat: repeat-y;
	/*overflow:auto;*/
	}
.cdw{
	position:relative;
	width:100%;
	height:110px;
	background-image: url(../images/in_04.jpg);
	background-position:50% 0%;
	background-repeat: no-repeat;
	}
.hom{
	position:absolute;
	width:65px;
	height:64px;
	top:-102px;
	right:12px;
	background-image: url(../images/home.gif);
	z-index:1;
	}
.sline{
	position:relative;
	display:block;
	width:100%;
	height:60px;
	background-image: url(../images/s1.gif);
	background-position: 50% 70%;
	background-repeat: repeat-x;
}
.bu1 > a{
	position:relative;
	width:200px;
	height:60px;
	cursor: pointer;
	background-image: url(../images/b1.jpg);
	background-position: 50% 0%;
	background-repeat: no-repeat;
	display:inline-block;
	margin:0px 6px -2px 6px ;
	}	
.bu1 > a:hover{background-position: 50% 100%;}
.bu2{
	position:relative;
	width:416px;
	height:60px;
	cursor: pointer;
	background-image: url(../images/b2.jpg);
	background-position: 50% 0%;
	background-repeat: no-repeat;
	display:inline-block;
	margin:0px 6px -2px 6px ;
	}	
.bu2:hover{background-position: 50% 100%;}
.bu3 > a{
	position:relative;
	width:200px;
	height:60px;
	cursor: pointer;
	background-image: url(../images/b3.jpg);
	background-position: 50% 0%;
	background-repeat: no-repeat;
	display:inline-block;
	margin:0px 6px -2px 6px ;
	}	
.bu3 > a:hover{background-position: 50% 100%;}
.butop{
	position:absolute;
	width:48px;
	height:49px;
	cursor: pointer;
	background-image: url(../images/top.png);
	background-position: 50% 0%;
	background-repeat: no-repeat;
	display:none;
	top:-200px;
	right:-10px;
	
	}
.butop a{
	position:relative;
	width:48px;
	height:49px;
	cursor: pointer;
	display:block;
	}
/*cy*/
.acbg{
	position:relative;
	width:719px;
	height:85px;
	margin:0 auto;
	background-image: url(../images/acb.png);
	background-position:50% 100%;
	background-repeat: no-repeat;
	}
.acbg > a{
	float:left;
	display:block;
	height:85px;
	cursor: pointer;
	background-position: 0 0;
	}
.acbg > a:hover{background-position:0 85px;}
.acb1{width:203px;background-image: url(../images/acb_02.png);margin-left:71px;}
.acb2{width:172px;background-image: url(../images/acb_03.png);}
.acb3{width:203px;background-image: url(../images/acb_04.png);}
#cca{
	position:fixed;
	width: 100%;
	height:0;
	bottom:0;
	left: 0;
	z-index:2;
	}
#cy{
	position:fixed;
	width: 100%;
	height:155px;
	bottom:-68px;
	left: 0;
	z-index:2;
	cursor:pointer;
	}
.cy{
	position:relative;
	width:100%;
	height:70px;
	background-image: url(../images/cy.jpg);
	background-position:50% 100%;
	background-repeat: no-repeat;
	}


/* loading */
#loo{
	position:absolute;
	width:50px;/*32*/
	height:50px;
	left: 50%;
	top: 50%;
	margin-left: -25px;/*-16*/
	margin-top: -25px;
	background-color: #000;
	background-image: url(../images/loading.gif);
	border-radius: 99px;
	background-repeat: no-repeat;
	background-position: 50% 50%;	/*z-index: 5;*/
	overflow:hidden;
}
#bacc{
	width:100%;
	height:100%;
	position: fixed;
	z-index:8;
	background-image:url(../images/ba.png);
	}
	
	
	
/**/	
.ina{
	opacity:.2;
	animation:box2 .4s infinite alternate;
	/*animation-fill-mode:forwards;*/
	-webkit-animation:box2 .4s infinite alternate;
	/*-webkit-animation-fill-mode:forwards;*/
	-moz-animation:box2 .4s infinite alternate;
	/*-moz-animation-fill-mode:forwards;*/
	-o-animation:box2 .4s infinite alternate;
	/*-o-animation-fill-mode:forwards;*/
	}
	@keyframes box2 {
		0% {opacity:.2;}
		50% {opacity:.6;}
		100${opacity:.2;}
	}
	@-webkit-keyframes box2 {
		0% {opacity:2;}
		50% {opacity:.6;}
		100${opacity:.2;}
	}
	@-moz-keyframes box2 {
		0% {opacity:2;}
		50% {opacity:.6;}
		100${opacity:.2;}
	}
	@-o-keyframes box2 {
		0% {opacity:2;}
		50% {opacity:.6;}
		100${opacity:.2;}
	}
#ubox{
	position:absolute;
	width:100%;
	height:50%;
	overflow:hidden;
	/*z-index:1;*/
	left:0;
	bottom:0;
	}	
#ubox > div {
	position: absolute;
	height:204px;
  	right:-900px;
	/*background-color:#0F0;*/
	}
#ubox > div > img{width:100%;}
#ubox > div:nth-child(1){
  bottom:-10px;
  -webkit-animation: textRight 30s linear 0.5s infinite;
  -moz-animation: textRight 30s linear 0.5s infinite;
  animation: textRight 30s linear 0.5s infinite;
}
#ubox > div:nth-child(2){
  bottom:20px;
  -webkit-animation: textRight 15s linear 1s infinite;
  -moz-animation: textRight 15s linear 1s infinite;
  animation: textRight 15s linear 1s infinite;
}	
#ubox > div:nth-child(3){
  bottom:0px;
  -webkit-animation: textRight 10s linear 0.8s infinite;
  -moz-animation: textRight 10s linear 0.8s infinite;
  animation: textRight 10s linear 0.8s infinite;
}
@keyframes textRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px);
    transform: translateX(0px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(-3000px);
    -moz-transform: translateX(-3000px);
    -ms-transform: translateX(-3000px);
    -o-transform: translateX(-3000px);
    transform: translateX(-3000px);
  }
}