body {
	padding: 0;
	margin: 0;
	background: #fff;	
	color: #8b8e94;
	line-height: 28px;
	font-size: 15px;
	font-family: "Microsoft JhengHei","微軟正黑體","Arial", sans-serif!important;
}
body a {
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
	text-decoration: none;
}
body a:hover {
	text-decoration: none;
}
body a:focus, a:hover {
	text-decoration: none;
}
input[type="button"], input[type="submit"] {
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
}
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	font-weight:normal;
		
}
p {
	margin: 0;
	color:#777;
	letter-spacing:1px;
	line-height:1.8em;
	font-size:15px;
	
}
.row{
	margin:0px;
	padding:0px;
}
ul {
	margin: 0;
	padding: 0;
}
label {
	margin: 0;
}
a{
	color:#000;
}
a:focus, a:hover {
	text-decoration: none;
	outline: none;
}
a:focus, a:hover {
    
    text-decoration:none;
}
/*-- //Reset-Code --*/

 /*--top hover--*/
#toTop {
    display: none;
    text-decoration: none;
    position: fixed;
    bottom: 20px;
    right: 2%;
    overflow: hidden;
    z-index: 999;
    width: 32px;
    height: 32px;
    border: none;
    text-indent: 100%;
    background: url(../images/arrow.png) no-repeat 0px 0px;
}
#toTopHover {
    width: 32px;
    height: 32px;
    display: block;
    overflow: hidden;
    float: right;
    opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity=0);
}
/*--/tophover--*/
/*定點置頂*/
.fixednav {  
    position: fixed;  
    top: 0px;  
    left:0;  
    width: 100%;  
    z-index: 999;  
	color: #fff;
	background-color: #9B3031;
}  
/*定點置頂*/


.bg-g{background-color: #ccc !important;}
.bg-o{background-color: #f9c270 !important;}
.bg-bk{background-color: #000 !important;}
.bg-yellow{background-color: #f1f4a4 !important;}
.bg-green{background-color: #c7e7c4 !important;}
.bg-white2{background-color: #fffcf3 !important;}

.bg_th1{
	background-image: url("../images/bg-pink.png");
	background-position:center;
	background-size: contain;
	background-repeat: repeat;
}
.bg_th2{
	background: linear-gradient(90deg, #A9DAA5 0%, #F0F4AC 100%);
background: -moz-linear-gradient(90deg, #A9DAA5 0%, #F0F4AC 100%);
background: -webkit-linear-gradient(90deg, #A9DAA5 0%, #F0F4AC 100%);
background: -o-linear-gradient(90deg, #A9DAA5 0%, #F0F4AC 100%);
}
.clr_blue{
	color: #123188;
	}
.clr_red{
	color: #de2a2b;
	}
a.h_big:hover img{width: 102%!important;}
a.h_op:hover img{opacity: 0.8!important;}
a.h_shadow:hover img{
-webkit-box-shadow: 0px  4px 8px #875409;
-moz-box-shadow: 0px 4px 8px #875409;
box-shadow: 0px  4px 8px #875409;
}
.areatitle{text-align: center;}
.areatitle h2{text-align: center;
    font-size: 3em;
    color: #fff;
    font-weight: 800;
    line-height: 1.7em;
    background-color: #268a44;
    border-radius: 60px;
    margin: 0 0 2rem 0;}
.divider-custom-line{width: 100%;height: 5px;color: #f00;background-color:#fff;margin-bottom: 3em; }
.pyellow{color: #fff226;}
h6.footerword{font-size: 1rem;color: #262626;text-align: center;font-weight: bolder;display: block;padding: 3rem 0;width: 100%;}
/*section.banner{padding-top: 0!important;}*/
section{padding-top: 4rem;}

/*banner*/
.bannerbg{position: absolute;left: 0;top: 0;}
.bannerimg{position: absolute;left: 0;top: 0;}


section.part1{position: relative;}
.line_area{
	background-image: url("../images/bg-line.png"); 
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	width: 92%; padding: 3%;
	margin-bottom: 4rem;

}
.line_area table img{width: 96%;margin-left: 2%;}

#banner_ph img{width: 100%;}

/*PART2*/
.youtube-video{
	background-image: url("../images/bd-video.png"); 
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	padding: 1em;
}

.bg-video{position: relative;margin-bottom: 1em; }
.con-video{position: absolute;top:7%;left:7%;width: 86%;}
.con-video iframe{height: 220px;}
.con-video h5{color: #fff;text-align: center;margin-top: 0.5em; font-size: 3em;}

/*PART3*/
.classbox{position: absolute;left: 0;top: 0;width: 100%;z-index: 2;}
.classtype{font-size: 2.4rem;
    color: #000;
    font-weight: bolder;
    margin-left: 57px;
    margin-top: 10px;}
.classbox h3{font-size: 3.5rem;
    font-weight: bolder;
    color: #fff;
    text-align: center;
    margin-top: 3%;}
.classbox table{margin-top: -2rem;   margin-bottom: 3rem;}
.classtitle{color: #268a44;
    font-size: 2.6rem;
    line-height: 2rem;
    font-weight: bolder;
    letter-spacing: -3px;}
.classtime{color: #4b4b4b;
	font-size: 1.5rem;
	margin-bottom: 1rem;}




/*part4*/

/*part5*/
.fight_box{
	background-color: #fff9df;
	border: 10px solid #268a44;
	border-radius: 25px;
	margin-bottom: 25px;
}
.fight_box h4{
	background-color: #282526;
	color: #fff;border-radius: 30px;
	padding: 8px 16px;
	margin-top: 30px;
	font-weight: 800;
	display: inline-block;}


.fight_box p{padding-left: 8px;font-size: 18px;color: #232323;line-height: 22px;margin: 15px 0 ;}
.pred{color: #ff3377;}


/*part6*/

/*end_part6*/

/*滾動固定MENU*/
.top,.bottom{position:fixed;width:100%;z-index:1}.top{top:0;left: 0;}.bottom{bottom:0;left: 0;}
.hide{display:none!important}

.ttittle {padding-bottom: 0;}
.ttittle table{
    line-height: 1.25;background-color: #E4E4E4;
}
/*#滾動固定MENU*/

/*lightbox*/
.modal{
	z-index:3;
	display:none;
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	overflow:auto;
	background-color:rgb(0,0,0);
	background-color:rgba(0,0,0,0.4);	
	}
.lightbox-close {
		width: 50px;
		height: 50px;
		background: #139dd7;
		color: #fff;
		position: absolute;
		top: 5%;
		right: 5%;
	}
	/* 利用偽元素做出 \ 以及 / 的線條 */
	.lightbox-close:after {
		width: 30px;
		height: 1px;
		content: "";
		display: block;
		background: #fff;
		position: absolute;
		top: 23px;
		left: 10px;
		transform: rotate(45deg);
	}
	.lightbox-close:before {
		width: 30px;
		height: 1px;
		content: "";
		display: block;
		background: #fff;
		position: absolute;
		top: 23px;
		left: 10px;
		transform: rotate(-45deg);
	}
/*end_lightbox*/
/*手風琴*/
		a:hover,a:focus{
		    text-decoration: none;
		    outline: none;
		}
		#accordion .panel{
		    border: none;
		    box-shadow: none;
		    border-radius: 10px;
		    margin-bottom: 10px;
		}
		#accordion .panel-heading{
		    padding: 0;
		    border: none;
		    border-radius: 10px;
		}
		#accordion .panel-title a{
		    display: block;
		    padding: 22px 5px 22px 5px;
		    font-size: 24px;
		    font-weight: 600;
		    color: #2d3f50;
		    background: #fff;
		    border: 8px solid #7a20f4;
		    position: relative;
		    transition: all 0.3s ease 0s;
			text-align: center;
		}
		#accordion .panel-title a:after,
		#accordion .panel-title a.collapsed:after{
		    content: "\f068";		
			font-family: "Font Awesome 5 Free";
			width: 80px;
			height: 80px;
			line-height: 30px;	
			text-align: center;
			font-size: 30px;
			color: #601986; 
			border: none;
			position: absolute;
			top: 22px;
			left: 0px;
			transition: all 0.3s ease 0s;
		}
		#accordion .panel-title a.collapsed:after{
		    content: "\f067";
		}
		#accordion .panel-title a:hover:after,
		#accordion .panel-title a.collapsed:hover:after{
		    transform: rotate(360deg);
		}
		#accordion .panel-body{
		    padding: 10px 25px;
		    background: #fff;
		    font-size: 14px;
		    color: #8c8c8c;
		    line-height: 25px;
		    border-top: 1px solid #601986;
		    position: relative;
		}
		
		#accordion .panel-body p{
		    margin-bottom: 15px;
			font-size: 14px;
			color: #262626;
		}
/*#手風琴*/
/*---------------------------media------------------------------*/
/*992~1200*/
@media screen and (max-width: 1199px) {
/*PART2*/
.con-video iframe{height: 180px;}
.con-video h5 {font-size: 2em;}
.areatitle h2 {font-size: 2.2em; }
	
.classbox h3 {
    font-size: 2.6rem;  
    margin-top: 4%;
}	
.classtype {
    font-size: 1.8rem;  
    margin-left: 50px;
    margin-top: 14px;
}	
.classtitle {  
    font-size: 2rem;}
.classtime {  
    font-size: 1.3rem;
    margin-bottom: 0.8rem;
}
.classbox table {
    margin-bottom: 1.8rem;
}	
	
}
/*768~991*/
@media screen and (max-width: 991px) {
.areatitle h2 {
    font-size: 2em;
}
.con-video {  
    top: 4%;
    left: 10%;
    width: 80%;
}	
.con-video iframe{height: 140px;}	
.con-video h5 {
	margin-top: 0.2em;}	
.classbox h3 {
	font-size: 2rem;}	
.classtype {
    font-size: 1.4rem;
    margin-left: 40px;
    margin-top: 5px;
}	
.classtitle {
    font-size: 1.6rem;
    line-height: 1.8rem;
	letter-spacing: 0;	}
.classtime {
    font-size: 1rem;
    margin-bottom: 0.5rem;
	line-height: 1.2rem;}	
.classbox table {
    margin-top: -1rem;
    margin-bottom: 0.8rem;
}	
.fight_box p { 
    font-size: 16px;
	line-height: 18px;}	
.fight_box h4 {  
    padding: 7px 16px;
    margin-top: 16px;    
    font-size: 1.2rem;
}
	
}

/*手機板767以下*/
@media screen and (max-width: 767px) {
.line_area {
    margin-left: 4%;margin-bottom: 2rem;
}	
.con-video iframe {
    height: 260px;
}	
.con-video h5 {
	margin-top: 0.5em;
	font-size: 3rem;
	}	
.classbox h3 {
	font-size: 3rem;}	
.classtype {
    font-size: 2rem;
    margin-left: 62px;
    margin-top: 35px;
}	
.classtitle {
    font-size: 2.6rem;
	line-height: 2.8rem;}	
.classtime {
    font-size: 1.6rem;
    margin-bottom: 1.5rem;
    line-height: 2.2rem;
}	
.areatitle h2 {
    font-size: 1.8em;
}	
		
	
}
/*576以上*/
@media screen and (min-width: 576px) {
.type_ph{display: none;}

}
/*手機板575*/
@media screen and (max-width: 575px) {
.type_pc{display: none;}	
.tablestyle {border: none;}	
/*PART2*/
.con-video iframe{height: 270px;}
#accordion .panel-body{
	padding: 0;}	
/*part5*/
.fight_box img{margin-left: 30%;}	
.classbox table {
    margin-bottom: 5.5rem;
}	
.con-video iframe {
    height: 250px;
}	
	

}/*END(max-width: 575px)*/
/*525以下*/
@media screen and (max-width: 525px) {
/*PART2*/
.con-video iframe{height: 230px;}	
.classtype {
    margin-left: 60px;
    margin-top: 26px;
}	
.classtime {
    font-size: 1.5rem;
	margin-bottom: 0.9rem;}
.classbox table {
    margin-bottom: 2rem;
}	
.areatitle h2 {
    font-size: 1.6em;
}	
.con-video h5 {
    margin-top: 1em;
    font-size: 2.4rem;
}	
	
}/*490以下*/
@media screen and (max-width: 490px) {
/*PART2*/
.con-video iframe{height: 200px;}	
.con-video h5 {
    margin-top: 0.5em;
    font-size: 2.4rem;
}	
.classtype {
    margin-left: 50px;
    margin-top: 8px;
}	
.classtitle {  
    font-size: 2rem;line-height: 2rem;
}
.classtime {  
    font-size: 1.3rem;line-height: 1.5rem;
    margin-bottom: 0.6rem;
}
.classbox table {
    margin-bottom: 4rem;
}	
	

	
}/*442以下*/
@media screen and (max-width: 442px) {
.areatitle h2 {
    font-size: 2em;
    line-height: 2rem;
    padding: 18px 10px;
}	
/*PART2*/
.con-video h5 {
    margin-top: 0.5em;
    font-size: 2rem;
}	
.con-video iframe{height: 190px;}
.classbox h3 {
    font-size: 2.6rem;
}	
.classtype {
	font-size: 1.6rem;
    margin-left: 50px;
    margin-top: 12px;
}	

	
}/*420以下*/
@media screen and (max-width: 420px) {	
.classtype {
    font-size: 1.2rem;
    margin-left: 49px;
    margin-top: 13px;
}	
.classtitle {
	font-size: 1.8rem;}
.classtime {
    font-size: 1.2rem;
    line-height: 1.8rem;
	margin-bottom: 0.4rem;	}
	
	
}@media screen and (max-width: 390px) {
/*PART2*/
.con-video iframe{height: 160px;}
.con-video h5 {
	margin-top: 0em;}	
.classbox h3 {
    font-size: 2rem;
}	
.classtype {
	margin-left: 45px;}
.classtime {
    font-size: 1rem;
	line-height: 1.4rem;}	
.classbox table {
    margin-bottom: 3.5rem;
}		
}@media screen and (max-width: 360px) {

	
	
}

