@charset "utf-8";
img, object, embed, video {max-width: 100%;border:0px;}
.ie6 img {width:100%;border:0px;}


.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	padding-left: 0%;
	padding-right: 0%;
	background-color: #000;		
}
#top {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#heardermenu{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding-bottom:5px;	
}
#heartop{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	font-size: 90%;
	color: #999;
	text-align: left;
	line-height: 30px;
	height: 60x;
	
}	
#center{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding-bottom: 10px;
}

#footer{
	clear: both;
	float: left;
	margin-left: 0;
	width: 96%;
	display: block;
	border-bottom-right-radius:20px ;
	border-bottom-left-radius:20px ;	
	padding:2% 2% 1% 2%;
	background-color: #262626;
}
#footerleft{
	clear: both;
	float: left;
	display: block;
	width: 100%;
	margin-left: 0;
	text-align: left;
    line-height:24px;
}	
#footerright{
	clear: none;
	float: left;
	margin-left: 0%;
	width: 100%;
	display: block;
	font-size: 80%;
	color: #FFF;	
}
#fname{
	clear: both;
	float: left;
	margin-left: 0;
	border: 1px inset #4F4F4F;	
	width: 30%;
	display: block;
	text-align: center;
	background-color: #003A57;
	height: 30px;
	line-height: 30px;		
}
#fin{
	clear: none;
	float: left;
	margin-left: 0%;
	border: 1px inset #4F4F4F;	
	width: 60%;
	display: block;
	text-align: center;
	background-color: #002540;
	height: 30px;
	line-height: 30px;	
}
#footerbottom{
	clear: both;
	float: left;
	display: block;
	margin: 8px 0 5px 0;
	width: 100%;
	text-align: center;
	font-size:90%;	
}	
#menushow{
	clear: both;
	float: left;
	margin-left: 0;
	width: 94%;
	display: block;
	padding:5px 0 5px 5%;
	line-height: 40px;
	margin-bottom: 4px;
	border-radius:7px ;
	font-size:110%;	
background: -moz-linear-gradient(-45deg,  rgba(0,0,0,0) 0%, rgba(1,1,1,0) 1%, rgba(78,78,78,0.65) 99%, rgba(79,79,79,0.65) 100%);
background: -webkit-linear-gradient(-45deg,  rgba(0,0,0,0) 0%,rgba(1,1,1,0) 1%,rgba(78,78,78,0.65) 99%,rgba(79,79,79,0.65) 100%);
background: linear-gradient(135deg,  rgba(0,0,0,0) 0%,rgba(1,1,1,0) 1%,rgba(78,78,78,0.65) 99%,rgba(79,79,79,0.65) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a64f4f4f',GradientType=1 );

}	
#menushow:hover{
background: -moz-linear-gradient(-45deg,  rgba(79,79,79,0.65) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(-45deg,  rgba(79,79,79,0.65) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(135deg,  rgba(79,79,79,0.65) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a64f4f4f', endColorstr='#00000000',GradientType=1 );
}
#menukid2{
	clear: both;
	float: left;
	margin-left: 0;
	width: 90%;
	display: block;
	padding:5px 0 5px 5%;
	line-height: 25px;
	margin: 0px 0px 4px 10%;
	border-radius:7px ;
	font-size:95%;
background: -moz-linear-gradient(left,  rgba(130,130,130,0) 25%, rgba(142,142,142,0.73) 100%);
background: -webkit-linear-gradient(left,  rgba(130,130,130,0) 25%,rgba(142,142,142,0.73) 100%);
background: linear-gradient(to right,  rgba(130,130,130,0) 25%,rgba(142,142,142,0.73) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00828282', endColorstr='#ba8e8e8e',GradientType=1 );
}	

.TL{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	height: 30px;
	line-height:30px;
	}

.TR{
	clear: both;
	float: left;
	margin-left: 0%;
	width: 100%;
	height: 30px;
	line-height:30px;
	}
@media only screen and (min-width: 481px) {
.gridContainer {
	width: 100%;
	padding-left: 0%;
	padding-right: 0%;
	background-color: #000;		
}
#top {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#heartop{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	font-size:100%;
	color:#999;
	text-align: left;
	line-height: 30px;
	height: 60x;
}
#heardermenu{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding-bottom:5px;	
}
#center{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding-bottom:10px;	
}

#footer{
	clear: both;
	float: left;
	margin-left: 0;
	width: 96%;
	display: block;
	border-bottom-right-radius:20px ;
	border-bottom-left-radius:20px ;	
	padding:2% 2% 1% 2%;
	background-color: #262626;
}
#footerleft{
	clear: both;
	float: left;
	display: block;
	width:75%;
	margin-left: 0;
	text-align: left;
    line-height:24px;
}	
#footerright{
	clear: none;
	float: left;
	margin-left: 0%;
	width: 25%;
	display: block;
	text-align: right;
	font-size: 80%;
	color: #FFF;	
}
#fname{
	clear: both;
	float: left;
	margin-left: 0;
	width: 35%;
	display: block;
	text-align: center;
	background-color: #003A57;
	height: 30px;
	line-height: 30px;		
}
#fin{
	clear: none;
	float: left;
	margin-left: 0%;
	width: 60%;
	display: block;
	text-align: center;
	background-color: #002540;
	height: 30px;
	line-height: 30px;		
}
#footerbottom{
	clear: both;
	float: left;
	display: block;
	width: 100%;
	margin: 8px 0 5px 0;
	text-align: center;
	font-size:90%;	
}
#menushow{
	clear: both;
	float: left;
	margin-left: 0;
	width:95%;
	display: block;
	padding:5px 0 5px 5%;
	line-height: 40px;
	margin-bottom: 4px;
	border-radius:7px ;
	font-size:95%;		
background: -moz-linear-gradient(-45deg,  rgba(0,0,0,0) 0%, rgba(1,1,1,0) 1%, rgba(78,78,78,0.65) 99%, rgba(79,79,79,0.65) 100%);
background: -webkit-linear-gradient(-45deg,  rgba(0,0,0,0) 0%,rgba(1,1,1,0) 1%,rgba(78,78,78,0.65) 99%,rgba(79,79,79,0.65) 100%);
background: linear-gradient(135deg,  rgba(0,0,0,0) 0%,rgba(1,1,1,0) 1%,rgba(78,78,78,0.65) 99%,rgba(79,79,79,0.65) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a64f4f4f',GradientType=1 );

}	
#menushow:hover{
background: -moz-linear-gradient(-45deg,  rgba(79,79,79,0.65) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(-45deg,  rgba(79,79,79,0.65) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(135deg,  rgba(79,79,79,0.65) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a64f4f4f', endColorstr='#00000000',GradientType=1 );
}
#menukid2{
	clear: both;
	float: left;
	margin-left: 0;
	width:92%;
	display: block;
	padding:5px 0 5px 5%;
	line-height:25px;
	margin: 0px 0px 4px 5%;
	border-radius:7px ;
	font-size:90%;
background: -moz-linear-gradient(left,  rgba(130,130,130,0) 25%, rgba(142,142,142,0.73) 100%);
background: -webkit-linear-gradient(left,  rgba(130,130,130,0) 25%,rgba(142,142,142,0.73) 100%);
background: linear-gradient(to right,  rgba(130,130,130,0) 25%,rgba(142,142,142,0.73) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00828282', endColorstr='#ba8e8e8e',GradientType=1 );
	
}	

.TL{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	height: 30px;
	line-height:30px;
	}

.TR{
	clear: both;
	float: left;
	margin-left: 0%;
	width: 100%;
	height: 30px;
	line-height:30px;
	}
}
@media only screen and (min-width: 769px) {
.gridContainer {
	width:100%;
	max-width: 1232px;
	padding-left: 0%;
	padding-right: 0%;
	margin: auto;
	background-color: #000;	
}
#heartop{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	font-size: 100%;
	color: #999;
	text-align: left;
	line-height: 30px;
	height: 30px;
}	
#top {
	clear: both;
	float: left;
	margin-left: 0;
	width:100%;
	max-width: 1232px;
	display: block;
}

#heardermenu{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding-bottom:5px;	
}
#center{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding-bottom: 10px;
	
}
#footer{
	clear: both;
	float: left;
	margin-left: 0;
	width: 96%;
	display: block;
	text-align: center;
	border-bottom-right-radius:20px ;
	border-bottom-left-radius:20px ;	
	padding:2% 2% 1% 2%;
	background-color: #262626;
}
#footerleft{
	clear: both;
	float: left;
	display: block;
	width: 80%;
	margin-left: 0;
	text-align: left;
    line-height:24px;
}	
#footerright{
	clear: none;
	float: left;
	margin-left: 0%;
	width: 20%;
	display: block;
	text-align: right;
	font-size: 80%;
	color: #FFF;
}
#fname{
	clear: both;
	float: left;
	margin-left: 0;
	border: 1px inset #4F4F4F;	
	width: 30%;
	display: block;
	text-align: center;
	background-color: #003A57;
	height: 30px;
	line-height: 30px;		
}
#fin{
	clear: none;
	float: left;
	margin-left: 0%;
	border: 1px inset #4F4F4F;	
	width: 65%;
	display: block;
	text-align: center;
	background-color: #002540;
	height: 30px;
	line-height: 30px;		
}

#footerbottom{
	clear: both;
	float: left;
	display: block;
	margin: 8px 0 5px 0;
	width: 100%;
	text-align: center;
	font-size:90%;	
}	

#menushow{
	clear: both;
	float: left;
	margin-left: 0;
	width:100%;
	display: block;
	padding:5px 0 5px 5%;
	line-height: 35px;
	margin-bottom: 4px;
	border-radius:7px ;
	font-size:100%;		
background: -moz-linear-gradient(-45deg,  rgba(0,0,0,0) 0%, rgba(1,1,1,0) 1%, rgba(78,78,78,0.65) 99%, rgba(79,79,79,0.65) 100%);
background: -webkit-linear-gradient(-45deg,  rgba(0,0,0,0) 0%,rgba(1,1,1,0) 1%,rgba(78,78,78,0.65) 99%,rgba(79,79,79,0.65) 100%);
background: linear-gradient(135deg,  rgba(0,0,0,0) 0%,rgba(1,1,1,0) 1%,rgba(78,78,78,0.65) 99%,rgba(79,79,79,0.65) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a64f4f4f',GradientType=1 );

}	
#menushow:hover{
background: -moz-linear-gradient(-45deg,  rgba(79,79,79,0.65) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(-45deg,  rgba(79,79,79,0.65) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(135deg,  rgba(79,79,79,0.65) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a64f4f4f', endColorstr='#00000000',GradientType=1 );
}
#menukid2{
	clear: both;
	float: left;
	margin-left: 0;
	width: 94%;
	display: block;
	padding:5px 0 5px 5%;
	line-height:25px;
	margin: 0px 0px 4px 5%;
	border-radius:7px ;
	font-size:95%;	
background: -moz-linear-gradient(left,  rgba(130,130,130,0) 25%, rgba(142,142,142,0.73) 100%);
background: -webkit-linear-gradient(left,  rgba(130,130,130,0) 25%,rgba(142,142,142,0.73) 100%);
background: linear-gradient(to right,  rgba(130,130,130,0) 25%,rgba(142,142,142,0.73) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00828282', endColorstr='#ba8e8e8e',GradientType=1 );
}	

.TL{
	clear: both;
	float: left;
	margin-left: 0;
	width: 45%;
	height: 30px;
	line-height:30px;
	}

.TR{
	clear: none;
	float: left;
	margin-left: 1%;
	width: 54%;
	height: 30px;
	line-height:30px;
	}	

}
#banner{
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
	text-align: left;
	max-width:100%;
	border-radius:10px;
	margin-bottom:5px;
	width: 100%;
	height: auto;	
}
.limg {clear: both;float: center;margin-left: 0;max-width:85%;width:85%;border-radius:10px;margin-bottom:10px;}
.edittital{	border: 1px solid #ccc;width: 98%;padding: 7px 0 8px 2px;line-height: 25px;text-align: center;font-size: 110%;font-weight: bold;margin-bottom:10px;}
.fronttital{
width: 98%;padding: 7px 0 8px 2px;line-height: 25px;text-align: center;font-size: 140%;font-weight: bold;margin-bottom:5px;
background-color: #ccc;-webkit-background-clip: text;-moz-background-clip: text;background-clip: text;color: transparent;text-shadow: rgba(255,255,255,0.5) 0px 5px 5px;}
.fronttital2{
width: 98%;padding: 7px 0 8px 2px;line-height: 25px;text-align: center;font-size: 130%;font-weight: bold;margin-bottom:5px;
background-color: #ccc;-webkit-background-clip: text;-moz-background-clip: text;background-clip: text;color: transparent;text-shadow: rgba(255,255,255,0.5) 0px 5px 5px;}
.fronttital2 a{
	width: 98%;
	padding: 7px 0 8px 2px;
	line-height: 25px;
	text-align: center;
	font-size: 110%;
	font-weight: bold;
	margin-bottom: 5px;
	background-color: #F03;
	-webkit-background-clip: text;
	-moz-background-clip: text;
	background-clip: text;
	color: transparent;
	text-shadow: rgba(255,255,255,0.5) 0px 5px 5px;
}

/*inkeyin*/
.inkeyin{line-height:30px;width:75%;height:30px;background-color:#000;border:1px solid #d4d4d4;font-size:100%;color:#fff; padding-left: 5px; border:1px; border-bottom-style: solid;border-top-style: none;border-left-style:none;border-right-style:none;}
.inkeyintext{width:75%;height:150px;margin: 5; padding: 5;background-color:#000;font-size:100%;color:#fff;padding-left: 5px;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;}
.inkeyintext:hover {background:#333;}
/*input*/
input{color: #000;font-size:90%; background-color: #f3f3f3;width: 40%; margin: 0; padding: 0;line-height:30px;height:30px;}
input:hover {background:#333;color: #fff;}
/* show頁面 */
#wrapper{box-sizing:border-box;float:left;width:96%;margin:0 2%;padding:0 10px 5px 10px;background:#191919;border-radius:10px;line-height:25px;}

/* 內容wrapper */
.kind{		clear: both;
	float: left;
font-size:100%;color:#CCC;width: 94%;padding:10px 0 0px 2px;line-height:18px;margin-left:10px;}
.kind a{color:#CCC}

.tital{
	float:left;
	width: calc(100% - 20px);
	border-bottom: 1px solid #ccc;
	line-height: 25px;
	margin: 0 0 20px 10px;
	padding-top: 12px;
	padding-bottom: 12px;	
	font-weight: bold;
	text-align: center;
}
.title img,.tital img  {max-width:20px;float:left;}
.top_intro{
	color: #CCC;
	font-size: 100%;
	line-height: 25px;
	width: 98%;
	margin-left: 1%;
}

.copyR{
	clear: both;
	float: left;
	width:100%;
	padding-top:5px;
	padding-bottom:0px;
	text-align:center;
	color:#ccc;
	font-size:95%;
}
.vedioshow{
	padding-top: 0px;
	padding-bottom: 0px;
	text-align: center;
	color: #F60;
	font-size: 95%;
}
.day{width: 96%;text-align:right;color:#777;font-size:80%;line-height:30px;margin:5px 10px 0 0;}
.show{color:#fff;}
.pg{text-align:center;}

.no{clear: both;float: left;margin-left: 0;border:#999 1px solid;width: 100%;margin: 7px 0 7px 0;}
/* 搜尋 */
.searchdiv{clear: both;float: left;margin-left: 0;width: 100%;text-align:center;}
.searchdiv .inkeyin{color: #000;font-size:90%; background-color:#ccc;width:100%;margin:0;width:92%;border:#999 1px inset;padding:2%;}
.searchdiv .inkeyin:hover {background:#fff;}
.searchenter{color: #000;font-size:75%;background-color: #f3f3f3;border-style: solid;border-width: 1;width: 50%;margin-top: 3px;}
.searchenter hover{background-color: #ccc;}
/* youtube*/
.youtubecontent{position: relative;padding-top: 10px;height: 0;overflow: hidden;padding-bottom: 56.25%;}
.youtubecontent iframe,.youtubecontent object,.youtubecontent embed {position: absolute;top: 0;left: 2%;min-width: 96%;min-height: 96%;border:0;}


#menukid2:hover{
background: -moz-linear-gradient(left,  rgba(130,130,130,0) 0%, rgba(183,183,183,0.73) 100%);
background: -webkit-linear-gradient(left,  rgba(130,130,130,0) 0%,rgba(183,183,183,0.73) 100%);
background: linear-gradient(to right,  rgba(130,130,130,0) 0%,rgba(183,183,183,0.73) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00828282', endColorstr='#bab7b7b7',GradientType=1 );
}	
#banner{margin-left:0;width:100%;}

/*聯絡我們*/
.line{border-bottom: 1px solid #333;border-right: 1px solid #333;}

.Lb{
	clear: both;
	float: left;	
	display: block;
	width: 100%;
	padding: 1px 0 1px 0;
	margin: 1px 0 0 0;
	*height : 1%; 	
}
.Lb:after
{
  clear : both;
  content : '';
  display : block;
  height : 0;
  overflow : hidden;
}
/*-------------------------------2022update*/
@media only screen and (max-width: 479px) {
.bannerBox{
	width: calc(100% - 18px);
}
}
@media only screen and (min-width: 480px) {
.bannerBox{
	width: calc(100% - 18px);
}
}
@media only screen and (min-width: 768px) {
.bannerBox{
	width: calc((100% / 2) - 18px);
}
}
@media only screen and (min-width: 1024px) {
.bannerBox{
	width: calc((100% / 2) - 18px);
}	
}
@media only screen and (min-width: 1280px) {
.bannerBox{
	width: calc((100% / 3) - 18px);
}
}
@media only screen and (min-width: 1600px) {
.bannerBox{
	width: calc((100% / 3) - 18px);
}
}
.bannerBox{
	position: relative;
	clear: none;
	float: left;
	display: inline-block;	
	color: #353535;
	text-align: center;
	border:#666 1px solid; 
	*height : 1%; 
	margin:8px;
    padding:0px 0 50px 0;
}
.Ibanner {/*服務客戶*/
	position:relative;
	clear: none;
	float: left;	
    width: 100%;
    height: 0;
    padding-bottom: 31.5%;
	overflow: hidden;
    background-repeat: no-repeat;
	background-position:center center;
	background-size:cover;
	*height : 1%; 	
}
.Tbanner {/*首頁BANNER*/
	position:relative;
	clear: none;
	float: left;	
    width: 100%;
    height: 0;
    padding-bottom: 41.7%;
	overflow: hidden;
    background-repeat: no-repeat;
	background-position:center center;
	background-size:cover;
	*height : 1%; 	
}
.Tbanner:after.Ibanner:after{
  content : '';
  height : 0;
  clear : both;
  display : block;
  visibility: hidden;
}
.Del_LD_icon{
   position: absolute;
   width: 40px; 
   height:auto;   
   bottom: 5px;
   left: 5px;
   z-index: 4;
   transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;-webkit-transition: all 0.5s ease-out;     
}
.Open_icon{
   position: absolute;	  
   top: 5px;
   left: 5px;
   z-index: 4;	
   zoom: 1;
   width:35px;
  }
.Edit_icon{
   position: absolute;	
   width: 35px;
   height:auto;   
   bottom: 5px;
   right: 5px;
   z-index: 4;	
  }	 
.Move_icon{
   position: absolute;
   width: 45px;
   height:auto;
   top: 5px;
   right: 5px;
   z-index: 4;	
  }  
.line100{
	clear: both;
	float: left;
	display: block;
	width: 100%;
	margin: 5px 0 5px 0;
	padding: 1px 0 1px 0;
	*height : 1%;	
}
.line100:after{
  content : '';
  height : 0;
  clear : both;
  display : block;
  visibility: hidden;
}
.Lbutton{
	padding: 8px 20px;
	cursor: pointer;
	background-color: #009999;
	color: #FFF;
	border-color: #006699;
	border-width: 1px;
	border-style: solid;
	font-size: 100%;
	text-align: center;
}
.Lbutton:hover{
	background-color: #FF9933;
	color: #FFF;
	border-color: #FF6600;
}
.Lbutton img{
	width:25px;
	margin-right:8px;
}
input.insubmit{
	padding: 6px 15px;
	margin: 5px 0 5px 0;
	cursor: pointer;
	background-color: #999999;
	color: #FFF;
	border-color: #BBBBBB;
	border-width: 1px;
	border-style: solid;
	font-size: 115%;
	font-family: Microsoft JhengHei;
	border-radius: 0px;
}	
/*頁碼 左右鍵*/
.panext{
	margin: 0 1px 0 1px;
	padding: 1px;
	text-align: center;
}
.pacon{
	line-height: 29px;
	padding: 0 6px;
	margin: 2px;
	background-color: rgba(51,51,51,0.05);
	color: #FFFFFF;
	text-align: center;
	text-decoration: none;
	border: 1px solid #999;
}
.pacon:hover{
	color: #fff;
    background-color: #06C;	
} 
.paconthis{
	line-height: 29px;
	padding: 0 6px;
	margin: 2px;
	background-color: rgba(51,51,51,0.05);
	color: #666666;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	border: 1px solid #E0E0E0;
}