@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);
body {
	margin: 0;
	/* font-weight: bolder; */
	font-size: 100%;
	font-family: 'Noto Sans TC', "Times New Roman", sans-serif;

	color: white;
	text-align: center;
	padding-top: 4em;
}
a:link {
	text-decoration: none;
	border:0px;
}
.w5{
	color:#0A7016;
}
a:visited {
	text-decoration: none;
	border:0px;

}
a:hover {
	text-decoration: none;
	border:0px;

}
a:active {
	text-decoration: none;
	border:0px;

}
.align {
	text-align: center;
	clear: both;
	width: auto;
	margin-right: 10px;
	margin-left: 10px;
}
header{
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 999;
	background-color: #FFF;
}
#logo img {
	border: 0;
	outline: none;
	padding-top:15px;
}
nav {
	width: 100%;
	background-color: #f4f4f4;
	height: auto;
	clear: both;
}
#navs ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 100%;
}
#navs li {
	float: left;
}
#navs li a {
	display: block;
	color: #666;
	text-align: center;
	text-decoration: none;
	/* [disabled]padding-left: 10px;*/
	width: 88px;
	font-size: 1em;
	font-weight: 400;
	padding-top: 30px;
	height: 55px;
	padding-left:2px;
	padding-right:2px;
}
#navs li a:hover:not(.active) {
	background-color: #666666;
	color: #FFF;
	padding-left:2px;
	padding-right:2px;

}
.active {
}
aside{
	width: 100%;
	margin-top: 100px;
	overflow: hidden;
	text-align: center;
	margin-bottom: 0px;
}
aside img{
	width:100%;
	height:auto;
}
.content{
	width: 100%;
	margin: 0px;
	padding-top: 5em;
	padding-right: 0px;
	padding-bottom: 5em;
	padding-left: 0px;
	}
.color2_gra{
background: linear-gradient(to top, #eb9d62 0%, #feeeee 100%);}
.color_bg1{
	background-color: #E1E1E8;
	}
.color_bg2{
	background-color: #EFEFEF;
	}
/* base styles */
.flexslider {
	margin: 0;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 2px;
	padding-left: 0;
}
.flexslider .slides > li {
	display: none;
	-webkit-backface-visibility: hidden;
}
.flexslider .slides img {
	max-width:100%;
	display: block;
}
.flexslider .slides:after {
	content: "\0020";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
html[xmlns] .flexslider .slides {
	display: block;
}
* html .flexslider .slides {
	height: 1%;
}
.no-js .flexslider .slides > li:first-child {
	display: block;
}
.slides, .slides > li, .flex-control-nav, .flex-direction-nav {
	margin: 0;
	padding: 0;
	list-style: none;
}


.b1:after {
  position: absolute;
  content: "首  頁";
  position: unset;
  

}

.b1:hover:after {
  content: "Home";
 
}

.b2:after {
  position: absolute;
  content: "藝 文 展 演";
  position: unset;

}

.b2:hover:after {
  content: "Activity";
  position: unset;
  
}


.b3:after {
  position: absolute;
  content: "學 術";
  position: unset;
 
 
}

.b3:hover:after {
  content: "Academic";
  position: unset;
 
}

.b4:after {
  position: absolute;
  content: "檢 定";
  position: unset;

 
}

.b4:hover:after {
  content: "Verification";
  font-size:15px;
  
}

	
.b5:after {
  position: absolute;
  content: "閱 讀";
  position: unset;
 
 
}

.b5:hover:after {
  content: "Reading";
  
}

.b6:after {
  position: absolute;
  content: "表 達";
  position: unset;


}

.b6:hover:after {
  content: "Expression";
 
}


.b7:after {
  position: absolute;
  content: "思 辨";
  position: unset;


}

.b7:hover:after {
  content: "Speculation";
  font-size:15px;
  
}


.b8:after {
  position: absolute;
  content: "競 賽";
  position: unset;
 

}

.b8:hover:after {
  content: "Competition";
  font-size:14px;

}


.b9:after {
  position: absolute;
  content: "報 導 選 錄";
  position: unset;
 
  
}

.b9:hover:after {
  content: "News";
}

.z1{
	margin-top:32px;
    font-weight: lighter;
    opacity:0.6;
	color:#999;

}





.button1 {
    background-color: #72c2dd;
    border: none;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    cursor: pointer;
	border-radius: 2px;
}

.button1:hover {
    background-color: #51a4c0;
}

.button2 {
    background-color: #4a65ab;
    border: none;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    cursor: pointer;
	border-radius: 2px;
}

.button2:hover {
    background-color: #2a3f74;
}

.button3 {
    background-color: #873da5;
    border: none;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    cursor: pointer;
	border-radius: 2px;
}

.button3:hover {
    background-color: #66317c;
}

.button4 {
    background-color: #e74880;
    border: none;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    cursor: pointer;
	border-radius: 2px;
}

.button4:hover {
    background-color: #ca4272;
}

.button5 {
    background-color: #dea305;
    border: none;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    cursor: pointer;
	border-radius: 2px;
}

.button5:hover {
    background-color: #b68503;
}

.button6 {
    background-color: #578a45;
    border: none;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    cursor: pointer;
	border-radius: 2px;
}

.button6:hover {
    background-color: #436c35;
}

.button7 {
    background-color: #5ab1a2;
    border: none;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    cursor: pointer;
	border-radius: 2px;
}

.button7:hover {
    background-color: #418579;
}


.button8 {
    background-color: #9e612a;
    border: none;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    cursor: pointer;
	border-radius: 2px;
}

.button8:hover {
    background-color: #6a401b;
}


.menu{
	float: right;
}
.menu li{
	float: left;
}
.menu li a{
	display: block;
	color: #69CA62;
	text-decoration: none;
	padding: 1em;
}

/*在PC上隱藏漢堡選單*/
.showmenu{
	display: none;
}
@media (max-width: 1200px) {
	.menu{
		/*隱藏選單開始*/
		max-height: 0;
		overflow: hidden;
		/*隱藏選單結束*/
		/*漸變效果*/
		transition: max-height 2.3s;
		margin-top: 1px;
    	/*絕對定位疊在網頁上*/
		position: absolute;
    	/*權重*/
		z-index: 122;
    	/*header 80px+1px boder 線條*/
	
		/* left:0 right:0表示滿版 */
		left: 0;
		right: 0;
		background: #d5deef;
	}
	.menu li{
		float: none;
		border-bottom: 1px dashed #69CA62;
	}
	.menu li a{
    	transition: all 0.3s;
  	}
	.menu li a:hover{
    	background: #69CA62;
    	color: #fff;
  	}
	.showmenu{
    	display: block;
    	float: right;
    	margin: 1em;
    	background: none;
    	border: none;
    	display: inline-block;
    	position: absolute;
    	top: 5px;
    	right: 0;
    	
   }

button.showmenu {}
  	/*jQuery點擊後動態在 body 加上 class */
  	.menu-show .menu{
  		max-height: 500px;
  	}
	
	.icon-bar{
    background-color: #5667dc;
    display: block;
    height: 4px;
    margin: 0 auto 4px;
    width: 30px;
  
}

	
	
	

}