table{ width:960px; background:#fff; border-collapse:collapse;  margin:10px auto 0; text-align:center; border: 1px solid #252525;}
table th{ color: #fff; font-size: 18px; height:40px; font-weight: 100; padding:5px;  text-align:center;}
table td{ font-size: 14px; padding:20px 10px; height:20px;}
td{border: 1px solid #252525;}
th{border: 1px solid #252525; color:#333;}
tr:hover{ background:#f9f9f9;}
.ht_top {
  width: 100%;
  background: #fafafa url(www.huatu.comztopfooterimagesnav_bg.gif) repeat-x 0 0;
  line-height: 41px;
  overflow: hidden;
}

.ht_top .zt_top {
  width: 1000px;
  height: 41px;
  margin: 0 auto;
}

.ht_top h1 a {
  float: left;
  width: 131px;
  height: 40px;
  overflow: hidden;
  text-indent: -100em;
  background: url(www.huatu.comztopfooterimageslogo.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;
}

.footer {
  clear: both;
  text-align: center;
  padding: 25px 0;
  position: relative;
}

.footer p {
  line-height: 24px;
  color: #959595;
  font-size: 14px;
  position: relative;
  z-index: 2;
}

.footer p a {
  color: #959595;
  font-size: 14px;
}

.footer p span {
  padding-bottom: 0px;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 0px
}

.m-footer {
  display: none;
}

.banner {
  width: 100%;
  height: 0;
  padding-bottom: 31.333%;
  background-image: url(imagesbanner.png);
  background-repeat: no-repeat;
  background-size: 100%;
}

.container>li {
  width: 100%;
  padding-bottom: 50px;
}

.container>li:nth-child(1) {
  background-color: #108fee;
}

.container>li:nth-child(2) {
  background-color: #f1cc01;
}

.container>li:nth-child(3) {
  background-color: #a27bee;
}

.container>li:nth-child(4) {
  background-color: #07e8be;
}

.title_warp {
  padding-top: 45px;
}

.title {
  width: 390px;
  height: 84px;
  margin: 0 auto 25px auto;
  background-image: url(imagestitle1.png);
  background-size: 100%;
  background-repeat: no-repeat;
  padding-left: 176px;
  line-height: 84px;
  font-weight: bold;
  font-size: 35px;
  color: #fff;
}

.main {
  width: 100%;
  background-color: #fdfbec;
}

.main_bg {
  width: 394px;
  height: 320px;
  margin-left: 50px;
  background-image: url(imageslist.png);
  background-repeat: no-repeat;
}

.person {
  width: 363px;
  height: 248px;
  margin: 66px 0 60px 116px;
  background-image: url(imagesperson.png);
  background-repeat: no-repeat;
}

.person>p {
  width: 185px;
  margin-top: 30px;
  margin-left: 168px;
  color: #fff;
}

.title1 {
  position: relative;
  width: 840px;
  height: 200px;
  margin: 0 auto;
  background-image: url(../images/title2.png);
  background-repeat: no-repeat;
  background-size: 100%;
  line-height: 200px;
  font-weight: bold;
  font-size: 35px;
  color: #fff;
}

.title1 p {
  position: absolute;
  top: 0;
  left: 320px;
}

.list {
  width: 100%;
  text-align: center;
}

.list>h5 {
  margin-bottom: 15px;
  color: #fff;
  font-size: 22px;
  font-weight: normal;
}

.list_title>div {
  height: 40px;
  margin-right: 1px;
  margin-bottom: 1px;
  line-height: 40px;
  color: #fff;
}

.name {
  width: 154px;
  background-color: #188dfb;
}

.subject {
  width: 190px;
  background-color: #188dfb;
}

.teacher {
  width: 210px;
  background-color: #188dfb;
}

.time {
  width: 180px;
  background-color: #5f64fb;
}

.price {
  width: 130px;
  background-color: #fd9e64;
}

.place {
  width: 130px;
  background-color: #188dfb;
}
.diqu{
	color:#03F;
}

.list_val>div {
  height: 145px;
  line-height: 145px;
  margin-right: 1px;
  margin-bottom: 1px;
  background-color: #fff;
  color: #188dfb;
}

.list_val>div.time {
  color: #5f64fb;
}

.list_val>div.price {
  color: #fd9e64;
}

.list_val>div.subject, .list_val>div.teacher {
  height: 93px;
  padding-top: 52px;
  line-height: inherit;
}

select {
  width: 98px;
  height: 32px;
  margin-top: 52px;
  line-height: 32px;
  background-color: #188dfb;
  color: #fff;
  cursor: pointer;
}

.animate_warp {
  padding-top: 50px;
  overflow: hidden;
 
}

.animate {
  width: 950px;
  height: 70px;
  border: 2px solid #ff8400;
  border-radius: 15px;
  margin: 30px auto 0 auto;
  background-color: #fff;
}

.animate_title {
  width: 240px;
  margin: -32px auto 0 auto;
}

.icon1 {
  background-image: url(images1.png);
}

.icon2 {
  background-image: url(../images/2.png);
}

.icon3 {
  background-image: url(../images/3.png);
}

.icon4 {
  background-image: url(../images/4.png);
}

.animate_title i {
  display: block;
  width: 244px;
  height: 54px;
  background-repeat: no-repeat;
}

.animate_txt {
  margin-top: 15px;
  margin-left: 40px;
  font-size: 16px;
  color: #ff8400;
}

.animate_txt i {
  width: 40px;
  height: 33px;
  margin-top: -7px;
  background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAhCAYAAACr8emlAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAYNSURBVFhH7ZdbbFRVFIanFqjaSEtq2lJ6BXuhnXIptioqaNAHjRobhTalrTUgofLiAzHxRVEj1LTpZUqbXrTESFQwmtRAQ0yMxkvUGBMhBkjaWEhoTaUt9H53ub81c4ZhOlNmCg/GuJI958yZs9f+97/W+tcem/zL7X+AN2v/MYBzzsuU/O28mZ02HzPOe/Pb3JzzhVlzmdU7kek51zv8ZB7y3BqTZuDDmufLggA4IxNmKDgAuED09vWLo6FRtm8vkDUp98jSkDCJCA+XrDS7PmtpbpOe3j4Fo3MtdGBy+XBu1LcFBXAWJqbMImaMXhqUfWV7xLbEJiE2m/vqb5SUlcmFnj/d4BQYvsy9MunHAgYIOEKB4/aTJyUiJlYXBljcjlyJ+2C3ZP96QLIGG2TVYK1En31TUo68KHHP2PWdMPNuasJKOf75Z+rDGnzo1Y8FAdD5sfelcl3QdrtNwp/OktVn3lFQ9iGHbJhsFPt4raSPVek1e7Ref0voeleWPm93b6j05b3XQBkG3TntwwIPsfH4RXuHe5Hog/m6+FoDInW6QZLHHZIx2SAZYw4FZwFcP9oo6UONsrW/VRLfelbn4oMoWCG+JQySP0lRMRqqpNeflKzRJsmea5F1w7WSNumQNRN1CtIN1AU2a/ywMst92mSLG2RsZJT6pPAWQhgwwB3FRbrz0PxM2XK1TaKnDbCRWrl3pF6Z2mgAWINwwyzgAJ8yVi2pM9WSMlSjcwk3G6XKtUAMi/4sIIDd3d1iC1mmO8/peluBwQi5BmP20fcVSO4VhyRN10vSVJ0C1U0Y1rLPVSrrKX3VOgcf+MLnuT96zAouLfVh1wGkSr1Fk+8OR73qG9UKC4z7x1oUjMUYTGZcMUyZfNwwUCWbR+o0DcjVmIQoee2NVyW0fLPkjrbq/IjiPPWJ70XpoCfQ/Px83S1SwsKAyBxqkvjhemUzx+QfDHJPLsJgynijrKosUHDnuzo1z0qKCyW6bacJfYPEfbRbU+apwgLzU4AM+rOE+EQFSKjIpZVTZvFj+2T5Y+mScaxcUg175ByMAhRG4x07Fdwvv53RGviy/ZQsC1si9/U26QZTzx7SMNN9ggboHWYck9QwljVSKWsv10p4iE1+PvWNbHniUbnzlcdVSggfzCY3l2q7AxzoeO+OiFCJOr5HZYeiwRc+2PiiimRm5tquWIxw0CEIJ2EiXCx+eWxCHnrwEYnav002Dbyn3SNyRbh89dP3ujBXNrjiaLEWDLJEmrBJGLzrtnDt6/7shkUCUMIAg3QNdp93tUkTnsRHxwD5wMN5yiRMwRjy8d23P+p3QCM5sEcqJA5XyLquQ7pp0mchm8egN0C+o1c4I7ERYBZZf6FW7t6VKwcrDiiT/UMDCvLE1x3K3Okfftd+Tbh5HwkCIPlLkYR+8oKG2Fkk/in0G2JPoEgBACMLNyl76Bth4kAQXb5NqmtqFJQVqu7TBlz8clntKJKNI80KEOZpfxQSLRKZISrMDQigBcgTmHXf2dmpAMkZKhlxJpdYnLDzG2dC1rHAUcUUDtJjn6lT5vOGqlUrMy6a/DOHDeb1dF90tjs/5pNBT5CWlTxXpE5pUyQ7INE8JIZjFosRbo5UiHPseKvzdGPAJY9XKIPModJpl7yPTzblaz3L/IbYMmsyJ2eqk7AAgPZGLqF7dJOc84cldP9WZRhwsEvOkXv0arRP9dOIN5HgsNB36S/1HVSrs2zerkwhILYAJLlZCM1jYfqrdhCE2oQUwDynX6vuma7CcYucJAqMjk9PuBxfL2nedkMG3Wbw0hGsAyshIlTkIIWTOVWlgzxDzAFMvtGzSQErrMzFh+VT88+LC0+bVySYrx1Zf3jQt6MffqxnQxaDDaqbLkFVwyqCTSujHVKtVkEwh7l6UDVGi9MKDgQg5h1Wz+848/xXxj+1XaXOhq/MmJZF+BnWM8/h/tOESzPf6WvaCRCffizwELvMexNIEFqGmNMVaGsA4p5TEBrKeXKxFjTAhcxXaixUAIFYwADnVbUxnvl6fittUQx6A/O8v1nGvC0ogN5s+WPPewOLN5F/AAkIQrfkRig8AAAAAElFTkSuQmCC");
  background-repeat: no-repeat;
}

.roate_cricle {
  margin-top: 55px;
  text-align: center;
}

.roate_title {
  margin-bottom: 14px;
  color: #fff;
  font-size: 22px;
}

.roate_list {
  /*perspective: 1000px;*/
  position: relative;
  width: 235px;
  height: 270px;
  margin-right: 10px;
  color: #ffec81;
  cursor: pointer;
}

.roate_list:last-child {
  margin-right: 0;
}

.circle {
  position: relative;
  width: 100px;
  height: 100px;
  margin: 0 auto 40px auto;
  border-radius: 100%;
  background-color: #fff;
}

.pc {
  width: 46px;
  height: 38px;
  top: 35px;
  left: 30px;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAmCAYAAAC76qlaAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAC/SURBVFhH7ZixCsMwEMXu35v+dIekGK7YGEdTiWyw4C3RQTQ7ziPe5ys+1xHXjCttpTF6Zo7+rTRmbmV0OOMyt4JSBttQymAbShlsQymDbShlsA2lDLahlME2lDLYhlIG21DKYBtKGWxDKYNtKGWwDaUMtqGUwTaUMtiGUgbbUMpgG0oZbEMpg20oZbANpQy2tXLmZW5l2QehZZ/g/kn7w/y0Bjv8aZYKb2PvlqdzMQrtl6dzMQrtl6ebzfNEfAFh9CLnpXxRcwAAAABJRU5ErkJggg==");
}

.code {
  width: 30px;
  height: 40px;
  top: 32px;
  left: 35px;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAoCAYAAADpE0oSAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADWSURBVFhH7ZhBCsMgFAX/YXLCXqG2l0zPYhKrBJE/C+VJF3XgbxwdyUIKtRjsdQQ7Zk+6x2q8TbOmXJnxNsyacmUGhQjsoxCBfRQisN+K+LYtPm2v13snnU8dr3/TiuvQo14bndTx+jet+H5xsE+93jvpfPcXq8E+ChHYRyEC+yhEYL8V6zmNzHpObh+FCOyjEIH9VqznNDLrObl9FCKwj0IE9lGIwD4KEdhHIQL7KERgH4UI7KMQgX0UIrCPQgT2azF7ypUZb8OsKVdmrp+w3/z58meYnStAE6wF+BJZAAAAAElFTkSuQmCC");
}

.lock {
  width: 47px;
  height: 45px;
  top: 31px;
  left: 28px;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAAAtCAYAAAA+7zKnAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAJESURBVGhD5ZjNUcMwEIV1pQCuVEIBNMDQQQpIAbk4zHDJPVeu6SC30ETKiXkrdoV+LFuxRbQZ3ozHeLVovyfJssC0UN+Z50tn1v3WrPoP88Rh/bpszR7QfXS9crNeYbQ/B8Dl0mtgAPyAWThHMX0GYnBaOjb+bh5VG8iBi9QamAIXqTNQCi5SY+BacFFzA3PBRc0MLAUX3dxALXDRoIG/OEqgyM4vMgZuzzU788CPo4oNYIDW3FRHVKAYHFPPOcdSA8g/uL47s+FwHdFIus4xShxOhHYL7uVOLivK8X+HanFTHdE69AsMTS3iMfiZZoybBxWDl5gtkl0qNOL8AqFzN7W2kGcAz8vBsRlw0zKh4+DlxHUgGMS/gvjPjCgCj7ZDd3XmxLNxomfkveCuF5xg/GfPAL3AqsHty4M4/R3q4ncDLhIDuI8uldzXsRm4iMCQ+xblOnA2RmDBNtocnDQGzkvpt40N3AU4/YxYsI1STvCsDRxtdql4u5DdRuNLHXh8ZHAG4i8xPni2s6WqBS5CTriNApzi1hgvJ5u4VATqFxoDp8JRbgIuSgxktsvZGoDJgpPoHI6cI+dmwUWU4/pHLQ7XEUZn4zrnqZ0SG9gXgIczWmupiPypLRnJUiXgtV5OX/HOUMNAAl5rOxwSClx9mMrppuAiFFpsoAm4CAVnG2gKLkJhPefxOQJAsQFV4CKATBpQCS4CUNaAanARwBIDuMf/p9EHLgJgYMC/VIOLAJoYoKXDzfrFR4kVRntd/YT4v2TMN/1bN0LU1++LAAAAAElFTkSuQmCC");
}

.beats {
  width: 40px;
  height: 40px;
  top: 31px;
  left: 30px;
  background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAK0SURBVFhH7Vi7bhsxEGSbMh+QD0jnNj+gPnX+wF3+QLAOCWAgvXv/QSoVatypUqdGXRo3atKlO2VmOUuR55Oie8hWAA1AELfLnR2Sd0tK4YpLQD0LH+oqfEa73c3ClL09w64hr4/6R3gHEQ8Q8Yz+D4T9Zu+Nz7Jt0R44XqHnhyV0IVXY/av5WMaJ4jzYfQ/vsWLrXFiWfCvfk3quXDEJe4aPPKIcDyaumSwmvEdrfddoN7/Geqxt/5giJW6bJ0DiR7lPAsebMHEY31giQfaUViCKu5erExjnIslHXrn6A6RVmvkAcY5cpPgqufoBBM9pxrPwU+ZBII/vCPll7g4ET4otGanwkscFahUncnUDAh+NJAoc/r5kIF/i7vjBGepv4RMC0/ZiplO5RgH5fBWZh/nkOg6VlKUtvRNEgdyKxdDSYPzkaeNn3mP8dHIgg9oaiWxVe4qUuHh2t/BbY/5D/Ags6x1mhMZzd+XC6UeSXl8z4xr8K/HbjiX+tve9vgsffZAFN+oTnssi2/GL5njGZfxFPWW+Ij/0yBWBYN7h4jsxC79kLgB/PO5igi8ynwSOzya4lbkA88rPVbyVOQLBU0seBS5kLoCgVSK4C19lPgkczzjFr2QuwLyugXpkjrgKvAoErgKPCUTQvsxUYSNzAdjPW2aQV/6WMlOFGyewvjEDJEiF1AiGF+riIGA+51d/I9ceIFjagD3JnERodrjTLnFzhXQCeRoiF+KfJ3Exx1IhJewwd4JDjUQDLgu5kLZm+Y/xS+TmBRFnzI+kpziH+NPlo8G/OZkfyz5BAP/amKvvdy0/APLlIsfmHwwIqjDxWDUOXE7eFBC1zlav+2+ScwJFu3n3vLjtTSfGxW0vBBX/LKCVR9pbI30Y6CG2V8E/K3wF0a9f9V/XLsAKvjxn/0+E8BcDSTV7EKirNAAAAABJRU5ErkJggg==");
}

.circle i {
  position: absolute;
  background-size: 100%;
  background-repeat: no-repeat;
}

.roate_warp {
  background-color: #ff8400;
  width: 100%;
  height: 230px;
  padding-top: 40px;
  border-radius: 10px;
  transform: rotateY(0);
  transition: transform .5s ease-in-out 0s;
}

.roate_txt {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #ff8400;
  border-radius: 10px;
  color: #ffec81;
  transform: rotateY(90deg);
  transition: transform .5s ease-in-out 0s;
}

.roate_txt p {
  padding: 40px 25px 0 25px;
  line-height: 24px;
}

/*.roate_list.active {
  perspective: 1000px;
}*/

/*.roate_warp.active {
  transform: rotateY(-90deg);
}*/

.roate_txt.active {
  transform: rotateY(0);
}

.title3 {
  width: 480px;
  height: 104px;
  margin: 0 auto;
  padding-left: 58px;
  background-image: url(../images/title3.png);
  background-repeat: no-repeat;
  background-size: 100%;
  line-height: 123px;
  text-align: center;
  font-weight: bold;
  font-size: 35px;
  color: #fff;
}

.title3_txt {
  margin-top: 30px;
  margin-bottom: 10px;
  text-align: center;
  color: #fff;
  font-size: 20px;
}

.color {
  color: #fff6c5;
}

.title3_show {
  position: relative;
  width: 105px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 20px;
  background-color: #fff6c5;
  color: #9c55b5;
}

.little_circle {
  position: absolute;
  top: 17px;
  width: 4px;
  height: 4px;
  border-radius: 100%;
  background-color: #9c55b5;
}

.pl {
  left: 8px;
}

.pr {
  right: 8px;
}

.line {
  width: 14px;
  margin-top: 18px;
  border: 1px solid #844df1;
}

.title3_warp {
  width: 468px;
  margin: 0 auto;
}

.list_circle {
  position: relative;
  width: 150px;
  height: 150px;
  border-radius: 100%;
  overflow: hidden;
  margin-right: 20px;
  margin-bottom: 20px;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  transition:2.5s transform ease;
}
.list_circle:hover{
  transform:scale3d(1.1,1.1,1.1);
}
.list_circle a {
  display: block;
}

.list_circle img {
  width: 150px;
  height: 150px;
  border-radius: 100%;
}
.list_circle p {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 150px;
  height: 45px;
  line-height: 45px;
  text-align: center;
  background-color: rgba(0, 0, 0, .5);
  color: #fff;
}

.list3_main {
  width: 660px;
  margin: 40px auto 0 auto;
}

.list3_main li:nth-child(4), .list3_main li:nth-child(8) {
  margin-right: 0;
}

.title4 {
  position: relative;
  width: 864px;
  height: 120px;
  margin: 0 auto;
  background-image: url(imagestitle4.png);
  background-repeat: no-repeat;
  background-size: 100%;
  line-height: 160px;
  font-weight: bold;
  font-size: 35px;
  color: #fff;
}

.title4 p {
  position: absolute;
  left: 360px;
  top: 0;
}

.title4_list {
  width: 960px;
  margin: 35px auto 0 auto;
}

.title4_list li {
  width: 150px;
  height: 40px;
  margin-right: 10px;
  margin-bottom: 10px;
  line-height: 40px;
  background-color: #fda729;
  text-align: center;
  color: #fff;
  cursor: pointer;
  transition: .8s background ease;
}

.title4_list li:hover {
  background-color: #ff8400;
}

.title4_list a {
  color: #fff;
}

.person_warp {
  width: 950px;
  margin: 0 auto;
  text-align: center;
}

.person_txt {
  color: #66461d;
}

.person_txt p, .person_text p {
  width: 135px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.person_txt:last-child p {
  width: 100px;
}

.person_txt:nth-child(1) {
  margin-left: -12px;
  margin-right: 148px;
}

.person_txt:nth-child(2) {
  margin-right: 145px;
}

.person_txt:nth-child(3) {
  margin-right: 162px;
}

.person_txt:last-child {
  margin-right: 0;
}

.person_circle {
  width: 950px;
  margin: 35px auto 0 auto;
  padding-bottom: 30px;
}

.person_circle>a {
  position: relative;
  width: 96px;
  height: 96px;
  margin-right: 44px;
  border-radius: 100%;
  line-height: 96px;
  color: #fff;
  font-size: 20px;
  text-align: center;
}

.person_circle>a:nth-child(1) {
  margin-left: 5px;
  background-color: #fd89b4;
}

.person_circle>a:nth-child(2) {
  background-color: #f89f59;
}

.person_circle>a:nth-child(3) {
  background-color: #2b6b7a;
}

.person_circle>a:nth-child(4) {
  background-color: #fa5b5d;
}

.person_circle>a:nth-child(5) {
  background-color: #37a8b9;
}

.person_circle>a:nth-child(6) {
  background-color: #983cdf;
}

.person_circle>a:nth-child(7) {
  background-color: #9ec526;
  margin-right: 0;
}

.person_icon1 {
  position: absolute;
  top: -35px;
  left: -26px;
  width: 100px;
  height: 100px;
  background-image: url(../images/line1.png);
  background-repeat: no-repeat;
}

.person_icon2 {
  position: absolute;
  top: 48px;
  left: 42px;
  width: 150px;
  height: 85px;
  background-image: url(../images/line2.png);
  background-repeat: no-repeat;
}

.person_icon3 {
  position: absolute;
  top: -30px;
  left: -77px;
  width: 150px;
  height: 75px;
  background-image: url(../images/line3.png);
  background-repeat: no-repeat;
}

.person_icon4 {
  position: absolute;
  top: 48px;
  left: 45px;
  width: 150px;
  height: 85px;
  background-image: url(../images/line4.png);
  background-repeat: no-repeat;
}

.person_icon5 {
  position: absolute;
  top: -36px;
  left: -95px;
  width: 150px;
  height: 85px;
  background-image: url(../images/line5.png);
  background-repeat: no-repeat;
}

.person_icon6 {
  position: absolute;
  top: 48px;
  left: 45px;
  width: 150px;
  height: 85px;
  background-image: url(../images/line6.png);
  background-repeat: no-repeat;
}

.person_icon7 {
  position: absolute;
  top: -32px;
  left: -90px;
  width: 150px;
  height: 85px;
  background-image: url(../images/line7.png);
  background-repeat: no-repeat;
}

.person_icon8 {
  position: absolute;
  top: 44px;
  right: -58px;
  width: 100px;
  height: 100px;
  background-image: url(../images/line8.png);
  background-repeat: no-repeat;
}

.person_text {
  text-align: center;
  padding-bottom: 38px;
  margin-top: 10px;
  color: #66461d;
}

.person_text:nth-child(1) {
  margin-left: 152px;
  margin-right: 145px;
}

.person_text:nth-child(2) {
  margin-right: 145px;
}

.person_text:last-child {
  margin-right: 0;
}

.mob_header, .mob_list {
  display: none;
}

@media screen and (max-width: 1080px) {
table{width:100%}

#doyoo_panel{display:none}
  .person_text, .person_circle, .person_warp, .little_circle, .line, .ht_top, .footer, .person_icon1, .person_icon2, .person_icon3, .person_icon4, .person_icon5, .person_icon6, .person_icon7, .person_icon8 {
    display: none;
  }
  .fl, .fr {
    float: none;
  }
  html {
    font-size: 20px;
  }
  .mob_header {
    display: block;
    width: 100%;
    height: 1.5rem;
    line-height: 1.5rem;
    padding: .3rem 0;
    background-color: #f5f5f5;
    border-bottom: 1px solid #ccc;
    font-size: .65rem;
  }
  .logo {
    float: left;
    width: 6rem;
    height: 1.5rem;
    margin-left: .5rem;
    background-image: url(www.huatu.comimages2015cssimagesmob_logo.pngv=1);
    background-repeat: no-repeat;
    background-size: 100%;
    text-indent: -999em;
  }
  .mob_header a:nth-child(2) {
    float: right;
    margin-right: .5rem;
  }
  .m-footer {
    display: block;
    color: #fff;
    text-align: center;
    font-size: 0.6rem;
    line-height: 2rem;
    background-color: #333;
  }
  .banner {
    width: 16rem;
    height: 9rem;
    padding: 0;
    background-image: url(imagesmob_banner.jpg);
    background-size: 100%;
    background-color: #108fee;
  }
  .warp {
    width: 16rem;
	
  }
  .title_warp {
    padding-top: .8rem;
  }
  .title {
    width: 10rem;
    height: 2.1rem;
    line-height: 2.1rem;
    padding-left: 4rem;
    margin: 0 auto;
    font-size: .9rem;
  }
  .main_bg {
    width: 14rem;
    height: 11.2rem;
    background-size: 100%;
    margin: 0 auto;
  }
  .person {
    width: 14rem;
    height: 9.8rem;
    margin: 1rem auto;
    background-size: 100%;
  }
  .person>p {
    width: 7rem;
    padding-top: 1.5rem;
    margin-top: 0;
    margin-left: 6.5rem;
    font-size: .6rem;
  }
  .title1 {
    width: 15rem;
    height: 3.5rem;
    line-height: 3.5rem;
    font-size: .8rem;
  }
  .title1 p {
    left: 5rem;
  }
  .list>h5 {
    margin-bottom: .45rem;
    font-size: .9rem;
  }
  .list_title, .list_val {
    width: 15.9rem;
    margin: 0 auto;
  }
  .list_title>div, .list_val>div {
    float: left;
    width: 2.6rem;
    height: 2rem;
    line-height: 2rem;
    font-size: .55rem;
  }
  .list_val>div {
    height: 2rem !important;
    padding: 2rem 0;
    line-height: inherit;
  }
  .list_val>div.subject, .list_val>div.teacher {
    padding: 2rem 0;
  }
  select {
    width: 2.4rem;
    height: 1rem;
    line-height: 1rem;
    margin: 0 auto;
  }
  .animate_warp {
    padding-top: 1.5rem;
  }
  .animate {
    position: relative;
    width: 15rem;
    height: 3.2rem;
    margin: 1.2rem auto 0 auto;
  }
  .animate_title {
    width: 6.5rem;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: .5rem;
    margin: -1.2rem auto 0 auto;
  }
  .animate_title i {
    display: block;
    width: 6.5rem;
    height: 1.5rem;
    background-size: 100%;
  }
  .animate_txt {
    margin-top: .75rem;
    margin-left: .8rem;
    font-size: .6rem;
  }
  .roate_cricle {
    margin-top: 1.5rem;
  }
  .roate_title {
    margin-bottom: .5rem;
    font-size: .85rem;
  }
  .roate_list {
    perspective: 500rem;
    width: 12.5rem;
    height: 10rem;
    margin: 0 auto 1rem auto;
    font-size: .7rem;
  }
  .roate_warp {
    width: 100%;
    height: 8rem;
    padding-top: 2rem;
  }
  .roate_txt p {
    padding: 1.2rem .8rem 0 .8rem;
    line-height: inherit;
  }
  .circle {
    width: 4rem;
    height: 4rem;
  }
  .pc {
    width: 2.3rem;
    height: 1.9rem;
    top: 1.2rem;
    left: .9rem;
  }
  .code {
    top: 1.1rem;
    left: 1.3rem;
    width: 1.5rem;
    height: 2rem;
  }
  .lock {
    width: 2.35rem;
    height: 2.25rem;
    top: .9rem;
    left: .9rem;
  }
  .beats {
    width: 2rem;
    height: 2rem;
    left: 1rem;
    top: 1.2rem;
  }
  .roate_list:last-child {
    margin: auto;
  }
  .title3 {
    width: 11.8rem;
    height: 3rem;
    padding-left: 2.2rem;
    line-height: 3.2rem;
    font-size: 1rem
  }
  .title3_txt {
    margin-top: 1rem;
    margin-bottom: .5rem;
    font-size: .8rem;
  }
  .title3_warp {
    width: 15rem;
    margin: 0 auto;
    font-size: .7rem;
  }
  .title3_show {
    float: left;
    width: 7rem;
    height: 1.5rem;
    line-height: 1.5rem;
    margin-right: .5rem;
    margin-bottom: .5rem;
  }
  .list3_main {
    width: 16rem;
    margin-top: 1rem;
  }
  .list_circle {
    float: left;
    width: 6.5rem;
    height: 6.5rem;
    margin: 0 0 1rem 1rem;
    font-size: .55rem;
  }
  .list_circle img {
    width: 6.5rem;
    height: 6.5rem;
  }
  .list_circle p {
    width: 6.5rem;
    height: 2rem;
    line-height: 2rem;
  }
  .title4 {
    width: 16rem;
    height: 2rem;
    line-height: 3rem;
    font-size: .55rem;
  }
  .title4 p {
    left: 6rem;
  }
  .title4_list {
    width: 15rem;
    margin-top: 1rem;
  }
  .title4_list li {
    float: left;
    width: 7rem;
    height: 1.5rem;
    line-height: 1.5rem;
    margin-right: .5rem;
    margin-bottom: .5rem;
    font-size: .6rem;
  }
  .mob_list {
    display: block;
    width: 15rem;
    margin: 1rem auto 0 auto;
  }
  .mob_list li {
    float: left;
    width: 4.7rem;
    margin-right: .3rem;
    margin-bottom: .3rem;
    text-align: center;
    font-size: .6rem;
    color: #66461d;
  }
  .mob_circle {
	display: block;
    width: 3rem;
    height: 3rem;
    margin: .3rem auto 0 auto;
    border-radius: 100%;
    color: #fff;
    line-height: 3rem;
    text-align: center;
  }
  .mob_circle1 {
    background-color: #fd89b4;
  }
  .mob_circle2 {
    background-color: #f89f59;
  }
  .mob_circle3 {
    background-color: #2b6b7a;
  }
  .mob_circle4 {
    background-color: #fa5b5d;
  }
  .mob_circle5 {
    background-color: #37a8b9;
  }
  .mob_circle6 {
    background-color: #983cdf;
  }
  .mob_circle7 {
    background-color: #9ec526;
  }
}