/* == 共用區 ============================================================================= */

*{
	margin:0; 
	padding:0;
	-webkit-box-sizing:border-box; /*safari & chrome*/
	-moz-box-sizing:border-box; /*firebox*/
	box-sizing:border-box; /*解除padding影響寬度關係*/
	}

html, body{
	-webkit-text-size-adjust:100%;/*避免ios用戶字體自動放大*/
	font-family:'微軟正黑體', Arial, Helvetica, sans-serif;
	width:100%;
	height:100%;


	}

ul{ list-style:none;}
li{ list-style:none;}
/*nav*/
.nav{
padding: 0 auto;
	display: flex;
	justify-content:center;
	background: #F8A417;
	z-index:1;
	width:100%;
	position:fixed;
	text-align:center;
}
.nav ul{
	display:flex;justify-content: space-between;width:1000px;text-decoration: none;
	max-width:1200px;
	text-align:center;}
.nav li{
	width:16%;

	font-size:25px;
	display:inline-block;
	border-right:#fff 2px solid;
	vertical-align:middle;
	line-height:33px;
	padding: 2% 0 0 0;
	font-weight:bold;
	color:#FFF;}	
.nav li:last-child{
	border-right:none;}
.nav li a{
	display:block;
	color:#FFF;
	text-decoration:none;
	font-weight:bold;
}	

.nav ul li a::after{content: '';background: #fff;height: 2px;width: 0;position: absolute;bottom:0;left: 51%;transition: all .5s;}
.nav ul li i{color:#FFF;animation: upDown 1s linear infinite;}
@keyframes upDown{
0%{transform: translateY(0px);}
25%{transform: translateY(-5px);}
75%{transform: translateY(5px);}
100%{transform: translateY(0px);}
}

.nav ul a i{animation: none;}

.cont{
	width:100%;
	max-width:900px;
	margin:0 auto;
	padding:2% 0;
	text-align:center;}

.content{
	width:100%;
		margin:0 auto;
	padding:0;
	background-color: #E6F9FF;
	text-align:center;
}
.content2{
	width:100%;
	margin:0 auto;
	padding:0;
	background-color: #0477CF;
	text-align:center;}
.content3{
	width:100%;
	margin:0 auto;
	padding:0;
	background-color: #E6F9FF;
	text-align:center;}
.content4{
	width:100%;
	margin:0 auto;
	padding:0;
	background-color: #528BA5;
	text-align:center;}
.content5{
	width:100%;
	margin:0 auto;
	padding:0;
	background-color: #FFED61;
	text-align:center;}

.content img{
    max-width:1000px;}

.content2 img{
    max-width:1000px;}
.content3 img{
    max-width:1200px;}
.content4 img{
    max-width:1000px;}
.content5 img{
    max-width:1000px;}
	
ul{ list-style:none; }
.maxw img{max-width:980px;}
.Stay{ width:100%; height:auto; background-color:#FFFFFF; text-align:center; margin:3px auto; font-size:1.5em; color:#003399; max-width:980px; }
.texthidden{
	display:block; /*轉換為塊級元素*/
	height:0; 
	width:0; 
	overflow:hidden;
	}/*隱藏文字，切勿使用display:none;*/

table{
	max-width:1200px;
	text-align: center;}

.TOP-WEB {
	text-decoration:none;
    color:  #FF3;
    font-size: 25px;
    text-align:center;
    background-color:#000;
}
.add {
	font-size: 16px;
	color: #FF9;
	background-color: #000;
    text-align: center;
}
.add2 {
	font-size: 15px;
	color: #FFF;
	background-color: #000;
    text-align: center;
}
.add3 {
	font-size: 20px;
	color: #FF3;
	text-decoration: blink;
	background-color: #000;
    text-align: center;
}

.Stay{  
	text-align:center; 
	margin:0 auto;
	padding:2% auto;
	font-size: 30px;
}

.footer {
	font-family: "微軟正黑體";
	font-size: 16px;
	color: #FF9;
	background-color: #000;
	text-align:center;
    padding:0 auto;
	
}
.footer2 {
	font-family: "微軟正黑體";
	font-size: 15px;
	color: #FFF;
	background-color: #000;
    
}
.footer3 {
	font-family: "微軟正黑體";
	font-size: 20px;
	color: #FF3;
	text-decoration: blink;
	background-color: #000;
    text-align:center; 
   
}


.red{ color: #C00E11; font-size:36px; 
    font-weight:bold;}
.red2{ color: #C00E11;font-weight:bold;}
.yel{ color: #C9BC9C; font-size:30px; 
    font-weight:bold;}
.mark{ color: #C00E11; font-size:24px; 
    font-weight:bold;}
.gr{ color: #47AC93; font-size:28px; 
    font-weight:bold;}
.text-orange{color:#eb7624;font-size:24px;font-weight:bold;}
.pale-orange,.hover-pale-orange:hover{color:#5F5479!important;background-color:#FCF2E9!important}
.black{ color: #000; font-size:24px; }

.bnmc{background-color:#A48B78;}

.bnmc2{background-color:#056A8D;}
.bert{background-color:#DDCE78;}
/* == 桌機版 ============================================================================= */
	





/*間距*/
.padding-lr{
	width:100%;
text-align:center;
padding:3% 0;
}

.center{	
	max-width:1200px;	
	margin:0 auto;}

.padding-lr ul{width:100%;}

.padding-lr li{
	width:356px;
	display:inline-block;
	height:auto;
	text-align:center;
	margin:0 auto;
    padding:1% 1%;
	}



.Stay{ width:100%; 
    height:auto;
text-align:center; 
    margin:0% auto;
   padding:2% 1% 1% 1%;
    font-size:2em; color:#fff;
    max-width:1200px; }

/*影片*/
.sel{
	width:100%;max-width:1000px;
       padding:2% 1%;
    overflow: hidden;
    font-family:'微軟正黑體', Arial, Helvetica, sans-serif;
	margin:0 auto;

       
}
.sel li{
	width:48%; 
	height:430px;
margin:1% 1%;
padding: 1% 1%;
     background-color: #fff;
	text-align: center;
     color:#FE5757;
    font-weight:bold;
font-size:35px;
     float:left;
 transition:0.5s;
	}

.sel t{
color:#5480C1;
font-weight:bold;
font-size:25px;
	}

.sel li a{
    
   background-color: #fff;

}
 


.sel li:hover{
	transform:scale(0.95,0.95);}


.sel ki{        
	padding:4% 1%;
	float:left;   
	background-color:#0A1B6B;
margin:5% 1%;
	width:48%;
	height:auto;
	font-size:30px;
	font-weight:bolder;
	text-align:center;
	display:inline-block;
	margin-bottom:1%;
	border-radius:10px;
	transition:0.5s;}
.sel ki a{
	color:#fff;
	display:block;
	text-decoration:none;}
.sel  img{
		width:30%;height:auto;
}


.sel ki:hover{
	background-color:#0C66C5;
	transform:scale(0.95,0.95);}


/* == 手機版 ============================================================================= */
@media screen and (max-width:767px){
	/*置頂選單*/
/*nav*/
.nav{
padding:0 8% 0 0; display: flex;
	justify-content: center;
	background: #F8A417;
	z-index:1;
	width:100%;
	height: auto;
	position:fixed;
	text-align:center;
}
.nav ul{
	display:flex;justify-content: space-between;width:1150px;text-decoration: none;
	max-width:1200px;
	text-align:center;}
.nav li{
	width:16%;
	font-size:18px;
	display:inline-block;
	border-right:#fff 1px solid;
	vertical-align:middle;
	line-height:25px;
	padding: 1% 1% 0 1%;
	font-weight:bold;
	color:#FFF;}	
.nav li:last-child{
	border-right:none;}
.nav li a{
	display:block;
	color:#FFF;
	text-decoration:none;
	font-weight:bold;
}	

.nav ul li a::after{content: '';background: #fff;height: 2px;width: 0;position: absolute;bottom:0;left: 51%;transition: all .5s;}
.nav ul li i{color:#FFF;animation: upDown 1s linear infinite;}
@keyframes upDown{
0%{transform: translateY(0px);}
25%{transform: translateY(-5px);}
75%{transform: translateY(5px);}
100%{transform: translateY(0px);}
}

.nav ul a i{animation: none;}


body{
	background-position:20% 5%;
	background-size: auto;
    background-position: center top;}      
    
/*按鈕*/
.btn{ 
    padding:2% 0 ; 
	width:100%;
	text-align:center;
    background-color: #ADCDDA;
	}
.btn h2{
    font-size:1.8em; 
	line-height:1.6;
	color:#000;
	}
.btn ul{
	margin:0 auto; 
	width:100%; 
	list-style:none;
	}
.btn li{ 
    display:inline-block; 
	margin:4px; 
	padding:0; 
	width:80%; 
	}
.btn li a{
	display:block; 
	border-radius:6px; -webkit-border-radius:6px; 
	background:#FFF;
    font-size:1.2em; 
	line-height:40px; 
	text-decoration:none; 
	color:#C30D23;
	transition:0.5s;
	}
.btn li a:hover{ 
    transform:translate(0,5px);
    box-shadow:1px 1px 15px rgba(20%,20%,40%,0.5);
	}
    

    
/*間距*/
.padding-lr{
	width:100%;
    padding:3% 0; }
.center{	
	max-width:1200px;	
	margin:0 auto;}

.padding-lr ul{width:100%;}

.padding-lr li{
	width:43%;
	display:inline-block;
	height:auto;
	margin:0 auto;
    text-align:center;
	}	
    
    
    
.Stay{ width:100%; 
    height:auto;
text-align:center; 
    margin:0% auto;
   padding:2% 1% 1% 1%;
    font-size:1em; color:#fff;
    max-width:1200px; }
    
 /*影片*/
.sel{
	width:100%;max-width:1000px;
       padding:1% 1%;
    overflow: hidden;
    font-family:'微軟正黑體', Arial, Helvetica, sans-serif;
	margin:1% auto;

       
}
.sel li{
	width:95%; 
	height:355px;
margin:2%;
padding: 0;
     background-color: #fff;
	text-align: center;
     color:#FE5757;
    font-weight:bold;
font-size:35px;
     float:left;
 transition:0.5s;
	}

.sel t{
color:#5480C1;
font-weight:bold;
font-size:25px;
	}

.sel li a{
    
   background-color: #fff;

}
 


.sel li:hover{
	transform:scale(0.95,0.95);}


.sel ki{        
	padding:4% 1%;
	float:left;   
	background-color:#0A1B6B;
margin:5% 1%;
	width:48%;
	height:auto;
	font-size:30px;
	font-weight:bolder;
	text-align:center;
	display:inline-block;
	margin-bottom:1%;
	border-radius:10px;
	transition:0.5s;}
.sel ki a{
	color:#fff;
	display:block;
	text-decoration:none;}
.sel  img{
		width:30%;height:auto;
}


.sel ki:hover{
	background-color:#0C66C5;
	transform:scale(0.95,0.95);}   
    
}