@charset "utf-8";
/* CSS Document */
body { font-family:"Hiragino Sans GB","MicroSoft YaHei",Arial,sans-serif; overflow-x: hidden;color:#333;}
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:#0d0d0d; text-decoration:none;}
a,area { blur:expression(this.onFocus=this.blur()) }
ul, li{ list-style:none;}
table { border-collapse:collapse;border-spacing:0; max-width:100%;}
input { outline:0;}
input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none;}
:focus { outline: none; }
input::focus-inner { padding:0;border:0;}

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


/* 通用头部 */
.ht_top {width: 100%;background: #fafafa url(https://www.huatu.com/z/topfooter/images/nav_bg.gif) repeat-x 0 0;line-height: 41px;overflow: hidden;}
.ht_top .zt_top { width: 1070px;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:#0d0d0d; font-size:12px;}
.ht_top .topnav a {padding:0 8px;}
.ht_top .topnav a:hover { color:#e4393c; text-decoration:underline;}
@keyframes movef{
  0%{
    transform: translateX(-10px);
  }
  100%{
    transform: translateX(10px);

  }
}
@keyframes moves{
  0%{
    transform: translateX(10px);
  }
  100%{
    transform: translateX(-10px);

  }
}
.ht_fix{
  position: fixed;
  right:0;
  width:50px;
  height:150px;
  top:50%;
  margin-top:-75px;
  background:linear-gradient(135deg,rgba(207,74,52,1),rgba(213,96,32,1));
  border-radius:10px 0 0px 10px;
  text-align: center;
  padding-top:10px;
  box-sizing: border-box;
  z-index: 9;
}
.ht_fix a{
  display: block;
  color:#fff;
  font-size:20px;
}
.ht_fix a i{
  display: block;
  width:21px;
  height:21px;
  background: url(../images/tel.png) no-repeat;
  background-size:100% 100%;
  margin:0 auto 5px;
}
/*右侧选悬浮样式结束*/
.banner {
  position: relative;
  height:494px;
  background:url(../images/ban.png) top center no-repeat;
  padding-top:100px;
  box-sizing: border-box;

}
.banner .bt{
  margin-left:105px;
  margin-top:-35px;
}
.banner .ms{
  position: absolute;
  top:55px;
  right:100px;
}
.banner p{
  font-size:32px;
  font-weight:400;
  color:rgba(13,11,21,1);
  padding-left: 476px;

}

.banner p span:after,
.banner p span:before{
  display: inline-block;
  width:6px;
  height: 6px;
  border-radius: 50%;
  background: #0D0B16;
  content: "";
  vertical-align: middle;
}

.box_title {
  font-size: 46px;
  margin-bottom: 60px;
  text-align: center;
}
.box_title span:after,
.box_title span:before{
    display: inline-block;
    width:99px;
    height:22px;
    vertical-align: middle;
    content: "";
}
.box_title span:after{
    background: url(../images/after.png) no-repeat;
    background-size:100% 100%;
    animation: movet linear .8s infinite alternate;
    margin-left:10px;
}
.box_title span:before{
    background: url(../images/before.png) no-repeat;
    background-size:100% 100%;
    margin-right:25px;
    animation: movett linear .8s infinite alternate;
    margin-right:10px;
}

.box_title span{
  font-size:40px;
  font-weight:400;
  color:rgba(191,150,71,1);
  background:radial-gradient(rgba(254,245,229,1) 0%, rgba(222,185,121,1) 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  font-weight: bold;
}
.panel{
  padding-top:80px;
}
.panel01{
  background: url(../images/bg1.png) top center no-repeat;
  background-size: cover;
  overflow:hidden;
}
.panel01 .box_title{
  margin-bottom: 35px;
}
.panel01 .txt-box{
  width:1189px;
  height:440px;
  background: url(../images/bg2.png) top center no-repeat;
  background-size:100% 100%;
  margin:0 auto 64px;
  padding-top:60px;
  box-sizing: border-box;
  padding-left:80px;
  padding-right:80px;
}
.panel01 .txt-box{
  font-size:18px;
  font-weight:400;
  color:rgba(51,51,51,1);
  line-height:53px;
}
.panel02{
  background: url(../images/bg3.png) top center no-repeat;
  padding-bottom: 80px;
  background-size: cover;
  position: relative;
}
.panel02 .sj{
  position: absolute;
  right:18%;
  top:-25px;
}

.panel03 .Width{
  height:525px;
  background: url(../images/ly.png) center no-repeat;
}
.panel03 .sm-title{
  float:left;
  width:24px;
  font-size:24px;
  font-weight:400;
  color:rgba(255,255,255,1);
  line-height:30px;
  margin:0 20px;

}
.panel03 .sm-title:after{
  content: "";
  width:1px;
  height:50px;
  background: #fff;
  position: absolute;
  left:55px;
  top:50px;
  margin-top:-27px;

}
.list-div{
  padding:15px 0 10px;
  box-sizing: border-box;
   border-radius:15px;
   height:90px;
   position: absolute;
}
.list-div1{
  width:218px;
  top:77px;
  left:265px;
  background:linear-gradient(135deg,rgba(207,74,52,1),rgba(150,35,35,1));

}
.list-div p{
  font-size:16px;
  font-weight:400;
  color:rgba(255,255,255,1);
  line-height:30px;
  float:left;
  margin-left:5px;
}
.list-div2{
  width:318px;
  left:713px;
  top:77px;
  background:linear-gradient(135deg,rgba(207,74,52,1),rgba(213,96,32,1));
}
.list-div3{
  width:435px;
  top:218px;
  background:linear-gradient(135deg,rgba(207,74,52,1),rgba(213,96,32,1));
}
.list-div4{
  width:435px;
  right:0;
  top:218px;
  background:linear-gradient(135deg,rgba(207,74,52,1),rgba(150,35,35,1));
}
.list-div5{
  width:404px;
  left:82px;
  top:358px;
  background:linear-gradient(135deg,rgba(207,74,52,1),rgba(150,35,35,1));
}
.list-div6{
  width:363px;
  right:125px;
   top:358px;
  background:linear-gradient(135deg,rgba(207,74,52,1),rgba(213,96,32,1));
  
}
.panel04{
  position: relative;
  height:430px;
  background:rgba(247,247,247,1);
}
.panel04 .box_title span,
.panel03 .box_title span{
  color:rgba(191,150,71,1);
  background:linear-gradient(0deg,rgba(24,24,25,1) 0.146484375%, rgba(105,27,12,1) 49.5849609375%, rgba(23,22,24,1) 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}
.panel04 .box_title span:before,
.panel03 .box_title span:before{
  background: url(../images/before2.png) no-repeat;
  background-size:100% 100%;
}
.panel04 .box_title span:after,
.panel03 .box_title span:after{
  background: url(../images/after2.png) no-repeat;
  background-size:100% 100%;
}
.panel04 .number{
  font-size:26px;
  font-weight:400;
  color:rgba(255,255,255,1);
  width:50px;
  height:50px;
  background:linear-gradient(135deg,rgba(207,74,52,1),rgba(150,35,35,1));
  border-radius:50%;
  display: block;
  text-align: center;
  line-height: 50px;

}
.panel04 .list-cont02 .number{
  background:linear-gradient(135deg,rgba(207,74,52,1),rgba(213,96,32,1));
}
.panel04 .number-box{
  width:50px;
  height: 50px;
  border:2px solid #fff;
  border-radius:50%;
  margin:0 auto;
   position: relative;
  top:25px;
}
.panel04 p{
  width:350px;
  height:78px;
  background:linear-gradient(135deg,rgba(207,74,52,1),rgba(150,35,35,1));
  border-radius:15px;
  text-align: center;
  color:#fff;
  font-size: 20px;
  line-height: 95px;

}
.panel04 p span{
  font-size:22px;
}
.panel04 .list-cont01{
  width:350px;
}
.panel04 .list-cont02{
  margin:0 45px;
}
.panel04 .list-cont02 p{
  width:410px;
  background:linear-gradient(135deg,rgba(207,74,52,1),rgba(213,96,32,1));
}
.more{
  text-align: center;
  font-size:20px;
  font-weight:400;
  color:rgba(255,255,255,1);
  background:linear-gradient(135deg,rgba(207,74,52,1) 0.146484375%, rgba(150,35,35,1) 99.5849609375%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  font-weight:bold;
  display: block;
  margin-top:50px;
}
.more img{
  vertical-align: middle;
  position: relative;
  top:-2px;
  margin-left:6px;
}
.sj2,.sj3{
  position: absolute;
  left:18%;
  top:-30px;
}
.line{
  position: absolute;
  left:9%;
  bottom:0;
}
.panel05{
  padding-bottom:70px;
  background: url(../images/bg4.png) top center no-repeat;
  background-size:cover;
}
.panel05 .cont{
  width:945px;
  height:432px;
  margin:0 auto;
  position: relative;
  background: url(../images/yy.png) center no-repeat;
}
.panel05 .cont li{
  position: absolute;
  font-size:22px;
  font-weight:400;
  color:rgba(247,247,247,1);
}
.panel05 .cont li i{
  width:141px;
  height:2px;
  border-bottom:1px dashed #fff;
  display: inline-block;
  margin-left:16px;
  vertical-align: middle;
}
.panel05 .cont li:nth-child(1){
  left:40px;
  top:132px;
}
.panel05 .cont li:nth-child(2){
  left:20px;
  top:271px;
}
.panel05 .cont li:nth-child(3){
  left: 100px;
  top: 346px;
}
.panel05 .cont li:nth-child(4){
  right: 112px;
  top: 70px;
}
.panel05 .cont li:nth-child(5){
  right: -42px;
  top: 188px;
}
.panel05 .cont li:nth-child(6){
  right: 70px;
  top: 304px;
}

.panel06{
  padding-bottom: 78px;
  background: #373737;
  position: relative;
}
.panel06 a{
  float:left;
  width:380px;
  height:280px;
  background:rgba(178,63,45,1);
  border:5px solid rgba(232, 204, 155, 1);
  border-radius:15px;
}
.panel06 a img{
  border-radius: 15px;
  width:100%;
  height: 100%;
}
.panel06 a:nth-child(3n-1){
  margin:0 15px;
}
/* 通用底部 */
/* 通用底部 */
.footer {
 
  position: relative; 
  padding: 30px 0;
  background: #000;
  text-align: center; 
}
.footer p {
  position: relative; 
  z-index: 2;
  color: #fff; 
  font-size: 14px;
  line-height: 26px; 
}
.footer p a {
  color: #fff;
  font-size: 14px;
}
.footer p span { padding: 0 5px; }

.panel01 .txt-box img,.mob{
  display: none;
}

@media screen and (max-width:1080px){
  .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; width: 18.75rem; margin: 0 auto; overflow-x: hidden;
    background-size: 200% 24rem; }
  html,body{  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .Width {  width: 96%;  }
 
  /* 隐藏元素 */
  .ht_top .topnav a:nth-child(n+2) ,
  .footer p,
  .pc,
  .pc,
  .ht_top .topnav
  ,.right-fix
  {  display: none;  }
  .mob{
    display: block;
  }
  

  /* 通用头部 */
  .ht_top { line-height: 2.5rem; height:2.5rem; background-size:auto 100%; }
  .ht_top .zt_top { width:17.5rem; 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; 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; }
  .ht_fix{
  
  width:1.5rem;
  height:5rem;
  margin-top:-2.5rem;
  border-radius:5px 0 0px 5px;
  padding-top:.5rem;
}
.ht_fix a{
  font-size:.65rem;
  line-height: 1.2;
}
.ht_fix a i{
  display: block;
  width:.75rem;
  height:.75rem;
  margin:0 auto .25rem;
}
  .banner { 
    height:10rem; 
    background-size:cover;
    padding-top:2rem;
  }
  .banner p{
    font-size:.8rem;
    padding-left:24%;
  }
  .banner .bt{
    width:75%;
    margin-left:1rem;
    margin-top:0;
  }
  .banner .ms{
    height:3.75rem;
    position: absolute;
    top: 1.5rem;
    right: 1.25rem;
  }
  .panel{
    padding-top:1rem;
  }
  .box_title{
    margin-bottom: 1.5rem;
  }
  .box_title span{
    font-size:1rem;
  }
  .box_title span:after, .box_title span:before{
    width: 1.75rem;
    height:.5rem;
  }
  .sj2, .sj3,.panel02 .sj{
    width:2rem;
    top:-1rem;
  }
  .panel01 .txt-box{
    width:96%;
    height: 14.5rem;
    padding:1rem 1.5rem 0;
    border-radius: 5px;
    position: relative;
    background-image: -moz-radial-gradient( 50% 50%, circle closest-side, rgb(255,255,255) 0%, rgb(232, 232, 232) 100%);
    background-image: -webkit-radial-gradient( 50% 50%, circle closest-side, rgb(255,255,255) 0%, rgb(232, 232, 232) 100%);
    background-image: -ms-radial-gradient( 50% 50%, circle closest-side, rgb(255,255,255) 0%, rgb(232, 232, 232) 100%);
  }

  .panel01 .txt-box .mms{
    display: block;
    position: absolute;
    left:-.45rem;
    top:-.55rem;
    width:4.5rem;
  }
  .panel01 .txt-box .mms2{
    display: block;
    position: absolute;
    right:-.61rem;
    bottom:-.55rem;
    width:3rem;
  }
  .panel01 .txt-box{
    font-size:.6rem;
    line-height: .9rem;
  }
  .panel03 .Width{
    padding-top:1rem;
    height:19.5rem;
    background: none;
  }
  .list-div {
    padding: .5rem 0;
    box-sizing: border-box;
    border-radius: 5px;
    height:2.5rem;
    position: absolute;
  }
  .list-div p{
    font-size:.6rem;
    line-height: 1.3;
  }
  .list-div1{
    left:-1%;
    top:1.5rem;
    width:7rem;
    margin-top:2.5rem;
  }
  .list-div2{
    left:40%;
    top:1.5rem;
    width:11rem;
    margin-top:2.5rem;
  }

  .list-div3,
  .list-div4 {
    width:16rem;
    top:7rem;
    left:4%;
  }
  .list-div4{
    left:8%;
  }
  .list-div4 {
    top:10rem;
  }
  .list-div5,.list-div6{
    width: 16rem;
    left: 4%;
    top:13rem;
  }

  .list-div6{
    top:16rem;
    left:8%;
  }
  .panel03 .sm-title:after{
    height:1.5rem;
    left:1rem;
    top:1.5rem;
  }
  .panel03 .mob{
    display: block;
  }
  .panel03 .sm-title{
    font-size:.7rem;
    width:.7rem;
    line-height: 1.3;
    margin:0 .5rem;
    position: relative;
    top:-.15rem;
  }
  .panel04 .number-box {
    width: 1.5rem;
    height: 1.5rem;
    top: .75rem;
  }
  .panel04 .number {
    font-size:.7rem;
    width:1.5rem;
    height: 1.5rem;
    line-height: 1.5rem;
  }
  .panel04 p {
    width:11rem;
    height:2rem;
    border-radius: 5px;
    font-size: .65rem;
    line-height: 2.4rem;
   
  }
  .panel04 .list-cont01,.panel04 .list-cont02,.panel04 .list-cont03{
    width:11rem;
     margin:0 auto;
     float:none!important;
  }
  .panel04{
    height:auto;
    padding-bottom: 1.5rem;
  }
  .panel04 .box_title{
    margin-bottom: 0rem;
  }
  .line{
    display: none;
  }
  .panel04 .list-cont02,.panel04 .list-cont02 p{
    width:14rem;
  }
  .more{
    font-size:.85rem;
    margin-top:1rem;
  }
  
  .panel04 p span{
    font-size:.7rem;
  }
  .panel05{
    padding-bottom: 1.5rem;
  }
  .panel05 .cont {
    width: 100%;
    height: 10rem;
    background: url(../images/yy.png) center no-repeat;
    background-size:50% 9rem;
  }
  .panel05 .cont li {
    font-size: .65rem;
  }
  .panel05 .cont li i {
    width: 1.5rem;
    height: 1px;
    margin-left:.2rem;
  }
  .panel05 .cont li:nth-child(1) {
    left: 0;
    top: 2.8rem;
  }
  .panel05 .cont li:nth-child(2){
    left:0;
    top:6rem;
  }
  .panel05 .cont li:nth-child(3){
    left: 1.25rem;
    top: 7.5rem;
  }
  .panel05 .cont li:nth-child(4){
   right: 2.25rem;
    top: 1.5rem;
  }
  .panel05 .cont li:nth-child(5){
    right:-.35rem;
    top:4rem;
  }
  .panel05 .cont li:nth-child(6){
    right: 1.25rem;
    top: 6.5rem;
  }
  .panel06{
    padding-bottom: 1.5rem;
  }
  .panel06 a,.panel06 a:nth-child(3n-1){
    width: 31.33%;
    height: 4rem;
    background: rgba(178,63,45,1);
    border: 2px solid rgba(232, 204, 155, 1);
    border-radius: 5px;
    box-sizing: border-box;
    margin:0 1%;
  }
  .panel06 a img{
    border-radius: 5px;
  }
  /* 通用底部 */
  .footer { height:2.1rem; padding:0;  overflow:hidden; position:relative; }
  .footer p { display: none;}
  .footer:before { color:#fff; position:absolute; left:0; top:0; display:block; content:"华图教育集团版权所有";
    width: 100%; height:2.1rem; padding:0; overflow:hidden;
    line-height:2.1rem; font-size:0.7rem; text-align: center; 
  }
}