body{

}

.base-width {
    width: 1200px; padding:0px 10px; max-width:100%; margin:0 auto;
}

.page-banner{
	position:relative; overflow:hidden;
}

.page-banner .img{
	position:relative;
}

.page-banner .img:before{
	width:100%; height:100%; position:absolute; left:0; top:0; z-index:1; background-color:rgb(0,0,0,0); content:" ";
}

.page-banner .img img{
	display:block; max-width:100%;
}
 
.page-banner .text-box{
	position:absolute; z-index:100; width:100%; height:100%; left:0; top:0; display:flex; flex-direction:column; justify-content:center; color:#FFCC00; 
}

.page-banner .text-box .title{
	font-size: 60px; line-height: 71px; position:relative; margin-bottom:10px; padding-left:25px; transition:all 0.9s; opacity:0; bottom:-20px;
} 

.page-banner .text-box .description{
	font-size: 28px; text-transform: uppercase; position:relative; line-height: 48px; text-align: left;  padding-left:25px;
}

.page-banner .text-box .description span{
	position:relative; z-index:100; transition:all 0.6s; opacity:0; left:20px; transition-delay:0.4s;
}

.page-banner.opened .text-box .title{
	bottom:0;  opacity:1;
}

.page-banner.opened .text-box .description span{
	 opacity:1; left:0px;
}

.page-banner .text-box .description:after{
	height:100%; width:90px; z-index:1; position:absolute; left:-20px; top:0; background:#72BF44; content:" "; transition:all 0.6s; opacity:0; transition-delay:0.4s;
}

.page-banner.opened .text-box .description:after{
	left:0px; opacity:1;
}


.page-banner .img1{
	position:absolute; right:-20vw; top:-20vw; width:20%; height:auto; z-index:10; transition:all 1.1s; transition-delay:0.5s; opacity:0;
}

.page-banner .img1 img{
	max-width:100%; display:block;
}

.page-banner .img2{
	position:absolute; left:-20vw; bottom:-20vw; width:20%; height:auto; z-index:10; transition:all 1.1s; transition-delay:0.5s; opacity:0;
}

.page-banner .img2 img{
	max-width:100%; display:block;
}

.page-banner.opened .img1{
	opacity:1; top:0; right:0;
}

.page-banner.opened .img2{
	opacity:1; bottom:0; left:0;
}

.page-banner .text-box .title{
	font-size: 62px; line-height: 85px; 
} 

.page-banner .text-box .description{
	font-size: 24px; line-height: 48px;
}

.page-course{
	padding:80px 0px;
}

.page-course .course-title{
	text-align:center; color: rgba(0, 191, 1, 1); font-size: 32px; line-height: 45px; margin-bottom:10px;
}

.page-course .en-title{
	text-align:center; color: rgba(167, 176, 181, 1); height: 45px;     text-transform: uppercase; font-size: 30px; margin-bottom:60px;
}

.course-list{
	padding:0px 0px; margin:0px 0px; display:flex; flex-wrap:wrap;
}

.application-title{
	text-align:center; line-height: 45px; font-size: 32px; text-align:center; color: rgba(0, 191, 1, 1);
}

.application-title-en{
	line-height: 45px; font-size: 32px; color: #A7B0B5; margin-bottom:25px; text-align:center;
}

.sub-title{
	padding:0px 0px; margin:0px 0px; color:#00BF01; font-size: 28px; line-height: 40px; text-align:center;
}

.page-application{
	padding:65px 0px; line-height:1.4rem;
}

.page-school-hourse{
	padding:85px 0px; background:white; display:flex; justify-content:flex-end;
}

.school-boxs{
	width:100%; display:flex; position: relative; max-width:1280px; margin:0 auto; flex-direction:column;
}
 
.school-boxs .box1{
	width:100%; margin-right:0; display:flex; flex-direction:column;
}

.school-boxs .box2{
	flex:1; background:url(../picture/school1.jpg) no-repeat left center;  background-size:100% auto; border-radius:10px;
}

.school-boxs .box1 .title{
	color:#00BF01; font-size: 32px; color: #00BF01; line-height: 45px; 
}

.school-boxs .box1 .desc{
	color: #A7B0B5; font-size: 28px;  line-height: 38px; text-transform:uppercase; font-weight: bold !important;  margin-bottom:25px;
}

.school-boxs .box2 .content{
	 padding:32px 35px;  line-height: 32px; font-size: 17px; color:white; line-height:30px;  
}


.school-boxs .box2 .content p{
	margin-bottom:15px;
}

.school-boxs .s-box{
	 
}
 
.sw-img{
	position:relative; overflow:hidden;
}

.sw-img a.img{
	display:block;
}

.sw-img a.txt{
	display:block; height:36px; overflow:hidden; line-height:36px; color:#333333; text-align:center; text-decoration:none; font-size:16px;
}

.sw-img img{
	max-width:100%; display:block;
}

.sliders-box{
	height:65px;
}

.xiaoshe{
	display:flex;
}

.xiaoshe a{
	width:44px; height:44px; margin-right:12px; text-decoration:none; display:flex; justify-content:center; align-items:center; flex-direction:column; border-radius:50%;
}

.xiaoshe a:first-child{
	background:#B0D506;
}

.xiaoshe a:last-child{
	background:#FFCC00;
}

.swiper-slide2 img {
     width: 100%;
     height: auto;
     border-radius: 10px;
}
.swiper-wrapper2 {
     filter: blur(0px);
     transition: filter 0.5s;
}
.swiper-slide-prev2,
.swiper-slide-next2 {
            //filter: blur(5px);
           // opacity: 0.5;
}
		
.sw-img{
	transition: filter 0.5s;
	filter: blur(5px);
}
		
.sw-img.swiper-slide-prev,.sw-img.swiper-slide-next,.sw-img.swiper-slide-active{
	filter: blur(0px);
}

.feng-xiao{
	display:flex; justify-content:space-between; margin-top:45px;
}

.feng-xiao a{
	display:flex; width:48%; text-decoration:none; flex-direction:column; color:#72BF44; 
}
		
.feng-xiao a .img{
	margin-bottom:0px; border-radius:7px; overflow:hidden;
}

.feng-xiao a .img img{
	max-width:100%; display:block; transition:all 0.6s;
}

.feng-xiao a:hover .img img{
	transform:scale(1.12);
}

.feng-xiao a span{
	display:flex; padding:7px 10px; line-height:36px; font-size:18px; border-bottom:solid 1px #f0f0f0; justify-content:space-between; align-items:center;
}

.feng-xiao a:hover{
	text-decoration:none; color:#FFCC00;
}

.feng-xiao a span font{
	display:inline-block;
}

.feng-xiao a:hover span svg path:last-child{
	fill:#FFCC00;
}


/* 詳情頁 *****/
.detail-1{
	padding-top:160px; padding-bottom:85px;
}


.school-1{
	display:flex; justify-content:space-between; 
}


.school-1 .school-left{
	width:40%; display:flex; flex-direction:column; justify-content:center;
}

.school-1 .school-left .title{
	background:url(../picture/detail_home.png) no-repeat left center; height:50px; line-height:50px; padding-left:40px; font-size: 32px; color: #00BF01; margin-bottom:18px;
}

.school-1 .school-left .b-list{
	display:flex; flex-direction:column;
}

.school-1 .school-left .b-list a.b-items{
	margin-bottom:8px; line-height:38px; padding-left:29px; font-size: 18px; color: #333333; display:block; text-decoration:none;
}

.school-1 .school-left .b-list .b-items:nth-child(1){
	background:url(../picture/detail_map.png) no-repeat left center;
}

.school-1 .school-left .b-list .b-items:nth-child(2){
	background:url(../picture/detail_mobile.png) no-repeat left center;
}

.school-1 .school-left .b-list .b-items:nth-child(3){
	background:url(../picture/detail_tel.png) no-repeat left center;
}

.school-1 .school-left .b-list .b-items:nth-child(4){
	background:url(../picture/detail_email.png) no-repeat left center;
}

.school-1 .school-right{
	width:60%; max-width:600px;
}

.school-1 .school-right img{
	display:block; max-width:100%;
}

.detail-1 .base-width{
	max-width:1280px;
}

.school-tit1{
	text-align:center; color:#00BF01; font-size: 32px; line-height: 45px;
}

.school-tit2{
	font-size: 32px; color: #A7B0B5; font-size: 30px; text-align:center; text-transform:uppercase; margin-bottom:32px; font-weight: bold !important;
}

.school-desc{
	line-height:30px; color: rgba(102,102,102,0.8); font-size: 18px; text-align:center; margin-bottom:35px;
}

.school-2{
	margin-top:55px;
}

.prev-box{
	position:absolute; width:46px; height:100%; display:flex; flex-direction:column; left:80px; justify-content:center; z-index:1000; top:0;
}

.next-box{
	position:absolute; width:46px; height:100%; display:flex; flex-direction:column; right:80px; justify-content:center; z-index:1000; top:0;
}

.btn-link{
	
}



@media screen and (max-width: 1200px) and (min-width: 768px){
.school-boxs{
	width:100%; 
}

.page-school-hourse{
	padding:0px 15px;
}

.school-boxs{
		flex-direction:column;
}
	
.school-boxs .box1{
		width:100%; margin-right:0;
}
	
.school-boxs .box2{
		flex:none;
}

.school-boxs .box2 .content{
	width:100%; padding-top:50px; padding-bottom:50px;
}

.xiaoshe{
	padding:0px 35px;
}

.school-boxs .box1{
	padding-top:35px; margin-bottom:22px;
}

.school-boxs .s-box{
	height:auto; width:100%; padding:0 2%; position:relative;
}
	

}

@media screen and (max-width: 767px){
	
.feng-xiao{
	justify-content:flex-start; margin-top:40px; flex-direction:column;
}

.feng-xiao a{
	width:100%; margin-bottom:32px;
}

.feng-xiao a span font{
	font-size:16px;
}
	

.page-school-hourse{
	padding: 55px 0px;
}

.detail-1 {
    padding-top: 30px;
    padding-bottom: 50px;
}

.school-boxs{
	width:100%; display:flex; position: relative; flex-direction:column; padding:0px 10px;
}
 
.school-boxs .box1{
	width:100%; margin-right: ; display:flex; flex-direction:column;
}

.school-boxs .box2{
	flex:none; background:url(../picture/school1.jpg) no-repeat left top;  width:100%;
}

.page-course .course-title{
	font-size: 26px; line-height: 38px;
}

.page-course .en-title{
	height: 30px; font-size: 18px;
}


.base-width {
    padding: 0px 15px;
}

.page-banner .img img{
	width:135%; max-width:135%;
}


.page-banner .text-box .title{
	font-size: 32px; line-height: 45px;
} 

.page-banner .text-box .description{
	font-size: 18px; line-height: 28px;
}

.school-boxs .box1 .title{
	text-align:center; font-size:26px;
}

.school-boxs .box1 .desc{
	text-align:center; font-size:18px; line-height:30px; margin-bottom:25px;
}


.school-boxs .box2 .content {
    padding: 32px 10px;
    width: 100%;
    line-height: 26px;
    font-size: 14px;
    color: white;
    padding-bottom: 0px;
}

.school-boxs .s-box {
    height: auto;
    position: relative;
    left: 0px;
    bottom: 0px;
    width: 100%;
}

.xiaoshe{
	justify-content:center;
}


.school-1{
	flex-direction:column; justify-content: flex-start;
}

.school-1 .school-left{
	width:100%;
}

.school-1 .school-right{
	width:100%; margin-top:30px;
}

.school-1 .school-left .title {
    background: url(../picture/detail_home.png) no-repeat left center; background-size:20px;
    height: 40px;
    line-height: 40px;
    padding-left: 30px;
    font-size: 22px;
    color: #00BF01;
    margin-bottom: 18px;
}

.school-2{
	margin-top:40px;
}


.detail-1 .base-width {
    max-width: 100%;
}

.school-tit1 {
    font-size: 22px;
    line-height: 32px;
}

.school-tit2 {
    font-size: 22px;
    margin-bottom: 22px;
}

.school-desc {
    line-height: 25px;
    font-size: 14px;
    margin-bottom: 25px;
}

.next-box {
    right: 20px;
}

.prev-box {
    left: 20px;
}

.school2-swiper{
	width:96%; margin:0 auto;
}


}