@charset "utf-8";
/* CSS Document */
body {
	max-width: 100%; overflow-x: hidden;
	background: #fff;
	color:#333; 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: #333; text-decoration: none; }
a:hover { color: #e4393c; 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"] { -webkit-appearance: none; font-family:"Hiragino Sans GB", "MicroSoft YaHei", Arial, sans-serif ; }
input::focus-inner { padding: 0; border: 0; }

::selection {background: #D03333;color: white;text-shadow: none; opacity: .5;}
::-webkit-scrollbar-track-piece{width:10px;background-color:#f2f2f2; opacity: .5;}
::-webkit-scrollbar{width:10px;height:6px; opacity: .5;}
::-webkit-scrollbar-thumb{height:50px;background-color:rgba(0,0,0,.3);}
::-webkit-scrollbar-thumb:hover{background:#707070; opacity: .5;}

.fl { float: left; } .fr { float: right; }
.clearfix:after { display: block; content: ''; 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 {
	position: relative; width: 100%; overflow: hidden; z-index: 2;
	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; }

.banner { 
	position: relative; height:610px; padding-top:20px; box-sizing: border-box;
	background:url(../images/pic01.jpg) no-repeat top;
}
.banner .logo {
	display: block; width: 215px; height: 36px; overflow: hidden;
	background: url(../images/logo.png) no-repeat left;
	background-size: contain;
	text-indent: -9999em;
}
.banner h2 { 
	height: 151px; margin-top: 54px; overflow: hidden;
	background: url(../images/pic02.png) no-repeat center;
	background-size: contain;
	text-indent: -9999em;
}
.banner h3 {
	width: 426px; height: 62px; margin:0 auto;
	border: solid 1px #d8e5ff; border-radius:62px;
	color: #ffea37; font-size:40px; font-weight: 400; line-height:62px; text-align: center;
}	

.box01 {
	position:relative; margin-top:20px;
}
.slideBox { 
	position:relative; width:1100px; height:448px; margin:0 auto; overflow:hidden;
}
.slideBox .bd {
	position:relative;
}
.slideBox ul {
	float:left; width:200%;
}
.prevBtn,
.nextBtn {
	position:absolute; left:50%; bottom:149px; z-index:1; cursor: pointer; opacity:.75;
	display:block; width:80px; height:80px; margin-left:-660px;
	background: url(../images/pic11.png) no-repeat center;
	transition: all .3s; 
}
.nextBtn {
	margin-left:580px;
	transform:rotate(180deg);
}
.prevBtn:hover,
.nextBtn:hover {
	opacity: 1;
}
.box01 li {
	position: relative; float:left; width:1100px; height:448px; opacity:.5; overflow: hidden;
	transform: scale(.8);
	transition:all .2s;
}
.box01 li.on,
.box01 li:first-child {
	opacity: 1;
	transform: scale(1);
}
.title {
	margin-bottom: 40px;
	color: #467ff7; font-size:55px; line-height:60px; text-align: center;
}
.title i {
	position: relative; display: inline-block; width: 110px; height: 25px; margin:30px 10px 0;
	background: rgba(102,188,243,.2); border-radius:25px; vertical-align:top;
}
.title i:before {
	position: absolute; left:0; top:-15px;
	content: " "; display:block; width:75px; height: 25px;
	background: rgba(62, 141, 220,.75); border-radius:25px;
	animation:float01 1.5s ease-in-out infinite alternate;
}
.title i:last-child:before {
	animation-direction:alternate-reverse;
}
@keyframes float01 {
	0% { transform:translateX(0); }
	100% { transform:translateX(35px); }
}
.wrap {
	width:1090px; box-sizing: border-box;
	background: #fff; border:20px solid #497ff5; border-radius: 25px;
	box-shadow:10px 10px 0 #3954fb,0 10px 0 #3954fb,10px 0 0 #3954fb;
}
.box01 .tabTit {
	height:318px; padding:70px 25px 0;
}
.box01 .tabTit span,
.box04 .btnBox a {
	position: relative; display:block; float: left; width: 220px; height: 52px; margin: 0 15px 30px; cursor: pointer; box-sizing: border-box;
	background: #fff; border: solid 1px #2b42ee; border-radius:52px;
	background: linear-gradient( 90deg, #fff, #fff, #fe5a6c , #ffa266 ) no-repeat left;
	background-size: 300% 105%;
	font-size: 26px; line-height: 52px; text-align: center;
	transition: all .3s;
}
.box01 .tabTit span.on,
.box04 .btnBox a:hover {
	border-color:transparent;
	background-position:95% center;
	color: #fff;
}
.box01 .tabTit02 {
	padding-top:30px;
}
.box01 .tabTit02 span:nth-child(5),
.box01 .tabTit02 span:nth-child(6),
.box01 .tabTit02 span:nth-child(7),
.box01 .tabTit02 span:nth-child(8) {
	float: right;
}
.box01 .tabTit02 span:before {
	position: absolute; right:-30px; top:0; pointer-events: none;
	content: " "; display: block; width:30px; height:100%;
	background: url(../images/pic12.png) no-repeat center;
}
.box01 .tabTit02 span:nth-child(4):before,
.box01 .tabTit02 span:nth-child(8):before {
	left:0; top:100%; width:100%; height:30px;
	transform:rotate(90deg);
}

.box01 .tabTit02 span:nth-child(5):before,
.box01 .tabTit02 span:nth-child(6):before,
.box01 .tabTit02 span:nth-child(7):before {
	left:-30px;
	transform:rotate(180deg);
}
.box01 .tabTit02 span:nth-child(10):before{
	display: none;
}

.box02 {
	position: relative; width:1100px; height:100px; padding-left: 90px; margin:65px auto; overflow: hidden; box-sizing: border-box;
	background: #fff url(../images/pic21.png) no-repeat 20px center; border: solid 1px #4372f8; border-radius: 25px;
}
.box02 .searchInput {
	display: block; width:830px; height:100px; 
	background: none; border: none;
	font-size: 22px;
}
.box02 .searchBtn {
	position: absolute; right:0; top: 0; cursor: pointer;
	background: #4372f8; border: none; display: block; width:180px; height:105px;
	border-radius:0 25px 25px 0;
	color:#fff; font-size:30px; line-height: 100px;
	transition: all .2s;
}
.box02 .searchBtn:hover {
	background: #3954fb;
}
.conBox {
	width:1100px; margin:0 auto;
}
.box03 .wrap {
	height:618px; padding:30px 80px 0; overflow-y: auto;
	color: #467ff7; font-size: 20px; text-align: justify;
}
.box03 .wrap dt,
.box03 .wrap dd {
	margin-left: 2.5em;
	text-indent: -2.5em;
}
.box03 .wrap dt i,
.box03 .wrap dd i {
	color:#ffa266; font-style: normal;
}
.box03 .wrap dd {
	margin-bottom:15px;
}
.box03 .wrap table {
	width:100%; text-align: center; margin-bottom:20px;
}
.box03 .wrap th,
.box03 .wrap td {
	padding: 5px;
	border:1px solid #3954fb;
	font-size: 16px; line-height: 24px; text-indent: 0;
}
.box03 .wrap th {
	height: 40px;
	background:#467ff7;
	color:#fff; word-break: keep-all;
}
.box03 #searchNull .wrap {
	height:auto; padding-bottom:20px;
}
.box03 .wrap .noResult {
	width:700px; margin:0 auto; overflow: hidden;
}
.box03 .wrap .noResult dt {
	float:left; margin-left: 0; text-align: 0;
}
.box03 .wrap .noResult img {
	display: block; width:200px;
}
.box03 .wrap .noResult dd {
	float:left; width:460px; padding-top:50px;  margin-left:30px;
	text-indent: 2em;
}

.box04 {
	padding-top: 150px; padding-bottom: 100px; margin-top: 60px;
	background:#5280f5 url(../images/pic40.jpg) no-repeat top;
}
.box04 .title {
	color: #fff;
}
.box04 .title i:before {
	background: rgba(112, 164, 236,.75);
}
.box04 .wrap {
	position: relative; left: -5px; height:318px; padding:70px 25px 0; margin: 0 auto;
	border-color:#6390f4;
	box-shadow:10px 10px 0 #215ad5,0 10px 0 #215ad5,10px 0 0 #215ad5;
}

/* 热搜 */
.hotList {
	display: none; position: fixed; left:5px; top:50%; z-index: 8;
	width:280px; box-sizing: border-box;
	background:#fff; border: solid 1px #254ada;
	transform: translateY(-50%);
}
.hotList h4 {
	position: absolute; left:-5px; top:-110px; pointer-events: none;
	width: 301px; height: 163px; overflow: hidden;
	background: url(../images/xf02.png) no-repeat top;
	text-indent: -999em;
}
.hotList p {
	height: 48px; overflow: hidden; word-break:keep-all; text-overflow: ellipsis; cursor: pointer;
	border-bottom: 1px solid #dfe4f9;
	line-height: 48px; text-indent: 30px;
	transition:all .2s;
}
.hotList p:nth-child(n+5) {
	border-bottom: none;
}
.hotList p:nth-child(n+6) { display: none; }
.hotList p:hover {
	color:#254ada;
}
/* 二维码 */
.codeBox {
	display: none; position: fixed; right:5px; top:50%; z-index: 8;
	width:220px; padding-bottom: 15px; box-sizing: border-box;
	background:#fff; border: solid 1px #254ada;
	transform: translateY(-50%);
	text-align: center;
}
.codeBox:before {
	position: absolute; left: 0; top:-215px; pointer-events: none;
	content: " "; display: block; width: 100%; height: 215px;
	background: url(../images/xf01.png) no-repeat top;
}
.codeBox img {
	display: block; width: 200px; margin: 10px auto 0;
}

/* 通用底部 */
.footer { clear: both; position: relative; padding: 30px 0; background: #333; 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 ,
.footer p a:hover { color: #fff; }

@media only all and (min-width:2000px) {
	.box04 {
		background-size: 100% 133px;
	}
}
@media only all and (max-width:1800px) {
	.hotList { width:170px; }
	.hotList h4 { top:-65px; width:190px; height:100px; background-size:contain; }
	.hotList p { height: 32px; font-size: 12px; line-height:32px; text-indent:10px; }
	/* 二维码 */
	.codeBox { width:150px; padding-bottom: 10px; font-size: 12px; line-height:30px; }
	.codeBox:before { top:-110px; height:110px; background-size: 75%; }
	.codeBox img { width:145px; margin-top: 0; }
	
}
@media only all and (max-width:1600px) {
	.hotList { top:auto; bottom: 5%; transform: translateY(0); }
	/* 二维码 */
	.codeBox { top:auto; bottom: 5%; transform: translateY(0); width:130px; padding-bottom:0; }
	.codeBox:before { top:-80px; height:80px; background-size:60%; }
	.codeBox img { width:125px; }
}
@media only all and (max-width:1440px) {
	.prevBtn { margin-left:-640px; }
	.nextBtn { margin-left:560px; }
}
@media only all and (max-width:1200px) {
	.onlymob { display: block; }
	html { font-size: 20px; }
	body { 
		width: 18.75rem; font-size: .7rem; line-height: 1.2rem;
	}
	html , body { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
	.Width { width: 17rem; }

	/* 隐藏元素 */
	.ht_top .topnav a:nth-child(n+2),
	.footer p,
	.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:10.75rem; padding-top:.5rem; background-size: auto 100%; }
	.banner .logo { width:3.75rem; height:.7rem; }
	.banner h2 { height:2.75rem; margin-top:1rem; }
	.banner h3 { width:7.4rem; height:1.1rem; margin-top: .15rem; border-radius:1.1rem; font-size:.74rem; line-height:1.1rem; }	
	
	.box01 { margin-top:1rem; }
	.slideBox { width:17rem; height:12.65rem; }
	.prevBtn,
	.nextBtn { opacity:1; bottom:4.2rem; width:1.8rem; height:1.8rem; margin-left:-9rem; background-size:contain; }
	.nextBtn { margin-left:7.2rem; }
	.box01 li { width:17rem; height:12.65rem; }
	.title { margin-bottom:1rem; font-size:1.3rem; line-height:1.5rem; }
	.title i { width:2rem; height:.5rem; margin:.8rem .35rem 0; border-radius:.5rem; }
	.title i:before { top:-.3rem; width:1.2rem; height:.5rem; border-radius:.5rem; }
	@keyframes float01 {
		0% { transform:translateX(0); }
		100% { transform:translateX(.8rem); }
	}
	.wrap {
		width:16.85rem; border-width:.3rem; border-radius:.5rem;
		box-shadow:.15rem .15rem 0 #3954fb,0 .15rem 0 #3954fb,.15rem 0 0 #3954fb;
	}
	.box01 .tabTit { height:10rem; padding:2rem .625rem 0; }
	.box01 .tabTit span,
	.box04 .btnBox a {
		width:4.6rem; height:1.6rem; margin: 0 .2rem .4rem; z-index: 1;
		border-width: .05rem; border-radius:1.6rem;
		font-size:.6rem; line-height:1.5rem; 
	}
	.box01 .tabTit02 { padding-top:1rem; }
	
	.box01 .tabTit02 span:nth-child(1),
	.box01 .tabTit02 span:nth-child(2),
	.box01 .tabTit02 span:nth-child(3),
	.box01 .tabTit02 span:nth-child(9) { float: right; }
	.box01 .tabTit02 span:nth-child(5),
	.box01 .tabTit02 span:nth-child(6) { float: left; }
	.box01 .tabTit02 span:before,
	.box01 .tabTit02 span:nth-child(7):before ,
	.box01 .tabTit02 span:nth-child(8):before { left:-.425rem; top:0; width:.4rem; background-size:.8rem auto; transform:rotate(180deg); }
	.box01 .tabTit02 span:nth-child(3):before,
	.box01 .tabTit02 span:nth-child(6):before,
	.box01 .tabTit02 span:nth-child(9):before { left:50%; top:100%; width:.4rem; height:.425rem; transform:translateX(-.2rem) rotate(90deg); }
	.box01 .tabTit02 span:nth-child(4):before,
	.box01 .tabTit02 span:nth-child(5):before { left:auto; right:-.425rem; top:0; width:.4rem; height:100%; transform:rotate(0); }
	
	.box02 { 
		width:17rem; height:2.4rem; padding-left:1.5rem; margin:1.25rem auto 0;
		background-size:1rem; background-position: .25rem; border-width: .05rem;  border-radius:.5rem;
	}
	.box02 .searchInput { width:11.5rem; height:2.3rem; line-height: 2.3rem; font-size:.75rem; }
	.box02 .searchBtn { width:4rem; height:2.3rem; border-radius:0 .5rem .5rem 0; font-size:.7rem; line-height:2.3rem; }

	.conBox { width:17rem; margin-top: 1.5rem; }
	.box03 .wrap { height:20rem; padding:1rem 1rem 0; font-size:.65rem; line-height: 1rem; }
	.box03 .wrap dd,
	.box03 .wrap table { margin-bottom:.5rem; }
	.box03 .wrap th,
	.box03 .wrap td { padding:.15rem; font-size:.6rem; line-height:.8rem; }
	.box03 .wrap th { height:1.8rem; }
	.box03 .wrap .noResult { width:15rem; }
	.box03 .wrap .noResult img { width:5rem; }
	.box03 .wrap .noResult dd { width:9rem; padding-top: .5rem; margin-left:.5rem; }
	
	.moreTag {
		width:8rem; height:2rem; margin:.75rem auto; cursor: pointer; box-sizing: border-box;
		background: #fff; border: solid .05rem #2b42ee; border-radius:2rem;
		background: linear-gradient( 90deg, #fff, #fff, #fe5a6c , #ffa266 ) no-repeat left;
		background-size: 300% 105%;
		font-size:.7rem; line-height:2rem; text-align: center;
		transition: all .3s;
	}
	.moreTag:hover {
		border-color:transparent;
		background-position:95% center;
		color: #fff;
	}
	
	.box04 { padding-top:3rem; padding-bottom:1rem; margin-top:1rem; background-size:auto 3rem; background-position:top; }
	.box04 .wrap {
		left: -.075rem; height:auto; padding:1rem .5rem .5rem;
		box-shadow:.15rem .15rem 0 #215ad5,0 .15rem 0 #215ad5,.15rem 0 0 #215ad5;
	}
	
	/* 热搜 */
	.hotList {
		position:relative; left:0; top:0; overflow: hidden; 
		width:17rem; padding:.5rem 0; margin:0 auto; border-width: .05rem; transform: translateY(0);
	}
	.hotList h4 { display: none; }
	.hotList p {
		display: inline-block; height:1.2rem; margin:0 .2rem;
		border-bottom:none;
		font-size:.6rem; line-height:1.2rem; text-indent:0;
	}
	.hotList p:nth-child(n+6) { display: inline-block; }
	/* 二维码 */
	.codeBox {
		display: block; position:relative; right:0; top:0;
		width:100%; padding:.5rem 3rem 1.5rem 6rem; margin-top: -2px;
		background:#5280f5; border:none;
		transform: translateY(0);
		color: #fff;
	}
	.codeBox:before { left:3rem; top:1.5rem; width:5rem; height:6rem; background-size:contain; }
	.codeBox img { width:6rem; margin-top:0; }
	
	/* 通用底部 */
	.footer { position: relative; height: 2.4rem; padding: 0; overflow: hidden; }
	.footer:before {
		display: block; content: "华图教育集团版权所有";
		position: absolute; left: 0; top: 0;
		width: 100%; height: 2.4rem; overflow: hidden;
		color:#fff; font-size: .7rem; line-height: 2.4rem; text-align: center; }

}
