@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;}
select{
  appearance:none;
  -moz-appearance:none;
  -webkit-appearance:none;
}

body,html{
  font-size:20px;
}
.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:1220px; margin:0 auto;}
.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);

  }
}
body{

}


/*右侧选悬浮样式结束*/
.banner {
  height:1126px;
  color:#fff;
  background: url(../images/ban.jpg) top center no-repeat;
  box-sizing: border-box;
  overflow: hidden;
}
.banner p {
  width:970px;
  font-size: 20px;
  line-height: 28px;
  color:#fff;
  float: right;
  margin-right: 60px;
  margin-top: 40px;
}
.banner .dy{ width: 1220px; height: 166px; margin-top: 950px; background: url(../images/dy_bg.png) top center no-repeat;}
.banner .dy span{ font-size: 34px; line-height: 28px; color:#fff; float: left; margin: 50px 0 0 65px;}

.bt{ width: 476px; margin: 70px auto 0;}
.bt div{ font-size: 32px; line-height: 60px; color:#fff; text-align: center; width: 476px; height: 66px; background: url(../images/bt_bg.png) no-repeat; font-weight: bold;}
.bt p{ font-size: 20px; line-height: 20px; color:#fff; text-align: center; margin-top: 10px;}

.mian01{  width: 1220px; height: 817px; margin: 15px auto 0; background: url(../images/mian01_bg.png) no-repeat; overflow: hidden;}
.m1_l{ float: left; width: 440px; height: 530px; border: 4px solid #fff; background: #a4060a; border-radius: 50px; margin: 35px 0 0 110px;
    -ms-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -moz-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -webkit-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -o-box-shadow: 2px 2px 30px rgba(51, 51, 51, 0.52);}
.m1_l p,.m1_r p{ font-size: 26px; line-height: 52px; color:#fff; text-align: center; margin: 25px auto 0; padding: 0 30px; width: 180px; height: 52px; background: #d02522; border: 4px solid #fbe5b5; border-radius: 56px;}
.m1_l img,.m1_r img{ width: 260px; height: 402px; margin: 20px auto 0; display: block;}
.m1_r{ float: right; width: 440px; height: 530px; border: 4px solid #fff; background: #a4060a; border-radius: 50px; margin: 35px 110px 0 0;
    -ms-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -moz-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -webkit-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -o-box-shadow: 2px 2px 30px rgba(51, 51, 51, 0.52);}

.mian02{ width: 1220px; height: 710px; margin: 20px auto 0; background: url(../images/mian01_bg.png) no-repeat; overflow: hidden; background-size:100% 100%;}
.m2_l{ float: left; width: 750px; height: 450px; border: 4px solid #fff; background: #a4060a; border-radius: 50px; margin: 35px 0 0 70px;
	-ms-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -moz-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -webkit-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -o-box-shadow: 2px 2px 30px rgba(51, 51, 51, 0.52);}
.m2_l p,.m2_r p{ font-size: 28px; line-height: 50px; color:#fff; text-align: center; margin: 22px 0 0 0;}
.m2_l li{ float: left; margin: 22px 7px 0 13px;}
.m2_l li a{ font-size: 24px; line-height: 50px; color:#fbe5b5; text-align: center; width: 100px; height: 50px; border: 2px solid #fbe5b5; border-radius: 56px; background-image: -webkit-linear-gradient( -2deg, rgb(243,51,0) 0%, rgb(204,35,38) 100%);
    background-image: -ms-linear-gradient( -2deg, rgb(243,51,0) 0%, rgb(204,35,38) 100%); display: inline-block;}
.m2_l li a:hover{ color:#fff; border: 2px solid #fff;}
.m2_r{ float: right; width: 280px; height: 450px; border: 4px solid #fff; background: #a4060a url(../images/smcp_bg.png) bottom center no-repeat; border-radius: 50px; margin: 35px 70px 0 0;
	-ms-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -moz-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -webkit-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -o-box-shadow: 2px 2px 30px rgba(51, 51, 51, 0.52);}
.m2_r img{ width: 182px; height: 182px; margin: 18px auto 0; display: block;}
.m2_r span{ font-size: 20px; line-height: 30px; color:#fff; text-align: center; margin: 10px 0 0 0; display: block;}

.mian03{ width: 1220px; height: 700px; margin: 20px auto 0; background: url(../images/mian03_bg.png) no-repeat; overflow: hidden;background-size: 100% 100%;}
.m3_t ul{ width: 1120px; margin: 0 auto;}
.m3_t li{ float: left; width: 234px; height: 430px; border: 4px solid #fff; background: #a4060a; border-radius: 50px; margin: 35px 0 0 30px;
	-ms-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -moz-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -webkit-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -o-box-shadow: 2px 2px 30px rgba(51, 51, 51, 0.52);}
.m3_t li p{ font-size: 26px; line-height: 50px; color:#fff; text-align: center; width: 190px; height: 50px; margin: 25px auto 0; border-radius: 50px; background-image: -webkit-linear-gradient( -2deg, rgb(243,51,0) 0%, rgb(204,35,38) 100%);
    background-image: -ms-linear-gradient( -2deg, rgb(243,51,0) 0%, rgb(204,35,38) 100%);}
.m3_t li img{ width: 150px; height: 150px; display: block; margin: 15px auto;}
.m3_t li span{
  width: 100%; font-size: 20px;
 padding:0 6%;
 line-height: 30px; color:#fff; display:
  block; margin: 20px auto 0;
   box-shadow: 0px -12px 21px 0px rgba(0, 0, 0, 0.12);
   box-sizing: border-box;
   padding-top:10px;
}
.m3_t li b{ font-weight:normal;font-size: 22px; line-height: 34px; display: block;}
.m3_b{ width: 1100px; margin: 35px auto 0; border: 4px solid #fff; background: #a4060a url(../images/m3book_bg.png) top center no-repeat; border-radius: 50px; padding: 18px 0;
	-ms-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -moz-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -webkit-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -o-box-shadow: 2px 2px 30px rgba(51, 51, 51, 0.52);}
.m3_b p{ float: left; width: 746px; margin: 30px 0 0 80px; font-size: 24px; line-height: 36px; color:#f9fbb5;}
.m3_b p span{ display: block; font-size: 20px; line-height: 36px; color:#fff;}
.m3_b img{ float: right; margin-right: 80px; width: 166px; height: 194px;}


.mian04{ width: 1220px; height: 462px; margin: 20px auto 0; background: url(../images/mian04_bg.png) no-repeat; overflow: hidden;}
.mian04 ul{ width: 1120px; margin: 0 auto;}
.mian04 li{ float: left; border: 4px solid #fff; background: #a4060a; border-radius: 50px; margin: 40px 0 0 30px; padding: 16px 18px;}
.mian04 li img{ width: 288px; height: 166px; border-radius: 10px; display: block;}

.mian05{ height:650px; color:#fff; background: url(../images/m5_boxbg.jpg) bottom center no-repeat; box-sizing: border-box; overflow: hidden;}
.mian05_box{ width: 1220px; height: 629px; margin: 20px auto 0; background: url(../images/mian05_bg.png) no-repeat; overflow: hidden;}
.mian05_box ul{ width: 1120px; margin: 0 auto;}
.mian05_box li{ float: left; margin: 30px 7px 0 13px;}
.mian05_box li a{ font-size: 24px; line-height: 50px; color:#fbe5b5; text-align: center; width: 115px; height: 50px; border: 2px solid #fbe5b5; border-radius: 56px; background-image: -webkit-linear-gradient( -2deg, rgb(243,51,0) 0%, rgb(204,35,38) 100%);
    background-image: -ms-linear-gradient( -2deg, rgb(243,51,0) 0%, rgb(204,35,38) 100%); display: inline-block;}
.mian05_box li a:hover{ color:#fff; border: 2px solid #fff;}

/* 通用底部 */
/* 通用底部 */
.footer {
  position: relative;
  padding: 50px 0;
  background: #fff;
  text-align: center;
}
.footer p {
  position: relative;
  z-index: 2;
  color: rgb(72, 71, 71);
  font-size: 18px;
   line-height: 1.778;
}


.footer p a {
 color: rgb(72, 71, 71);
  font-size: 18px;
}
.footer p span { padding: 0 5px; }

.m-footer{
  display: none;
}

@media screen and (max-width:1080px){
  .onlymob { 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: 100%; margin: 0 auto; overflow-x: hidden;
   }
  html,body{  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);font-size: 14px; }
  .Width {  width: 18rem;  }

  /* 隐藏元素 */
  .ht_top .topnav a:nth-child(n+2) ,
  .footer p,
  .pc,
  .onlypc,
  .ht_top .topnav
  ,.right-fix
  ,.bottom-fixed img,
  .panel01 .center-cont img:nth-child(1),
  .panel01 .center-cont img:nth-child(3)

  {  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; }

  .banner {
    height: 18.2rem;
    background-size: 140% 90%;
  }
 .banner p {
    width: 14.5rem;
    font-size: 0.6rem;
    line-height: 0.7rem;
    margin-right: 0.7rem;
    margin-top: 0.5rem;
}
.banner .dy{ width: 18rem;
    height: 4.5rem;
    margin-top: 13.5rem;
    background: #930709;
    border-radius: 2.5rem;
    border:2px solid #fff;
    box-shadow: 0 0 10px #ddd;
  /*  background:url(../images/mdy_bg.png) center no-repeat;
    background-size: 100% 100%;*/
  }
.banner .dy span{ font-size: 0.75rem; line-height: 1rem; margin: 1.6rem 0 0 0.7rem;}


.mian01{  width: 18rem; height: 12.1rem; margin: 0.3rem auto 0; background-size: contain;}
.bt{ width: 14rem; margin: 1.2rem auto 0;}
.bt div{ font-size: 0.75rem; line-height: 1.3rem; width: 10.3rem; height: 1.5rem; background-size: contain; margin: 0 auto;}
.bt p{ font-size: 0.6rem; line-height: 0.6rem; margin-top: 0.4rem;}
.m1_l{ width: 5.4rem; height: 6.6rem; border: 0.15rem solid #fff; border-radius: 1rem; margin: 0.7rem 0 0 2.3rem;}
.m1_l p,.m1_r p{ font-size: 0.6rem; line-height: 1rem; margin: 0.25rem auto 0; padding: 0 0.3rem; width: 4rem; height: 1rem; border: 0.1rem solid #fbe5b5; border-radius: 1rem;}
.m1_l img,.m1_r img{ width: 4rem; height: 4.4rem; margin: 0.3rem auto 0;}
.m1_r{ width: 5.4rem; height: 6.6rem; border: 0.15rem solid #fff; border-radius: 1rem; margin: 0.7rem 2.3rem 0 0;}

.mian02{
  width: 18rem; height: 25rem; margin: 0.3rem auto 0;
  background:url(../images/mbg.png) top center no-repeat;
  background-size: 100% 101%;
}
.m2_l{
  float: none; width: 16rem;
   height: 8.5rem; border:none;
   border-radius: 1rem; margin: 0.5rem auto;
   background: none;
   box-shadow: none;
 }
.m2_l p,.m2_r p{ font-size: 0.66rem; line-height: 1rem; margin: 0.4rem 0 0 0;}
.m2_l li{ float: left; margin: 0.4rem 0.11rem 0 0.25rem;}
.m2_l li a{ font-size:0.6rem; line-height: 1rem; width: 2.2rem; height: 1rem; border: 0.04rem solid #fbe5b5; border-radius: 1rem;}
.m2_l li a:hover{ color:#fff; border: 0.04rem solid #fff;}
.m2_r{ float: none; width: 15rem; height: 9.8rem; border: 0.15rem solid #fff; border-radius: 1rem; margin: 0.5rem auto;background-size:100%;}
.m2_r img{ width: 5rem; height: 5rem; margin: 0.4rem auto 0; display: block;border-radius: 50%;}
.m2_r span{ font-size: 0.6rem; line-height: 1rem; color:#fff; text-align: center; margin: 0rem 0 0 0; display: block;}

.mian03{
  width: 18rem;
  height: 24.5rem;
  margin: 0.3rem auto 0;
  background:url(../images/mbg.png) top center no-repeat;
  background-size: 100% 101%;
}
.m3_t ul{ width: 16rem;}
.m3_t li{ float: left; width: 7.15rem; height: 9rem; border: 0.15rem solid #fff; border-radius: 1rem; margin: 0.3rem 0.2rem 0 0.3rem;}
.m3_t li p{ font-size: 0.7rem; line-height: 1.25rem; width: 5rem; height: 1.25rem; margin: 0.5rem auto 0; border-radius: 1.5rem;}
.m3_t li img{ width: 2.5rem; height: 2.5rem; display: block; margin: 0.3rem auto;}
.m3_t li span{ width: auto; font-size: 0.6rem; line-height: .9rem; margin: 0 auto;padding:0 2%;box-sizing: border-box;}
.m3_t li b{ font-size: 0.66rem; line-height: 1.1rem;}
.m3_b{ width: 15rem; margin: 0.3rem auto 0;
  background: #a4060a url(../images/m3book_bg.png) left top no-repeat; border-radius: 1rem; padding: 0rem 0 .3rem; background-size: 180%; border: 0.15rem solid #fff;
	-ms-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -moz-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -webkit-box-shadow: 2px 2px 10px rgba(51, 51, 51, 0.52);
    -o-box-shadow: 2px 2px 30px rgba(51, 51, 51, 0.52);}
.m3_b p{ float: none; width: auto ; margin: 0.6rem auto 0; padding:0 3%; font-size: 0.65rem; line-height: 1rem;}
.m3_b p span{ font-size: 0.6rem; line-height: 1rem;}
.m3_b img{ float: none; margin: 0.5rem auto 0; width: 4rem; height: 5rem; display: block;}

.mian04{ width: 18rem; height: 7.4rem; margin: 0.5rem auto 0; background-size: 100% 101%;}
.mian04 ul{ width: 16rem; margin: 0 auto;}
.mian04 li{ float: left; border: 0.15rem solid #fff; background: #a4060a; border-radius: 0.5rem; margin: 0.3rem 0 0 0.3rem; padding: 0.2rem 0.2rem;}
.mian04 li img{ width: 4.2rem; height:2.5rem; border-radius: 0.25rem;}

.mian05{ height:13.6rem; color:#fff; background: url(../images/m5_boxbg.jpg) bottom center no-repeat; box-sizing: border-box; overflow: hidden; background-size: contain;}
.mian05_box{ width: 18rem; height: 12rem; margin: 0.2rem auto 0; background-size: 100% 101%;}
.mian05_box ul{ width: 16rem; margin: 0 auto;}
.mian05_box li{ float: left; margin: 0.2rem 0.11rem 0 0.25rem;}
.mian05_box li a{ font-size: 0.6rem; line-height: 1rem; width: 2.2rem; height: 1rem; border: 0.04rem solid #fbe5b5; border-radius: 1rem;}
.mian05_box li a:hover{ color:#fff; border: 0.04rem solid #fff;}


  /* 通用底部 */
  .footer { display: none;}

  .m-footer {  display: block; color: #fff; text-align: center; height: 2.5rem; width: 100%; font-size:.7rem; line-height: 2.5rem; background-color: #333;}
}