@charset "utf-8";
/* 共用區 */

*{
	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%;
	width:100%;
	height:100%;
	font-family:"微軟正黑體", Arial, Helvetica,sans-serif; 
	}
a{ text-decoration:none;}
/* 留單用 */
.Stay{ width:100%; height:auto; text-align:center; margin:1% auto; font-size:30px; color:#003399; max-width:980px; }
	
	
/* == 主頁刊頭 == */
.head2{
	width:100%;
	height:700px;
	background-image:url(../images/BG.jpg);
	background-position:center;
	position:relative;
    }
.head2 .head-img{
	width:100%;
	max-width:980px;
	position:absolute;
	top:14px;
	left:50%;
	margin-left:-500px;/*使用%置中，需要減掉寬的1半width:260*2=130*/
	}
	
	
/* 桌機版 */
.bnn4{ width:980px; margin:0 auto; padding:1%;}
.bnn4 ul{list-style:none; text-align:center;}
.bnn4 li{ width:47%; margin:1%;padding:1%; font-size:24px; font-weight:bold; color:#FFFFFF;display:inline-block; background-color:#5F1985;border-radius:30px;}
.bnn4 li a{display:block;color:#FFFFFF;text-decoration:none;}
	  
.bnn4 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);}
}


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

.bnn3{ width:980px; margin:0 auto; padding:1%;}
.bnn3 ul{list-style:none; text-align:center}
.bnn3 li{ width:80%; margin:1%;padding:1%; font-size:30px; font-weight:bold; color: #000;display:inline-block; background-color:#000;border-radius:30px;}
.bnn3 li a{display:block;color: #FFF;text-decoration:none;}
	  
.bnn3 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);}
}


.bnn2{ width:980px; margin:0 auto; padding:1%;}
.bnn2 ul{list-style:none; text-align:center}
.bnn2 li{ width:35%; margin:1%;padding:1%; font-size:24px; font-weight:bold; color: #000;display:inline-block; background-color:#000;border-radius:30px;}
.bnn2 li a{display:block;color: #FFF;text-decoration:none;}
	  
.bnn2 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);}
}

.bnn1{ width:1200px; margin:0 auto; padding:1%;}
.bnn1 ul{list-style:none; text-align:center;}
.bnn1 li{ width:22%; margin:1%;padding:1%; font-size:20px; font-weight:bold; color:#FFFFFF;display:inline-block; background-color:#5F1985;border-radius:30px;}
.bnn1 li a{display:block;color:#FFFFFF;text-decoration:none;}
	  
.bnn1 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);}
}


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


/*主頁刊頭*/	
.head2{
	width: 100%;
	height: auto;
	padding-bottom:100%;
	background-image:url(../images/head-m.png);
	background-size: cover;
	position: relative;}	
.head2 .head-img{ display:none;}	


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


.bnn1{ width:100%; margin:0 auto; padding:1%;}
.bnn1 ul{list-style:none; text-align:center}
.bnn1 li{ width:45%; margin:1%;padding:1%; font-size:14px; font-weight:bold; color:#FFFFFF;display:inline-block; background-color:#5F1985;border-radius:15px;}
.bnn1 li a{display:block;color:#FFFFFF;text-decoration:none;}

	
.bnn2{ width:100%; margin:0 auto; padding:1%;}
.bnn2 ul{list-style:none; text-align:center}
.bnn2 li{ width:60%; margin:1%;padding:1%; font-size:15px; font-weight:bold; color:#FFFFFF;display:inline-block; background-color:#000;border-radius:15px;}
.bnn2 li a{display:block;color:#FFFFFF;text-decoration:none;}


.bnn3{ width:100%; margin:0 auto; padding:1%;}
.bnn3 ul{list-style:none; text-align:center}
.bnn3 li{ width:60%; margin:1%;padding:1%; font-size:15px; font-weight:bold; color:#FFFFFF;display:inline-block; background-color:#000;border-radius:15px;}
.bnn3 li a{display:block;color:#FFFFFF;text-decoration:none;}


.bnn4{ width:100%; margin:0 auto; padding:1%;}
.bnn4 ul{list-style:none; text-align:center}
.bnn4 li{ width:46%; margin:1%;padding:1%; font-size:12px; font-weight:bold; color:#FFFFFF;display:inline-block; background-color:#5F1985;border-radius:15px;}
.bnn4 li a{display:block;color:#FFFFFF;text-decoration:none;}

/* 留單用 */
.Stay{ width:100%; height:auto; text-align:center; margin:1% auto; font-size:16px; color:#003399; max-width:100%; }
}