* {
  margin: 0;
  padding: 0;
  list-style: none;
  box-sizing: border-box;
}
.changecolor {
  color: #FFFF62 !important;
  font-size: 18px !important;
}
.display {
  display: none !important;
}
.page {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.page .top {
  width: 100%;
  height: 83px;
  text-align: center;
  background: url("../img/top.png");
  background-size: 100% 100%;
  position: relative;
}
.page .top .typeuu {
  width: auto;
  height: 40px;
  display: inline-block;
  margin-top: 40px;
}
.page .top .typeuu li {
  width: 100px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  margin: 0 10px;
  cursor: pointer;
  float: left;
  color: #fff;
  font-size: 16px;
}
.page .top .cart,
.page .top .login {
  position: absolute;
  /* width: 80px; */
  height: 30px;
  line-height: 30px;
  background: url("../img/cart.png");
  background-size: 30px 30px;
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 22px;
  color: #cdc3ca;
  top: 30px;
  right: 18px;
  font-size: 14px;
  cursor: pointer;
}
.page .top .login {
  background: url("../img/login.png");
  background-size: 30px 30px;
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 32px;
  top: 30px;
  right: 98px;
}
.page .top .login a{ 
	color:#cdc3ca;
	text-decoration: none;
}
.page .top .login a:hover{ 
	color:#f90;
}
.page .bottom1 {
  width: 100%;
}
.page .bottom1 .banner1 {
  width: 100%;
  height: 292px;
  background: url("../img/1-1.jpg");
  background-size: 100% 100%;
}
.page .bottom1 .banner2 {
  width: 1024px;
  height: 303px;
  background: url("../img/1-2.png");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom1 .banner3 {
  width: 1024px;
  height: 292px;
  background: url("../img/1-3.png");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom1 .banner4 {
  width: 1024px;
  height: 316px;
  background: url("../img/1-4.png");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom1 .banner5 {
  width: 1024px;
  height: 279px;
  background: url("../img/1-5.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom2 {
  width: 100%;
}
.page .bottom2 .banner1 {
  width: 100%;
  height: 346px;
  background: url("../img/2-1.jpg");
  background-size: 100% 100%;
}
.page .bottom2 .banner2 {
  width: 1024px;
  height: 335px;
  background: url("../img/2-2.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom2 .experience {
  width: 100%;
  height: 43px;
  line-height: 43px;
}
.page .bottom2 .experience .buttonti {
  width: 184px;
  height: inherit;
  line-height: 43px;
  text-align: center;
  margin: 0 auto;
  background-color: #33BBBB;
  border-radius: 30px;
  font-size: 20px;
  cursor: pointer;
  color: #fff;
}
.page .bottom2 .banner3 {
  width: 1024px;
  height: 841px;
  background: url("../img/2-3.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom2 .banner4 {
  width: 1024px;
  height: 467px;
  background: url("../img/2-4.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom3 {
  width: 100%;
}
.page .bottom3 .banner1 {
  width: 100%;
  height: 346px;
  background: url("../img/3-1.jpg");
  background-size: 100% 100%;
}
.page .bottom3 .banner2 {
  width: 1024px;
  height: 624px;
  background: url("../img/3-2.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom3 .banner3 {
  width: 1024px;
  height: 533px;
  background: url("../img/3-3.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom3 .banner4 {
  width: 1024px;
  height: 414px;
  background: url("../img/3-4.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom3 .banner5 {
  width: 1024px;
  height: 297px;
  margin: 0 auto;
  background-color: #fff;
  position: relative;
}
.page .bottom3 .banner5 .left {
  float: left;
  width: 498px;
  height: 297px;
  background: url("../img/3-5l.jpg");
  background-size: 100% 100%;
}
.page .bottom3 .banner5 .right {
  float: left;
  width: 526px;
  height: 297px;
  background: url("../img/3-5r.jpg");
  background-size: 100% 100%;
}
.page .bottom3 .banner5 .hiddendiv {
  position: absolute;
  left: 518px;
  top: 44px;
  width: 418px;
  height: 242px;
  z-index: 10;
  background-color: #fff;
  box-shadow: 5px 5px 8px 1px #ccc;
  text-align: center;
}
.page .bottom3 .banner5 .hiddendiv .mabox {
  display: inline-block;
  overflow: hidden;
}
.page .bottom3 .banner5 .hiddendiv .mabox .erweima1,
.page .bottom3 .banner5 .hiddendiv .mabox .erweima2 {
  height: 100%;
  width: 120px;
  float: left;
}
.page .bottom3 .banner5 .hiddendiv .mabox .erweima1 .ma,
.page .bottom3 .banner5 .hiddendiv .mabox .erweima2 .ma {
  width: 130px;
  height: 130px;
  background: url("../img/panda-word-ios.png");
  background-size: 100% 100%;
  margin-top: 40px;
}
.page .bottom3 .banner5 .hiddendiv .mabox .erweima1 .zi,
.page .bottom3 .banner5 .hiddendiv .mabox .erweima2 .zi {
  width: 130px;
  height: 30px;
  line-height: 30px;
  font-size: 14px;
  margin-top: 20px;
}
.page .bottom3 .banner5 .hiddendiv .mabox .erweima1 {
  margin-right: 40px;
}
.page .bottom3 .banner5 .hiddendiv .mabox .erweima1 .ma {
  background: url("../img/panda-word-apk.png");
  background-size: 100% 100%;
}
.page .bottom3 .kong1 {
  width: 1024px;
  height: 47px;
  margin: 0 auto;
  background-color: #fff;
}
.page .bottom3 .banner6 {
  width: 1024px;
  height: 254px;
  margin: 0 auto;
  background-color: #fff;
  position: relative;
}
.page .bottom3 .banner6 .left {
  float: left;
  width: 498px;
  height: 254px;
  background: url("../img/3-6l.jpg");
  background-size: 100% 100%;
}
.page .bottom3 .banner6 .right {
  float: left;
  width: 526px;
  height: 254px;
  background: url("../img/3-6r.jpg");
  background-size: 100% 100%;
}
.page .bottom3 .banner6 .hiddendiv {
  position: absolute;
  left: 518px;
  top: 5px;
  width: 418px;
  height: 242px;
  z-index: 10;
  background-color: #fff;
  box-shadow: 5px 5px 8px 1px #ccc;
  text-align: center;
}
.page .bottom3 .banner6 .hiddendiv .mabox {
  display: inline-block;
  overflow: hidden;
}
.page .bottom3 .banner6 .hiddendiv .mabox .erweima1,
.page .bottom3 .banner6 .hiddendiv .mabox .erweima2 {
  height: 100%;
  width: 120px;
  float: left;
}
.page .bottom3 .banner6 .hiddendiv .mabox .erweima1 .ma,
.page .bottom3 .banner6 .hiddendiv .mabox .erweima2 .ma {
  width: 130px;
  height: 130px;
  background: url("../img/hanzi-hsk-ios.png");
  background-size: 100% 100%;
  margin-top: 40px;
}
.page .bottom3 .banner6 .hiddendiv .mabox .erweima1 .zi,
.page .bottom3 .banner6 .hiddendiv .mabox .erweima2 .zi {
  width: 130px;
  height: 30px;
  line-height: 30px;
  font-size: 14px;
  margin-top: 20px;
}
.page .bottom3 .banner6 .hiddendiv .mabox .erweima1 {
  margin-right: 40px;
}
.page .bottom3 .banner6 .hiddendiv .mabox .erweima1 .ma {
  background: url("../img/hanzi-hsk-apk.png");
  background-size: 100% 100%;
}
.page .bottom3 .kong2 {
  width: 1024px;
  height: 37px;
  margin: 0 auto;
  background-color: #fff;
}
.page .bottom3 .banner7 {
  width: 1024px;
  height: 306px;
  margin: 0 auto;
  background-color: #fff;
  position: relative;
}
.page .bottom3 .banner7 .left {
  float: left;
  width: 498px;
  height: 306px;
  background: url("../img/3-7l.jpg");
  background-size: 100% 100%;
}
.page .bottom3 .banner7 .right {
  float: left;
  width: 526px;
  height: 306px;
  background: url("../img/3-7r.jpg");
  background-size: 100% 100%;
}
.page .bottom3 .banner7 .hiddendiv {
  position: absolute;
  left: 518px;
  top: 5px;
  width: 418px;
  height: 290px;
  z-index: 10;
  background-color: #fff;
  box-shadow: 5px 5px 8px 1px #ccc;
  text-align: center;
}
.page .bottom3 .banner7 .hiddendiv .mabox {
  display: inline-block;
  overflow: hidden;
}
.page .bottom3 .banner7 .hiddendiv .mabox .erweima1,
.page .bottom3 .banner7 .hiddendiv .mabox .erweima2 {
  height: 100%;
  width: 120px;
  float: left;
}
.page .bottom3 .banner7 .hiddendiv .mabox .erweima1 .ma,
.page .bottom3 .banner7 .hiddendiv .mabox .erweima2 .ma {
  width: 130px;
  height: 130px;
  background: url("../img/panda-read-ios.png");
  background-size: 100% 100%;
  margin-top: 60px;
}
.page .bottom3 .banner7 .hiddendiv .mabox .erweima1 .zi,
.page .bottom3 .banner7 .hiddendiv .mabox .erweima2 .zi {
  width: 130px;
  height: 30px;
  line-height: 30px;
  font-size: 14px;
  margin-top: 20px;
}
.page .bottom3 .banner7 .hiddendiv .mabox .erweima1 {
  margin-right: 40px;
}
.page .bottom3 .banner7 .hiddendiv .mabox .erweima1 .ma {
  background: url("../img/panda-read-apk.png");
  background-size: 100% 100%;
}
.page .bottom3 .kong1 {
  width: 1024px;
  height: 47px;
  margin: 0 auto;
  background-color: #fff;
}
.page .bottom3 .banner8 {
  width: 1024px;
  height: 266px;
  margin: 0 auto;
  background-color: #fff;
  position: relative;
}
.page .bottom3 .banner8 .left {
  float: left;
  width: 498px;
  height: 266px;
  background: url("../img/3-8l.jpg");
  background-size: 100% 100%;
}
.page .bottom3 .banner8 .right {
  float: left;
  width: 526px;
  height: 266px;
  background: url("../img/3-8r.jpg");
  background-size: 100% 100%;
}
.page .bottom3 .kong3 {
  width: 1024px;
  height: 44px;
  margin: 0 auto;
  background-color: #fff;
}
.page .bottom3 .banner9 {
  width: 1024px;
  height: 254px;
  margin: 0 auto;
  background-color: #fff;
  position: relative;
}
.page .bottom3 .banner9 .left {
  float: left;
  width: 498px;
  height: 254px;
  background: url("../img/3-9l.jpg");
  background-size: 100% 100%;
}
.page .bottom3 .banner9 .right {
  float: left;
  width: 526px;
  height: 254px;
  background: url("../img/3-9r.jpg");
  background-size: 100% 100%;
}
.page .bottom3 .banner9 .hiddendiv {
  position: absolute;
  left: 518px;
  top: 5px;
  width: 412px;
  height: 242px;
  z-index: 10;
  background-color: #fff;
  box-shadow: 5px 5px 8px 1px #ccc;
  text-align: center;
}
.page .bottom3 .banner9 .hiddendiv .mabox {
  display: inline-block;
  overflow: hidden;
}
.page .bottom3 .banner9 .hiddendiv .mabox .erweima1,
.page .bottom3 .banner9 .hiddendiv .mabox .erweima2 {
  height: 100%;
  width: 120px;
  float: left;
}
.page .bottom3 .banner9 .hiddendiv .mabox .erweima1 .ma,
.page .bottom3 .banner9 .hiddendiv .mabox .erweima2 .ma {
  width: 130px;
  height: 130px;
  background: url("../img/cchy-ios.png");
  background-size: 100% 100%;
  margin-top: 40px;
}
.page .bottom3 .banner9 .hiddendiv .mabox .erweima1 .zi,
.page .bottom3 .banner9 .hiddendiv .mabox .erweima2 .zi {
  width: 130px;
  height: 30px;
  line-height: 30px;
  font-size: 14px;
  margin-top: 20px;
}
.page .bottom3 .banner9 .hiddendiv .mabox .erweima1 {
  margin-right: 40px;
}
.page .bottom3 .banner9 .hiddendiv .mabox .erweima1 .ma {
  background: url("../img/cchy-apk.png");
  background-size: 100% 100%;
}
.page .bottom3 .kong4 {
  width: 1024px;
  height: 72px;
  margin: 0 auto;
  background-color: #fff;
}
.page .bottom4 {
  width: 100%;
}
.page .bottom4 .banner1 {
  width: 100%;
  height: 346px;
  background: url("../img/4-1.jpg");
  background-size: 100% 100%;
}
.page .bottom4 .banner2 {
  width: 1024px;
  height: 571px;
  background: url("../img/4-2.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom4 .experience {
  width: 1024px;
  height: 43px;
  line-height: 43px;
  background-color: #E8E8E8;
  margin: 0 auto;
}
.page .bottom4 .experience .buttonti {
  width: 184px;
  height: inherit;
  line-height: 43px;
  text-align: center;
  margin: 0 auto;
  background-color: #33BBBB;
  border-radius: 30px;
  font-size: 20px;
  cursor: pointer;
  color: #fff;
}
.page .bottom4 .experience1 {
  background-color: #fff;
}
.page .bottom4 .banner3 {
  width: 1024px;
  height: 653px;
  background: url("../img/4-3.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom4 .banner4 {
  width: 1024px;
  height: 162px;
  background-color: #E8E8E8;
  margin: 0 auto;
}
.page .bottom5 {
  width: 100%;
}
.page .bottom5 .banner1 {
  width: 100%;
  height: 347px;
  background: url("../img/5-1.jpg");
  background-size: 100% 100%;
}
.page .bottom5 .banner2 {
  width: 1024px;
  height: 727px;
  background: url("../img/5-2.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom5 .banner3 {
  width: 1024px;
  height: 558px;
  background: url("../img/5-3.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom5 .banner4 {
  width: 1024px;
  height: 476px;
  background: url("../img/5-4.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom5 .banner5 {
  width: 1024px;
  height: 768px;
  background: url("../img/5-5.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom5 .banner6 {
  width: 1024px;
  height: 614px;
  background: url("../img/5-6.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom5 .banner7 {
  width: 1024px;
  height: 538px;
  background: url("../img/5-7.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .copyright {
  width: 100%;
  height: 58px;
  background-color: #2E2E2E;
  padding-top: 10px;
}
.page .copyright p {
  width: 100%;
  height: 20px;
  line-height: 20px;
  font-size: 14px;
  text-align: center;
  color: #676767;
  margin: 0;
}

.page .bottom6 .banner1 {
  width: 100%;
  height: 346px;
  background: url("../img/6-1.jpg");
  background-size: 100% 100%;
}
.page .bottom6 .banner2 {
  width: 1024px;
  height: 572px;
  background: url("../img/6-2.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom6 .banner3 {
  width: 1024px;
  height: 420px;
  background: url("../img/6-3.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
}
.page .bottom6 .banner4 {
  width: 1024px;
  height: 577px;
  background: url("../img/6-4.jpg");
  background-size: 100% 100%;
  margin: 0 auto;
  position: relative;
}
.page .bottom6 .banner4 .experience {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 43px;
  line-height: 43px;
}
.page .bottom6 .banner4 .experience .buttonti {
  width: 184px;
  height: inherit;
  line-height: 43px;
  text-align: center;
  margin: 0 auto;
  background-color: #33BBBB;
  border-radius: 30px;
  font-size: 20px;
  cursor: pointer;
  color: #fff;
}