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

/*------------共用區------------*/



*{
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;
    -webkit-box-sizing:border-box;
	list-style:none;
}



body {
	-webkit-text-size-adjust:100%;/*避免ios用戶字體自動放大*/
	font-family:'微軟正黑體', Arial, Helvetica, sans-serif;
width:100%;
	height:100%;
    background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center top;
	background-color:#F29A6B;
}


ul{list-style:none;}
td{ padding:5px;}
.Stay{ width:100%; height:auto; background-color:#FBE4DB; text-align:center; margin:3px auto; font-size:1.5em; color:#003399; max-width:980px; }


.supbig_text{ font-size:44px;}
.left_ali{ text-align:left;}
.center_ali{ text-align:center;}
.w_bg{ background-color:#EEEEEF;}

.fbg{
    	width:100%;
	max-width:1000px;
background-color:;

}

.small{
	font-size:30px;
color: #000;
	font-weight: bold;
  text-align:center;
    margin: 1% 0 1% 0;
}

.vid{ width:980px; height:570px; text-align:center; margin:0 auto;}

.bg-video{
	background-position:center!important;
	background-size: cover!important;
	-ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
    padding:0 2% ;
}

img{ border: 0;}





/*------------桌機板------------*/



/*nav*/
nav{padding: 1% 0;
	display: flex;justify-content: center;
	background-color:#FFF;
	z-index:1;
	width:100%;
	position:fixed;
}
nav ul{display:flex;justify-content: space-between;
	text-decoration: none;
	max-width:900px;
	margin:0 auto;
	padding:0;
}
nav li {position: relative;
	transition:0.5s;
	padding:0 5%;
}

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

@keyframes slideR{
 0%{transform: translateX(0);}
 50%{transform: translateX(10px);}
 100%{transform: translateX(0);}
}



.bnn3{ width:1200px; margin:0 auto; padding:0.5%;}
.bnn3 ul{list-style:none; text-align:center}
.bnn3 li{ width:50%; margin:1%;padding:1%; font-size:35px; font-weight:bold;color:#FFF;display:inline-block; background-color:#EE7300;border-radius:30px;}
.bnn3 li a{display:block;color:#FFF;text-decoration:none;}

.bnn3 li a:hover{ 
    color:#EAF6FD;
transform:scale(0.95,0.95);
	}


.bnn5{ width:1200px; margin:0 auto; padding:0.5%;}
.bnn5 ul{list-style:none; text-align:center}
.bnn5 li{ width:50%; margin:1%;padding:1%; font-size:35px; font-weight:bold;color:#EE7300;display:inline-block; background-color:#FFF;border-radius:30px;}
.bnn5 li a{display:block;color:#EE7300;text-decoration:none;}

.bnn5 li a:hover{ 
    color:#EAF6FD;
transform:scale(0.95,0.95);
	}






/*各班連結*/
.fram{ width:100%; margin:0 auto; text-align:center;overflow:hidden;}
.fram img{ max-width:980px;}
.t01{ font-size:50px; font-weight:bold; color:#000; text-align:center;}
.t02{width:980px; margin:0 auto; padding:1%; font-size:24px; color:#000; text-align:center; }

.bn3{ width:1100px; margin:0% auto;}

.bn3 li{display:inline-block; width:20%;border:2px solid  #000; font-size:28px; font-weight:bold; text-align:center; color:#000; padding:1%;margin:1% 1% 2% 1%;}
.box1{ width:100%;overflow:hidden;}
.box2{ width:48%;float:left; font-size:24px; color: #FFF; background-color:#D25B3D;
}
.box3{ width:48%;float:right;  font-size:24px; color: #FFF; background-color:#39B54A; }
.box2 a{display:block;color:#FFF;
	text-decoration: none;
}
.box3 a{display:block;color: #FFF;text-decoration: none;}







/*各班連結*/
.link{ 
    padding:1% 0 1% 0; 
	width:100%;
	text-align:center;  
	}
.link h2{
    font-size:1.8em; 
	line-height:1.6;
	color:#605cff;
	font-weight: bold;
	}
.link ul{
	margin:0 auto; 
	width:1000px; 
	list-style:none;
	}
.link li{ 
    display:inline-block; 
	margin:4px; 
	padding:0; 
	width:30%; 
	}
.link li a{
	display:block; 
	border-radius:50px;
	background:#605cff;
    font-size:1.5em; 
	line-height:60px; 
	text-decoration:none; 
	color:#FFFFFF;
	transition:0.5s;
	}
.link li a:hover{ 
    transform:translate(0,5px);
    box-shadow:1px 1px 15px rgba(20%,20%,40%,0.5);
	}


/*line*/
.line{ 
    padding:0 0 3% 0; 
	width:100%;
	text-align:center;  
	}
.line h2{
    font-size:1.8em; 
	line-height:1.6;
	color:#E0552B;
	font-weight: bold;
	}
.line ul{
	margin:0 auto; 
	width:1200px; 
	list-style:none;
	}
.line li{ 
    display:inline-block; 
	margin:4px; 
	padding:0; 
	width:20%; 
	}
.line li a{
	display:block; 
	border-radius:50px; -webkit-border-radius:50px; 
	background:#E0552B;
    font-size:1.5em; 
	line-height:60px; 
	text-decoration:none; 
	color:#FFFFFF;
	transition:0.5s;
	}
.line li a:hover{ 
    transform:translate(0,5px);
    box-shadow:1px 1px 15px rgba(20%,20%,40%,0.5);
	}


.car2{
	width:100%;
    padding:2% 1%;
	margin:2% auto;}
.car2 li{
	background-color:#179017;
     margin:2% 1%;
	width:30%;
	height:45px;
	line-height:45px;
	font-size:25px;
	font-weight:bolder;
	text-align:center;
	display:inline-block;
	margin-bottom:1%;
	border-radius:60px;
	transition:0.5s;}
.car2 li a{
	color:#fff;
	display:block;
	text-decoration:none;}
.car2 li:hover{
	background-color:#042209;
	transform:scale(0.95,0.95);}

.car5{
	width:100%;
    padding:2% 1%;
	margin:2% auto;}
.car5 li{
	background-color:#4687C1;
     margin:2% 1%;
	width:30%;
	height:45px;
	line-height:45px;
	font-size:25px;
	font-weight:bolder;
	text-align:center;
	display:inline-block;
	margin-bottom:1%;
	border-radius:60px;
	transition:0.5s;}
.car5 li a{
	color:#fff;
	display:block;
	text-decoration:none;}
.car5 li:hover{
	background-color:#25547F;
	transform:scale(0.95,0.95);}


/*桌機刊頭*/
#header{
	width:100%;
	margin:0 auto;}

.headeroutside{width:100%;
	background-image: url("../images/bg-h.png");

	background-attachment: fixed;
	background-size: cover;
		
}

/*手機刊頭*/
#header-m{
	width:0;
	height:0;
	overflow:hidden;}

/*內容滿版背景*/
.contentoutside{width:100%;
	background-color:#D2DF80;
}
.contentoutside2{width:100%;
	background-color:#EAF6FD;
}
.contentoutside3{width:100%;
	background-color:#F29A6B;
}
.contentoutside4{width:100%;
	background-color:#FFF;
}
/*桌機內容*/
.content{
	width:100%;
	max-width:1200px;
	margin:0 auto;
	padding:0;
	text-align:center;}

/*圖片切換*/
.pic{
	width:100%;
	margin:0 auto;
	padding:0;
	text-align:center;}
.pic img{
	max-width:1200px;}
.pic-m{
	width:0;
	height:0;
	overflow:hidden;}
.bn{
	width:100%;
    padding:0 1% 2% 1%;
	color:#fff;
	margin:0 auto;}
.bn li{
	background-color:#FD6758;
     margin:0% 1% 1% 1%;
	width:60%;
	height:60px;
	line-height:60px;
	font-size:30px;
	font-weight:bolder;
	text-align:center;
	display:inline-block;
	margin-bottom:1%;
	border-radius:60px;
	transition:0.5s;}
.bn li a{
	color:#fff;
	display:block;
	text-decoration:none;}
.bn li:hover{
	background-color:#0D7A8C;
	color:rgba(255,255,255,1.00);
	transform:scale(0.95,0.95);}
	




/*------------手機板---------------*/
@media screen and (max-width:767px){

/*nav*/
nav{padding: 1% 0; display: flex;justify-content: center;rgba(13,122,140,0.8)
	z-index:1;
	width:100%;
	position:fixed;
	text-align: center;
}
nav ul{display:flex;justify-content: space-between;
	width: 98%;
	padding:0 ;
	margin: 2% 1%;
}	
	

nav li {position: relative;
	transition:0.5s;
	padding: 1%;
}

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

 
 /*按鈕*/

/*桌機刊頭*/
#header{
	width:0;
	height:0;
	overflow:hidden;}
	
/*手機刊頭*/
#header-m{
	display:block;
	width:100%;
	height:auto;
	margin:0;}
	
	
    
/*圖片切換*/
.pic{
	width:0;
	height:0;
	overflow:hidden;}
.pic-m{
	overflow:visible;
	display:block;
	width:100%;
	height:auto;
	margin:0;}



.luie2{ margin:0% auto; 
    padding:1%; 
	width:100%;
	text-align:center; 
	}

.luie2 ul{
	margin:0 auto; 
	padding:0; 
	list-style:none;
	}
.luie2 li{ 
    display:inline-block; 
	margin:1% 0 5% 0; 
	padding:1%; 
width:100%; 
	height:20px;
	font-weight: bold
	}
.luie2 li a{
	display:block; 
	border-radius:10px; 
		background-color:#050F12;
    font-size:30px;  
	text-decoration:none;	
color:#FFFFFF;
	transition:0.5s;
	}
.luie2 li a:hover{ 
	transform:translate(0,5px);
	}
/*line*/
.line{ 
    padding: 0 0 5% 0; 
	width:100%;
	text-align:center;  
	}
.line h2{
    font-size:1.4em; 
	line-height:1.6;
	color:#E0552B;
	font-weight: bold;
	}
.line ul{
	margin:0 auto; 
	width:100%; 
	list-style:none;
	}
.line li{ 
    display:inline-block; 
	margin:4px; 
	padding:0; 
	width:40%; 
	}
.line li a{
	display:block; 
	border-radius:6px; -webkit-border-radius:50px; 
	background:#E0552B;
    font-size:1.2em; 
	line-height:40px; 
	text-decoration:none; 
	color:#FFFFFF;
	transition:0.5s;
	}
.line li a:hover{ 
    transform:translate(0,5px);
    box-shadow:1px 1px 15px rgba(20%,20%,40%,0.5);
	}       
	
	




.bn3{ width:100%; margin:0% auto;}

.bn3 li{display:inline-block; width:50%;border:2px solid  #000; font-size:28px; font-weight:bold; text-align:center; color:#000; padding:1%;margin:1% 1% 2% 1%;}
.box1{ width:100%;overflow:hidden;}
.box2{ width:48%;float:left; font-size:24px; color: #fff; background-color:#D25B3D;
}
.box3{ width:48%;float:right;  font-size:24px; color: #fff; background-color:#39B54A; }
.box2 a{display:block;color:#FFF;
	text-decoration: none;
}
.box3 a{display:block;color: #FFF;text-decoration: none;}




.t01{ font-size:24px; font-weight:bold; color:#fff;}
.t02{width:100%; margin:0 auto; padding:1%; font-size:12px; color:#fff; text-align:center; }
	
.bnn3{ width:100%; margin:0 auto; padding:1%;}
.bnn3 ul{list-style:none; text-align:center}
.bnn3 li{ width:65%; margin:1%;padding:1%; font-size:16px; font-weight:bold; display:inline-block; border-radius:15px;}
.bnn3 li a{display:block;text-decoration:none;}

.bnn5{ width:100%; margin:0 auto; padding:1%;}
.bnn5 ul{list-style:none; text-align:center}
.bnn5 li{ width:65%; margin:1%;padding:1%; font-size:16px; font-weight:bold; display:inline-block; border-radius:15px;}
.bnn5 li a{display:block;text-decoration:none;}


	
.car2{
	width:100%;
    padding:2% 1%;
	margin:2% auto;}
.car2 li{
	background-color:#179017;
 
	width:48%;
	height:45px;
	line-height:45px;
	font-size:20px;
	font-weight:bolder;
	text-align:center;
	display:inline-block;
	margin-bottom:1%;
	border-radius:60px;
	transition:0.5s;}
.car2 li a{
	color:#fff;
	display:block;
	text-decoration:none;}
.car2 li:hover{
	background-color:#042209;
	transform:scale(0.95,0.95);}	
.car5{
	width:100%;
    padding:2% 1%;
	margin:2% auto;}
.car5 li{
	background-color:#4687C1;
	width:48%;
	height:45px;
	line-height:45px;
	font-size:20px;
	font-weight:bolder;
	text-align:center;
	display:inline-block;
	margin-bottom:1%;
	border-radius:60px;
	transition:0.5s;}
.car5 li a{
	color:#fff;
	display:block;
	text-decoration:none;}
.car5 li:hover{
	background-color:#25547F;
	transform:scale(0.95,0.95);}	

.vid{ width:100%; height:auto;}