@charset "utf-8";
/* CSS Document */
body {
    max-width: 100%; overflow-x: hidden; background: #1c1c1c;
    font: 18px/36px "Hiragino Sans GB", "MicroSoft YaHei", Arial, sans-serif; }
body , h1 , h2 , h3 , h4 , h5 , h6 , hr , p , blockquote , dl , dt , dd , ul , ol , li ,
pre , form , fieldset , legend , button , input , select, textarea ,
th, td { margin: 0; padding: 0; }
img { border: none; max-width: 100%; }
a { color: #2b2a3c; text-decoration: none; }
a:hover { text-decoration: none; }
a , area { blr: expression(this.onFocus=this.blur()); }
ul , ol , li { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; max-width: 100%; }
input , :focus { outline: 0; }
input[type="button"] , input[type="submit"] , input[type="reset"] , select { -webkit-appearance: none; appearance:none; -moz-appearance:none; -ms-appearance:none;}
input::focus-inner { padding: 0; border: 0; }
input::-webkit-input-placeholder{ color: #999; }
input::-moz-placeholder{ color: #999; }
input:-moz-placeholder{ color: #999; }
input:-ms-input-placeholder{ color: #999; }

.fl { float: left; } .fr { float: right; }
.clearfix::after { display: block; content: ''; height: 0; font-size: 0; clear: both; } .clearfix { zoom: 1;}
.clear { height: 0; width: 100%; overflow: hidden; font-size: 1px; line-height: 0; visibility: hidden; }
.Width { width: 1200px; margin: 0 auto; }
.hide , .onlymob { display: none; }


/* 通用头部 */
.ht_top {
    width: 100%; overflow: hidden;
    background: #fafafa url(https://www.huatu.com/z/topfooter/images/nav_bg.gif) repeat-x 0 0;
    line-height: 41px; }
.ht_top .zt_top {
    width: 1200px; height: 41px; margin: 0 auto; }
.ht_top h1 {
    float: left; }
.ht_top h1 a {
    float: left; width: 131px; height: 40px; overflow: hidden;
    background: url(https://www.huatu.com/z/topfooter/images/logo.gif) no-repeat;
    font-size: 12px; text-indent: -100em; }
.ht_top .topnav {
    float: right; color: #333; font-size: 12px; }
.ht_top .topnav a {
    padding: 0 8px; }
.ht_top .topnav a:hover {
    color: #e4393c; text-decoration: underline; }

/* 通用底部 */
.footer { clear: both; position: relative; padding: 30px 0; text-align: center; }
.footer p { position: relative; z-index: 2; color:#fff; font-size: 16px; line-height: 30px; }
.footer p span { padding: 0 5px; }
.footer p a { color:#fff; }


.banner{
	position: relative;
	height: 828px;
	background: url(../images/bannerbg.jpg) no-repeat center top;
	text-align: center;
}
.banner img{
	display: block;
	margin: 0 auto;
}

.searchbox{
	padding: 40px 0; text-align: center;
	background: #d3b171;
	background: linear-gradient(to top,#d3b171,#c98e20);
}
.searchbox a{
	display: inline-block; width: 250px; height: 50px; background: #1f1f1f; border-radius: 50px; font-size: 24px; color: #d3b171; border: 0;vertical-align: middle;
	margin: 0 50px; cursor: pointer; line-height: 50px; cursor: pointer; 
	transition: all .5s;
}
.searchbox a:hover{
	transform: scale(1.05,1.05);
}
.part01,.part04{
	height: 494px; margin: 100px auto 40px;
	background: url(../images/bg01.png) no-repeat center bottom;
}

.title{
	height: 82px; 
	background: url(../images/titbg01.png) no-repeat center top;
	font-size: 32px; line-height: 64px; color: #fff; text-align: center;
}
.tit-sm{
 margin-bottom: 35px;	text-align: center; font-size: 20px; line-height: 54px; color: #29e8f1;
}
.tit-sm span{
	display: inline-block; margin: 0 15px;	
}
.ul01 li{
	float: left; width: 197px; height: 258px; margin-left: 140px; 
	background: url(../images/libg01.png) no-repeat;
	text-align: center;
}
.ul01 li img{
	display: block; margin: 20px auto 10px;
}
.ul01 li h5{
	font-size: 18px; color: #d3b171; line-height: 40px;
}
.ul01 li p{
	font-size: 16px; color: #fff; line-height: 20px;
}
.ul01 li:hover{
	background-image: url(../images/libg02.png);
}


.teacherBox{
	overflow: hidden;
}
.tea-wrap{
	border-bottom: 2px dashed #d3b171; 
}
.tea-wrap:nth-child(2n+1) .tea-pic,.tea-wrap:nth-child(2n) .tea-txt{
	float: right;
} 
.tea-wrap:nth-child(2n) .tea-pic,.tea-wrap:nth-child(2n+1) .tea-txt{
	float: left;
}

.tea-pic{
	width: 450px;
}
.tea-pic img{
	display: block; width: 100%;
}
.tea-txt{
	width: 678px; margin-top: 65px;
}
.tea-wrap:nth-child(2n) .tea-txt .tit{
	text-align: right;
}
.tea-txt .tit{
	 margin-bottom: 40px;
}
.tea-txt .tit p{
	font-size: 30px; color: #d3b171; line-height: 40px;
}
.tea-txt .tit h5{
	width: 350px; border-bottom: 3px solid #ebd291; display: inline-block;
	font-size: 60px; color: #d3b171; line-height: 80px;
}
.tea-txt .txt{
	height: 350px;
	font-size: 26px; line-height: 48px; color: #fff; text-indent: 2em;
}
.btnwrap {
	text-align: center;
}
.btnwrap .btn{
	display: inline-block; width: 285px; height: 87px;
	background: url(../images/btn01.png) no-repeat center top;
	font-size: 0; text-indent: -999em; overflow: hidden;
	transition: all .5s;
}
.btnwrap .btn02{
	background-image: url(../images/btn02.png);
}
.btnwrap .btn:hover{
	transform: scale(1.05,1.05);
}
.btn-showmore{
	width: 100%; height: 146px; 
	background: url(../images/bg03.png) no-repeat;
	font-size: 40px; line-height: 146px; color: #d3b171; text-align: center; cursor: pointer;
}

.part03{
	height: 630px; margin: 60px auto;
	background: url(../images/bg02.png) no-repeat center bottom;
}
.tit-sm02{
 margin:15px 0;	text-align: center; font-size: 20px; line-height: 44px; color: #fff;
}
.tit-sm02 span{
	display: inline-block; margin: 0 15px;	
}
.tit-sm02 strong{
	color: #29e9f1; font-size: 25px;
}
.part03 h3{
 margin-bottom: 30px;	font-size: 32px; line-height: 50px; text-align: center;
}
.part03 h3 span{
	display: inline-block; vertical-align: middle; color: #d3b171; margin: 0 10px;
}
.part03 h3 i{
	display: inline-block; width: 75px; height: 22px; vertical-align: middle;
	background: url(../images/tit-l.png) no-repeat center center / 100% auto;
}
.part03 h3 i.tit-r{
	background-image: url(../images/tit-r.png);
}
.part03 .imgbox{
	text-align: center;
}
.imgbox .arr{
	margin:0 20px 10px;
}
.txtbox{
	text-align: center;
}
.txtbox p{
	display: inline-block; margin: 20px 40px 0; font-size: 20px; line-height: 36px; color: #d3b171; text-align: left;
}

.tabTit{
	margin: 20px 40px 0 76px;
}
.tabTit span {
    display: block;
    float: left;
    width: 125px;
    line-height: 50px;
    margin: 0 0 20px 20px;
    cursor: pointer;
    border-radius: 10px;
    border: 1px solid #d3b171;
    background: #fff;
    color: #000;
    font-size: 20px;
    text-align: center;
}
.tabTit span.on,
.tabTit span:hover {
    background: #d3b171;
	  background: linear-gradient(to top,#d3b171,#c98e20);
    color: #fff;
}
.tabCon {
    padding: 30px 50px 0 92px;
    color: #333;
    font-size: 18px;
    line-height: 35px;
    text-align: left;
}
.tabCon .con{
    margin: 0 auto;
    position: relative;
}
.tabCon h5 {
    color: #d3b171;
    font-size: 18px;
    line-height: 35px;
    font-weight: normal;
}
.tabCon p{
	color: #d3b171;
}
.tabCon .con a{
    font-size: 20px;
    color: #333;
    display: block;
    width: 155px;
    line-height: 55px;
    text-align: center;
    background: #fff;
    border-radius: 10px;
		border: 1px solid #d3b171;
    position: absolute;
    right: 50px;
    top: 50%;
    transform: translateY(-50%);
		cursor: pointer;
}
.tabCon .con a:hover{
		background: #d3b171;
	  background: linear-gradient(to top,#d3b171,#c98e20);
    color: #fff;
}

.xfnav{
	position: fixed; right: 0; bottom: 50%; margin-bottom: -150px;
	width: 200px; padding: 50px 0 10px; border: 5px solid #d3b171; border-radius: 16px; display: none;
}
.xfnav img{
	position: absolute; left: 5px; top: -80px;
}
.xfnav a{
	display: block; width: 170px; height: 36px; margin: 0 auto 20px; border: 3px solid #d3b171; border-radius: 36px;
	font-size: 28px; line-height: 32px; color: #d3b171; text-align: center;
}
.xfnav a:hover{
	background: #d3b171;
	background: linear-gradient(to top,#d3b171,#c98e20);
  color: #000;
}


@media only all and (max-width:1200px) {
  .onlymob { display: block; }
  html { font-size: 20px; }
  body { 
    max-width: 18.75rem;
    font-size: .7rem; line-height: 1.2rem; 
  }
  html , body { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .Width,.container{ width: 17.75rem; }

  /* 隐藏元素 */
  .ht_top .topnav a:nth-child(n+2),
  .pc , .onlypc { display: none; }

  /* 通用头部 */
  .ht_top { height: 2.5rem; background-size: auto 100%; line-height: 2.5rem; }
  .ht_top h1 a {
    height: 2.5rem; width: 7.5rem;
    background: url(https://www.huatu.com/images/2015css/images/mob_logo.png) no-repeat center / contain; }
  .ht_top .topnav { font-size: .8rem; text-indent: -1000rem; }
  .ht_top .topnav a { padding: 0 0 0 0.3rem; text-indent: 0; float: right; word-break: keep-all; }
	
	
	
	.banner{
		height: 12.4rem;
		background: url(../images/bannerbg.jpg) no-repeat center top / 160% auto;
		text-align: center;
	}
	.banner img{
		width: 100%;
	}

	.searchbox{
		padding: 1rem 0;
	}
	.searchbox a{
		width: 5rem; height: 1.5rem; border-radius: 1.5rem; font-size: .7rem; margin: 0 1rem ; line-height: 1.5rem;
	}
	
	.part01,.part04{
		height: auto; margin: 1rem auto;
		background:none;
	}

	.title{
		height: 2rem; 
		background: url(../images/titbg01.png) no-repeat center top / auto 100%;
		font-size: 1rem; line-height: 1.5rem;
	}
	.tit-sm{
	 margin-bottom: 1rem;	font-size: .7rem; line-height: 1.2rem;
	}
	.tit-sm span{ margin: 0 .3rem;	
	}
	.ul01 li{
		width: 5.7rem; height: 7.5rem; margin-left: .2rem; 
		background: url(../images/libg01.png) no-repeat center top / 100% auto;
	}
	.ul01 li img{
		width:2rem; margin: .5rem auto .3rem;
	}
	.ul01 li h5{
		font-size: .6rem; line-height: 1.5rem; font-weight: normal;
	}
	.ul01 li p{
		font-size: .6rem; line-height: 1rem;
	}
	.ul01 li:hover{
		background-image: url(../images/libg02.png);
	}


	
	.tea-wrap{
		border-bottom: 2px dashed #d3b171; 
	}
	.tea-pic{
		width: 6.25rem;
	}
	.tea-pic img{
		display: block; width: 100%;
	}
	.tea-txt{
		width: 11.5rem; margin-top: 1rem; 
		
	}
	.tea-txt.fr .tit{
		text-align: right;
	}
	.tea-txt .tit{
		 margin-bottom: .5rem;
	}
	.tea-txt .tit p{
		font-size: .6rem; line-height: 1rem; display: none;
	}
	.tea-txt .tit h5{
		width: 4rem; border-bottom: .05rem solid #ebd291;
		font-size: .8rem; line-height: 1.2rem;
	}
	.tea-txt .txt{
		height: 6rem; overflow: hidden;
		font-size: .6rem; line-height: 1rem;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 6;
		-webkit-box-orient: vertical;
	}
	.btnwrap .btn{
		width: 5rem; height: 2rem;
		background: url(../images/btn01.png) no-repeat center top / 100% auto;
	}
	.btnwrap .btn02{
	background-image: url(../images/btn02.png);
}
	.btn-showmore{
		width: 100%; height: 3rem; 
		background: url(../images/bg03.png) no-repeat center top / auto 100%;
		font-size: 1rem; line-height: 3rem;
	}

	.part03{
		height: auto; margin: 1rem auto;
		background: none;
	}
	.tit-sm02{
	 margin:.5rem 0;	font-size: .6rem; line-height: 1.1rem;
	}
	.tit-sm02 span{
		margin: 0 .2rem;	
	}
	.tit-sm02 strong{
		font-size: .7rem;
	}
	.part03 h3{
	 margin-bottom: 1rem;	font-size: .75rem; line-height: 1.5rem; 
	}
	.part03 h3 span{
		margin: 0 .3rem;
	}
	.part03 h3 i{
		width: 2rem; height: .6rem;
	}
	.imgbox .tutu{
		width: 3.5rem;
	}
	.imgbox .arr{
		width: 1rem;
		margin:0 .5rem .2rem;
	}
	
	.txtbox p{
		margin: .5rem .5rem 0; font-size: .6rem; line-height: 1rem; 
	}
  
	.tabTit{
		margin: 1rem auto 0;
	}
	.tabTit span {
			width: 3.9rem;
			height: 1.5rem;
			line-height: 1.5rem;
			margin: 0 .4rem .6rem 0;
			border-radius: .25rem;
			font-size: .6rem;
	}
	.tabTit span:nth-child(4n){ margin-right: 0;}
	.tabCon {
			padding: .5rem 0 1rem;
			font-size: .6rem;
			line-height: 1.5rem;
	}
	.tabCon .con{
			margin: 0 auto;
			position: relative;
	}
	.tabCon h5 {
			font-size: .7rem;
			line-height: 1.5rem;
	}
	.tabCon .con a{
			font-size: .6rem;
			width: 6rem;
			line-height: 1.5rem;
			border-radius: .25rem;
			position: inherit;
			right: auto;
			top: auto;
			transform: none;
			margin: .5rem auto;
	} 
	
	.xfnav{
		position: fixed; right: 0; bottom: 50%; margin-bottom: -2rem;
		width: 3rem; height: 3rem; padding:0; border: 0; border-radius: 50%; 
		background: linear-gradient(to top,#d3b171,#c98e20);
		color:#fff; box-shadow: 0 0 .5rem 0 #fff;
	}
.xfnav img,.xfnav a{
	display: none;
}
.xfnav a.zx{
	display: block; width: 100%; height: 100%; padding: .5rem; margin:0; border:0; border-radius: 50%;
	font-size: .7rem; line-height: 1rem; color: #fff; box-sizing: border-box;
}

 
  /* 通用底部 */
  .m-footer { height: 2.4rem; background: #333; color:#fff; font-size: .7rem; line-height: 2.4rem; text-align: center; }
  
 
}
