@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:#F5E7BE;
}


ul{list-style:none;}
td{ padding:5px;}


.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; 
   
}

.supbig_text{ font-size:44px;}
.left_ali{ text-align:left;}
.center_ali{ text-align:center;}
.w_bg{ background-color:#FBEEEE;}

.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;
}


.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% ;
}



/*------------桌機板------------*/

/*nav*/
nav{padding: 15px 0; display: flex;justify-content: center;background: #fff;
	z-index:1;
	width:100%;
	position:fixed;
}
nav ul{display:flex;justify-content: space-between;width:1000px;text-decoration: none;
	max-width:1200px;
}
nav ul li a{font-size: 32px;color: #D6484A;text-decoration: none;position: relative;


}
nav ul li a::after{content: '';text-decoration: none;background:#D6484A;height: 2px;width: 0;position: absolute;bottom:0;left: 51%;transition: all .5s;}
nav ul li i{color:#D6484A;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 li a:hover i{animation: none;}
nav ul li a:active::after{left: 0;width: 100%;}auto;}
nav ul a i{animation: none;}


/*影片*/
.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:#5480C1;
    font-weight:bold;
font-size:28px;
     float:left;
 transition:0.5s;
	}

.sel p{
	
padding:1%;
color:#5480C1;
font-weight:bold;
font-size:20px;
 
	}

.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);}

.btn{
	width:100%;
      padding:2% 1%;
	margin:0% 2%;}
.btn li{
	background-color:#780bce;
	width:30%;
	font-size:2em;
  	margin:1% 1% 1% 1%;
    padding:1% 1% 1% 1%;
	font-weight:bolder;
	text-align:center;
	display:inline-block;
	margin-bottom:1% 3%;
	border-radius:30px;
	line-height: 40px;
	transition:0.5s;}
.btn li a{
	color:rgba(255,255,255,1.00);
	display:block;
	text-decoration:none;transition:0.5s;}
.btn li:hover{
	transform:scale(0.95,0.95);}	


.btn a::after{content:'\f0a5';display: inline-block; font-family:"Font Awesome 5 Free";animation:slideR 1s linear infinite;}



@keyframes slideR{
 0%{transform: translateX(0);}
 50%{transform: translateX(10px);}
 100%{transform: translateX(0);}
}





/*按鈕*/
.car{
	width:100%;
    padding:2% 1%;
	margin:2% auto;}
.car li{
	background-color:#605cff;
     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;}
.car li a{
	color:#fff;
	display:block;
	text-decoration:none;}
.car li:hover{
	background-color:#A554F4;
	transform:scale(0.95,0.95);}





.car2{
	width:100%;
    padding:2% 1%;
	margin:2% auto;}
.car2 li{
	background-color:#179017;
     margin:2% 1%;
	width:70%;
	height:45px;
	line-height:45px;
	font-size:28px;
	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);}
.car3{
	width:100%;
    padding:0 1% 2% 1%;
	color:#fff;
	margin:0 auto;}
.car3 li{
	background-color:#0F2546;
	color:#fff;
     margin:0% 1% 1% 1%;
	width:60%;
	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;}
.car3 li a{
	color:#fff;
	display:block;
	text-decoration:none;}
.car3 li:hover{
	color:#fff;
	background-color:#2C65B3;
	transform:scale(0.95,0.95);}

.cter22{overflow:hidden;
	max-width: 1000px;
    padding:1% 1%;
	margin:1% 1% 2% 1%}
.cter22 li{
float: left; padding:1% 2% 1% 1%;
width:100%;
	transition:0.5s;}
.cter22 li a{
width:48%;
	text-decoration:none;}
.cter22 li:hover{

	transform:scale(0.95,0.95);}


.car5{
	
	width:100%;
    padding:2% 1%;
	margin:2% auto;}
.car5 li{
	background-color:#5480C1;
     margin:2% 1%;
	width:70%;
	height:45px;
	line-height:45px;
	font-size:28px;
	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);}
.car6{
	width:100%;
}
.car6 li{
	width:100%;
	font-weight:bolder;
	text-align:center;
	display:inline-block;
	transition:0.5s;}
.car6 li a{
	display:block;
	text-decoration:none;}
.car6 li:hover{
	transform:scale(0.95,0.95);}
/*按鈕-end*/





/* 各班連結 */
.bn3{ width:1100px; margin:0% auto;}
.bn3 ul{}
.bn3 li{display:inline-block; width:20%;border:2px solid  #15439A; font-size:28px; font-weight:bold; text-align:center; color:#15439A; padding:1%;margin:1% 1% 2% 1%;}
.box1{ width:100%;overflow:hidden;}
.box2{ width:48%;float:left; font-size:24px; color: #000; background-color:#5480C1;
}
.box3{ width:48%;float:right;  font-size:24px; color: #000; background-color:#70BD60; }
.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);
	}
/*浮動連結*/
  div#social-address{
        position:fixed; bottom:50%; left:0; z-index:1000!important;box-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.3);
        font-family: '微軟正黑體'; font-size: 16px!important;text-align: center;
    }
    div#social-address .social-btn{color:white;padding: 16px 8px;cursor: pointer; display: block;}
    div#social-address a{color: inherit;text-decoration:none;}
    div#social-address p{margin:0;}
    div#social-address a:hover,div#social-address .social-btn:hover{-webkit-filter:brightness(60%) contrast(150%);    -o-filter:brightness(60%) contrast(150%);    filter:brightness(60%) contrast(150%);}
    div#social-address img {    width: 1em;    padding: 0 0 0.25em 0;}
    div#social-address .mlu{ background-color:#304E8E;}
    div#social-address .mline{ background-color:#29A339; }
    div#social-address .social-btn.mline{position: relative;}
    div#social-address #social-address-lines{
        position: absolute;
        background: rgba(255, 255, 255, 0.9);
        color: #29A339;
        top: 0%;
        left: 100%;
        margin: 0.5em 0.25em;
        border: 2px solid;
        border-radius: 0.25em;
        box-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.5);
        width: 7em;
        display: inline-table;
    }
    div#social-address #social-address-lines a{display: block;padding: 0 0.5em;}
    div#social-address #social-address-lines a:hover{background: #ededed;}
    div#social-address #social-address-lines p{line-height: 1;border-bottom: 1px solid #ededed;margin: 0;padding: 0.5em 0;}
    div#social-address #social-address-lines a:last-child p{border-bottom: none;}
	



div#social-address .mline2{ background-color:#304E8E; }
    div#social-address .social-btn.mline2{position: relative;}
    div#social-address #social-address-lines2{
        position: absolute;
        background: rgba(255, 255, 255, 0.9);
        color:#304E8E;
        top: 0%;
        left: 100%;
        margin: 0.5em 0.25em;
        border: 2px solid;
        border-radius: 0.25em;
        box-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.5);
        width: 7em;
        display: inline-table;
    }
    div#social-address #social-address-lines2 a{display: block;padding: 0 0.5em;}
    div#social-address #social-address-lines2 a:hover{background: #ededed;}
    div#social-address #social-address-lines2 p{line-height: 1;border-bottom: 1px solid #ededed;margin: 0;padding: 0.5em 0;}
    div#social-address #social-address-lines2 a:last-child p{border-bottom: none;}	





/*刊頭滿版背景*/
.headeroutside{
	width:100%;
	
}
.headeroutside2{
	    background-color: #F5E554;}


.cter22{overflow:hidden;max-width:1100px;
	width:100%;
    padding:1% 1%;
	margin:1% 1%}
.cter22 li{
float: left; padding:1% 2%;
	width:48%;
	transition:0.5s;}
.cter22 li a{

	text-decoration:none;}
.cter22 li:hover{

	transform:scale(0.95,0.95);}


/*桌機刊頭*/
#header{
	width:100%;
	max-width:1100px;
    
	margin:0 auto;}

	
/*手機刊頭*/
#header-m{
	width:0;
	height:0;
	overflow:hidden;}


/*內容滿版背景*/
.contentoutside{width:100%;
}

.contentoutside02{
width:100%;
	background-color:#D3E1F8;
}

.contentoutside03{
width:100%;
	height:100%;
    background-attachment: fixed;
	background-image: url("../images/bg2.png");
	background-repeat: no-repeat;
	background-position: center top;
}
.contentoutside04{
width:100%;
	height:100%;
    background-attachment: fixed;
	background-image: url("../images/bg3.png");
	background-repeat: no-repeat;
	background-position: center top;
}
.contentoutside05{
width:100%;
	height:100%;
    background-attachment: fixed;
	background-image: url("../images/bg4.png");
	background-repeat: no-repeat;
	background-position: center top;
}
.contentoutside06{
width:100%;
	height:100%;
    background-attachment: fixed;
	background-image: url("../images/bg5.png");
	background-repeat: no-repeat;
	background-position: center top;
}
/*桌機內容*/
.content{
	width:100%;
	max-width:1100px;
	margin:0 auto;
	padding:2% 1%;
	text-align:center;}

.content2{
	width:100%;
	max-width:1100px;
	margin:0 auto;
	text-align:center;}

/*圖片切換*/
.pic{
	width:100%;
	margin:0 auto;
	padding:0;
	text-align:center;}
.pic img{
	margin:1% 0;}
.pic-m{
	width:0;
	height:0;
	overflow:hidden;}
.class{
overflow:hidden;
	background-color: #E1FBFF;
	padding:3% 0 3% 10%;
	max-width: 1000px;
	text-align: center;
	margin:2% auto;}
.class .left{
float: left;
	margin:0 0 0 3%;
width: 17%;}
.class .right{
float: left;
width: 80%;}
.class .st{float:left;
	text-align: center;
	font-size:32px;
	padding:6px;
	width:80%;
	margin:0 0 2% 5%;
	height:auto;
	border-radius:30px;
	font-weight:bold;
	background-color: #2E85A3;
	color:#FFFFFF}

.class .brwon_w{
	width:80%;
	margin:0 0% 0 5%;
	color:#72604C;
	font-size:28px;
	font-weight:bold;}	
.r{
	color:#D84800;
	font-size:28px;
	font-weight:bold;}
.class2{
overflow:hidden;
	padding:3% 0 3% 10%;
	max-width: 1000px;
	text-align: center;
	margin:2% auto;}
.class2 .left{
float: left;
	margin:0 0 0 3%;
width: 17%;}
.class2 .right{
float: left;
width: 80%;}
.class2 .st{float:left;
	text-align: center;
	font-size:32px;
	padding:6px;
	width:80%;
	margin:0 0 2% 5%;
	height:auto;
	border-radius:30px;
	font-weight:bold;
	background-color: #2E85A3;
	color:#FFFFFF}

.class2 .brwon_w{
	width:80%;
	margin:0 0% 0 5%;
	color:#72604C;
	font-size:28px;
	font-weight:bold;}	
.wh{
	font-size:20px;
	color: white;
}

.class3{
overflow:hidden;
	background-color: #FFFFFF;
	padding:3% 0 3% 10%;
	max-width: 1000px;
	text-align: center;
	margin:2% auto;}
.class3 .left{
float: left;
	margin:0 0 0 3%;
width: 20%;}
.class3 .right{
float: left;
width: 70%;}
.class3 .st{float:left;
	text-align: center;
	font-size:32px;
	padding:6px;
	width:80%;
	margin:0 0 2% 5%;
	height:auto;
	border-radius:30px;
	font-weight:bold;
	background-color: #D84800;
	color:#FFFFFF}

.class3 .brwon_w{
	width:80%;
	margin:0 0% 0 5%;
	color:#72604C;
	font-size:28px;
	font-weight:bold;}	

.btn2{
	width:80%;
	margin:1% auto;
	background-color:#FFFFFF;
	color:#5E6FAC;
	padding:8px 32px;
	font-size:20px;
	border-radius:50px;
	transition:.5s;}	
.btn:hover{
	transform:translate(0,5px);}
.btn2:hover{
	transform:translate(0,5px);}	
.discount .btn{
	width:80%;
	margin:1% auto;
	background-color:#FF0;
	color:#5E6FAC;}
.btn a{
	display:block;
	text-decoration:none;
	color:#208669;}
.btn2 a{
	display:block;
	text-decoration:none;
	display:block;
	text-decoration:none;
	color:#5E6FAC;}	
.discount .btn a{
	color:#5E6FAC;}





/*------------手機板---------------*/
@media screen and (max-width:767px){
	
/*影片*/

.sel{
	width:100%;
       padding:2% 1%;
    overflow: hidden;
    font-family:'微軟正黑體', Arial, Helvetica, sans-serif;
	margin:0 auto;
	margin:0 auto;
       
}
.sel li{
	width:100%; 
	height:auto;
margin:1% 1%;
padding: 1% 1%;
     background-color: #fff;
	text-align: center;
     color:#5480C1;
    font-weight:bold;
font-size:28px;
     float:left;
 transition:0.5s;
	}

.sel p{
	
padding:1%;
color:#5480C1;
font-weight:bold;
font-size:20px;
 
	}

.sel li a{
    
   background-color: #fff;

}
 
.sel li:hover{
	transform:scale(0.95,0.95);}


.sel ki{        
	padding:1% 1%;
	float:left;   
	background-color:#0A1B6B;
margin:1% 1%;
	width:100%;
	height:auto;
	font-size:28px;
	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);}

/*nav*/
.nav{width: 100%;
	z-index:1;
	}
nav ul{width: 95%;margin: 0 auto;
	justify-content: space-between;
	}
nav ul li a{font-size: 15px;
	vertical-align:middle;}	
nav{padding:1% 0;
	height: 38px;
	}
nav ul li{margin: 0 auto;
	text-align: center;
	margin-top:4px;}

nav ul a i{animation: none;}
	
.b {
	overflow: hidden;
	max-width: 1000px;
	margin:0 auto;
	padding:0;
	 
}



.b .left{width:100%;
	margin:4% 1% 1% 1%;
	float:left;
	transition:0.5s;
}


.b .right{width:100%;
	margin:4% 1% 1% 1%;
		float: left;
	transition:0.5s;
}


.b .left:hover{
transform:scale(0.95,0.95);}


.b .right:hover{
transform:scale(0.95,0.95);}

 


/*按鈕*/
.car{
	width:100%;
    padding:2% 1%;
	margin:2% auto;}
.car li{
	background-color:#605cff;
 
	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;}
.car li a{
	color:#fff;
	display:block;
	text-decoration:none;}
.car li:hover{
	background-color:#A554F4;
	transform:scale(0.95,0.95);}

	
.car2{
	width:100%;
    padding:2% 1%;
	margin:2% auto;}
.car2 li{
	background-color:#179017;
 
	width:70%;
	height:45px;
	line-height:45px;
	font-size:24px;
	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);}
.car3{
	width:100%;
    padding:0 1% 2% 1%;
	color:#fff;
	margin:0 auto;}
	
	
	.car3 li{
	background-color:#0F2546;
	color:#fff;
     margin:0% 1% 1% 1%;
	width:60%;
	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;}
.car3 li a{
	color:#fff;
	display:block;
	text-decoration:none;}
.car3 li:hover{
	color:#fff;
	background-color:#2C65B3;
	transform:scale(0.95,0.95);}

.car4{
	width:100%;
    padding:0 1% 2% 1%;
	color:#fff;
	margin:0 auto;}
.car4 li{
	background-color:#29B3C1;
     margin:0% 1% 1% 1%;
	width:80%;
	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;}
.car4 li a{
	color:#fff;
	display:block;
	text-decoration:none;}
.car4 li:hover{
	color:#29B3C1;
	background-color:#F15A24;
	transform:scale(0.95,0.95);}
.car5{
	width:100%;
    padding:2% 1%;
	margin:2% auto;}
.car5 li{
	background-color:#5480C1;
	width:70%;
	height:45px;
	line-height:45px;
	font-size:24px;
	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);}
.r{
	color:#D84800;
	font-size:20px;
	font-weight:bold;}	
.class{
overflow:hidden;
	background-color: #E1FBFF;
	padding:3% 0 3% 10%;
	max-width: 1100px;
	text-align: center;
	margin:1% auto;}
.class .left{
float: left;

	margin:3% 0 0 0;
width: 15%;}
.class .right{
float: left;
width: 82%;}
.class .st{float:left;
	text-align: center;
	font-size:17px;
	padding:6px;
	width:80%;
	margin:0 0 2% 2%;
	height:auto;
	border-radius:30px;
	font-weight:bold;
	background-color: #2E85A3;
	color:#FFFFFF}

.class .brwon_w{
	width:80%;
	margin:0 0 0 2%;
	color:#72604C;
	font-size:13px;
	font-weight:bold;}	
.class2{
overflow:hidden;
	padding:3% 0 3% 10%;
	max-width: 1100px;
	text-align: center;
	margin:2% auto;}
.class2 .left{
float: left;
	margin:3% 0 0 0;
width: 15%;}
.class2 .right{
float: left;
width: 82%;}
.class2 .st{float:left;
	text-align: center;
	font-size:17px;
	padding:6px;
	width:80%;
	margin:0 0 2% 2%;
	height:auto;
	border-radius:30px;
	font-weight:bold;
	background-color: #2E85A3;
	color:#FFFFFF}

.class2 .brwon_w{
	width:80%;
	margin:0 0 0 2%;
	color:#72604C;
	font-size:13px;
	font-weight:bold;}	
	
.wh{
	font-size:12px;
	color: white;
}
	

.class3{
overflow:hidden;
	background-color: #FFFFFF;
	padding:3% 0 3% 10%;
	max-width: 1000px;
	text-align: center;
	margin:2% auto;}
.class3 .left{
float: left;
	margin:0 0 0 3%;
width: 25%;}
.class3 .right{
float: left;
width: 65%;}
.class3 .st{float:left;
	text-align: center;
	font-size:20px;
	padding:6px;
	width:80%;
	margin:0 0 2% 5%;
	height:auto;
	border-radius:30px;
	font-weight:bold;
	background-color: #D84800;
	color:#FFFFFF}

.class3 .brwon_w{
	width:80%;
	margin:0 0% 0 5%;
	color:#72604C;
	font-size:15px;
	font-weight:bold;}	
.class4{
overflow:hidden;
	padding:3% 0 3% 10%;
	max-width: 1000px;
	text-align: center;
	margin:2% auto;}
.class4 .left{
float: left;
	margin:0 0 0 3%;
width: 25%;}
.class4 .right{
float: left;
width: 65%;}
.class4 .st{float:left;
	text-align: center;
	font-size:20px;
	padding:6px;
	width:80%;
	margin:0 0 2% 5%;
	height:auto;
	border-radius:30px;
	font-weight:bold;
	background-color: #D84800;
	color:#FFFFFF}

.class4 .brwon_w{
	width:80%;
	margin:0 0% 0 5%;
	color:#72604C;
	font-size:15px;
	font-weight:bold;}		

/*-end*/

.bn3{ width:100%; margin:0% auto;}
.bn3 ul{}
.bn3 li{display:inline-block; width:90%;border:2px solid  #15439A; font-size:28px; font-weight:bold; text-align:center; color:#15439A; padding:1%;margin:1% 1% 2% 1%;}
.box1{ width:100%;overflow:hidden;}
.box2{ width:48%;float:left; font-size:24px; color: #000; background-color:#5480C1;
}
.box3{ width:48%;float:right;  font-size:24px; color: #000; background-color:#70BD60; }
.box2 a{display:block;color:#FFF;
	text-decoration: none;
}
.box3 a{display:block;color: #FFF;text-decoration: none;}



    
/*桌機刊頭*/
#header{
	width:100%;
	height:auto;
	overflow:hidden;}
	
/*手機刊頭*/
#header-m{
	overflow:visible;
	display:block;
	width:0;
	height:0;
	margin:0 auto;}
	
    
/*圖片切換*/
.pic{
	width:0;
	height:0;
	overflow:hidden;}
.pic-m{
	overflow:visible;
	display:block;
	width:100%;
	height:auto;
	margin:0;}
.pic-m img{
	margin:3% auto;}
  



.btn{
	width:100%;
      padding:1% 1%;
	margin:0% 1%;}
.btn{
	width:100%;
      padding:2% 1%;
	margin:0% 2%;}
.btn li{
	background-color:#780bce;
	width:30%;
	font-size:22px;
  	margin:1% 1% 1% 1%;
    padding:1% 1% 1% 1%;
	font-weight:bolder;
	text-align:center;
	display:inline-block;
	margin-bottom:1% 3%;
	border-radius:30px;
	line-height: 40px;
	transition:0.5s;}
.btn li a{
	color:rgba(255,255,255,1.00);
	display:block;
	text-decoration:none;transition:0.5s;}
.btn li:hover{
	transform:scale(0.95,0.95);}	


.btn a::after{content:'\f0a5';display: inline-block; font-family:"Font Awesome 5 Free";animation:slideR 1s linear infinite;}


.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);
	}       
    	
/*各班連結*/
.link{ 
    padding:1% 0 1% 0; 
	width:100%;
	text-align:center;  
	}
.link h2{
    font-size:1.2em; 
	line-height:1.6;
	color:#605cff;
	font-weight: bold;
	}
.link ul{
	margin:0 auto; 
	list-style:none;
	}
.link li{ 
    display:inline-block; 
	margin:2px; 
	padding:0; 
	width:40%; 
	}
.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);
	}
.cter22{
	width:100%;
    padding:1% 1%;
	margin:1% 1%}
.cter22 li{
float: left; padding:1% 1%;
	width:96%;
	transition:0.5s;}
.cter22 li a{

	text-decoration:none;}
.cter22 li:hover{

	transform:scale(0.95,0.95);}

  /*nav*/
nav{padding: 20px 0; display: flex;
	justify-content: center;
	background: #fff;
	z-index:1;
	width:100%;
	height: auto;
	position:fixed;
}
nav ul{display:flex;justify-content: space-between;width:100%;text-decoration: none;

}
nav ul li a{font-size:20px;color: #D6484A;
	text-decoration: none;position: relative;


}
nav ul li a::after{content: '';text-decoration: none;background:#D6484A;
	height: 10px;width: 0;position: absolute;bottom:0;left: 50%;transition: all .5s;}
nav ul li i{color:#007FB7;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 li a:hover i{animation: none;}
nav ul li a:active::after{left: 0;width: 100%;}auto;}
nav ul a i{animation: none;}  


/*浮動連結*/
div#social-address{ width: 100%;bottom: 0;content: "";display: inline-block;clear: both; }
    div#social-address .social-btn{ display: block;float: left;width: 49.99%;padding: 8px 0;}
    div#social-address img {    width: 1em;    padding:0.25em 0.25em 0 0;}
    div#social-address br{display: none;}
    div#social-address .mlu{display: inline-block; }
    div#social-address #social-address-lines{width: 100%;top:initial;bottom:100%;left: 0;}
 
     div#social-address #social-address-lines2{width: 100%;top:initial;bottom:100%;left: 0;}   
   
    