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

.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: 1100px;
  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(25px);
  }

  100% {
    transform: translateX(-25px);
  }
}

body {}

@keyframes movet {
  0% {
    transform: translateX(-5px);
  }

  100% {
    transform: translateX(5px);
  }
}

@keyframes movett {
  0% {
    transform: translateX(5px);
  }

  100% {
    transform: translateX(-5px);
  }
}

/*右侧选悬浮样式结束*/
.banner {
  position: relative;
  height: 624px;
  color: #fff;
  background: url(../images/ban.jpg) top center no-repeat;
  margin-bottom: 25px;
  text-align: center;
}

.banner p {
  font-size: 40px;
  padding-top: 90px;
  margin-bottom: 35px;
  line-height: 1;
}

.banner .Width>div {
  background-image: -moz-linear-gradient(0deg, rgb(251, 170, 13) 0%, rgb(254, 193, 48) 100%);
  background-image: -webkit-linear-gradient(0deg, rgb(251, 170, 13) 0%, rgb(254, 193, 48) 100%);
  background-image: -ms-linear-gradient(0deg, rgb(251, 170, 13) 0%, rgb(254, 193, 48) 100%);
  text-align: center;
  line-height: 74px;
  width: 376px;
  height: 74px;
  border-radius: 37px;
  font-size: 36px;
  margin: 55px auto 0;
}

.banner img {
  width: 55%;
}

.title {
  font-size: 48px;
  color: rgb(220, 7, 60);
  text-align: center;
  font-weight: 400;
  color: rgba(12, 12, 12, 1);
}

.title span:after, .title span:before {
  display: inline-block;
  width: 89px;
  height: 13px;
  vertical-align: middle;
  content: "";
}

.title span:after {
  background: url(../images/right.png) no-repeat;
  background-size: 100% 100%;
  margin-left: 25px;
  animation: movet linear .8s infinite alternate;
}

.title span:before {
  background: url(../images/left.png) no-repeat;
  background-size: 100% 100%;
  margin-right: 25px;
  animation: movett linear .8s infinite alternate;
}

.panel01 .title {
  margin-bottom: 105px;
}

.panel01 .list-cont {
  position: relative;
  float: left;
  background: url(../images/tbg.png) no-repeat;
  box-shadow: 0px 5px 54px 0px rgba(225, 223, 223, 0.75), inset 0px 5px 46px 0px rgba(94, 68, 221, 0.75);
  width: 309px;
  height: 328px;
  border-radius: 9px;
  margin-bottom: 65px;
  font-size: 18px;
  color: rgb(255, 255, 255);
  line-height: 1.778;
  text-align: center;
}

.panel01 .list-cont img {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -68px;
}

.panel01 .list-cont p {
  padding-top: 100px;
}

.panel01 .list-cont .tip {
  width: 170px;
  height: 48px;
  line-height: 48px;
  margin: 20px auto;
}

.panel01 .list-cont .tip1 {
  background: url(../images/b1.png) no-repeat;
  background-size: 100% 100%;
}

.panel01 .list-cont .tip2 {
  background: url(../images/b2.png) no-repeat;
  background-size: 100% 100%;
}

.panel01 .list-cont .tip3 {
  background: url(../images/b3.png) no-repeat;
  background-size: 100% 100%;
}

.panel01 .list-cont:nth-child(3n-1) {
  margin: 0 86px;
}

.panel02 {
  padding-top: 65px;
  height: 562px;
  background: rgba(97, 72, 233, 1);
  box-sizing: border-box;
}

.panel02 .title {
  color: #fff;
  margin-bottom: 70px;
}

.panel02 .title span:after,
.provinces-wrap .title span:after {
  background: url(../images/right2.png) no-repeat;
  background-size: 100% 100%;
}

.panel02 .title span:before,
.provinces-wrap .title span:before {
  background: url(../images/left2.png) no-repeat;
  background-size: 100% 100%;
}

.panel02 .list-cont {
  width: 222px;
  height: 310px;
  background: url(../images/w1.png) no-repeat;
  background-size: 100% 100%;
  float: left;
  text-align: center;
  font-size: 18px;
  color: rgb(31, 30, 30);
  margin-right: 70px;
}

.panel02 .list-cont2 {
  background: url(../images/w2.png) no-repeat;
  background-size: 100% 100%;
}

.panel02 .list-cont3 {
  background: url(../images/w3.png) no-repeat;
  background-size: 100% 100%;
}

.panel02 .list-cont4 {
  background: url(../images/w4.png) no-repeat;
  background-size: 100% 100%;
  margin-right: 0;
}

.panel02 .list-cont>div {
  font-size: 24px;
  color: rgb(254, 253, 253);
  padding-top: 23px;
  margin-bottom: 64px;
}

.panel02 .list-cont img {
  margin-bottom: 35px;
}

.panel02 .list-cont span {
  font-size: 24px;
}

.panel02 .list-cont2 img,
.panel02 .list-cont3 img,
.panel02 .list-cont4 img {
  margin-bottom: 25px;
}

.panel03 {
  padding-top: 75px;
  padding-bottom: 56px;
  overflow: hidden;
}

.panel03 .txt-box {
  text-align: center;
}

.panel03 .txt-box h3 {
  margin-bottom: 10px;
}

.panel03 .txt-box>div {
  width: 250px;
  margin: 0 100px;
  display: inline-block;
}

.panel03 .txt-box p {
  height: 25px;
  line-height: 25px;
  margin-bottom: 15px;
  padding-left: 20px;
  text-align: left;
  font-size: 18px;
}

.panel03 .txt-box p img {
  vertical-align: middle;
  margin-right: 10px;
}

.panel04 .title {
  margin-bottom: 35px;
}

.search-box {
  border-radius: 20px;
  background-color: rgb(115, 91, 245);
  box-shadow: inset 0px 5px 62px 0px rgba(97, 72, 233, 0.75);
  width: 1111px;
  height: 120px;
  margin: 0 auto 25px;
  text-align: center;
  color: #fff;
  padding-top: 34px;
  box-sizing: border-box;
  font-size: 24px;
}

.search-box>div {
  display: inline-block;
  margin: 0 25px;
}

.search-box select,
.search-box input,
.search-box .sBtn {
  background: #fff;
  width: 230px;
  height: 50px;
  border-radius: 10px;
  border: none;
  font-size: 20px;
  text-indent: 15px;
}

.search-box .sBtn {
  background: #FFD535;
  color: #333;
  line-height: 50px;
  cursor: pointer;
}

.search-box .sBtn:hover {
  background: #FF9C71;
}

.search-box select {
  background: #fff url(../images/arr.png) 90% center no-repeat;
}

.panel04 .tip {
  font-size: 18px;
  color: rgb(133, 133, 134);
  line-height: 1;
  text-align: center;
  margin-bottom: 38px;
}

.teacher-box .pic img,
.teacher-box .name,
.teacher-result-box .pic img,
.teacher-result-box .name {
  width: 171px;
  height: 242px;
  border-radius: 15px;
}

.teacher-box .top-pic,
.teacher-box .bottom-pic {
  position: relative;
  display: block;
  height: 242px;
  border-radius: 15px;
  overflow: hidden;
  cursor: pointer;
}

.teacher-box .top-pic {
  margin-bottom: 15px;
}

.teacher-box .name,
.teacher-result-box .name {
  position: absolute;
  top: 100%;
  left: 0;
  text-align: center;
  font-size: 18px;
  background: rgba(0, 0, 0, .5);
  color: rgb(255, 255, 255);
  padding-top: 184px;
  box-sizing: border-box;
  transition: all .3s;
}

.teacher-box .top-pic:hover .name,
.teacher-box .bottom-pic:hover .name {
  top: 0;
}

.swiper-button-next, .swiper-button-prev {
  width: 56px;
  height: 112px;
}

.swiper-button-next, .swiper-button-prev.swiper-button-disabled {
  opacity: 1;
}

.swiper-button-prev.swiper-button-white {
  background: url(../images/prev.png) no-repeat;
  background-size: 100% 100%;
  left: 0;
  margin-top: -56px;
}

.swiper-button-next.swiper-button-white {
  background: url(../images/next.png) no-repeat;
  background-size: 100% 100%;
  right: 0;
  margin-top: -56px;
}

.list-pic {
  float: left;
  display: block;
  margin-right: 15px;
  border-radius: 15px;
  position: relative;
  overflow: hidden;
}

.list-pic:last-child {
  margin-right: 0;
}

/*老师详情展示*/
.teacher-detail,
.teacher-result-box,
.no-teacher-infor,
.teacher-box {
  border-radius: 20px;
  background-color: rgb(213, 205, 254);
  width: 1112px;
  height: 516px;
  margin: 0 auto 65px;
  position: relative;
  padding: 46px 88px;
  box-sizing: border-box;
}

.teacher-detail,
.search-teacher-result,
.no-teacher-infor {
  display: none;
}

.teacher-box {
  height: 556px;
  padding-top: 28px;
  padding-left: 102px;
  padding-right: 100px;
}

.teacher-detail .left-pic img {
  width: 300px;
  height: 420px;
}

.teacher-detail .right-txt {
  width: 563px;
  max-height: 424px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.teacher-detail .t-name {
  font-size: 30px;
  color: rgb(15, 14, 14);
  margin-top: 55px;
  margin-bottom: 20px;
}

.teacher-detail .zj {
  font-size: 18px;
  color: rgb(15, 14, 14);
  margin-bottom: 35px;
}

.teacher-detail p {
  font-size: 18px;
  color: rgb(15, 14, 14);
  line-height: 1.889;
}

.back-page {
  background-color: rgb(142, 122, 249);
  box-shadow: inset 0px 5px 38px 0px rgba(109, 85, 250, 0.75);
  width: 114px;
  height: 41px;
  border-radius: 25px;
  position: absolute;
  top: 55px;
  right: 110px;
  color: #fff;
  text-align: center;
  line-height: 41px;
  cursor: pointer;
}

.back-page:hover {
  background: #FFD535;
  box-shadow: none;
  color: #333;
}

/***搜索出的老师结果展示**/
.search-teacher-result {
  position: relative;
}

.teacher-result-box {
  height: 410px;
}

.teacher-result-box .pic img,
.teacher-result-box .name,
.teacher-result-box .list-pic {
  width: 222px;
  height: 309px;
}

.teacher-result-box .name {
  top: 309px;
}

.teacher-result-box .list-pic:hover .name {
  top: 0;
}

.teacher-result-box .list-pic {
  margin-right: 16px;
}

.teacher-result-box .list-pic:last-child {
  margin-right: 0;
}

.search-teacher-result .back-page {
  position: relative;
  top: 0;
  right: 0;
  display: block;
  margin-left: 890px;
  margin-bottom: 18px;
}

.no-teacher-infor {
  height: 384px;
  padding-top: 80px;
}

.no-teacher-infor img {
  float: left;
  margin-left: 88px;
  margin-right: 25px;
}

.no-teacher-infor .txt {
  float: left;
}

.no-teacher-infor h4 {
  font-size: 24px;
  color: rgb(15, 14, 14);
  font-weight: normal;
  margin-bottom: 20px;
  padding-top: 20px;
}

.no-teacher-infor p {
  font-size: 18px;
  color: rgb(15, 14, 14);
  line-height: 1.889;
}

.no-teacher-infor .back-page {
  top: 260px;
}

.provinces-wrap {
  padding-top: 50px;
  background: rgba(97, 72, 233, 1);
  box-sizing: border-box;
}

.provinces-wrap .title {
  color: #fff;
  margin-bottom: 50px;
}

.provinces-wrap li {
  float: left;
  font-size: 18px;
  margin-right: 16px;
  margin-bottom: 14px;
}

.provinces-wrap li a {
  display: block;
  color: #fff;
  background-color: #fff;
  width: 142px;
  height: 50px;
  text-align: center;
  line-height: 50px;
  border-radius: 25px;
  color: rgb(60, 59, 64);
}

.provinces-wrap li:nth-child(7n) {
  margin-right: 0;
}

.provinces-wrap li a:hover {
  background: linear-gradient(90deg, #FF9C71, #FFB74F);
  color: #fff;
}

/* 通用底部 */
/* 通用底部 */
.footer {
  position: relative;
  padding: 30px 0;
  background: #6148E9;
  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;
}

.mob {
  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: 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,
  .onlypc,
  .ht_top .topnav, .right-fix, .bottom-fixed img {
    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;
  }

  .panel03 .pic-wall {
    display: none;
  }

  .banner {
    height: 15rem;
    background: url(../images/mban.jpg) top center no-repeat;
    background-size: 100% 100%;
    margin-bottom: 1.5rem;
  }

  .banner p {
    font-size: 1rem;
    padding-top: 1.5rem;
    margin-bottom: .65rem;
  }

  .banner img {
    width: 90%;
  }

  .banner .Width>div {
    font-size: .8rem;
    width: 9.25rem;
    height: 1.75rem;
    line-height: 1.75rem;
    margin-top: 1.5rem;
    margin-left: 38%;
  }

  .title {
    font-size: 1rem;
  }

  .title span:after, .title span:before {
    width: 2rem;
    height: .3rem;
  }

  .title span:before {
    margin-right: .5rem;
  }

  .title span:after {
    margin-left: .5rem;
  }

  .panel01 .title {
    margin-bottom: 3rem;
  }

  .panel01 .list-cont,
  .panel01 .list-cont:nth-child(3n-1) {
    width: 48%;
    margin: 0 1% 1.75rem;
    font-size: .7rem;
    height: 8.5rem;
  }

  .panel01 .list-cont:nth-child(3n) {
    margin-left: 26%;
  }

  .panel01 .list-cont img {
    width: 3rem;
    top: -1.5rem;
  }

  .panel01 .list-cont p {
    padding-top: 2rem;
  }

  .panel01 .list-cont .tip {
    width: 4.35rem;
    height: 1.25rem;
    line-height: 1.25rem;
    margin: .5rem auto;
  }

  .panel02 {
    padding-top: 1.5rem;
    padding-bottom: 1rem;
    height: auto;
  }

  .panel02 .title {
    margin-bottom: 1.5rem;
  }

  .panel02 .list-cont img {
    width: 2.5rem;
    margin-bottom: .75rem;
  }

  .panel02 .list-cont {
    width: 48%;
    margin: 0 1% .5rem;
    font-size: .7rem;
    line-height: 1.3;
    height: 10rem;
  }

  .panel02 .list-cont span {
    font-size: .8rem;
  }

  .panel02 .list-cont>div {
    font-size: .8rem;
    padding-top: .75rem;
    margin-bottom: 1.85rem;
  }

  .teacher-detail, .teacher-result-box, .no-teacher-infor, .teacher-box {
    border-radius: 10px;
    width: 100%;
    padding: 1rem 8% 1rem 9%;
    margin-bottom: 1.5rem;
  }

  .swiper-button-next, .swiper-button-prev {
    width: 1rem;
    height: 2rem;
  }

  .teacher-box .top-pic {
    margin-bottom: .5rem;
  }

  .teacher-box {
    height: auto;
  }

  .teacher-box .top-pic, .teacher-box .bottom-pic {
    height: 10rem;
  }

  .teacher-box .name, .teacher-result-box .name {
    padding-top: 8rem;
    font-size: .65rem;
  }

  .teacher-box .pic img,
  .teacher-box .name,
  .teacher-result-box .pic img,
  .teacher-result-box .name,
  .teacher-result-box .list-pic {
    width: 7rem;
    height: 10rem;
  }

  .panel03 {
    padding: 1.5rem 0;
  }

  .panel03 .txt-box h3 img {
    width: 80%;
  }

  .panel03 .txt-box>div {
    width: 48%;
    margin: 0 1%;
    float: left;
  }

  .panel03 .txt-box p {
    font-size: .65rem;
    height: .85rem;
    line-height: .85rem;
    padding-left: 1rem;
    margin-bottom: .25rem;
  }

  .panel03 .txt-box p img {
    height: .85rem;
    margin-right: .25rem;
  }

  .panel04 .title {
    margin-bottom: 1.5rem;
  }

  .panel03 .title {
    margin-bottom: .75rem;
  }

  .search-box {
    width: 100%;
    font-size: .65rem;
    height: auto;
    padding: 1rem 0 .5rem;
    border-radius: 10px;
  }

  .search-box>div {
    float: left;
    width: 100%;
    margin: 0 0 .5rem;
  }

  .search-box select, .search-box input, .search-box .sBtn {
    width: 13rem;
    font-size: .7rem;
    height: 1.75rem;
    line-height: 1.75rem;
    text-indent: 5px;
    border-radius: 5px;
  }

  .search-box select {
    background-size: .5rem;
  }

  .search-box .sBtn {
    margin-left: 20%;
  }

  .panel04 .tip {
    font-size: .6rem;
    line-height: 1.4;
    padding: 0 10%;
    margin-bottom: 1.25rem;
  }

  .teacher-detail .left-pic img {
    width: 5rem;
    height: 7rem;
    position: relative;
    /* top: 2rem; */
  }

  .no-teacher-infor {
    padding: 1rem 5%;
    height: 14.5rem;
  }

  .no-teacher-infor .back-page {
    top: 11.5rem;
    right: 6rem;
  }

  .no-teacher-infor img {
    width: 5rem;
    float: none;
    margin: 0 auto;
    display: block;
  }

  .no-teacher-infor .txt {
    float: none;
    text-align: center;
  }

  .no-teacher-infor h4 {
    font-size: .75rem;
    margin-bottom: .25rem;
    padding-top: .25rem;
  }

  .no-teacher-infor p {
    font-size: .6rem;
  }

  .teacher-result-box {
    height: auto;
  }

  .swiper-button-prev.swiper-button-white,
  .swiper-button-next.swiper-button-white {
    margin-top: -1rem;
  }

  .teacher-detail {
    padding: 3rem 3% 1rem;
    height: auto;
  }

  .teacher-detail .right-txt {
    width: 11.5rem;
    max-height: 13.5rem;
  }

  .teacher-detail .t-name {
    font-size: .75rem;
    margin: 0 0 .25rem;
  }

  .teacher-detail .zj {
    font-size: .65rem;
    line-height: 1.3;
    margin-bottom: .5rem;
  }

  .teacher-detail p {
    font-size: .6rem;
    line-height: 1.4;
  }

  .teacher-detail .back-page {
    right: 3%;
    top: 1rem;
  }

  .search-teacher-result .back-page {
    margin-left: 68%;
    margin-bottom: 10px;
  }

  .provinces-wrap {
    padding-top: 1.5rem;
    padding-bottom: 1rem;
  }

  .provinces-wrap li {
    width: 23%;
    margin: 0 1% .35rem .55%;
    height: 1.75rem;
  }

  .provinces-wrap li a {
    width: 100%;
    font-size: .7rem;
    height: 1.55rem;
    line-height: 1.55rem;
  }

  /* 通用底部 */
  .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;
  }

  .back-page {
    width: 4rem;
    height: 1.4rem;
    border-radius: .8rem;
    line-height: 1.4rem;
  }
}

.swiper-slide {
  margin-top: 0 !important;
}