@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@400;700;900&display=swap');
html{height: 100%;}
body {
	padding: 0;
	margin: 0;
	background: #fff;	
	color: #212529;
	line-height: 28px;
	font-size: 15px;
	font-family: "Noto Sans TC","Microsoft JhengHei","微軟正黑體","Arial", sans-serif!important;
    height: 100%;
}
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: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;
   line-height: 1.2;
}
p {
	margin: 0;
	color:#777;
	letter-spacing:1px;
	line-height:1.5em;
	font-size:15px;}
.row{
	margin:0px;
	padding:0px;
}
ul {
	margin: 0;
	padding: 0;
}
li{
   list-style: none;
   
}
label {
	margin: 0;
}
a{
	color:#000;
}
a:focus, a:hover {
	text-decoration: none;
	outline: none;
}
a:focus, a:hover {    
    text-decoration:none;
}
.hide{
	display: none;
}

section{
	padding-bottom: 4em;
	padding-top: 4em;
}

.scroll-to-top {
    z-index: 1029;
    right: 1rem;
    bottom: 6em;
    display: none;
}

.scroll-to-top a {
  width: 3em;
  height: 3em;
  background-color: rgba(33, 37, 41, 0.5);
  line-height: 3em;
  border-radius: 8px;
}
.to-line {
  z-index: 1029;
  right: 1rem;
  bottom: 7.3rem;
}
.to-line a {
  width: 3.1rem;
  height: 3.3rem;
  font-size:3.4em;
  color: #fff;  
   border-radius: 20px;
  background-color: rgba(33, 37, 41, 0.5);
  line-height: 3.1rem;
}
/*-- //Reset-Code --*/
.bg-blue{background-color: #3f97d3!important;}
.bg-blue2{background-color: #003a75!important;}
.bg-green{background-color: #59b038!important;}
.bg-yellow{background-color: #fff5eb!important;}
.bg-gray{background-color: #f0f0f1!important;}
.bg_dkred{	background-color: #903a3c!important;;}
.border-white{border: 2px solid #fff;}

.f-blue{color: #2b2e66!important;}
.f-red{color: #ab0d0d!important;}
.f-gray{color: #474542!important;}
.f-yellow{color: #fff000!important;}
.f-white{color: #FFFFFF;}



.bg_banner{
	background-image: url("../images/bn_bg.png");
	background-position:bottom center!important;
	background-repeat: no-repeat;
   background-size: cover;
   -ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}
.bg_th1{	
	background-image: url("../images/pt1-bg.png");
	background-position:left top!important;
	background-repeat: no-repeat;
   background-size: 60% auto;
   -ms-background-size: 60% auto;
	-moz-background-size: 60% auto;
	-webkit-background-size:60% auto;
}
.bg_th3{	
	background-image: url("../images/pt3-bg.png");
	background-position:center!important;
	background-repeat: no-repeat;
   background-size: cover;
   -ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}
.bg_th5{
    background: url(../images/pt5-3.png);
    background-color: #fff5eb;
    background-position: left 25% bottom 0%;
    background-repeat: no-repeat;
   background-size: auto 54%;
   -ms-background-size: auto 54%;
	-moz-background-size: auto 54%;
	-webkit-background-size: auto 54%;
}
.bg_th9-2{
    background: url(../images/pt9-2-bg.png);
    background-position: center;
    background-repeat: no-repeat;
   background-size:cover;
   -ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}
.bg_th8{
    background: url(../images/pt8-bg.png);
    background-position: center;
    background-repeat: no-repeat;
   background-size:cover;
   -ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}
.bg_th11{
    background: url(../images/ad_bg.png);
    background-position: center top;
    background-repeat: no-repeat;
   background-size:cover;
   -ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}


/*BTNN*/
.hoverbig img{
	filter:drop-shadow(2px 2px 2px #303030);
}
.hoverbig:hover img{
	transform: scale(1.1, 1.1);
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
filter:drop-shadow(0px 0px 0px #303030);
}
.btngo{
	font-size: 1.6em;
	line-height: 1.5;
	font-weight: bolder;
	color: #ffffff;
   text-align: center;
	background-color: #004572;
	padding: 4px 20px;
   margin-top: 25px;
   border-radius: 30px;
	box-shadow: 3px 3px 0 rgba(0,0,0,.4);
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
}
.btngo:hover{
    transform: scale(1.1, 1.1);
	transition: 0.5s all;
    color: #feefd0;
    background-color: #5E2223;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
	box-shadow:2px 2px 0 rgba(100,100,100,.8);
}

/*#BTNN*/

/*click*/
.click_box{
    position: relative;
}
.click_box:hover img.click_hand{
   display: none;
}
.click_hand{
   position: absolute;
   width: 1.8em;
   z-index: 2;
   right: -8%;
   top: 30%;
}
/*##click*/

/**/
.shadow-f{
   filter:drop-shadow(0px 0px 8px #303030);
}
/**/
img {
   width: 100%;}

/*header*/
header{
   margin-top: 6.5em;
   position: relative;
}

header .bn {
   margin-top: 5em;
   margin-bottom: 3.3em;}
/*Menu*/
.menu{
   width: 100%;
   padding: 2em 0;
   -webkit-transition: padding-top .3s, padding-bottom .3s;
   transition: padding-top .3s, padding-bottom .3s;
}

.menu.navbar-shrink{
   padding: 1em 0;
}

.menu li{
   width: calc( calc(100%/6) - 2%);
    border-radius: 40px;
    text-align: center;
    font-size: 1.6em;
    line-height: 1.2;
    margin-left: 1%;
    margin-right: 1%;
    vertical-align: middle;
    font-family: "cwTeXYen", sans-serif!important;
   
}
.menu li a{
   color: #fac200;
   font-weight: 700;  
   background-image: url("../images/lamp.png");
	background-position:left 15% center;	
	background-repeat: no-repeat;
	background-size: auto 80%;
	-ms-background-size: auto 80%;
	-moz-background-size:auto 80%;
	-webkit-background-size: auto 80%;
   padding: 3% 2% 2% 19%;
}


@media screen and (max-width:575px) {
.nav-link {
    padding: .5rem .2rem;
}
.menu{
      padding: 1em 0 .4em 0;
   }  
.menu li{
   font-size: 1.6em;
   letter-spacing: 1;
   width: calc( calc(100%/3) - 2%);
   margin-bottom: 2%;
   }

}/*#Menu*/

@media screen and (min-width: 1601px) {
header .bn {
   margin-bottom: 3.7em;}
}/*1600以上*/
@media screen and (max-width:1199px) {
header .bn {
    margin-bottom: 2.7em;
}
}@media screen and (max-width:575px) {
 header {
    margin-top: 7.5em;}  
header .bn {
    margin-top: 0;
    margin-bottom: 5em;
}
.menu.navbar-shrink{
   padding: 1em 0 .4em 0;
}   
}/*1199*/


/*PART1*/
#part1 .btngo{
   position: absolute;
   left: 12%;
   bottom: -4%;
   width: 30%;
   background-color: #004572;
}
@media screen and (max-width:575px) {
#part1 .btngo {
   left: 15%;
   bottom: 21%;
   width: 36%;
   font-size: 1.4em;}
.bg_th1 {
    background-position: left 28% top 0!important;
    background-size: 155% 86%;
    -ms-background-size: 155% 86%;
    -moz-background-size: 155% 86%;
    -webkit-background-size:155% 86%;
}   
   
}/*#END_PART1*/


/*PART2*/

/*theme3*/ 
.mycarousel .carousel-inner {
    position: relative;
    width: 80%;
    left: 10%;
}
.mycarousel .carousel-caption{
    bottom: unset;
    top:20px;}
.mycarousel .carousel-indicators {
    position:relative;
    right: unset;
    bottom:  unset;
    left:  unset;
    display: unset;
    -ms-flex-pack:unset;
    justify-content: unset;
    padding-left:unset;
    margin-right: unset;
    margin-left: unset;
    list-style: none;
    top: 1em;
}    
.mycarousel .carousel-indicators li{
    width: 17%;
    display: inline-block;
    text-indent: unset;
    height: unset;
    background-color: #f9bf09;
    border-radius: 45px;
    font-size: 1.6em;
    line-height: 1.6;
    }      
.mycarousel .carousel-control-next,
.mycarousel .carousel-control-prev{
   width: 10%;
}
@media screen and (max-width:575px) {
.mycarousel .carousel-indicators li {
    width: 22%;
    display: inline-block;
    text-indent: unset;
    height: unset;
    background-color: #f9bf09;
    border-radius: 0;
    font-size: 1.5em;
    line-height: 2;
   font-weight: 700;}
}/*##_theme3*/   

/*#END_PART2*/





/*part4*/
.pt4-con{
   color: #fff;
/*   padding-left: 10%;*/
}
#part4 .wrp {
  background: #fff;
  line-height: 1.4;
  text-align: center;
  width: 6em;
  height: 6em;
  border-radius: 50%;
  display: inline-block;
   margin-right: 1%;
}
#part4 .wrp .middle {
  vertical-align:  middle;
  display: contents;
   color: #59b038;
   font-size: 4em;
   font-weight: 900;
}
#part4 h3{
   font-size: 3em;
   line-height: 1.4;
}
#part4 h5{
   font-size: 2em;
   line-height: 1.4;
}
#part4 ul{
   margin-top: 5%;
   margin-bottom: 4%; 
}
#part4 li.point{
   width: 45%;
   background-color: #003a75;
   border: 2px solid #fff;
   border-radius: 30px;
   list-style: none;
   display: inline-block;
   font-size: 1.5em;
   line-height: 1.6;
   margin-bottom: 1%;
}
.pt4-btn{
   background-color: #fff;
   border-radius: 30px;
   padding: 2% 6%;
   margin: 1% 0;
   font-weight: 700;
   font-size: 2em;
   color: #59b038;
   filter:drop-shadow(0px 0px 6px #25590f);
}
.pt4-btn:hover{
   color: #59b038;
filter:drop-shadow(0px 0px 0px #25590f);
   
}

#part4 .hand{
   position: absolute;
   bottom: 0;
   right: 0;
   width: 90%;
}
@media screen and (max-width: 575px) {
  #part4 .hand{
     position: relative;}
} 
/*#END_PART4*/  

/*PART5*/
.pt5-btn{
   position: absolute;
   right: -10%;
   bottom: 0;
   width: 75%;
}
.pt5-btn:hover{  
   transform: scale(1.1, 1.1);
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
}
#part5 .col-md-10{
   padding-bottom: 13%;
}

@media screen and (max-width: 575px) {
#part5 .col-md-10{
   padding-bottom: 38%;
}   
.pt5-btn{
    right: 2%;
    bottom: 8%;
    width: 95%;
}
   
}/*#END_PART5*/ 

/*PART6*/   
#part6 .nav-link ,
#part9 .nav-link {
    padding: 1rem .2rem;
}
#part6 .nav-pills .nav-link,
#part9 .nav-pills .nav-link {
   border-bottom-left-radius: 0;
   border-bottom-right-radius: 0;
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
   background-color: #004e95;
   font-size: 1.6em;
   color: #fff;
}
#part6 .nav-pills .nav-link.active ,
#part9 .nav-pills .nav-link.active {
   background-color: #11365f;
   color: #fff;
}

#part6 .tab-content,
#part9 .tab-content{
   position: relative;
}
#part6 .tab-content ul,
#part9 .tab-content ul{
   margin-bottom: 10px;
}
#part6 .tab-content li,
#part9 .tab-content li{
   text-align: left;
   font-weight: 700;
   color: #555;
   font-size: 1.2em;
   line-height: 1.4;
}

#part6 .tab-pane,
#part9 .tab-pane{
   padding: 3% 2% 3% 15%;   
}
#part6 .tab-pane::before ,
#part9 .tab-pane::before {
   position: absolute;
    left: 0;
    bottom: .4em;
    font-size: 7em;
    font-weight: 500;
    color: #EBEBEB;
   z-index: 0;
}
#class1::before,#new1::before {content: '北區';}
#class2::before,#new2::before {content: '桃壢區';}
#class3::before,#new3::before {content: '中區';}
#class4::before,#new4::before {content: '嘉南區';}
#class5::before,#new5::before {content: '高屏區';}

@media screen and (max-width: 575px) {
#part6 .tab-pane, 
#part9 .tab-pane {
    padding: 6% 4% 10% 4%;
}
#part6 .tab-content li, 
#part9 .tab-content li {
    font-size: 1.4em;
}   
   
}/*#END_PART6*/   

/*PART8*/
#part8 .carousel-indicators{
   position: relative;   
}

#part8 .carousel-inner {
    position: relative;
    width: 80%;
    overflow: hidden;
    left: 10%;
}
#part8 .carousel-control-next, 
#part8 .carousel-control-prev {
   width: 10%;
}
/*#END_PART8*/
/*PART9*/

#part9-2 .btngo{
   background-color: #c1112b;
   color: #fff;
   min-width: 25%;
   display: inline-block;
   position: absolute;
   left: 48.5%;
    bottom: 2.5em;
}
@media screen and (max-width: 575px) {
#part9-2 .btngo {
    min-width: 40%;
   left: 30%;}


}/*#END_PART9*/
/*PART10*/

@media screen and (max-width: 575px) {
#part10{
   overflow: hidden;
}
.pt10{
   width: 160%;
    left: -44%;
    position: relative;
}
   
}/*#END_PART10*/




/*class_pt-各班*/
#class_pt .btngo{
border-radius: 50px;
background-color: #00417b;
border: 3px solid #618cb3;
width: calc(100% / 5);
color: #fff4d7;
margin: 10px;
box-shadow: 6px 6px 0 rgba(80,20,25,.8);
font-size: 1.6em;
line-height: 1.2;
padding: 6px 0;
}
#class_pt .btngo:hover{
box-shadow: 2px 2px 2px rgba(80,20,25,.8);
}
#class_pt .btngo small{
font-size:80%;
font-weight: bolder;
}


@media screen and (max-width: 575px) {
#class_pt .btngo {
    border: 3px solid #618cb3;
    width: calc(29%);
    margin: 1.5%;
    font-size: 1.6em;
    padding: 6px 0;
}
   
}/*#END_class_pt-各班*/





   
/*footerstyle*/
.logo{
margin-top: 8%!important;
padding-top: 1rem;
padding-bottom: 1rem}  
footer{
	padding: 3em 0;
	background-color: #112020;
	color: rgba(255, 255, 255, 0.9);
	text-align:center;}

ul.footerstyle-social {
  padding: 10px 0;
  margin: 0;}
ul.footerstyle-social li {
/*display: inline;*/
  padding: 0;
  margin: 0;
  list-style: none;}
ul.footerstyle-social li a {
color: white;
  padding: 10px;
  font-size: 16px;}
ul.footerstyle-social li a:hover {
  color: white;}

@media screen and (max-width: 767px) {
.logo{width: 70%;margin-top: 5%;}   
footer {
    padding: 2em 0 6em 0;
}	
footer ul {
  border-bottom-width: 1px ;
	border-bottom-style: solid;
	border-bottom-color: rgba(255, 255, 255, 0.6);
	padding: 1em 0;
	/*margin: 0 3em; */
}	   
}@media screen and (max-width: 575px) {	

footer {
    padding: 0 0 6em 0;
/*    padding: 0 0 13em 0;*/
  }	
}	
/*end_footerstyle*/

/*---------------------------media------------------------------*/
@media screen and (max-width: 1400px) {

.btns {
    width: 11vw;
    height: 11vw;
    line-height: 11vw;}

   
   
}/*992~1200*/
@media screen and (max-width: 1199px) {
body {
   font-size: 1.35vw!important;}   

}@media screen and (max-width:991px) {
   body {
   font-size: 1.5vw!important;}  
   .bg_pt3con {
      padding-top: 3.2%;}
}/*576以上*/
@media screen and (min-width: 576px) {
.type_ph{display: none;}
	
}/*手機板575*/
@media screen and (max-width: 575px) {
body {font-size: 3vw!important;}    
   
section{padding-bottom: 3rem;padding-top: 3rem;}	
.type_pc{display: none;}
.nolr{
    padding-left: 0!important;
    padding-right: 0!important;}	
   
.bg_th5{
    background: url(../images/pt4-bg-ph.png);
    background-color: #fff5eb;
    background-position: right bottom;
    background-repeat: no-repeat;
   background-size: cover;
   -ms-background-size:cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}
   
}/*END(max-width: 575px)*/
@media screen and (max-width: 472px) {	


}/*END(max-width: 472px)*/
@media screen and (max-width: 420px) {


}