@charset "utf-8";
/* 2018.04.09 by zq */
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td ,img{ margin: 0; padding: 0; font:14px/28px "Hiragino Sans GB","MicroSoft YaHei",Arial,sans-serif; color:#262121; border:none;}
html,body { -webkit-tap-highlight-color:rgba(0,0,0,0); }
img { max-width:100%; }
body { background:#fff url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/bg.jpg") no-repeat center 40px; overflow-x:hidden; }
article, iframe { display:block; border:0;}
ul, li { list-style:none;}
table { border-collapse:collapse;border-spacing:0; max-width:100%;}
input::focus-inner{ outline:0;padding:0;border:0;}
input[type="button"], input[type="submit"], input[type="reset"], button {-webkit-appearance:none; outline:0;}
:focus { outline: none; }
a,area { blr:this.onFocus=this.blur()) }
a { color:#262121; text-decoration:none;}
a:hover { color: #e21837; text-decoration:none;}
.Width { width:1200px; margin:0 auto;}
.clear { clear:both;height:0px; width:100%; font-size:1px;line-height:0px; visibility:hidden; overflow:hidden;}
.clearfix:after{ content:" ";display:block; visibility:hidden; height:0;font-size:0; clear:both;}
.clearfix { *zoom:1;}
.hide, .mobshow, .onlymob, .mob { display:none;}
.fl { float:left;} .fr { float:right;}

.ht_top {width: 100%;background: #fafafa url(http://www.huatu.com/z/topfooter/images/nav_bg.gif) repeat-x 0 0;line-height: 41px;overflow: hidden;}
.ht_top .zt_top {width: 1160px;height: 41px;margin: 0 auto;}
.ht_top h1 { float:left;}
.ht_top h1 a {float: left;width: 131px;height: 40px;overflow: hidden;text-indent: -100em;background: url(http://www.huatu.com/z/topfooter/images/logo.gif) no-repeat; font-size:12px;}
.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 */
.banner { position: relative; width: 100%; height:658px;
	background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/banner_bg.png") no-repeat center; }
.banner .pic { position: absolute; left:50%; }
.banner .pic01 { width:215px; height:122px; margin-left:135px; top:510px;
	background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/banner_01.png") no-repeat center;
	animation: picrotate01 12s infinite alternate; }
.banner .pic02 { width:939px; height:537px; margin-left:-1208px; top:278px;
	background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/banner_02.png") no-repeat center;
	animation: picrotate01 12s infinite alternate; }
.banner .pic03 { width:684px; height:751px; margin-left:-1100px; top:-45px;
	background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/banner_03.png") no-repeat center;
	animation: picrotate01 12s 1s infinite alternate; }
.banner .pic04 { width:503px; height:331px; margin-left:-710px; top:105px;
	background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/banner_04.png") no-repeat center;
	animation: picrotate02 15s infinite alternate;}
.banner .pic05 { width:435px; height:316px; margin-left:285px; top:105px;
	background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/banner_05.png") no-repeat center;
	animation: picrotate01 12s 1s infinite alternate;}
.banner .pic06 { width:809px; height:840px; margin-left:405px; top:-220px;
	background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/banner_06.png") no-repeat center;
	animation: picrotate02 12s infinite alternate;}
.banner h1 { position: absolute; left:50%; top:105px; width:1200px; margin-left:-600px;
	color: #fff; font-size: 96px; font-weight: bold; line-height:110px; text-align: center;
	text-shadow:0 0 25px rgba(41,41,41,.2); }
.banner h1 span { font-size: 90px; }
.banner p { position: absolute; left:50%; top:370px; width:740px; padding:20px 60px; margin-left:-450px;
	background: rgba(0,0,0,.15); border-radius:55px;
	color: #fff600; font-size:18px; line-height:34px; text-align:justify; }
.banner p a{color: #fff000;}	
.banner .pic07 { position: absolute; left:0; bottom:0;
	width:100%; height:183px; background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/banner_07.png") no-repeat top; }
	.selectbox .selectdiv a{ color:#f00;}
	.selectbox .selectdiv a:hover{ text-decoration:underline;}
@keyframes picrotate01 {
	0%{ transform: rotate(0); }
	100%{ transform:rotate(-15deg); }
}
@keyframes picrotate02 {
	0%{ transform: rotate(0); }
	100%{ transform:rotate(15deg); }
}

.stepbox { position: relative; width:1068px; padding:0 66px; margin:50px auto 0;
	background: #fff; border-radius: 15px; box-shadow: 0 0 20px rgba(0,0,0,.1); }
.stepbox:before { content: ""; display: block; position: absolute; right:-90px; top:-40px;
	width:66px; height:60px; z-index: -1;
	background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_01.png") no-repeat; }
.stepbox .pic { position: absolute; left:-86px; bottom:-54px;
	width:141px; height:141px; z-index: -1;
	background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_02.png") no-repeat; }
.stepbox .line { position: absolute; left:0; top:95px; width:1200px; height: 1px; background: #e8e8e8; }
.stepbox .con { float:left; width:266px; height:410px; margin:0 45px;
	background:#faf9fa; text-align: center; transition:background 0.5s; }
.stepbox .con a { display: block; width:100%; height: 100%; }
.stepbox .con i { position: relative; display: block; width:100%; height:235px; }
.stepbox .con i:before { content: ""; position: absolute; top:90px; left:50%; display: block;
	width:10px; height:10px; margin-left:-5px;
	background:#aaa; border-radius: 20px; }
.stepbox .con i:after { content: ""; position: absolute; top:86px; left:50%; display: block;
	width:16px; height:16px; margin-left:-9px;
	border:1px solid #aaa; border-radius: 20px; }
.stepbox .con .icon01 { background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_04.png") no-repeat center bottom; }
.stepbox .con .icon02 { background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_06.png") no-repeat center bottom; }
.stepbox .con .icon03 { background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_08.png") no-repeat center bottom; }
.stepbox .con h3 { font-size: 24px; line-height: 50px; }
.stepbox .con p { color:#999; font-size: 16px; line-height: 26px; }
.stepbox .able,
.stepbox .able a { cursor: pointer; }
.stepbox .unable,
.stepbox .unable a { cursor: default; }
.stepbox .able i:before { background:#f768a4; }
.stepbox .able i:after { border:1px solid #f768a4; }
.stepbox .able .icon01 { background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_03.png") no-repeat center bottom; }
.stepbox .able .icon02 { background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_05.png") no-repeat center bottom; }
.stepbox .able .icon03 { background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_07.png") no-repeat center bottom; }
.stepbox .able:hover { background:#f768a4; }
.stepbox .able:hover .icon01 { background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_03a.png") no-repeat center bottom; }
.stepbox .able:hover .icon02 { background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_05a.png") no-repeat center bottom; }
.stepbox .able:hover .icon03 { background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_07a.png") no-repeat center bottom; }
.stepbox .able:hover i:before { background:#fff; border-radius: 20px; }
.stepbox .able:hover i:after { border:1px solid #fff; }
.stepbox .able:hover h3,
.stepbox .able:hover p { color:#fff; }

.giftbox { width:1170px; margin:80px auto 50px; }
.giftdiv { position: relative; width:540px; height:300px; }
.giftdiv:before { content: ""; position: absolute; top:-15px; right:-15px;
	width:534px; height:294px;
	border:3px solid #efefef;
	transition:all 0.3s;}
.giftdiv:hover:before{
	border:3px solid #ed5f9b;
	border-image: -webkit-linear-gradient( 135deg, #b66cdf,#ed5f9b, #b66cdf) 3 3;
	border-image: linear-gradient( 135deg,#b66cdf,#ed5f9b, #b66cdf) 3 3; }
.giftdiv a { display:block; position: absolute; height:210px; padding-top:90px;
	color:#fff; font-size: 50px; line-height: 60px; }
.leftgift a { width:500px; padding-left:40px; background:url(https://u3.huatu.com/uploads/allimg/210413/660673-210413131554517.png) no-repeat center;
	background-size: 100%;
	transition:all 0.8s;}
.leftgift_1 a { width:500px; padding-left:40px; background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_09.png") no-repeat center;
	background-size: 100%;
	transition:all 0.8s;}
.leftgift a span { color:#45f0b1; }
.leftgift2 a { width:540px; background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_13.png") no-repeat center; text-align: center;
	background-size: 100%;
	transition:all 0.8s;}
.leftgift2 a span { color:#00eaff; }
.rightgift a { width:540px; background:url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_10.png") no-repeat center; text-align: center;
	background-size: 100%;
	transition:all 0.8s;}
.rightgift a span { color:#ffe400; }
.giftdiv:hover a { background-size: 102%; }

.orderbox { padding:70px 66px 45px; margin-bottom:70px; }
.orderdiv { width:450px; }
.orderdiv .text { margin-bottom:12px; }
.orderdiv lable { display:block; float: left; width: 85px; font-size: 20px; line-height: 42px; }
.orderdiv .input { display:block; float: left; width:360px; height: 40px;
	border: 1px solid #ddd; font-size: 16px; text-indent:20px; }
.orderdiv .input:focus { border: 1px solid #f660c0; }
.orderdiv .yzinput { width: 230px; }
.orderdiv .yzbtn { display:block; float: left; width:120px; height: 42px; margin-left: 10px; cursor: pointer;
	background:#f660c0; border-radius:40px;
	color: #fff; font-size: 16px; line-height: 42px; text-align: center;
	background: linear-gradient(135deg , #ed5f9b, #ed5f9b, #b66cdf,#ed5f9b );
	background-size:300% 110%; background-position:0 center; background-repeat: repeat-x;
	transition:background-position 0.5s; }
.orderdiv .yzbtn:hover { background-position:100% center; color: #fff; }
.orderdiv .postbtn { display:block; width:200px; height:50px; margin:30px auto; cursor: pointer;
	background:#fff; border:1px solid #f660c0; border-radius: 50px;
	color:#f660c0; font-size:20px; line-height: 50px; text-align: center;
	background: linear-gradient(135deg , #fff, #fff, #b66cdf,#ed5f9b );
	background-size:300% 110%; background-position:0 center; background-repeat: repeat-x;
	transition:background-position 0.5s; }
.orderdiv .postbtn:hover { background-position:100% center; color: #fff; }
.orderdiv p { font-size: 16px; color:#999; }
.orderdiv p a { color:#f660c0; }

.selectbox { padding:40px 66px; }
.selectbox .loginpic { width:450px; }
.selectbox .loginpic img { width: 450px; height: 340px; }
.selectbox .loginpic span { display: none;}
.selectbox .selectdiv { width:590px;}
.selectbox h4 { font-size: 26px; line-height: 50px; }
.selectbox p { margin:15px 0 30px; font-size:16px; line-height:28px; }

.tipbox { margin-top: 90px; margin-bottom: 20px; }
.tipbox h3 { height:2px; margin-bottom: 60px; background:#e9e9e9; line-height: 0; text-align: center; }
.tipbox h3 span { display:inline-block; height: 50px; padding:0 25px; margin:-24px auto 0;
	background:#b66cdf; border-radius:5px;
	color:#fff; font-size: 26px; line-height: 50px; }
.tipbox dt { color: #f660c0; font-size: 20px; line-height: 40px; }
.tipbox dt span { display: block; float: left; width: 40px; height: 40px; margin-right: 5px;
	background:#fde5f3; border-radius: 50%;
	ine-height: 40px; text-align: center; }
.tipbox dd { padding-left:45px; padding-bottom:30px; font-size: 16px; line-height: 28px;}

.popShadow { display:none; position: fixed; left: 0; top: 0; z-index:10; width:100%; height:100%;
	background:#000; opacity: 0.5; filter:alpha(opacity=50); }
.tipPop { display:none; position:fixed; left:50%; top:50%; z-index:11;
	width:410px; height:288px; margin-top:-144px; margin-left:-205px;
	background:#fff url("https://www.walldrift.com/__xh__/nmg.huatu.com/zt/2020skcjcx/images/pic_11.png") no-repeat center 100px; border-radius:10px;
	box-shadow:0 0 25px rgba(0, 0, 0, 0.1); }
.tipPop h3 { padding:45px 0 125px; font-size: 26px; line-height: 30px; text-align: center; }
.tipPop a { display:block; width:110px; height:40px; margin:0 auto; cursor: pointer;
	background:#fff; border:1px solid #f660c0; border-radius: 50px;
	color:#f660c0; font-size:16px; line-height: 40px; text-align: center;
	background: linear-gradient(135deg , #fff, #fff, #b66cdf,#ed5f9b );
	background-size:300% 110%; background-position:0 center; background-repeat: repeat-x;
	transition:background-position 0.5s; }
.tipPop a:hover { background-position:100% center; color: #fff; }


/* foot */
.footer {clear:both;text-align: center;padding:30px 0;position: relative;background: #252525;}
.footer p {line-height: 26px; color:#f5f4f4; font-size:14px;position: relative;z-index: 2;}
.footer p a {color: #f5f4f4; font-size:14px;}
.footer p span { padding-bottom: 0px; padding-left: 5px; padding-right: 5px; padding-top: 0px}
.foot{ display:none;}

@media only all and (max-width:1200px){
	.onlypc,.ht_top .topnav{ display:none;}
	.ht_top .onlymob,.ht_top .mob { display:block;}
	html{ font-size:20px; }
	body { font: 0.7rem/1.2rem "Hiragino Sans GB","\5FAE\8F6F\96C5\9ED1","\9ED1\4F53",Arial,sans-serif;
		background-size:auto 16rem; background-position:center 2.4rem ; }
	html,body{  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
	.Width { width:100%;}
	.ht_top .topnav a:nth-child(n+2) ,
	.banner p,
	.stepbox .line,
	.stepbox .con i:before,
	.stepbox .con i:after,
	.tipbox,
	.selectbox .selectdiv,
	.selectbox .loginpic img,
	.footer p { display:none; }

	.ht_top { line-height: 2.5rem; height:2.5rem; background-size:auto 100%; }
	.ht_top .zt_top { width:96%; height:2.5rem; }
	.ht_top h1 a { height:2.5rem; width:7.5rem; background: url(http://www.huatu.com/images/2015css/images/mob_logo.png) no-repeat center; background-size:100%; }
	.ht_top .topnav { font-size:0.8rem; text-indent:-1000rem;}
	.ht_top .topnav a { padding:0 0 0 0.3rem; text-indent: 0; float: right; }

	/* banner */
	.banner { height:10rem; background-size:auto 15rem; }
	.banner .pic01 { width: 4rem; height: 3rem; margin-left:1.5rem; top:7rem;
		background-size: contain; }
	.banner .pic02 { width: 12rem; height: 6rem; margin-left: -13rem; top: 5rem;
		background-size: contain; }
	.banner .pic03 { width: 9rem; height: 10rem; margin-left: -13rem; top: 0;
		background-size: contain; }
	.banner .pic04 { width: 6rem; height: 4rem; margin-left: -10rem; top: 2.5rem;
		background-size: contain; }
	.banner .pic05 { width:8rem; height:5rem; margin-left: 1rem; top: 0.5rem;
		background-size: contain; }
	.banner .pic06 { width: 16rem; height: 13rem; margin-left: 2rem; top: -4rem;
		background-size: contain; }
	.banner h1 { left:0; top:2rem; width:100%; margin-left:0;
		font-size:1.8rem; line-height:2.4rem;
		text-shadow:0 0 10px rgba(41,41,41,.2); }
	.banner h1 span { font-size:1.8rem; }
	.banner .pic07 { height:2rem; background-size: cover; }
	.banner p a{color: red;}

	.stepbox { width:100%; padding:0; margin:1.5rem auto 0;
		background:none; border-radius:0; box-shadow:none; }
	.stepbox:before { right:0.2rem; top:-1.5rem; width:3rem; height:3rem; background-size: contain; }
	.stepbox .pic { left:-0.2rem; bottom:-1rem; width:3rem; height:3rem; background-size: contain; }
	.stepbox .con { float:none; width:16rem; height:4rem; margin:0 auto 1rem;
		border-radius: 0.2rem; box-shadow: 0 0 20px rgba(0,0,0,.1); }
	.stepbox .con i { float:left; width:5rem; height:4rem; }
	.stepbox .con .icon01,
	.stepbox .con .icon02,
	.stepbox .con .icon03,
	.stepbox .able .icon01,
	.stepbox .able .icon02,
	.stepbox .able .icon03,
	.stepbox .able:hover .icon01 ,
	.stepbox .able:hover .icon02 ,
	.stepbox .able:hover .icon03 { background-position: center; background-size:auto 3rem; }
	.stepbox .con h3 { float:left; width:10rem; font-size: 1.2rem; line-height:2.4rem; }
	.stepbox .con p { float:left; width:10rem; font-size:0.65rem; line-height:1rem; }
	.stepbox .con p br { display:none; }
	.banner p{ display: block;
    left: 10%;
    top: auto;
    bottom: -3.4rem;
    width: 80%;
    padding: .4rem;
    margin: 0 auto;
    background: rgba(0,0,0,.15);
    border-radius: 10px;
    color: #333;
    font-size: .46rem;
    line-height: 1.5;
    text-align: justify;
    background: #ffffff;
    z-index: 1000;}

	.giftbox { width:16rem; margin:1rem auto; }
	.giftdiv { float:none; width:16rem; height:9rem; margin:1.5rem auto 0; }
	.giftdiv:before { top:-0.5rem; right:-0.5rem; box-sizing: border-box;
		width:16rem; height:9rem; }
	.giftdiv a { width:16rem; height:6.5rem; padding-top:2.5rem;
		font-size:1.4rem; line-height:2rem; }
	.leftgift a { width:16rem; padding-left:0; background-size:100%; text-align: center; }
	.leftgift2 a,
	.righgift a { width:16rem; background-size:100%; }

	.orderbox { width:16rem; background: #fff; padding:0; margin:1.5rem auto; }
	.orderbox:before { right:-1.175rem;}
	.orderbox .pic { left:-1.575rem; }
	.orderdiv { float: none; width:14rem; padding:1rem; margin:3.8rem auto 0;
		background:#fff; border-radius: 0.2rem; box-shadow: 0 0 20px rgba(0,0,0,.1);}
	.orderdiv .text { margin-bottom:.4rem; }
	.orderdiv lable { width:3rem; font-size: 0.7rem; line-height:1.6rem; }
	.orderdiv .input { width:10.5rem; height:1.6rem;
		font-size:0.65rem; text-indent:0.5rem; }
	.orderdiv .yzinput { width:6rem; }
	.orderdiv .yzbtn { width:4rem; height:1.6rem; margin-left:0.5rem;
		border-radius:1.6rem;
		font-size:0.65rem; line-height:1.6rem;  }
	.orderdiv .postbtn { width:5rem; height:1.8rem; margin:1rem auto 0.5rem;
		border-radius:1.8rem;
		font-size:0.7rem; line-height: 1.8rem; }
	.orderdiv p { font-size:0.6rem; }

	.selectbox { width:16rem; padding:0; margin:1.5rem auto; }
	.selectbox .loginpic { width:100%; margin-top:2.5rem;}
	.selectbox .loginpic a { display:block; position: relative; width:100%; height: 2rem;
		background:#f660c0; border-radius:2rem;
		color:#fff; font-size:0.8rem; line-height:2rem; text-align: center;
		background: linear-gradient(135deg , #ed5f9b, #ed5f9b, #b66cdf,#ed5f9b );
		background-size:300% 110%; background-position:0 center; background-repeat: repeat-x;
		transition:background-position 0.5s; }
	.selectbox .loginpic span { display:block; font-size:0.8rem; line-height:2rem; }

	.selectbox .loginpic a:hover { background-position:100% center; color: #fff; }

	.tipPop { width:14rem; height:10rem; margin-top:-5rem; margin-left:-7rem;
		background-size: 2rem; background-position:center 3.5rem; }
	.tipPop h3 { padding:1.5rem 0 4.2rem; font-size:1rem; line-height:1.5rem; }
	.tipPop a { width:4rem; height:1.6rem; border-radius:21.6rem;
		font-size:0.7rem; line-height:1.6rem; }
	.pc-foot{display: none;}
	#adress1{ display:none;}
	.foot{font-size:.45rem;line-height:.45rem;padding:.6rem 0 1.85rem;background: #fff;}

	/* foot */
	.footer { height:2.1rem; padding:0; overflow:hidden; position:relative; }
	.footer:before { color:#f5f4f4; position:absolute; left:0; top:0; display:block; content:"华图教育集团版权所有";
		width: 100%; height:2.1rem; background: ##252525; overflow:hidden;
		line-height:2.1rem; font-size:0.7rem; text-align: center; }

}