/************************************************************************************
more than 800
*************************************************************************************/
@media screen and (min-width: 640px) {
    #pagewrap {
        margin: 0 auto;
        max-width: 800px;
    }
    .header{
        height:80px;
    }

	.header-l{ width:60%; float:left;}
	
	.header-r{ float:right; width:34%;}


	.header-l img{ float:left; margin:5% 2% 0 5%; width:126px; height:38px; }
	.header-l span{ border-left:1px solid #333333; padding-left:2%; float:left; margin-top:5%;}
	.header-l span h3{ font-size:1.2em; line-height:1.2em; color:#24272e;}
	.header-l span h4{ font-size:1em; line-height:1.6em; color:#24272e; font-weight:normal;}

	.header-r h5{ margin-top:12%; font-size:1.4em; line-height:1.8em; padding-left:14%;}
	
	.nav{ height:44px;}
    .nav ul li{
		width:13.84%;
        height:44px;
		line-height:44px;
        font-size:1.4em;
		padding:0 1.25%;
    }
	
	.icon{ height:90px;}
	
	.icon ul li img{ width:130px; height:123px;}

	.banz{ width:100%; height:180px; background:#1e1d18; padding:7% 0; margin-top:8.4%;}
	
	.banz dl{ width:17%; float:left; }
	
	.banz dl:first-child{ margin-left:9.0%;}
	
	.banz dt{ width: 92px;
			height: 92px;
			text-align: center;
			position:relative;
	}
	
	.banz dt::before{
		  content: " ";
	
		  position: absolute;
	
		  width: 89px;
	
		  height: 89px;
	
		  border: 1.5px solid #fbac01;
		  
		  border-radius: 50%;
	
		  animation: rotateRouter 8s linear infinite;
	
		  -moz-animation: rotateRouter 8s linear infinite;
		  
	
		  -webkit-animation: rotateRouter 8s linear infinite;
	
		  -o-animation: rotateRouter 8s linear infinite; }
		  
	
	.banz dt img{ position:absolute; top:30%; left:78%; }
	
	.banz dd{ width: 92px;
		height: 70px;
		text-align: center;
		margin-left:42%;
	}
	
	.banz dd h5 a{ color:#fbac01;
			font-size:1.4em;
			line-height:2em;
			font-weight:400;
	}
		

	.tit_01 h1,.tit h1{
		padding-top:0%;
		font-size:2.4em;
		line-height:1.4em;
		text-align:center;
		color:#36383f;
	}
	
	.tit_02 h1{
		padding-top:0%;
		font-size:2.4em;
		line-height:1.4em;
		text-align:center;
		color:#ffffff;
	}
	.tit_01 h1 span,.tit_02 h1 span, .tit h1 span{
		color:#fbac01;
	}

	.work-info li h3{ 
		font-size:1.4em;
		font-weight:400;
		padding-bottom:5px; border-bottom:1px solid #ffffff;
		color:#ffffff;
		text-align:center;
	}
	
	.work-info h4{
		font-size:1.2em;
		color:#1e1d18;
		padding:12% 0 8%;
		}



/*老师*/
    .tea-box{
        width:90%;
    }
    .tea-info h1{
        font-size:2em;
		line-height:2em;
    }
    .tea-info h2{
        font-size:1.8em;
		line-height:1.6em;
    }
	
    .tea-info p{
        font-size:1.4em;
        line-height:1.6em;
    }
/*老师*/

/*学员视频*/
.video{ width:90%; margin:0 auto;}
.video li{
    height:190px;
	}

.video_r h3{
	font-size:1.8em;
	line-height:1.8em;
	font-weight:bold;
	color:#45474d;
	background:url(../images/stu-00.png) no-repeat left bottom;
	}

.video_r p{
	font-size:1.4em;
	color:#525252;
	line-height:1.4em;
	padding-top:6%;	
	}


/*学员视频*/

/*返回首页和底部*/
    .goback{
        top:140px;
    }
    .back{
        width:52px;
        height:52px;
        background:url("../images/back.png") no-repeat center center;
        background-size:52px 52px;
    }
    .bottom-btn{
        height:80px;
    }
    .bottom-btn1{
        height:80px;
        background:url("../images/bottom-btn1.png") no-repeat center center;
        background-size:58px 58px;
    }
    .bottom-btn2{
        height:80px;
        background:url("../images/bottom-btn2.png") no-repeat center center;
        background-size:58px 58px;
    }
	
/*返回首页和底部*/


.tedu_a{display:block; width:24%; margin:0 auto; margin-top:4%; margin-bottom:4%;}
#go{ font-size:1.2em;}
}




/************************************************************************************
smaller than 480
*************************************************************************************/
@media screen and (min-width: 480px) and (max-width: 639px) {
    #pagewrap {
        margin: 0 auto;
        width: 100%;
    }
    .header{
        height:64px;
    }

	.header-l{ width:60%; float:left;}
	
	.header-r{ float:right; width:30%;}


	.header-l img{ float:left; margin:4% 2% 0 20%; width:78px; height:24px; }
	.header-l span{ border-left:1px solid #333333; padding-left:2%; float:left; margin-top:5%;}
	.header-l span h3{ font-size:1.0em; line-height:1.2em; color:#24272e;}
	.header-l span h4{ font-size:0.8em; line-height:1.6em; color:#24272e; font-weight:normal;}
	
	.header-r h5{ margin-top:10%; font-size:1.0em; line-height:1.8em; padding-left:12%;}

	.nav{ height:36px;}
    .nav ul li{
		width:13.84%;
        height:36px;
        line-height:36px;
        font-size:1em;
		padding:0 1.0%;
    }
	
	.icon{ height:80px;}
	
	.icon ul li img{ width:104px; height:98px;}
	

	.banz{ width:100%; height:160px; background:#1e1d18; padding:7% 0; margin-top:8.4%;}
	
	.banz dl{ width:16%; float:left; }
	
	.banz dl:first-child{ margin-left:9.0%;}
	
	.banz dt{ width: 74px;
			height: 74px;
			text-align: center;
			position:relative;
	}
	
	.banz dt::before{
		  content: " ";
	
		  position: absolute;
	
		  width: 72px;
	
		  height: 72px;
	
		  border: 1.5px solid #fbac01;
		  
		  border-radius: 50%;
	
		  animation: rotateRouter 8s linear infinite;
	
		  -moz-animation: rotateRouter 8s linear infinite;
		  
	
		  -webkit-animation: rotateRouter 8s linear infinite;
	
		  -o-animation: rotateRouter 8s linear infinite; }
		  
	
	.banz dt img{ position:absolute; top:26%; left:74%; }
	
	.banz dd{ width: 74px;
		height: 60px;
		text-align: center;
		margin-left:42%;
	}
	.banz dd img{ width:70px; height:20px;}

	.banz dd h5 a{ color:#fbac01;
			font-size:1.2em;
			line-height:2em;
			font-weight:400;
	}
		
	.tit_01 h1,.tit h1{
		padding-top:0%;
		font-size:1.8em;
		line-height:1em;
		text-align:center;
		color:#36383f;
	}
	
	.tit_02 h1{
		padding-top:0%;
		font-size:1.8em;
		line-height:1em;
		text-align:center;
		color:#ffffff;
	}
	.tit_01 h1 span,.tit_02 h1 span, .tit h1 span{
		color:#fbac01;
	}
	
	.work-info li h3{ 
		font-size:1.2em;
		font-weight:400;
		padding-bottom:5px; border-bottom:1px solid #ffffff;
		color:#ffffff;
		text-align:center;
	}
	
	.work-info h4{
		font-size:1.0em;
		color:#1e1d18;
		padding:12% 0 8%;
		}
	
/*老师*/
    .tea-box{
        width:88%;
    }
    .tea-info h1{
        font-size:1.8em;
		line-height:1.8em;
    }
    .tea-info h2{
        font-size:1.6em;
		line-height:1.6em;
    }
	
    .tea-info p{
        font-size:1.4em;
        line-height:1.6em;
    }
/*老师*/

/*学员视频*/
.video{ width:90%; margin:0 auto;}
.video li{
    height:170px;
	}

.video_r h3{
	font-size:1.6em;
	line-height:1.6em;
	font-weight:bold;
	color:#45474d;
	background:url(../images/stu-00.png) no-repeat left bottom;
	width:190px;
	}

.video_r p{
	font-size:1.1em;
	color:#525252;
	line-height:1.4em;
	padding-top:2%;	
	width:190px;
	height:100px;
	}


/*学员视频*/
	
/*返回首页和底部*/

    .goback{
        top:120px;
    }
    .back{
        width:42px;
        height:42px;
        background:url("../images/back.png") no-repeat center center;
        background-size:42px 42px;
    }
    .bottom-btn{
        height:64px;
    }
    .bottom-btn1{
        height:64px;
        background:url("../images/bottom-btn1.png") no-repeat center center;
        background-size:43px 43px;
    }
    .bottom-btn2{
        height:64px;
        background:url("../images/bottom-btn2.png") no-repeat center center;
        background-size:46.4px 46.4px;
    }

/*返回首页和底部*/

.tedu_a{display:block; width:24%; margin:0 auto; margin-top:4%; margin-bottom:4%;}
#go{ font-size:1.2em;}


}



/************************************************************************************
smaller than 320
*************************************************************************************/
@media screen and (min-width: 320px) and (max-width: 479px) {
    #pagewrap {
        margin: 0 auto;
        width: 100%;
        min-width:320px;
    }
    .header{
        height:48px;
    }
	.header-l{ width:60%; float:left;}
	
	.header-r{ float:right; width:38%;}

	.header-l img{ float:left; margin:5.4% 1.2% 0 4%; width:64px; height:24px; }
	.header-l span{ border-left:1px solid #333333; padding-left:2%; float:left; margin-top:4%;}
	.header-l span h3{ font-size:0.8em; line-height:1.2em; color:#24272e;}
	.header-l span h4{ font-size:0.6em; line-height:1.6em; color:#24272e; font-weight:normal;}
	
	.header-r h5{ margin-top:10%; font-size:1.0em; line-height:2.0em; }
	.header-r h5 img{ width:22px; height:14px;}
	.nav{ height:36px;}
	.nav ul li.Js{width: 9.6%;}
	.nav ul li.about{width: 17.6%;}
    .nav ul li{
		width:13.6%;
        height:36px;
        line-height:36px;
        font-size:1.1em;
		padding:0 1.0%;
    }
	
	.icon{ height:64px;}
	
	.icon ul li img{ width:70px; height:68px;}
	
	
	.banz{ width:100%; height:120px; background:#1e1d18; padding:7% 0; margin-top:8.4%;}
	
	.banz dl{ width:17%; float:left; }
	
	.banz dl:first-child{ margin-left:7.0%;}
	
	.banz dt{ width: 58px;
			height: 58px;
			text-align: center;
			position:relative;
	}
	
	.banz dt::before{
		  content: " ";
	
		  position: absolute;
	
		  width: 56px;
	
		  height: 56px;
	
		  border: 1.5px solid #fbac01;
		  
		  border-radius: 50%;
	
		  animation: rotateRouter 8s linear infinite;
	
		  -moz-animation: rotateRouter 8s linear infinite;
		  
	
		  -webkit-animation: rotateRouter 8s linear infinite;
	
		  -o-animation: rotateRouter 8s linear infinite; }
		  
	
	.banz dt img{ position:absolute; top:20%; left:72%; width:32px; height:32px; }
	
	.banz dd{ width: 58px;
		height: 56px;
		text-align: center;
		margin-left:42%;
	}
	
	.banz dd img{ width:54px; height:16px;}
	
	.banz dd h5 a{ color:#fbac01;
			font-size:0.8em;
			line-height:2em;
			font-weight:400;
	}
		
	
	.tit_01 h1,.tit h1{
		padding-top:0%;
		font-size:1.6em;
		line-height:1.4em;
		text-align:center;
		color:#36383f;
	}
	
	.tit_02 h1{
		padding-top:0%;
		font-size:1.6em;
		line-height:1.4em;
		text-align:center;
		color:#ffffff;
	}
	.tit_01 h1 span,.tit_02 h1 span, .tit h1 span{
		color:#fbac01;
	}

	.work-info li h3{ 
		font-size:0.9em;
		font-weight:400;
		padding-bottom:5px; border-bottom:1px solid #ffffff;
		color:#ffffff;
		text-align:center;
	}
	
	.work-info h4{
		font-size:0.8em;
		color:#1e1d18;
		padding:8% 0 8%;
		}

/*老师*/
    .tea-box{
        width:94%;
    }
    .tea-info h1{
        font-size:1.6em;
		line-height:1.6em;
    }
    .tea-info h2{
        font-size:1.2em;
		line-height:1.4em;
		
    }
	
    .tea-info p{
        font-size:1.0em;
        line-height:1.2em;
    }
/*老师*/

/*学员视频*/
.video{ width:90%; margin:0 auto;}
.video li{
    height:140px;
	}


.video_r h3{
	font-size:1.4em;
	line-height:1.6em;
	font-weight:bold;
	color:#45474d;
	background:url(../images/stu-00.png) no-repeat left bottom;
	width:120px;
	}

.video_r p{
	font-size:0.8em;
	color:#525252;
	line-height:1.2em;
	padding-top:2%;	
	width:120px;
	height:100px;
	}


/*学员视频*/


/*返回首页和底部*/
    .goback{
        top:100px;
    }
    .back{
        width:31px;
        height:31px;
        background:url("../images/back.png") no-repeat center center;
        background-size:31px 31px;
    }
    .bottom-btn{
        height:48px;
    }
    .bottom-btn1{
        height:48px;
        background:url("../images/bottom-btn1.png") no-repeat center center;
        background-size:34.8px 34.8px;
    }
    .bottom-btn2{
        height:48px;
        background:url("../images/bottom-btn2.png") no-repeat center center;
        background-size:34.8px 34.8px;
    }

/*返回首页和底部*/

.tedu_a{display:block; width:24%; margin:0 auto; margin-top:4%; margin-bottom:4%;}
#go{ font-size:1em;}

}

@media screen and (min-width: 320px){
	.nav ul li.Js{
		width:8.6%;
	}
	.nav ul li.about{
		width: 19.6%;
	}
	.nav ul li.teacher{
		width: 11.6%;
	}
} 

