@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-image: url(../images/tbg.png);
   background-color: #EEECDE;
	background-repeat: no-repeat;
	background-position: center top;
}
ul{list-style:none;}
td{ padding:5px;}

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;
	margin:0 auto;
}
.footer2 {
	font-family: "微軟正黑體";
	font-size: 15px;
	color: #FFF;
	background-color: #000;
    text-align:center; 
}
.footer3 {
	font-family: "微軟正黑體";
	font-size: 20px;
	color: #FF3;
	text-decoration: blink;
	background-color: #000;
    text-align:center; 
}




.wh_line{
	border-bottom:#FFF solid 1px;}
.wh_text{
	color:#FFF;}
.yel_text{
    font-size: 24px;
	color:#FF0;}
.pink_text{
	color:#AC3B58;}
.cb_text{
	color:#410B1C;}
.bp_text{
	color:#5B66CC;}
.py_text{
	color:#C61F44;}

.dfdfdf{ 
    background-color:#EEECDE;}
.ioioio{ 
    background-color:#E3E8C7;}
.bbbbb{
    background-color:#E6C28B;}
.ppppp{
    background-color:#FDDDE3;}
.hhhhh{
    background-color:#F6F9E3;}
.ccccc{
    background-color:#CAEFF9;}
.ggggg{
    background-attachment: fixed;
	background-image: url(../images/bg2.png);
   background-color: #EEECDE;
	background-repeat: no-repeat;}
.s8_text{ font-size:18px;}
.m8_text{ font-size:28px;}
.m0_text{ font-size:20px;}
.b2_text{ font-size:32px;}
.supbig_text{ font-size:44px;}
.left_ali{ text-align:left;}
.center_ali{ text-align:center;}
.wb_bg{ background-color:#fff;}

.fbg{
    	width:100%;
	max-width:1000px;
background-color:
background: -webkit-linear-gradient(-50deg, rgb(237, 121, 142), rgb(232, 66, 88));
background: linear-gradient(-50deg, rgb(237, 121, 142), rgb(232, 66, 88));}

/*------------桌機板------------*/
/*置頂選單*/
.nav{
	width:100%;
	background-color:#184F6D;
	
	position:fixed;
	top:0;
	z-index:1;
	font-weight:bold;
}
.nav ul{
	max-width:1000px;
	margin:0 auto;
	padding:0;
	text-align:center;}
.nav li{
	width:24%;
	height:70px;
	font-size:24px;
	display:inline-block;
	border-right:#BDE3EA 1.5px solid;
	vertical-align:middle;
	line-height:32px;
	font-weight:bold;
	}	
.nav li:last-child{
	border-right:none;}
.nav li a{
	display:block;
	color:#BDE3EA;
	text-decoration:none;
	font-weight:bold;
}
.tiot{
	width:100%;
	max-width:1000px;
	margin:0 auto;
	padding:1% 0;
	text-align:center;
	color:#060606;
	font-size:12px;
}

.t {
	overflow: hidden;
	max-width: 1000px;
	margin:0 auto;
	padding:0;
	 
}



.t .left{width:49%;
	margin: 0.5%;
	float:left;
	transition:0.5s;
}

.t .right{width:49%;
	margin: 0.5%;
		float: left;
	transition:0.5s;
}

.t .left:hover{
transform:scale(0.95,0.95);}


.t .right:hover{
transform:scale(0.95,0.95);}

.e {
	overflow: hidden;
	max-width: 1000px;
	margin:0 auto;
	padding:0;
}

.e .left{width:49%;
	margin: 0.5%;
	float:left;
	transition:0.5s;
}

.e .right{width:49%;
	margin: 0.5%;
		float: left;
	transition:0.5s;
}

.e .left:hover{
transform:scale(0.95,0.95);}


.e .right:hover{
transform:scale(0.95,0.95);}


.d {
	overflow: hidden;
	max-width: 1000px;
	margin:0 auto;
	transition:0.5s;
	
}
.d .left{width:32%;
	margin: 0.5%;
	float: left;
	transition:0.5s;
}
.d .cnter{width:32%;
	margin: 0.5% 0 0.5% 0.5% ;
		float: left;
	transition:0.5s;
}

.d .right{width:32%;
	margin: 0.5%;
		float: left;
	transition:0.5s;
}

.d .left:hover{
transform:scale(0.95,0.95);}

.d .cnter:hover{
transform:scale(0.95,0.95);}


.d .right:hover{
transform:scale(0.95,0.95);}


/*各班連結*/
.link{ 
    padding:0 0 3% 0; 
	width:100%;
	text-align:center;  
	}
.link h2{
    font-size:1.8em; 
	line-height:1.6;
	color:#000;
	}
.link ul{
	margin:0 auto; 
	
	list-style:none;
	}
.link li{ 
    display:inline-block; 
	margin:4px; 
	padding:0; 
	width:20%; 
	}
.link li a{
	display:block; 
	border-radius:50px; -webkit-border-radius:50px; 
	background:#40220F;
    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);
	}


/*桌機內容*/
.content{
	width:100%;
    
	max-width:1000px;
	margin:0 auto;
	padding:1% 0;
	text-align:center;}


.contver{
	width:100%;
    	max-width:1000px;
	margin:0 auto;
	padding:0;
	text-align:center;
  background-color: #FFFFFF;
}


/*選單*/
.menu{ 
    padding:2% 0 2% 0; 
	width:100%;
    text-align:center;
    position:scroll;
	top:0;
	z-index:1;
	}
.menu h2{
    font-size:1.8em; 
	line-height:1.6;
	color:#000;
	}
.menu ul{
	margin:0 auto; 
	width:1200px; 
	list-style:none;
	}
.menu li{ 
    display:inline-block; 
	margin:4px; 
	padding:0; 
	width:30%; 
	}
.menu li a{
	display:block; 
	border-radius:6px; -webkit-border-radius:6px; 
	background:#C30D23;
    font-size:2em; 
	line-height:60px; 
	text-decoration:none; 
	color:#FFFFFF;
	transition:0.5s;
	}
.menu li a:hover{ 
    transform:translate(0,5px);
    box-shadow:1px 1px 15px rgba(20%,20%,40%,0.5);
	}
/*刊頭滿版背景*/
.headeroutside{
	width:100%;
}
.headeroutside2{
	    background-color: #F5E554;}



/*桌機刊頭*/
#header{
	width:100%;
	max-width:1000px;
    
	margin:0 auto;}
#header2{
	width:100%;
	max-width:1000px;
     background-color: #F5E554;
	margin:0 auto;}


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

/*內容滿版背景*/
.contentoutside{width:100%;
}




/*圖片切換*/
.pic{
	width:100%;
	margin:0 auto;
	padding:0;
	text-align:center;}
.pic img{
	margin:1% 0;}
.pic-m{
	width:0;
	height:0;
	overflow:hidden;}


/*按鈕*/
.btn{ 
    padding:1% 0; 
	width:100%;
	text-align:center;  
	}
.btn ul{
	margin:0 auto; 
	text-align:center;  
	list-style:none;
	}
.btn li{ 
    display:inline-block; 	text-align:center;  
	margin:1px; 
	padding:0; 
	width:18%; 
	}
.btn li a{
	display:block; 
	border-radius:50px; -webkit-border-radius:50px; 
	background:#C30D23;
    font-size:1.2em; 
	line-height:50px; 
	text-decoration:none; 
	color:#FFFFFF;
	transition:0.5s;
	}
.btn li a:hover{ 
    transform:translate(0,5px);
    box-shadow:1px 1px 5px rgba(20%,20%,40%,0.5);
	}






/*按鈕2*/
.bttio{ 
	width:100%;
	text-align:center;  
	}

.bttio li{ 
    display:inline-block; 	text-align:center;  
	border-radius:30px; 
	background:#1D2088;
    font-size:1.2em; margin:1% 1% 5% 1%; 
    	padding:0% 1%; 
	line-height:50px; 
	text-decoration:none; 
	color:#FFFFFF;
	width:40%; 
	}
.bttio li a{
	display:block; 
	color:#FFFFFF;
	transition:0.5s;
	}
.bttio li a:hover{ 
    transform:translate(0,5px);
    box-shadow:1px 1px 5px rgba(20%,20%,40%,0.5);
	}




.odr{  margin: 0% 1% 0% 1%;
  font-size:15px;
    color:#000000;}

.Stay{  
	text-align:center; 
	margin:0 auto;
	padding:2% auto;
	font-size:20px;background-color:#B2E0F9;
}

.Stay2{width:100%;background-color:#B2E0F9;}



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

.luie2 ul{
	margin:0 auto; 
	padding:0; 
	width:1000px; 
	list-style:none;
	}
.luie2 li{ 
    display:inline-block; 
	margin:1% auto; 
	padding:1%; 
	width:30%; 
	height:20px;
	}
.luie2 li a{
	display:block; 
	border-radius:10px; -webkit-border-radius:50px; 
	background:#609A16;
    font-size:20px; 
	line-height:50px; 
	text-decoration:none; 
	color:#FFF;
	transition:0.5s;
	}
.luie2 li a:hover{ 
	transform:translate(0,5px);
	}	


.txbk{ margin:0% auto; 
     font-size:28px; 
	color:#060606;
	text-align:center; 
	}


.luie{ margin:0% auto; 
    padding:20px 0 50px; 
	width:100%;
	text-align:center; 
	}

.luie ul{
	margin:0 auto; 
	padding:0; 
	width:1000px; 
	list-style:none;
	}
.luie li{ 
    display:inline-block; 
	margin:2% auto; 
	padding:1%; 
	width:19%; 
	height:20px;
	}
.luie li a{
	display:block; 
	border-radius:10px; -webkit-border-radius:50px; 
	background:#1E7296;
    font-size:20px; 
	line-height:50px; 
	text-decoration:none; 
	color:#FFF;
	transition:0.5s;
	}
.luie li a:hover{ 
	transform:translate(0,5px);
	}			




/*浮動色塊*/
.boxa{
   
	width:100%;
	padding:1% 1%;
font-family:'微軟正黑體', Arial, Helvetica, sans-serif;
	list-style:none;
   margin:1% 2%;
    overflow: hidden;
    	padding:1% 1%;
	text-align:center;}
.boxa li{
    float: left;
    
	display:inline-block;
	width:23%;
	  margin: 1%;
	padding:4%;
	font-weight:bolder;
	background-color:#EFC3CB;
	border-radius:10px;
	transition:0.5s;}
.boxa li a{
	display:block;
	color:#F8EFEF;
	text-decoration:none;}






.btnd{
	width:100%;
        height:auto;
	padding:1% 1%;
	list-style:none;
   margin:1% 2%;
    overflow: hidden;
    	padding:1% 1%;
    
	text-align:center;}
.btnd li{
    float: left;
    height: 300px;
    font-size:22px;
	display:inline-block;
	width:22%;
	  margin: 1%;
    transition:.5s;
	padding:2%;
	font-weight:bolder; 
background-color: #A20909;
	color:#EFA9A9;
	border-radius:20px;
          }
.btnd li a{
	display:block;
 font-size:18px;
    	color:#F7F0F0;
	text-decoration:none;}
.btnd:hover{
      box-shadow: inset 940px 0 0 #F687A4;
  color:#fff;
  transform:translate(0,4px);
	transition:0.5s;}


.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;}




  
  	
	
/*浮動連結*/
  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:#45B035; }
    div#social-address .social-btn.mline{position: relative;}
    div#social-address #social-address-lines{
        position: absolute;
        background: rgba(255, 255, 255, 0.9);
        color: #3f9831;
        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: 6em;
        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:#00F; }
    div#social-address .social-btn.mline2{position: relative;}
    div#social-address #social-address-lines2{
        position: absolute;
        background: rgba(255, 255, 255, 0.9);
        color:#06F;
        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: 6em;
        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;}	

    



/*------------手機板---------------*/
@media screen and (max-width:767px){
.mid_text{ font-size:16px;}
.big_text{ font-size:24px;}
.supbig_text{ font-size:32px;}
/*桌機刊頭*/
#header{
	width:0;
	height:0;
	overflow:hidden;}
	
/*手機刊頭*/
#header-m{
	overflow:visible;
	display:block;
	width:100%;
	height:auto;
	margin:0;}
	
 
/*置頂選單*/
.nav{
	width:100%;
	background-color:#184F6D;
	
	position:fixed;
	top:0;
	z-index:1;
	font-weight:bold;
}
.nav ul{
	max-width:1000px;
	margin:0 auto;
	padding:0;
	text-align:center;}
.nav li{
	width:24%;
	height:40px;
	font-size:12px;
	display:inline-block;
	border-right:#BDE3EA 1.5px solid;
	vertical-align:middle;
	line-height:20px;
	font-weight:bold;
	}	
.nav li:last-child{
	border-right:none;}
.nav li a{
	display:block;
	color:#BDE3EA;
	text-decoration:none;
	font-weight:bold;
}
  
    
  
     
   

/*選單*/
.menu{ 
    padding:2% 0 2% 0; 
	width:100%;
	text-align:center;  
	}
.menu h2{
    font-size:2em; 
	line-height:1.6;
	color:#000;
	}
.menu ul{
	margin:0 auto; 
	width:100%; 
	list-style:none;
	}
.menu li{ 
    display:inline-block; 
	margin:4px; 
	padding:0; 
	width:30%; 
	}
.menu li a{
	display:block; 
	border-radius:6px; -webkit-border-radius:6px; 
	background:#C30D23;
    font-size:1em; 
	line-height:30px; 
	text-decoration:none; 
	color:#FFFFFF;
	transition:0.5s;
	}
.menu li a:hover{ 
    transform:translate(0,5px);
    box-shadow:1px 1px 15px rgba(20%,20%,40%,0.5);
	}
   
.Stay{  
	text-align:center; 
	margin:0 auto;
	padding:2% auto;
	font-size:20px;
}


  .Stay2{width:100%;background-color:#B2E0F9;}
  
.luie2{ margin:1% auto; 
   
	width:100%;
	text-align:center; 
	}

.luie2 ul{
	margin:0% auto; 
	padding:0% 1%;
	width:100%; 
	list-style:none;
	}
.luie2 li{ 
    display:inline-block; 
	margin:1% auto; 
	padding:1%; 
	width:49%; 
	height:10px;
	}
.luie2 li a{
	display:block; 
	border-radius:10px; -webkit-border-radius:50px; 
	background:#609A16;
    font-size:20px; 
	line-height:30px; 
	text-decoration:none; 
	color:#FFF;
	transition:0.5s;
	}
.luie2 li a:hover{ 
	transform:translate(0,5px);
	}			

    
.txbk{ margin:0% auto; 
     font-size:24px; 
	color:#060606;
	text-align:center; 
	}
    
    
.luie{ margin:2% auto; 
   
	width:100%;
	text-align:center; 
	}

.luie ul{
	margin:1% auto; 
	padding:1%;
	width:100%; 
	list-style:none;
	}
.luie li{ 
    display:inline-block; 
	margin:2% auto; 
	padding:3%; 
	width:49%; 
	height:20px;
	}
.luie li a{
	display:block; 
	border-radius:10px; -webkit-border-radius:50px; 
	background:#1E7296;
    font-size:20px; 
	line-height:50px; 
	text-decoration:none; 
	color:#FFF;
	transition:0.5s;
	}
.luie li a:hover{ 
	transform:translate(0,5px);
	}			

  
/*圖片切換*/
.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;}
  

.t {
	overflow: hidden;
	margin:0 auto;
	padding:0; 
}



.t .left{width:100%;
	margin: 0.5%;
	float:left;
	transition:0.5s;
}

.t .right{width:100%;
	margin: 0.5%;
		float: left;
	transition:0.5s;
}

.t .left:hover{
transform:scale(0.95,0.95);}


.t .right:hover{
transform:scale(0.95,0.95);}

.e {
	overflow: hidden;
	margin:0 auto;
	padding:0;
}

.e .left{width:49%;
	margin: 0.5%;
	float:left;
	transition:0.5s;
}

.e .right{width:49%;
	margin: 0.5%;
		float: left;
	transition:0.5s;
}

.e .left:hover{
transform:scale(0.95,0.95);}

.e .right:hover{
transform:scale(0.95,0.95);}
 
/*按鈕*/
.btn{ 
    padding:1% 0; 
	width:100%;
	text-align:center;  
	}
.btn ul{
	margin:0 auto; 
	text-align:center;  
	list-style:none;
	}
.btn li{ 
    display:inline-block; 	text-align:center;  
	margin:1px; 
	padding:0; 
	width:30%; 
	}
.btn li a{
	display:block; 
	border-radius:50px; -webkit-border-radius:50px; 
	background:#C30D23;
    font-size:1.2em; 
	line-height:50px; 
	text-decoration:none; 
	color:#FFFFFF;
	transition:0.5s;
	}
.btn li a:hover{ 
    transform:translate(0,5px);
    box-shadow:1px 1px 5px rgba(20%,20%,40%,0.5);
	}
      
/*各班連結*/
.link{ 
    padding: 0 0 5% 0; 
	width:100%;
	text-align:center;  
	}
.link h2{
    font-size:1.4em; 
	line-height:1.6;
	color:#000;
	}
.link ul{
	margin:0 auto; 
	width:100%; 
	list-style:none;
	}
.link li{ 
    display:inline-block; 
	margin:4px; 
	padding:0; 
	width:30%; 
	}
.link li a{
	display:block; 
	border-radius:6px; -webkit-border-radius:50px; 
	background:#40220F;
    font-size:1.2em; 
	line-height:40px; 
	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);
	}       
    	
/*浮動連結*/
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;}