/* LESS Document */
/* 清除浮动 */
h1,
h2,
h3,
h4,
h5 {
  font-weight: 500;
}
/*常用颜色*/
/*常用字号*/
/* float */
.left {
  float: left;
}
.right {
  float: right;
}
.fnone {
  float: none;
}
.middle {
  float: left;
}
/* text-align */
.tleft {
  text-align: left;
}
.tright {
  text-align: right;
}
.tcenter {
  text-align: center;
}
/* display */
.dis {
  display: block;
}
.undis {
  display: none;
}
/*单行载断*/
/*单行载断溢出省略号*/
/*3行载断溢出省略号*/
/*边框圆角*/
/* 圆角  */
/*配模式定位*/
/*下阴影*/
/*弹出窗口半透明灰*/
/*1200屏*/
.sanjiao {
  width: 0;
  height: 0;
  overflow: hidden;
  border-width: 20px;
  border-color: transparent transparent #ccc transparent;
  border-style: dashed dashed solid dashed;
}
/* 背景自适应 */
/*单行载断*/
/*单行载断溢出省略号*/
.spill1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/*3行载断溢出省略号*/
/* 面包屑 */
.crumb {
  display: none;
}
@media (min-width: 768px) {
  .crumb {
    display: block;
    *zoom: 1;
    line-height: 50px;
  }
  .crumb:after {
    content: ' ';
    clear: both;
    display: table;
  }
  .crumb p {
    color: #999;
  }
  .crumb p a {
    padding: 0 10px;
  }
  .crumb p span {
    padding-left: 10px;
  }
}
/*配模式定位*/
/*1200屏*/
/* 背景自适应 */
/*下阴影*/
/* 背景自适应 */
/* box-sizing */
/* 文本元素内垂直居中 */
/* input提示字体颜色修改 */
.pa100 {
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.ztwrap {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}
@media (max-width: 768px) {
  .ztwrap {
    width: 96%;
  }
}
img {
  vertical-align: middle;
  max-width: 100%;
}
button {
  border: none;
  background: none;
  cursor: pointer;
  outline: none;
}
a {
  text-decoration: none;
}
.pubcon {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}
p {
  margin: 0;
  padding: 0;
}
.breadcrumb {
  font-size: 14px;
  color: #999;
  margin: 0 auto;
  padding: 19px 10px 15px;
  box-sizing: border-box;
}
.breadcrumb a {
  color: #999;
}
.breadcrumb a:last-child {
  color: #333;
}
.teachersRedesign {
  width: 100%;
  background-color: #f8f8f8;
  padding: 0.1px 0;
}
.teachersRedesign .teacherBanner {
  position: relative;
  display: block;
}
.teachersRedesign .teacherBanner:hover .video_icon {
  display: flex;
  opacity: 1;
}
.teachersRedesign .teacherBanner img.banner {
  width: 100%;
  height: auto;
}
.teachersRedesign .teacherBanner .video_icon {
  position: absolute;
  opacity: 0;
  background-color: rgba(0, 0, 0, 0.1);
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  justify-content: center;
  display: none;
  align-items: center;
  transition: all 1s;
  height: 100%;
}
.teachersRedesign .teacherBanner .video_icon img {
  max-width: 25%;
}
@media (max-width: 460px) {
}
.fun {
  width: 100%;
  padding: 32px 0 0;
  display: flex;
  justify-content: space-between;
}
.fun > li {
  max-width: 270px;
  width: 23%;
  height: 150px;
  background-color: #ffffff;
  box-sizing: border-box;
  box-shadow: #dddcdc 0 1px 5px 1px;
  transition: all 0.3s;
  padding: 0 10px;
}
.fun > li:hover {
  transform: scale(1.05);
}
.fun > li .fu {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.fun > li .fu img {
  width: 76px;
  max-width: 30%;
  display: block;
  padding-top: 5px;
  margin-right: 5px;
  box-sizing: border-box;
}
.fun > li .fu div p {
  font-size: 20px;
  font-weight: normal;
  color: #333333;
}
.fun > li .fu div div {
  font-size: 14px;
  font-weight: normal;
  color: #999999;
}
.fun > li:nth-child(2) .fu img {
  /* width: 39px;
                    height: 45px; */
  width: 65px;
  max-width: 30%;
}
.fun > li:nth-child(3) .fu img {
  /* width: 50px;
                    height: 41px; */
  width: 76px;
  max-width: 30%;
}
.fun > li:nth-child(4) .fu img {
  /* width: 50px;
                    height: 38px; */
  width: 75px;
  max-width: 30%;
  padding-top: 7px;
}
@media (max-width: 760px) {
  .fun {
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 30px 0 15px;
  }
  .fun li {
    width: 48%;
    margin-bottom: 20px;
  }
}
@media (max-width: 480px) {
  .fun {
    padding: 30px 0 0;
  }
  .fun li {
    margin-bottom: 15px;
  }
}
.teacherlist {
  width: 100%;
  background-color: #ffffff;
  padding-top: 40px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  /* Firefox */
  -webkit-box-sizing: border-box;
  /* Safari */
}
.teacherlist ::-webkit-scrollbar {
  height: 5px;
}
.teacherlist ::-webkit-scrollbar-thumb {
  background: #0c87ec;
  border-radius: 10px;
}
.teacherlist > p {
  font-size: 30px;
  font-weight: normal;
  color: #333333;
  text-align: center;
  margin-bottom: 30px;
}
.teacherlist .listbox {
  max-width: 1050px !important;
  width: 98%;
  overflow-x: auto;
  margin: 0 auto 30px;
}
.teacherlist .listbox .list {
  height: 30px;
  margin: 0 auto 10px;
  /* iOS 6-, Safari 3.1-6 */
  /* Chrome */
  /* Firefox 19 */
  /*flex容器*/
  display: -webkit-box;
  /* iOS 6-, Safari 3.1-6 */
  display: -webkit-flex;
  /* Chrome */
  display: -moz-box;
  /* Firefox 19 */
  display: -ms-flexbox;
  display: flex;
  /*flex容器*/
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -ms-justify-content: space-between;
  -o-justify-content: space-between;
  justify-content: space-between;
}
.teacherlist .listbox .list > li {
  line-height: 30px;
  height: 30px;
  padding: 0 10px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  /* Firefox */
  -webkit-box-sizing: border-box;
  /* Safari */
  font-size: 16px;
  white-space: nowrap;
}
.teacherlist .listbox .list .blue {
  background-color: #0c87ec;
  color: #ffffff;
}
.teacherlist .listbox .list .blue a {
  color: #ffffff;
}
@media (max-width: 940px) {
  .teacherlist .listbox .list {
    margin: 0 auto 15px;
  }
}
.teacherlist .content {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 1140px;
  width: 96%;
  margin: 0 auto;
  display: none;
}
.teacherlist .content ::after {
  content: '';
  width: 24%;
}
.teacherlist .content.show {
  display: block;
  display: flex;
  flex-wrap: wrap;
}
.teacherlist .content .likong {
  max-width: 270px;
  width: 24%;
}
.teacherlist .content > li {
  max-width: 270px;
  width: 24%;
  height: 368px;
  text-align: center;
  margin-bottom: 30px;
}
.teacherlist .content > li:hover {
  box-shadow: 0 0 10px #5c5c5c;
}
.teacherlist .content > li:hover div {
  background-color: #0c87ec;
  border: solid 1px #0c87ec;
}
.teacherlist .content > li:hover div h4 {
  color: #fff;
}
.teacherlist .content > li:hover div p {
  color: #fff;
}
.teacherlist .content > li div {
  max-width: 270px;
  width: 100%;
  height: 100px;
  background-color: #ffffff;
  border: solid 1px #e5e5e5;
  box-sizing: border-box;
}
.teacherlist .content > li div h4 {
  height: 22px;
  font-size: 20px;
  font-weight: normal;
  color: #333333;
  margin: 6px 0;
}
.teacherlist .content > li div p {
  margin: 0 auto 2px;
  /*  width       : 127px;
                    height: 31px; */
  font-size: 14px;
  font-weight: normal;
  color: #999999;
}
.teacherlist .content > li img {
  width: 270px;
  background: url('../images/teacherbg.png') no-repeat center;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  -ms-background-size: cover;
  /* background-image: linear-gradient(0deg,
                        #646e7a 0%,
                        #3c404a 100%) */
}
@media (max-width: 1200px) {
  .teacherlist .content li {
    max-width: 270px;
    width: 30%;
  }
  .teacherlist .content .likong {
    max-width: 270px;
    width: 30%;
  }
}
@media (max-width: 840px) {
  .teacherlist .content li {
    margin-bottom: -5px;
  }
}
@media (max-width: 760px) {
  .teacherlist .content li {
    width: 48%;
    margin-bottom: 20px;
  }
}
@media (max-width: 470px) {
  .teacherlist .content li {
    height: auto;
  }
}
@media (max-width: 420px) {
  .teacherlist .content li {
    max-width: 315px;
    width: 100%;
    height: 156px;
    margin: 0 auto 15px;
  }
  .teacherlist .content li > a {
    width: 100%;
    display: flex;
  }
  .teacherlist .content li img {
    width: 147px;
    height: 156px;
  }
  .teacherlist .content li div {
    min-width: 168px;
    height: 156px;
    text-align: left;
    width: 100%;
  }
  .teacherlist .content li div p,
  .teacherlist .content li div h4 {
    padding-left: 20px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    /* Firefox */
    -webkit-box-sizing: border-box;
    /* Safari */
  }
  .teacherlist .content li div p {
    font-size: 13px;
    overflow: hidden;
    display: -webkit-box;
    word-break: break-all;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  .teacherlist .content li div em {
    margin: 10px auto 0;
  }
  .teacherlist .content li div .bthlook {
    display: block;
  }
}
@media (max-width: 940px) {
  .teacherlist .content {
    margin-top: 20px;
  }
}
@media (max-width: 420px) {
  .teacherlist .content {
    max-height: 855px;
    overflow: hidden;
  }
}
.teacherlist hr {
  width: 95%;
  color: #eeeeee;
  opacity: 0.3;
  margin: 49px auto 40px;
}
@media (max-width: 420px) {
  .teacherlist hr {
    margin: 19px auto;
  }
}
.bthlook {
  width: 83px;
  height: 32px;
  display: block;
  border-radius: 16px;
  border: solid 1px #0c87ec;
  text-align: center;
  font-size: 14px;
  font-weight: normal;
  line-height: 32px;
  color: #0c87ec;
  margin-left: 20px;
  margin-top: 20px;
  display: none;
}
.pagelist {
  text-align: center;
  font-size: 0;
}
.pagelist input {
  width: 42px;
}
.pagelist input.number {
  padding: 0;
}
.pagelist span,
.pagelist input {
  display: inline-block;
  vertical-align: middle;
  min-width: 42px;
  height: 42px;
  line-height: 40px;
  font-size: 16px;
  color: #999;
  text-align: center;
  background-color: #ffffff;
  border: solid 1px #e5e5e5;
  cursor: pointer;
  margin-left: 10px;
}
.pagelist span a,
.pagelist input a {
  display: block;
  color: #999;
}
.pagelist span.on,
.pagelist input.on {
  background-color: #345aa3;
}
.pagelist span.on a,
.pagelist input.on a {
  color: #fff;
}
.pagelist span.next,
.pagelist input.next,
.pagelist span.prev,
.pagelist input.prev {
  width: 78px;
}
.pagelist span.jump,
.pagelist input.jump {
  background-color: #f6f6f6;
  border: solid 1px #e5e5e5;
}
@media (max-width: 640px) {
  .pagelist span,
  .pagelist input {
    display: none;
  }
  .pagelist span.prev,
  .pagelist input.prev,
  .pagelist span.next,
  .pagelist input.next,
  .pagelist span.number,
  .pagelist input.number {
    display: inline-block;
    height: 35px;
    line-height: 33px;
    font-size: 14px;
  }
  .pagelist span.next,
  .pagelist input.next,
  .pagelist span.prev,
  .pagelist input.prev {
    width: 60px;
  }
}
.pagelist span:hover {
  background-color: #345aa3;
  color: #fff;
}
.pagelist span:hover a {
  color: #fff;
}
.pagelist span:nth-last-child(1) {
  width: 56px;
  margin-left: 0;
  border-left: none;
}
@media (max-width: 640px) {
  .pagelist span:nth-last-child(1) {
    width: 50px;
  }
}
.container .record {
  max-width: 1132px;
  box-sizing: border-box;
  padding: 0 0 50px;
  margin: 0 auto;
}
.container .record h3 {
  margin-bottom: 30px;
  text-align: center;
  font-size: 30px;
  font-weight: normal;
  color: #333333;
}
.container .record .swiper-history {
  width: 94%;
  margin: 0 auto;
  padding-left: 7px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  /* Firefox */
  -webkit-box-sizing: border-box;
  /* Safari */
}
.container .record .swiper-history .swiper-wrapper {
  padding-top: 7px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  /* Firefox */
  -webkit-box-sizing: border-box;
  /* Safari */
}
.container .record .swiper-history .swiper-wrapper li {
  position: relative;
  padding: 13px 0 5px 15px;
  border-left: 1px solid #0c87ec;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  /* Firefox */
  -webkit-box-sizing: border-box;
  /* Safari */
  text-align: center;
}
.container .record .swiper-history .swiper-wrapper li > img {
  width: 170px;
  height: 98px;
  margin-top: 3px;
}
.container .record .swiper-history .swiper-wrapper li:nth-child(5n) {
  margin-right: 15px;
}
.container .record .swiper-history .swiper-wrapper li p {
  font-size: 14px;
  line-height: 22px;
  text-align: center;
  color: #333;
}
.container .record .swiper-history .swiper-wrapper li p.title {
  font-weight: bold;
  margin-bottom: 3px;
}
.container .record .swiper-history .swiper-wrapper li p.content {
  min-height: 30px;
  width: 100%;
  height: 60px;
  padding: auto;
  padding-right: 10px;
}
.container .record .swiper-history .swiper-wrapper li p.time {
  font-size: 20px;
  line-height: 23px;
  color: #0c87ec;
  padding-left: 2px;
  margin-top: 15px;
}
.container .record .swiper-history .swiper-wrapper li:first-child {
  margin-left: 0;
}
.container .record .swiper-history .swiper-wrapper li::after {
  position: absolute;
  content: '';
  display: block;
  top: -7px;
  left: -8px;
  width: 15px;
  height: 15px;
  background-color: #ffffff;
  border: solid 2px #0c87ec;
  border-radius: 50%;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  /* Firefox */
  -webkit-box-sizing: border-box;
  /* Safari */
}
.container .record .swiper-history .swiper-wrapper .swiper-slide ul {
  display: -webkit-box;
  /* iOS 6-, Safari 3.1-6 */
  display: -webkit-flex;
  /* Chrome */
  display: -moz-box;
  /* Firefox 19 */
  display: -ms-flexbox;
  display: flex;
  /*flex容器*/
  padding-top: 7px;
  padding-left: 10px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  /* Firefox */
  -webkit-box-sizing: border-box;
  /* Safari */
}
.container .record .swiper {
  width: 260px;
  height: 30px;
  margin: 30px auto 0;
  display: -webkit-box;
  /* iOS 6-, Safari 3.1-6 */
  display: -webkit-flex;
  /* Chrome */
  display: -moz-box;
  /* Firefox 19 */
  display: -ms-flexbox;
  display: flex;
  /*flex容器*/
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -ms-justify-content: space-between;
  -o-justify-content: space-between;
  justify-content: space-between;
  position: relative;
}
.container .record .swiper div {
  width: 210px;
  height: 3px;
  background-color: #ffffff;
  opacity: 0.7;
}
.container .record .swiper div span {
  height: 3px;
  background-color: #0c87ec;
}
.container .record .swiper .swiper-pagination {
  width: 210px;
  height: 3px;
  background-color: #e5e5e5;
  opacity: 0.7;
  left: 50%;
  top: 12px;
  transform: translateX(-50%);
}
.container .record .swiper .swiper-button-prev,
.container .record .swiper .swiper-button-next {
  top: 1px;
  width: 11px;
  height: 21px;
  margin-top: 0;
  background-image: none;
}
.container .record .swiper .swiper-button-prev {
  left: 0;
}
.container .record .swiper .swiper-button-next {
  right: 0;
}
.container .record .processBox {
  overflow: hidden;
  margin: 37px auto 0;
}
#vvBox {
  min-height: 450px;
}