@charset "utf-8";
/* CSS Document */
body,
ul,
p,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
  font-weight: normal;
}
body {
  padding-bottom: 2.7733rem;
}
html {
  font-size: 62.5%;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
  margin: 0;
  padding: 0;
}
address,
caption,
cite,
code,
dfn,
th,
var {
  font-style: normal;
  font-weight: normal;
}
img {
  vertical-align: top;
  border: none;
}
body {
  font-family: "PingFangSC-Regular", Tahoma, Arial, "Microsoft YaHei", "Roboto",
    "Droid Sans", "Helvetica Neue", "Droid Sans Fallback", "Heiti SC",
    "sans-self" !important;
}
li {
  list-style: none;
}
em,
i {
  font-style: normal;
}
a {
  text-decoration: none;
}
* {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  /* For some Androids ios*/
}
.base {
  overflow-x: hidden;
}
.clear {
  zoom: 1;
}
.clear:after {
  content: "";
  display: block;
  clear: both;
}
.box {
  width: 92%;
  margin: 0 auto;
}
.banner {
  position: relative;
  overflow: hidden;
}
.banner .swiper-container1 {
  width: 100%;
  height: 5.3333rem;
}
.banner .swiper-container1 .swiper-slide {
  width: 100%;
  height: 5.3333rem;
  background-position: center;
  background-size: cover;
}
.banner .swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 1.3rem !important;
}
.banner .swiper-pagination-bullet {
  width: 0.6133rem;
  height: 0.0667rem;
  background-color: #ffffff;
  border-radius: 0.04rem;
  opacity: 0.4;
}
.banner .swiper-pagination-bullet-active {
  opacity: 1;
}
.tit {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-top: 0.6667rem;
}
.tit a {
  font-family: PingFangSC-Regular;
  font-size: 0.2933rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 0px;
  color: #666666;
}
.tit a.fw {
  display: flex;
  align-items: center;
  font-family: PingFangSC-Semibold;
  font-size: 0.4533rem;
  line-height: 1;
  color: #000000;
}
.tit a.fw .javafont {
  width: 0.76rem;
  height: 0.76rem;
  line-height: 0.76rem;
  border-radius: 0.2667rem;
  font-size: 0.4533rem;
  color: #fff;
  margin-right: 0.2133rem;
  text-align: center;
}
.tit a.fw .javafont.java-shichang {
  background: #326cf6 url(//wap.mobiletrain.org/java/img/tit_icon.png)
    no-repeat;
  background-size: 0.76rem 0.4267rem;
  background-position: center bottom;
}
.tit a.fw .javafont.java-youshi1 {
  background: #19bc00 url(//wap.mobiletrain.org/java/img/tit_icon.png)
    no-repeat;
  background-size: 0.76rem 0.4267rem;
  background-position: center bottom;
}
.tit a.fw .javafont.java-renqun_renqun {
  background: #ff5400 url(//wap.mobiletrain.org/java/img/tit_icon.png)
    no-repeat;
  background-size: 0.76rem 0.4267rem;
  background-position: center bottom;
}
.tit a.fw .javafont.java-xiangmu {
  background: #7b00c1 url(//wap.mobiletrain.org/java/img/tit_icon.png)
    no-repeat;
  background-size: 0.76rem 0.4267rem;
  background-position: center bottom;
}
.tit a.fw .javafont.java-mingshijigou {
  background: #ff8d00 url(//wap.mobiletrain.org/java/img/tit_icon.png)
    no-repeat;
  background-size: 0.76rem 0.4267rem;
  background-position: center bottom;
}
.tit a.fw .javafont.java-shizituandui {
  background: #326cf6 url(//wap.mobiletrain.org/java/img/tit_icon.png)
    no-repeat;
  background-size: 0.76rem 0.4267rem;
  background-position: center bottom;
}
.tit a.fw .javafont.java-zixun-1 {
  background: #326cf6 url(//wap.mobiletrain.org/java/img/tit_icon.png)
    no-repeat;
  background-size: 0.76rem 0.4267rem;
  background-position: center bottom;
}
.tit a.fw .javafont.java-l-lresource {
  background: #19bc00 url(//wap.mobiletrain.org/java/img/tit_icon.png)
    no-repeat;
  background-size: 0.76rem 0.4267rem;
  background-position: center bottom;
}
.tit a.fw .javafont.java-wenti {
  background: #7b00c1 url(//wap.mobiletrain.org/java/img/tit_icon.png)
    no-repeat;
  background-size: 0.76rem 0.4267rem;
  background-position: center bottom;
}
.c1 .c1-con {
  position: relative;
  height: 7.3067rem;
  background-color: #ffffff;
  box-shadow: 0rem 0rem 0.2667rem 0rem rgba(50, 108, 246, 0.2);
  border-radius: 0.2667rem;
  margin-top: -1.0133rem;
  padding-top: 1.0667rem;
  z-index: 1;
}
.c1 .c1-con .c1-tit {
  text-align: center;
}
.c1 .c1-con .c1-tit span {
  position: relative;
  font-family: PingFangSC-Medium;
  font-size: 0.48rem;
  color: #000000;
  text-align: center;
}
.c1 .c1-con .c1-tit span::before {
  position: absolute;
  top: 50%;
  left: -0.9467rem;
  transform: translateY(-50%);
  content: "";
  width: 0.9467rem;
  height: 0.2933rem;
  background: url(//wap.mobiletrain.org/java/img/c1-before.png) no-repeat;
  background-size: 100%;
}
.c1 .c1-con .c1-tit span::after {
  position: absolute;
  top: 50%;
  right: -0.9467rem;
  transform: translateY(-50%);
  content: "";
  width: 0.9467rem;
  height: 0.2933rem;
  background: url(//wap.mobiletrain.org/java/img/c1-after.png) no-repeat;
  background-size: 100%;
}
.c1 .c1-con .c1-des {
  font-size: 0.32rem;
  color: #000000;
  text-align: center;
  margin-top: 0.0533rem;
}
.c1 .c1-con .c1-lists {
  display: flex;
  flex-wrap: wrap;
}
.c1 .c1-con .c1-lists li {
  margin-top: 0.6067rem;
}
.c1 .c1-con .c1-lists li:nth-child(odd) {
  width: 40%;
  padding-left: 10%;
}
.c1 .c1-con .c1-lists li:nth-child(even) {
  width: 45%;
  padding-left: 5%;
}
.c1 .c1-con .c1-lists li h3 {
  font-size: 0.3733rem;
  color: #000000;
}
.c1 .c1-con .c1-lists li h3 span {
  font-family: PingFangSC-Semibold;
  font-size: 0.5333rem;
}
.c1 .c1-con .c1-lists li h3 span.co1 {
  color: #ff5400;
}
.c1 .c1-con .c1-lists li h3 span.co2 {
  color: #326cf6;
}
.c1 .c1-con .c1-lists li h3 span.co3 {
  color: #7b00c1;
}
.c1 .c1-con .c1-lists li h3 span.co4 {
  color: #19bc00;
}
.c1 .c1-con .c1-lists li h3 span.co5 {
  color: #fbb100;
}
.c1 .c1-con .c1-lists li h3 span.co6 {
  color: #2400ff;
}
.c1 .c1-con .c1-lists li p {
  font-size: 0.32rem;
  color: #666666;
}
.c2-lists {
  display: flex;
  justify-content: space-between;
  margin-top: 0.72rem;
}
.c2-lists div {
  width: 31.3%;
  height: 3.4rem;
  background-color: #ffffff;
  box-shadow: 0rem 0rem 0.2rem 0rem rgba(50, 108, 246, 0.2);
  border-radius: 0.2133rem;
  box-sizing: border-box;
  overflow: hidden;
}
.c2-lists div .javafont {
  position: relative;
  font-size: 0.64rem;
  text-align: center;
  height: 0.64rem;
  margin-bottom: 0.3733rem;
  color: #19bc00;
  margin-top: -0.0367rem;
}
.c2-lists div .javafont span {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  font-size: 0.3467rem;
  line-height: 0.64rem;
  color: #fff;
  font-family: PingFangSC-Semibold;
}
.c2-lists div p {
  font-size: 0.3467rem;
  line-height: 0.5067rem;
  text-align: center;
  color: #000000;
}
.c2-lists div p span {
  font-weight: bold;
}
.c2-lists div:nth-child(2) .javafont {
  color: #ff5400;
}
.c2-lists div:nth-child(3) .javafont {
  color: #7b00c1;
}
.c7 {
  width: 100%;
  background-size: 100% 17.8133rem;
  background-repeat: no-repeat;
  background-position: center bottom;
  padding-bottom: 1.7333rem;
}
.c7 .c7-lists {
  display: flex;
  justify-content: space-between;
  margin: 0.7733rem auto;
}
.c7 .c7-lists .c7-item {
  position: relative;
  width: 31.3%;
  height: 4.4667rem;
  background-color: #ffffff;
  border: solid 1px #bed1ff;
  box-sizing: border-box;
  text-align: center;
}
.c7 .c7-lists .c7-item div {
  position: relative;
  width: 1.1333rem;
  height: 1.1333rem;
  background-color: #326cf6;
  border-radius: 50%;
  margin: 0.4rem auto 0.2667rem auto;
}
.c7 .c7-lists .c7-item div.bg1,
.c7 .c7-lists .c7-item div.bg1::before,
.c7 .c7-lists .c7-item div.bg1::after {
  background-color: #ff5400;
}
.c7 .c7-lists .c7-item div.bg2,
.c7 .c7-lists .c7-item div.bg2::before,
.c7 .c7-lists .c7-item div.bg2::after {
  background-color: #19bc00;
}
.c7 .c7-lists .c7-item div .javafont {
  line-height: 1.1333rem;
  font-size: 0.6267rem;
  color: #fff;
}
.c7 .c7-lists .c7-item div::before {
  content: "";
  position: absolute;
  top: -0.0267rem;
  left: -0.1867rem;
  width: 0.7067rem;
  height: 0.7067rem;
  background-color: #326cf6;
  opacity: 0.1;
  border-radius: 50%;
}
.c7 .c7-lists .c7-item div::after {
  content: "";
  position: absolute;
  bottom: -0.0267rem;
  right: -0.08rem;
  width: 0.3867rem;
  height: 0.3867rem;
  background-color: #326cf6;
  opacity: 0.2;
  border-radius: 50%;
}
.c7 .c7-lists .c7-item h3 {
  font-family: PingFangSC-Semibold;
  font-size: 0.4rem;
  color: #326cf6;
  margin-bottom: 0.2667rem;
}
.c7 .c7-lists .c7-item h3.bg1 {
  color: #ff5400;
}
.c7 .c7-lists .c7-item h3.bg2 {
  color: #19bc00;
}
.c7 .c7-lists .c7-item p {
  font-size: 0.3467rem;
  line-height: 0.5067rem;
  color: #000000;
}
.c7 .c7-lists .c7-item p span {
  font-weight: bold;
}
.c7 .c7-teacher {
  position: relative;
}
.c7 .c7-teacher .swiper-slide {
  height: 5.3733rem;
  background-color: #ffffff;
  box-shadow: 0rem 0.0533rem 0.24rem 0rem rgba(94, 68, 253, 0.18);
  border: solid 0.28rem #ffffff;
  box-sizing: border-box;
  text-align: center;
}
.c7 .c7-teacher .swiper-slide .c7-pic-bg {
  position: relative;
  height: 3.2667rem;
  background: linear-gradient(90deg, #9fa3af, #818392);
  margin: 0 auto;
}
.c7 .c7-teacher .swiper-slide .c7-pic-bg img {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 2.8667rem;
  z-index: 1;
}
.c7 .c7-teacher .swiper-slide h3 {
  font-size: 0.48rem;
  font-weight: bold;
  color: #000000;
  padding-top: 0.2667rem;
}
.c7 .c7-teacher .swiper-slide p {
  font-size: 0.3467rem;
  color: #000000;
}
.c7 .c7-teacher .swiper-pagination {
  width: 100%;
  bottom: -0.9867rem;
}
.c7 .c7-teacher .swiper-pagination-bullet {
  width: 0.7733rem;
  height: 0.1467rem;
  background-color: #ffffff;
  border-radius: 0.08rem;
  opacity: 0.2;
  margin: 0 0.1067rem;
}
.c7 .c7-teacher .swiper-pagination-bullet-active {
  opacity: 1;
}
.c3 .c3-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 2.8rem;
  background: url(//wap.mobiletrain.org/java/img/c3-top.png) no-repeat;
  background-size: cover;
  background-position: center;
  margin-top: 0.5333rem;
}
.c3 .c3-top div {
  color: #fff;
  padding-left: 0.7067rem;
}
.c3 .c3-top div h3 {
  font-family: PingFangSC-Semibold;
  font-size: 0.4667rem;
}
.c3 .c3-top div p {
  font-family: PingFangSC-Semibold;
  font-size: 0.3733rem;
  margin-bottom: 0.1867rem;
}
.c3 .c3-top div span {
  padding: 0.1067rem 0.2667rem;
  font-size: 0.32rem;
  color: #00a77a;
  background: #fff;
  border-radius: 0.2667rem;
}
.c3 .c3-top .java-bofang {
  font-size: 1.12rem;
  color: #fff;
  margin-right: 0.6667rem;
}
.c3 .c3-lists {
  display: flex;
  flex-wrap: wrap;
  background: linear-gradient(115deg, #f1fef7 1%, #f0fcfb 74%, #f6fcff 100%),
    linear-gradient(#ffffff, #ffffff);
  padding-bottom: 0.7733rem;
}
.c3 .c3-lists div {
  width: 50%;
  margin-top: 0.6133rem;
}
.c3 .c3-lists div .java-duihao {
  font-size: 0.5333rem;
  color: #19bc00;
  margin-right: 0.1867rem;
  margin-left: 0.5333rem;
}
.c3 .c3-lists div h3 {
  display: flex;
  align-items: center;
  color: #000000;
  font-family: PingFangSC-Semibold;
  font-size: 0.3733rem;
}
.c3 .c3-lists div p {
  font-size: 0.32rem;
  line-height: 0.5067rem;
  color: #333333;
  padding-left: 1.2733rem;
  margin-top: 0.1333rem;
}
.c4 {
  width: 100%;
  height: 10.8533rem;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.c4 .tit {
  margin-top: 0.4rem;
  padding-top: 0.5067rem;
}
.c4 .tit a {
  color: #ffffff;
}
.c4 .c4-lists {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.c4 .c4-lists .swiper-slide {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.c4 .c4-lists .swiper-pagination {
  top: 8.2667rem;
  width: 100%;
}
.c4 .c4-lists .swiper-pagination-bullet {
  width: 0.7467rem;
  height: 0.12rem;
  background-color: #ffffff;
  border-radius: 0.0667rem;
  opacity: 0.3;
  margin: 0 0.1067rem;
}
.c4 .c4-lists .swiper-pagination-bullet-active {
  opacity: 1;
}
.c4 .c4-lists .c4-con {
  position: relative;
  width: 29.85%;
  height: 1.7067rem;
  background-color: #ffffff;
  border-radius: 0.1333rem;
  margin-top: 0.9333rem;
}
.c4 .c4-lists .c4-con h3 {
  position: absolute;
  top: -0.5rem;
  left: 50%;
  transform: translateX(-50%);
  width: 1.0267rem;
  height: 1.0267rem;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border-radius: 50%;
}
.c4 .c4-lists .c4-con h3 .javafont {
  display: block;
  line-height: 1.0267rem;
  color: #fff;
  font-size: 0.48rem;
  text-align: center;
}
.c4 .c4-lists .c4-con p {
  font-size: 0.3467rem;
  color: #333333;
  padding-top: 0.8rem;
  text-align: center;
}
.c5 {
  background-repeat: no-repeat;
  background-size: 100% 28.6rem;
  background-position: center bottom;
}
.c5 .c5-s-tit {
  position: relative;
  margin-top: 0.8933rem;
  margin-bottom: 0.7733rem;
  height: 0.6133rem;
  background: linear-gradient(
    90deg,
    rgba(118, 0, 255, 0.1) 0%,
    rgba(157, 0, 201, 0.1) 53%,
    rgba(195, 0, 147, 0.1) 76%,
    rgba(218, 0, 159, 0.1) 100%
  );
}
.c5 .c5-s-tit.bg1 {
  background: linear-gradient(
    90deg,
    rgba(50, 108, 246, 0.1) 0%,
    rgba(0, 228, 255, 0.1) 100%
  );
  margin-bottom: 0.8267rem;
}
.c5 .c5-s-tit.bg2 {
  background: linear-gradient(
    90deg,
    rgba(4, 227, 125, 0.1) 0%,
    rgba(2, 234, 255, 0.1) 100%
  );
}
.c5 .c5-s-tit.bg3 {
  background: linear-gradient(
    90deg,
    rgba(255, 126, 0, 0.1) 0%,
    rgba(255, 177, 0, 0.1) 51%,
    rgba(255, 228, 0, 0.1) 100%
  );
}
.c5 .c5-s-tit .c5-s-txt {
  position: absolute;
  top: -0.2667rem;
  width: 3.64rem;
  padding-left: 0.6933rem;
  height: 1.12rem;
  line-height: 1.12rem;
  background: linear-gradient(
      90deg,
      #7600ff 0%,
      #9d00c9 53%,
      #c30093 76%,
      #da009f 100%
    ),
    linear-gradient(#7b00c1, #7b00c1);
  background-blend-mode: normal, normal;
  border-radius: 0.4rem 0rem 0.4rem 0rem;
  font-family: PingFangSC-Semibold;
  font-size: 0.4267rem;
  color: #fff;
}
.c5 .c5-s-tit .c5-s-txt.bg1 {
  background: linear-gradient(90deg, #326cf6 0%, #00e4ff 100%);
}
.c5 .c5-s-tit .c5-s-txt.bg2 {
  width: 5.7333rem;
  background: linear-gradient(90deg, #04e37d 0%, #02eaff 100%);
}
.c5 .c5-s-tit .c5-s-txt.bg3 {
  width: 5.7333rem;
  background: linear-gradient(90deg, #ff7e00 0%, #ffb100 51%, #ffe400 100%);
}
.c5 .c5-s-tit .c5-s-txt span {
  font-size: 0.4rem;
  letter-spacing: 0.04rem;
  opacity: 0.3;
  margin-left: 0.0533rem;
}
.c5 .c5-s-tit .c5-more {
  font-family: PingFangSC-Regular;
  float: right;
  font-size: 0.3733rem;
  color: #000000;
  line-height: 0.6133rem;
}
.c5 .c5-con1 ul {
  display: flex;
  justify-content: space-between;
}
.c5 .c5-con1 ul li {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 29.85%;
  height: 1.84rem;
  border-radius: 0.1333rem;
  border: solid 1px #7b00c1;
  box-sizing: border-box;
}
.c5 .c5-con1 ul li h3 {
  font-family: PingFangSC-Semibold;
  font-size: 0.56rem;
  color: #7b00c1;
}
.c5 .c5-con1 ul li p {
  font-size: 0.3467rem;
  color: #000000;
}
.c5 .c5-con1 .c5-arrow {
  display: block;
  height: 0.6rem;
  margin: 0.2667rem auto;
}
.c5 .c5-con1 .c5-p {
  padding: 0.5067rem 0;
  background: linear-gradient(
    90deg,
    rgba(118, 0, 255, 0.1) 0%,
    rgba(157, 0, 201, 0.1) 53%,
    rgba(195, 0, 147, 0.1) 76%,
    rgba(218, 0, 159, 0.1) 100%
  );
  text-align: center;
  font-size: 0.3467rem;
  color: #000000;
}
.c5 .c5-con2 {
  width: 100%;
  padding-bottom: 0.2667rem;
}
.c5 .c5-con2 .c5-con2-tab {
  display: flex;
  justify-content: space-between;
}
.c5 .c5-con2 .c5-con2-tab span {
  width: 29.27%;
  height: 0.8533rem;
  line-height: 0.8533rem;
  border-radius: 0.4267rem;
  border: solid 1px #326cf6;
  font-size: 0.4rem;
  text-align: center;
  color: #326cf6;
  transition: all 0.5s;
}
.c5 .c5-con2 .c5-con2-tab span.active {
  position: relative;
  background-color: #326cf6;
  font-family: PingFangSC-Semibold;
  color: #fff;
}
.c5 .c5-con2 .c5-con2-tab span.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.4433rem;
  transform: translateX(-50%);
  border: 0.2267rem solid transparent;
  border-top-color: #326cf6;
}
.c5 .c5-con2 ul {
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 0.2667rem;
}
.c5 .c5-con2 ul li {
  width: 48.69%;
  height: 3.5733rem;
  background-color: #ffffff;
  box-shadow: 0rem 0rem 0.1333rem 0rem rgba(50, 108, 246, 0.1);
  border-radius: 0.08rem;
  margin-top: 0.2667rem;
  overflow: hidden;
  box-sizing: border-box;
}
.c5 .c5-con2 ul li img {
  width: 100%;
}
.c5 .c5-con2 ul li p {
  text-align: center;
  font-size: 0.32rem;
  color: #000;
  padding-top: 0.3733rem;
}
.c5 .c5-con3 {
  height: 5.9333rem;
}
.c5 .c5-con3 ul {
  position: relative;
}
.c5 .c5-con3 ul li {
  position: absolute;
  color: #fff;
}
.c5 .c5-con3 ul li:nth-child(1) {
  top: 0.1867rem;
  left: 0;
  width: 4.52rem;
  height: 2.2533rem;
  background-repeat: no-repeat;
  background-size: 4.52rem 2.2533rem;
}
.c5 .c5-con3 ul li:nth-child(2) {
  top: 0;
  right: 0;
  width: 4.5733rem;
  height: 2.28rem;
  background-repeat: no-repeat;
  background-size: 5.16rem 2.28rem;
  padding-left: 0.5867rem;
}
.c5 .c5-con3 ul li:nth-child(3) {
  top: 2.84rem;
  left: 0;
  width: 4.68rem;
  height: 2.7733rem;
  background-repeat: no-repeat;
  background-size: 4.68rem 2.7733rem;
}
.c5 .c5-con3 ul li:nth-child(4) {
  top: 2.7067rem;
  right: 0;
  width: 4.1333rem;
  height: 2.28rem;
  background-repeat: no-repeat;
  background-size: 4.92rem 2.28rem;
  padding-left: 0.7867rem;
}
.c5 .c5-con3 ul li h3 {
  font-family: PingFangSC-Semibold;
  font-size: 0.4rem;
  padding-top: 0.2933rem;
  padding-left: 0.3733rem;
  margin-bottom: 0.1333rem;
}
.c5 .c5-con3 ul li p {
  font-size: 0.32rem;
  padding-left: 0.3733rem;
  line-height: 0.48rem;
}
.c5 .c5-con4 {
  padding-bottom: 0.96rem;
}
.c5 .c5-con4 .c5-con4-des {
  font-family: PingFangSC-Semibold;
  font-size: 0.3467rem;
  line-height: 0.5067rem;
  color: #ffffff;
  text-align: center;
}
.c5 .c5-con4 .c5-con4-label {
  display: flex;
  justify-content: space-between;
  margin-bottom: 0.72rem;
  margin-top: 0.4rem;
}
.c5 .c5-con4 .c5-con4-label span {
  width: 22.75%;
  padding: 0.2133rem 0;
  background-color: #ffffff;
  border-radius: 0.1333rem;
  text-align: center;
  color: #ff7e00;
}
.c5 .c5-con4 .c5-con4-label span:nth-child(2) {
  color: #326cf6;
}
.c5 .c5-con4 .c5-con4-label span:nth-child(3) {
  color: #019974;
}
.c5 .c5-con4 .c5-con4-label span:nth-child(4) {
  color: #7600ff;
}
.c5 .c5-con4 .c5-con4-swiper {
  position: relative;
  height: 10.6933rem;
  background-image: linear-gradient(131deg, #ffffff 0%, #fffcf9 100%),
    linear-gradient(#ffffff, #ffffff);
  background-blend-mode: normal, normal;
  box-shadow: -0.12rem 0.0133rem 0.3467rem 0.0133rem rgba(148, 167, 255, 0.32);
  border-radius: 0.3467rem;
  box-sizing: border-box;
}
.c5 .c5-con4 .c5-con4-swiper .swiper-container {
  height: 10.6933rem;
}
.c5 .c5-con4 .c5-con4-swiper .swiper-container .swiper-pagination-bullets {
  bottom: 0.4333rem;
}
.c5 .c5-con4 .c5-con4-swiper .swiper-container .swiper-pagination-bullet {
  width: 0.7733rem;
  height: 0.1467rem;
  background-color: #326cf6;
  border-radius: 0.08rem;
  opacity: 0.2;
}
.c5
  .c5-con4
  .c5-con4-swiper
  .swiper-container
  .swiper-pagination-bullet-active {
  opacity: 1;
}
.c5 .c5-con4 .c5-con4-swiper::after {
  position: absolute;
  top: -0.2667rem;
  left: 0;
  content: "";
  width: 100%;
  height: 0.5333rem;
  background-color: rgba(255, 255, 255, 0.15);
  border-top-left-radius: 0.3467rem;
  border-top-right-radius: 0.3467rem;
}
.c5 .c5-con4 .c5-con4-swiper .c5-tit-bg {
  display: flex;
  align-items: center;
  width: 8.4rem;
  height: 1.56rem;
  background-repeat: no-repeat;
  background-size: 8.4rem 1.56rem;
  margin-top: 0.6067rem;
  margin-left: 0.4rem;
}
.c5 .c5-con4 .c5-con4-swiper .c5-tit-bg img {
  height: 1rem;
  margin-left: 0.28rem;
}
.c5 .c5-con4 .c5-con4-swiper .c5-tit-bg .c5-pro-name {
  font-family: PingFangSC-Semibold;
  font-size: 0.4533rem;
  font-style: italic;
  color: #ffffff;
  margin-left: 0.36rem;
  margin-right: 0.1067rem;
}
.c5 .c5-con4 .c5-con4-swiper .c5-tit-bg .c5-pro-des {
  font-family: PingFangSC-Regular;
  font-size: 0.3733rem;
  font-style: italic;
  color: #ffffff;
  opacity: 0.2;
}
.c5 .c5-con4 .c5-con4-swiper ul {
  position: relative;
  padding-left: 1.0933rem;
  padding-top: 0.1333rem;
}
.c5 .c5-con4 .c5-con4-swiper ul::before {
  content: "";
  position: absolute;
  top: 0.8267rem;
  left: 0.57rem;
  width: 1px;
  height: 5.1333rem;
  background-color: #326cf6;
}
.c5 .c5-con4 .c5-con4-swiper ul.ah::before {
  height: 5.3333rem;
}
.c5 .c5-con4 .c5-con4-swiper ul li {
  margin-top: 0.4rem;
}
.c5 .c5-con4 .c5-con4-swiper ul li h3 {
  position: relative;
  width: 2.12rem;
  font-size: 0.3733rem;
  color: #326cf6;
  padding: 0.1067rem 0;
  background: rgba(50, 108, 246, 0.2);
  border-radius: 0.1333rem 0rem 0.1333rem 0rem;
  text-align: center;
  margin-bottom: 0.3733rem;
}
.c5 .c5-con4 .c5-con4-swiper ul li h3::before {
  position: absolute;
  top: 50%;
  left: -0.6667rem;
  transform: translateY(-50%);
  content: "";
  width: 0.32rem;
  height: 0.32rem;
  background-color: #326cf6;
  border-radius: 50%;
}
.c5 .c5-con4 .c5-con4-swiper ul li p {
  font-size: 0.32rem;
  color: #000000;
}
.c5 .c5-list {
  display: none;
}
.c5 .c5-list.active {
  display: flex;
}
.c6 ul {
  width: 100%;
  height: 11.5333rem;
  background-size: 100% 11.5333rem;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: 0.5333rem;
}
.c6 ul li {
  display: flex;
  align-items: center;
  color: #fff;
  margin: 0 auto 0.48rem auto;
  height: 2.4rem;
}
.c6 ul li:nth-child(2) {
  width: 94.2%;
}
.c6 ul li:nth-child(3) {
  width: 88.4%;
}
.c6 ul li:nth-child(4) {
  width: 82.6%;
}
.c6 ul li div {
  width: 38.91%;
  line-height: 1;
}
.c6 ul li div span {
  display: block;
  font-size: 0.4533rem;
  width: 1.6133rem;
  height: 0.52rem;
  background-color: #ffffff;
  border-radius: 0.2667rem;
  text-align: center;
  line-height: 0.52rem;
  font-family: PingFangSC-Regular;
  margin-left: 21%;
  color: #ff5400;
  margin-bottom: 0.16rem;
}
.c6 ul li div h3 {
  font-size: 0.4267rem;
  font-family: PingFangSC-Semibold;
  margin-left: 21%;
}
.c6 ul li p {
  white-space: nowrap;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 0.2667rem;
  padding: 0.3733rem;
  font-size: 0.3733rem;
}
.c6 ul li p i {
  font-family: PingFangSC-Semibold;
}
.c8 .c8-tab {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 0.6133rem;
}
.c8 .c8-tab span {
  display: inline-block;
  width: 2.6933rem;
  height: 0.8533rem;
  line-height: 0.8533rem;
  border-radius: 0.4267rem;
  border: solid 1px #326cf6;
  text-align: center;
  font-size: 0.4rem;
  color: #326cf6;
  margin-right: 0.5333rem;
}
.c8 .c8-tab span.active {
  position: relative;
  background-color: #326cf6;
  font-family: PingFangSC-Semibold;
  color: #ffffff;
}
.c8 .c8-tab span.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.4433rem;
  transform: translateX(-50%);
  border: 0.2267rem solid transparent;
  border-top-color: #326cf6;
}
.c8 .c8-tab a {
  font-family: PingFangSC-Regular;
  font-size: 0.3733rem;
  color: #000;
}
.c8 .c8-co {
  display: none;
}
.c8 .c8-co.active {
  display: block;
}
.c8 .c8-con a {
  width: 92%;
  display: flex;
  margin: 0.8rem auto 0 auto;
}
.c8 .c8-con a img {
  width: 2.8rem;
  height: 1.9333rem;
  border-radius: 0.1333rem;
  margin-right: 0.4rem;
}
.c8 .c8-con a div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
}
.c8 .c8-con a div h3 {
  font-family: PingFangSC-Semibold;
  font-size: 0.3733rem;
  color: #333333;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.c8 .c8-con a div p {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.c8 .c8-con a div p i {
  width: 2.6667rem;
  height: 0.6133rem;
  line-height: 0.6133rem;
  text-align: center;
  background-color: #eaf0fe;
  border-radius: 0.3067rem;
  font-size: 0.32rem;
  color: #326cf6;
}
.c8 .c8-con a div p i .java-33-javadaima {
  font-size: 0.3333rem;
  color: #326cf6;
  margin-right: 0.1067rem;
}
.c8 .c8-con a div p span {
  font-family: PingFangSC-Regular;
  font-size: 0.32rem;
  color: #999999;
}
.c8 .c8-con1 {
  padding-top: 0.7467rem;
}
.c8 .c8-con1 a {
  display: block;
  padding: 0.5333rem 0;
}
.c8 .c8-con1 a:nth-child(odd) {
  background-color: rgba(50, 108, 246, 0.03);
}
.c8 .c8-con1 a .box {
  display: flex;
  align-items: center;
}
.c8 .c8-con1 a .java-wenda2 {
  font-size: 0.8533rem;
  color: #326cf6;
  margin-right: 0.4rem;
  margin-left: 0.1333rem;
}
.c8 .c8-con1 a h3 {
  width: 7.56rem;
  font-family: PingFangSC-Semibold;
  font-size: 0.3733rem;
  color: #333333;
  margin-bottom: 0.2133rem;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.c8 .c8-con1 a p {
  width: 7.56rem;
  font-size: 0.32rem;
  color: #333333;
  line-height: 0.4533rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.c9 .c9-more {
  font-family: PingFangSC-Regular;
  font-size: 0.3733rem;
  color: #000000;
}
.c9 .c9-con {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding-top: 0.1333rem;
}
.c9 .c9-con div {
  width: 48.69%;
  margin-top: 0.4rem;
}
.c9 .c9-con div img {
  height: 2.52rem;
  border-radius: 0.1333rem;
  margin-bottom: 0.2667rem;
}
.c9 .c9-con div p {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.c9 .c9-con div p i {
  font-size: 0.32rem;
  color: #666666;
}
.c9 .c9-con div p i .java-renshu {
  font-size: 0.2933rem;
  color: #666666;
  margin-right: 0.08rem;
}
.c9 .c9-con div p .c8-label {
  width: 1.0667rem;
  height: 0.4533rem;
  line-height: 0.4533rem;
  background: #eaf0fe;
  text-align: center;
  font-family: PingFangSC-Semibold;
  font-size: 0.2667rem;
  color: #326cf6;
}
.c9 .c9-con div p .c8-label.senior {
  color: #ff3000;
  background: #ffeae5;
}
.c9 .c9-con div p .c8-label.middle {
  color: #028e70;
  background: #e5f3f0;
}
.c10 {
  width: 100%;
  overflow-x: hidden;
}
.c10 .c10-con {
  position: relative;
  width: 10rem;
  height: 7.16rem;
  background-size: 5.9467rem;
  background-position: center;
  background-repeat: no-repeat;
  margin: 0 auto;
}
.c10 .c10-con .c10-item1 {
  position: absolute;
  top: 2.2rem;
  left: 0.4rem;
  display: flex;
}
.c10 .c10-con .c10-item1 div h3 {
  font-family: PingFangSC-Semibold;
  font-size: 0.4rem;
  color: #326cf6;
}
.c10 .c10-con .c10-item1 div p {
  font-size: 0.4rem;
  color: #000000;
}
.c10 .c10-con .c10-item1 div a {
  display: block;
  width: 2.52rem;
  height: 0.7867rem;
  line-height: 0.7867rem;
  background-color: #326cf6;
  border-radius: 0.3867rem;
  text-align: center;
  font-family: PingFangSC-Semibold;
  font-size: 0.4rem;
  color: #fff;
  margin-top: 0.1333rem;
}
.c10 .c10-con .c10-item1 .java-xinzi {
  display: block;
  width: 1.08rem;
  height: 1.08rem;
  line-height: 1.08rem;
  background-size: 1.08rem;
  background-repeat: no-repeat;
  font-size: 0.68rem;
  text-align: center;
  color: #326cf6;
  margin-top: 0.6667rem;
  margin-left: 0.3467rem;
}
.c10 .c10-con .c10-item2 {
  position: absolute;
  top: 1.4067rem;
  left: 4.9067rem;
  display: flex;
}
.c10 .c10-con .c10-item2 div h3 {
  font-family: PingFangSC-Semibold;
  font-size: 0.4rem;
  color: #7b00c1;
}
.c10 .c10-con .c10-item2 div p {
  font-size: 0.4rem;
  color: #000000;
}
.c10 .c10-con .c10-item2 div a {
  display: block;
  width: 2.52rem;
  height: 0.7867rem;
  line-height: 0.7867rem;
  background-color: #7b00c1;
  border-radius: 0.3867rem;
  text-align: center;
  font-family: PingFangSC-Semibold;
  font-size: 0.4rem;
  color: #fff;
  margin-top: 0.1333rem;
}
.c10 .c10-con .c10-item2 .java-xinshou {
  display: block;
  width: 0.8133rem;
  height: 0.8133rem;
  line-height: 0.8133rem;
  background-size: 0.8133rem;
  background-repeat: no-repeat;
  font-size: 0.5067rem;
  text-align: center;
  color: #7b00c1;
  margin-top: 0.1867rem;
  margin-right: 0.2667rem;
}
.c10 .c10-con .c10-item3 {
  position: absolute;
  top: 4.46rem;
  left: 4.5867rem;
  display: flex;
}
.c10 .c10-con .c10-item3 div h3 {
  font-family: PingFangSC-Semibold;
  font-size: 0.4rem;
  color: #ff5400;
}
.c10 .c10-con .c10-item3 div p {
  font-size: 0.4rem;
  color: #000000;
}
.c10 .c10-con .c10-item3 div a {
  display: block;
  width: 2.52rem;
  height: 0.7867rem;
  line-height: 0.7867rem;
  background-color: #ff5400;
  border-radius: 0.3867rem;
  text-align: center;
  font-family: PingFangSC-Semibold;
  font-size: 0.4rem;
  color: #fff;
  margin-top: 0.1333rem;
}
.c10 .c10-con .c10-item3 .java-heshizengsong {
  display: block;
  width: 0.8133rem;
  height: 0.8133rem;
  line-height: 0.8133rem;
  background-size: 0.8133rem;
  background-repeat: no-repeat;
  font-size: 0.4667rem;
  text-align: center;
  color: #ff5400;
  margin-top: 0.16rem;
  margin-right: 0.2267rem;
}
.c10 .c10-con a {
  animation: mscale 1s infinite;
}
@keyframes mscale {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.9);
  }
  100% {
    transform: scale(1);
  }
}
.video-mask {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(1, 1, 1, 0.7);
  z-index: 9999102;
}
.video-mask .video-box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 8rem;
}
.video-mask .video-box video {
  width: 8rem;
  height: 5rem;
  object-fit: fill;
}
.video-mask .icon-guanbi1 {
  position: absolute;
  top: -0.8rem;
  right: 0;
  font-size: 0.5333rem;
  color: #fff;
}
.nav-mask-con {
  height: auto !important;
}
.java-links {
  display: flex;
  align-items: center;
  height: 1.1467rem;
}
.java-links span {
  width: 25%;
  text-align: center;
  font-family: PingFangSC-Regular;
  font-size: 0.3733rem;
  color: #333333;
}
.java-links span.active {
  position: relative;
  font-family: PingFangSC-Semibold;
  font-size: 0.3733rem;
  color: #326cf6;
}
.java-links span.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.1067rem;
  transform: translateX(-50%);
  width: 1.4667rem;
  height: 0.0667rem;
  background-color: #326cf6;
  border-radius: 0.0267rem;
}
.section {
  display: none;
}
.section.active {
  display: block;
}
.c11-con {
  position: relative;
  padding-top: 0.52rem;
  padding-bottom: 0.8rem;
  background-color: #ffffff;
  box-shadow: 0rem 0rem 0.2667rem 0rem rgba(50, 108, 246, 0.2);
  border-radius: 0.2667rem;
  text-align: center;
  margin-top: -1.0667rem;
  z-index: 1;
}
.c11-con img {
  height: 0.5467rem;
}
.c12 {
  position: relative;
}
.c12::before {
  content: "";
  position: absolute;
  top: -0.7333rem;
  left: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c12::after {
  content: "";
  position: absolute;
  top: -0.7333rem;
  right: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c12 .box {
  position: relative;
  padding-top: 0.8rem;
  padding-bottom: 0.9067rem;
  background-color: #ffffff;
  box-shadow: 0px 0px 0.2667rem 0px rgba(50, 108, 246, 0.2);
  border-radius: 0.2667rem;
  margin: 0.2667rem auto 0 auto;
}
.c12 .box .con-ti {
  height: 1.7733rem;
  margin: 0 -4%;
}
.c12 .box .con-ti img {
  display: block;
  margin: 0 auto;
  height: 1.7733rem;
}
.c12 .box .c12-con {
  width: 94.2%;
  margin: 0 auto;
}
.c12 .box .c12-con .c12-tabs {
  display: flex;
  justify-content: space-between;
  padding: 0 0.4rem;
  margin-top: 0.4rem;
}
.c12 .box .c12-con .c12-tabs span {
  width: 2.3733rem;
  height: 0.72rem;
  line-height: 0.72rem;
  background-image: linear-gradient(
    90deg,
    rgba(0, 95, 253, 0.1) 0%,
    rgba(0, 210, 255, 0.1) 100%
  );
  border-radius: 0.1333rem;
  font-size: 0.3467rem;
  color: #333333;
  text-align: center;
}
.c12 .box .c12-con .c12-tabs span.active {
  position: relative;
  background-image: linear-gradient(90deg, #005ffd 0%, #00d2ff 100%);
  font-weight: bold;
  color: #fff;
}
.c12 .box .c12-con .c12-tabs span.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.4433rem;
  transform: translateX(-50%);
  border: 0.2267rem solid transparent;
  border-top-color: #009afe;
}
.c12 .box .c12-con .c12-lists {
  display: none;
}
.c12 .box .c12-con .c12-lists.active {
  display: block;
}
.c12 .box .c12-con .c12-item {
  display: flex;
  margin-top: 0.5333rem;
}
.c12 .box .c12-con .c12-item div {
  width: 50%;
  padding-left: 0.4rem;
}
.c12 .box .c12-con .c12-item div p {
  font-size: 0.3467rem;
  color: #000000;
  line-height: 0.64rem;
}
.c12 .box .c12-con .c12-item2,
.c12 .box .c12-con .c12-item3 {
  padding: 0.5333rem 0.2667rem 0.1333rem 0.48rem;
}
.c12 .box .c12-con .c12-item2 p,
.c12 .box .c12-con .c12-item3 p {
  font-size: 0.3467rem;
  line-height: 0.64rem;
  color: #000000;
}
.c12 .box .c12-con .c12-tips {
  display: flex;
  font-family: PingFangSC-Regular;
  font-size: 0.3733rem;
  color: #000000;
  background-image: linear-gradient(
    90deg,
    rgba(0, 95, 253, 0.1) 0%,
    rgba(0, 210, 255, 0.1) 100%
  );
  margin-top: 0.48rem;
  padding: 0.2667rem 0 0.2667rem 0.4rem;
}
.c13 {
  position: relative;
}
.c13::before {
  content: "";
  position: absolute;
  top: -0.7333rem;
  left: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c13::after {
  content: "";
  position: absolute;
  top: -0.7333rem;
  right: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c13 .box {
  position: relative;
  padding-top: 0.8rem;
  padding-bottom: 0.9067rem;
  background-color: #ffffff;
  box-shadow: 0px 0px 0.2667rem 0px rgba(50, 108, 246, 0.2);
  border-radius: 0.2667rem;
  margin: 0.2667rem auto 0 auto;
}
.c13 .box .con-ti {
  height: 1.7733rem;
  margin: 0 -4%;
}
.c13 .box .con-ti img {
  display: block;
  margin: 0 auto;
  height: 1.7733rem;
}
.c13 .box .c13-con {
  width: 94.2%;
  margin: 0 auto;
}
.c13 .box .c13-con .c13-tabs {
  display: flex;
  justify-content: space-between;
  padding: 0 0.4rem;
  margin-top: 0.4rem;
}
.c13 .box .c13-con .c13-tabs span {
  width: 2.3733rem;
  height: 0.72rem;
  line-height: 0.72rem;
  background: linear-gradient(
    90deg,
    rgba(255, 228, 0, 0.1) 0%,
    rgba(255, 177, 0, 0.1) 49%,
    rgba(255, 126, 0, 0.1) 100%
  );
  border-radius: 0.1333rem;
  font-size: 0.3467rem;
  color: #333333;
  text-align: center;
}
.c13 .box .c13-con .c13-tabs span.active {
  position: relative;
  background-image: linear-gradient(
    90deg,
    #ffe400 0%,
    #ffb100 49%,
    #ff7e00 100%
  );
  font-weight: bold;
  color: #fff;
}
.c13 .box .c13-con .c13-tabs span.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.4433rem;
  transform: translateX(-50%);
  border: 0.2267rem solid transparent;
  border-top-color: #ffab00;
}
.c13 .box .c13-con .c13-lists {
  display: none;
}
.c13 .box .c13-con .c13-lists.active {
  display: block;
}
.c13 .box .c13-con .c13-item {
  display: flex;
  margin-top: 0.5333rem;
}
.c13 .box .c13-con .c13-item div {
  width: 50%;
  padding-left: 0.4rem;
}
.c13 .box .c13-con .c13-item div p {
  font-size: 0.3467rem;
  color: #000000;
  line-height: 0.64rem;
}
.c13 .box .c13-con .c13-item2,
.c13 .box .c13-con .c13-item3 {
  padding: 0.5333rem 0.2667rem 0.1333rem 0.48rem;
}
.c13 .box .c13-con .c13-item2 p,
.c13 .box .c13-con .c13-item3 p {
  font-size: 0.3467rem;
  line-height: 0.64rem;
  color: #000000;
}
.c13 .box .c13-con .c13-tips {
  display: flex;
  font-family: PingFangSC-Regular;
  font-size: 0.3733rem;
  color: #000000;
  background: linear-gradient(
    90deg,
    rgba(255, 228, 0, 0.1) 0%,
    rgba(255, 177, 0, 0.1) 49%,
    rgba(255, 126, 0, 0.1) 100%
  );
  margin-top: 0.48rem;
  padding: 0.2667rem 0 0.2667rem 0.4rem;
}
.c14 {
  position: relative;
}
.c14::before {
  content: "";
  position: absolute;
  top: -0.7333rem;
  left: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c14::after {
  content: "";
  position: absolute;
  top: -0.7333rem;
  right: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c14 .box {
  position: relative;
  padding-top: 0.8rem;
  padding-bottom: 0.9067rem;
  background-color: #ffffff;
  box-shadow: 0px 0px 0.2667rem 0px rgba(50, 108, 246, 0.2);
  border-radius: 0.2667rem;
  margin: 0.2667rem auto 0 auto;
}
.c14 .box .con-ti {
  height: 1.7733rem;
  margin: 0 -4%;
}
.c14 .box .con-ti img {
  display: block;
  margin: 0 auto;
  height: 1.7733rem;
}
.c14 .box .c14-lists {
  display: none;
}
.c14 .box .c14-lists.active {
  display: block;
}
.c14 .box .c14-con {
  width: 94.2%;
  margin: 0 auto;
}
.c14 .box .c14-con .c14-tabs {
  display: flex;
  justify-content: space-between;
  padding: 0 0.4rem;
  margin-top: 0.4rem;
}
.c14 .box .c14-con .c14-tabs span {
  width: 2.3733rem;
  height: 0.72rem;
  line-height: 0.72rem;
  background-image: linear-gradient(
    90deg,
    #f6e5f8 0%,
    #f4e5fb 24%,
    #f2e5fe 47%,
    #f1e5ff 100%
  );
  border-radius: 0.1333rem;
  font-size: 0.3467rem;
  color: #333333;
  text-align: center;
}
.c14 .box .c14-con .c14-tabs span.active {
  position: relative;
  background-image: linear-gradient(
    90deg,
    #da009f 0%,
    #c30093 24%,
    #9d00c9 47%,
    #7600ff 100%
  );
  font-weight: bold;
  color: #fff;
}
.c14 .box .c14-con .c14-tabs span.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.4433rem;
  transform: translateX(-50%);
  border: 0.2267rem solid transparent;
  border-top-color: #9b00c8;
}
.c14 .box .c14-con .c14-item {
  display: flex;
  margin-top: 0.5333rem;
}
.c14 .box .c14-con .c14-item div {
  width: 50%;
  padding-left: 0.4rem;
}
.c14 .box .c14-con .c14-item div p {
  font-size: 0.3467rem;
  color: #000000;
  line-height: 0.64rem;
}
.c14 .box .c14-con .c14-item2,
.c14 .box .c14-con .c14-item3 {
  padding: 0.5333rem 0.2667rem 0.1333rem 0.48rem;
}
.c14 .box .c14-con .c14-item2 p,
.c14 .box .c14-con .c14-item3 p {
  font-size: 0.3467rem;
  line-height: 0.64rem;
  color: #000000;
}
.c14 .box .c14-con .c14-tips {
  display: flex;
  font-family: PingFangSC-Regular;
  font-size: 0.3733rem;
  color: #000000;
  background-image: linear-gradient(
    90deg,
    #f6e5f8 0%,
    #f4e5fb 24%,
    #f2e5fe 47%,
    #f1e5ff 100%
  );
  margin-top: 0.48rem;
  padding: 0.2667rem 0 0.2667rem 0.4rem;
}
.c15 {
  position: relative;
  background: url(//wap.mobiletrain.org/java/img/c15-bg.png) no-repeat;
  background-size: 100% 5.7333rem;
  background-position: center bottom;
}
.c15::before {
  content: "";
  position: absolute;
  top: -0.7333rem;
  left: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c15::after {
  content: "";
  position: absolute;
  top: -0.7333rem;
  right: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c15 .box {
  position: relative;
  padding-top: 0.8rem;
  padding-bottom: 0.9067rem;
  background-color: #ffffff;
  box-shadow: 0px 0px 0.2667rem 0px rgba(50, 108, 246, 0.2);
  border-radius: 0.2667rem;
  margin: 0.2667rem auto 0 auto;
}
.c15 .box .con-ti {
  height: 1.7733rem;
  margin: 0 -4%;
}
.c15 .box .con-ti img {
  display: block;
  margin: 0 auto;
  height: 1.7733rem;
}
.c15 .box .c15-con {
  width: 94.2%;
  margin: 0 auto;
}
.c15 .box .c15-con .c15-lists {
  display: none;
}
.c15 .box .c15-con .c15-lists.active {
  display: block;
}
.c15 .box .c15-con .c15-tabs {
  display: flex;
  justify-content: space-between;
  padding: 0 0.4rem;
  margin-top: 0.4rem;
}
.c15 .box .c15-con .c15-tabs span {
  width: 2.3733rem;
  height: 0.72rem;
  line-height: 0.72rem;
  background-image: linear-gradient(
    90deg,
    #e5fcf4 1%,
    #e5f9fa 74%,
    #e5f7ff 100%
  );
  border-radius: 0.1333rem;
  font-size: 0.3467rem;
  color: #333333;
  text-align: center;
}
.c15 .box .c15-con .c15-tabs span.active {
  position: relative;
  background-image: linear-gradient(
    90deg,
    #00ef73 1%,
    #00cfb9 74%,
    #00aeff 100%
  );
  font-weight: bold;
  color: #fff;
}
.c15 .box .c15-con .c15-tabs span.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.4433rem;
  transform: translateX(-50%);
  border: 0.2267rem solid transparent;
  border-top-color: #00d7a7;
}
.c15 .box .c15-con .c15-item {
  display: flex;
  margin-top: 0.5333rem;
}
.c15 .box .c15-con .c15-item div {
  width: 54%;
  padding-left: 0.4rem;
}
.c15 .box .c15-con .c15-item div p {
  font-size: 0.3467rem;
  color: #000000;
  line-height: 0.64rem;
}
.c15 .box .c15-con .c15-item div:nth-child(1) {
  width: 46%;
}
.c15 .box .c15-con .c15-item2,
.c15 .box .c15-con .c15-item3 {
  padding: 0.5333rem 0.2667rem 0.1333rem 0.48rem;
}
.c15 .box .c15-con .c15-item2 p,
.c15 .box .c15-con .c15-item3 p {
  font-size: 0.3467rem;
  line-height: 0.64rem;
  color: #000000;
}
.c15 .box .c15-con .c15-tips {
  display: flex;
  font-family: PingFangSC-Regular;
  font-size: 0.3733rem;
  color: #000000;
  background-image: linear-gradient(
    90deg,
    #e5fcf4 1%,
    #e5f9fa 74%,
    #e5f7ff 100%
  );
  margin-top: 0.48rem;
  padding: 0.2667rem 0 0.2667rem 0.4rem;
}
.c16 {
  position: relative;
  background: url(//wap.mobiletrain.org/java/img/c16-bg.png) no-repeat;
  background-size: 100% 8.6667rem;
  background-position: center top;
  padding-top: 0.2667rem;
}
.c16::before {
  content: "";
  position: absolute;
  top: -0.4333rem;
  left: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c16::after {
  content: "";
  position: absolute;
  top: -0.4333rem;
  right: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c16 .box {
  position: relative;
  padding-top: 0.8rem;
  padding-bottom: 0.9067rem;
  background-color: #ffffff;
  box-shadow: 0px 0px 0.2667rem 0px rgba(50, 108, 246, 0.2);
  border-radius: 0.2667rem;
  margin: 0 auto;
}
.c16 .box .con-ti {
  height: 1.7733rem;
  margin: 0 -4%;
}
.c16 .box .con-ti img {
  display: block;
  margin: 0 auto;
  height: 1.7733rem;
}
.c16 .box .c16-con {
  width: 94.2%;
  margin: 0 auto;
}
.c16 .box .c16-con .c16-lists {
  display: none;
}
.c16 .box .c16-con .c16-lists.active {
  display: block;
}
.c16 .box .c16-con .c16-tabs {
  display: flex;
  justify-content: space-between;
  padding: 0 0.4rem;
  margin-top: 0.4rem;
}
.c16 .box .c16-con .c16-tabs span {
  width: 2.3733rem;
  height: 0.72rem;
  line-height: 0.72rem;
  background-image: linear-gradient(90deg, #e5f3ff 0%, #e5faff 100%);
  border-radius: 0.1333rem;
  font-size: 0.3467rem;
  color: #333333;
  text-align: center;
}
.c16 .box .c16-con .c16-tabs span.active {
  position: relative;
  background-image: linear-gradient(90deg, #005ffd 0%, #00d2ff 100%);
  font-weight: bold;
  color: #fff;
}
.c16 .box .c16-con .c16-tabs span.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.4433rem;
  transform: translateX(-50%);
  border: 0.2267rem solid transparent;
  border-top-color: #0091fe;
}
.c16 .box .c16-con .c16-item {
  display: flex;
  margin-top: 0.5333rem;
}
.c16 .box .c16-con .c16-item div {
  width: 40%;
  padding-left: 0.4rem;
}
.c16 .box .c16-con .c16-item div p {
  font-size: 0.3467rem;
  color: #000000;
  line-height: 0.64rem;
}
.c16 .box .c16-con .c16-item div:nth-child(1) {
  width: 60%;
}
.c16 .box .c16-con .c16-item2,
.c16 .box .c16-con .c16-item3 {
  padding: 0.5333rem 0.2667rem 0.1333rem 0.48rem;
}
.c16 .box .c16-con .c16-item2 p,
.c16 .box .c16-con .c16-item3 p {
  font-size: 0.3467rem;
  line-height: 0.64rem;
  color: #000000;
}
.c17 {
  position: relative;
}
.c17::before {
  content: "";
  position: absolute;
  top: -0.7333rem;
  left: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c17::after {
  content: "";
  position: absolute;
  top: -0.7333rem;
  right: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c17 .box {
  position: relative;
  padding-top: 0.8rem;
  padding-bottom: 0.9067rem;
  background-color: #ffffff;
  box-shadow: 0px 0px 0.2667rem 0px rgba(50, 108, 246, 0.2);
  border-radius: 0.2667rem;
  margin: 0.2667rem auto 0 auto;
}
.c17 .box .con-ti {
  height: 1.7733rem;
  margin: 0 -4%;
}
.c17 .box .con-ti img {
  display: block;
  margin: 0 auto;
  height: 1.7733rem;
}
.c17 .box .c17-con {
  width: 94.2%;
  margin: 0 auto;
}
.c17 .box .c17-con .c17-lists {
  display: none;
}
.c17 .box .c17-con .c17-lists.active {
  display: block;
}
.c17 .box .c17-con .c17-tabs {
  display: flex;
  justify-content: space-between;
  padding: 0 0.4rem;
  margin-top: 0.4rem;
}
.c17 .box .c17-con .c17-tabs span {
  width: 2.3733rem;
  height: 0.72rem;
  line-height: 0.72rem;
  background: linear-gradient(
    90deg,
    rgba(255, 228, 0, 0.1) 0%,
    rgba(255, 177, 0, 0.1) 49%,
    rgba(255, 126, 0, 0.1) 100%
  );
  border-radius: 0.1333rem;
  font-size: 0.3467rem;
  color: #333333;
  text-align: center;
}
.c17 .box .c17-con .c17-tabs span.active {
  position: relative;
  background-image: linear-gradient(
    90deg,
    #ffe400 0%,
    #ffb100 49%,
    #ff7e00 100%
  );
  font-weight: bold;
  color: #fff;
}
.c17 .box .c17-con .c17-tabs span.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.4433rem;
  transform: translateX(-50%);
  border: 0.2267rem solid transparent;
  border-top-color: #ffab00;
}
.c17 .box .c17-con .c17-item {
  display: flex;
  margin-top: 0.5333rem;
}
.c17 .box .c17-con .c17-item div {
  width: 45%;
  padding-left: 0.4rem;
}
.c17 .box .c17-con .c17-item div:nth-child(2) {
  width: 55%;
  padding-left: 1rem;
}
.c17 .box .c17-con .c17-item div p {
  font-size: 0.3467rem;
  color: #000000;
  line-height: 0.64rem;
}
.c17 .box .c17-con .c17-item div p.fz {
  font-weight: bold;
  font-size: 0.3733rem;
  color: #000000;
}
.c17 .box .c17-con .c17-item2,
.c17 .box .c17-con .c17-item3 {
  padding: 0.5333rem 0.2667rem 0.1333rem 0.48rem;
}
.c17 .box .c17-con .c17-item2 p,
.c17 .box .c17-con .c17-item3 p {
  font-size: 0.3467rem;
  line-height: 0.64rem;
  color: #000000;
}
.c18 {
  position: relative;
}
.c18::before {
  content: "";
  position: absolute;
  top: -0.7333rem;
  left: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c18::after {
  content: "";
  position: absolute;
  top: -0.7333rem;
  right: 1.1733rem;
  width: 0.24rem;
  height: 1.1867rem;
  background: url(//wap.mobiletrain.org/java/img/c12-1.png) no-repeat;
  background-size: 0.24rem 1.1867rem;
  z-index: 1;
}
.c18 .box {
  position: relative;
  padding-top: 0.8rem;
  padding-bottom: 0.9067rem;
  background-color: #ffffff;
  box-shadow: 0px 0px 0.2667rem 0px rgba(50, 108, 246, 0.2);
  border-radius: 0.2667rem;
  margin: 0.2667rem auto 0 auto;
}
.c18 .box .con-ti {
  height: 1.7733rem;
  margin: 0 -4%;
}
.c18 .box .con-ti img {
  display: block;
  margin: 0 auto;
  height: 1.7733rem;
}
.c18 .box .c18-con {
  width: 94.2%;
  margin: 0 auto;
}
.c18 .box .c18-con .c18-lists {
  display: none;
}
.c18 .box .c18-con .c18-lists.active {
  display: block;
}
.c18 .box .c18-con .c18-tabs {
  display: flex;
  justify-content: space-between;
  padding: 0 0.4rem;
  margin-top: 0.4rem;
}
.c18 .box .c18-con .c18-tabs span {
  width: 2.3733rem;
  height: 0.72rem;
  line-height: 0.72rem;
  background-image: linear-gradient(
    90deg,
    #f6e5f8 0%,
    #f4e5fb 24%,
    #f2e5fe 47%,
    #f1e5ff 100%
  );
  border-radius: 0.1333rem;
  font-size: 0.3467rem;
  color: #333333;
  text-align: center;
}
.c18 .box .c18-con .c18-tabs span.active {
  position: relative;
  background-image: linear-gradient(
    90deg,
    #da009f 0%,
    #c30093 24%,
    #9d00c9 47%,
    #7600ff 100%
  );
  font-weight: bold;
  color: #fff;
}
.c18 .box .c18-con .c18-tabs span.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.4433rem;
  transform: translateX(-50%);
  border: 0.2267rem solid transparent;
  border-top-color: #9b00c8;
}
.c18 .box .c18-con .c18-item {
  display: flex;
  margin-top: 0.5333rem;
}
.c18 .box .c18-con .c18-item div {
  width: 50%;
  padding-left: 0.4rem;
}
.c18 .box .c18-con .c18-item div p {
  font-size: 0.3467rem;
  color: #000000;
  line-height: 0.64rem;
}
.c18 .box .c18-con .c18-item div p.fz {
  font-weight: bold;
  font-size: 0.3733rem;
  color: #000000;
}
.c18 .box .c18-con .c18-item2,
.c18 .box .c18-con .c18-item3 {
  padding: 0.5333rem 0.2667rem 0.1333rem 0.48rem;
}
.c18 .box .c18-con .c18-item2 p,
.c18 .box .c18-con .c18-item3 p {
  font-size: 0.3467rem;
  line-height: 0.64rem;
  color: #000000;
}
.c19 img {
  height: 0.5467rem;
  display: block;
  margin: 0.7467rem auto 0 auto;
}
.c19 ul {
  padding-top: 0.8rem;
}
.c19 ul .c19-item {
  display: flex;
  align-items: center;
  margin-bottom: 0.4533rem;
}
.c19 ul .c19-item .item-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 21.73%;
  height: 5.4267rem;
  background-image: linear-gradient(0deg, #ff3b4e 0%, #ff32b6 100%);
  border-top-left-radius: 0.2667rem;
  border-bottom-left-radius: 0.2667rem;
}
.c19 ul .c19-item .item-left .javafont {
  font-size: 0.7733rem;
  color: #ffffff;
}
.c19 ul .c19-item .item-left p {
  font-family: PingFangSC-Semibold;
  font-size: 0.4rem;
  color: #fff;
  margin-top: 0.1333rem;
}
.c19 ul .c19-item .item-left.green {
  background-image: linear-gradient(0deg, #01b19e 0%, #00ef73 99%);
}
.c19 ul .c19-item .item-left.yellow {
  height: 6.0133rem;
  background-image: linear-gradient(
    0deg,
    #ff7e00 0%,
    #ffb100 51%,
    #ffe400 100%
  );
}
.c19 ul .c19-item .item-right {
  width: 78.27%;
  height: 6.2267rem;
  background-color: #ffffff;
  box-shadow: 0rem 0rem 0.2667rem 0rem rgba(50, 108, 246, 0.2);
  border-radius: 0.2667rem;
}
.c19 ul .c19-item .item-right h3 {
  padding-left: 0.5333rem;
  padding-top: 0.64rem;
  font-family: PingFangSC-Semibold;
  font-size: 0.3467rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.5067rem;
  margin-bottom: 0.08rem;
  color: #000000;
}
.c19 ul .c19-item .item-right p {
  padding-left: 0.5333rem;
  width: 6.28rem;
  font-size: 0.32rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.56rem;
  letter-spacing: 0px;
  color: #000000;
}
.c19 ul .c19-item .item-right.yellow {
  height: 6.8133rem;
}
.java-form {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 2.7733rem;
  max-width: 750px;
  background: linear-gradient(90deg, #d9e7ff 0%, #d9f8ff 100%);
  z-index: 11;
}
.java-form .form-icon {
  position: absolute;
  bottom: 0;
  left: 1.86%;
  width: 6.24rem;
  height: 3.2933rem;
  background-repeat: no-repeat;
  background-size: 5.84rem 3.2933rem;
  background-position: left center;
}
.java-form .form-icon h3 {
  width: 1.4933rem;
  height: 0.5333rem;
  line-height: 0.5333rem;
  background-color: #397cf3;
  border-radius: 0.2667rem;
  font-family: PingFangSC-Semibold;
  font-size: 0.3467rem;
  color: #fff;
  text-align: center;
  margin: 1.0133rem auto 0.08rem 3.0667rem;
}
.java-form .form-icon p {
  margin-left: 3.0667rem;
  font-size: 0.4533rem;
  color: #000000;
  line-height: 0.64rem;
}
.java-form .form-icon p span {
  font-family: PingFangSC-Semibold;
}
.java-form .form-icon i {
  margin-left: 3.0667rem;
  font-family: PingFangSC-Semibold;
  font-size: 0.48rem;
  line-height: 0.64rem;
  background: linear-gradient(to left, #ff4e00, #ffae00);
  -webkit-background-clip: text;
  color: transparent;
}
.java-form .form-btn {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 3.0533rem;
  height: 2.7733rem;
  background-image: linear-gradient(-45deg, #005ffd 0%, #00d2ff 100%);
  font-family: PingFangSC-Semibold;
  font-size: 0.48rem;
  font-weight: bold;
  line-height: 2.7733rem;
  color: #ffffff;
  text-align: center;
}
.c20 {
  position: relative;
  width: 100%;
  height: 8.0933rem;
  background-size: 100% 8.0933rem;
  background-position: center;
  background-repeat: no-repeat;
  margin-top: -1.2133rem;
  text-align: center;
  z-index: 1;
}
.c20 .c20-tit {
  font-size: 0.5333rem;
  font-weight: bold;
  color: #326cf6;
  padding-top: 0.8933rem;
}
.c20 .c20-des {
  font-size: 0.4rem;
  color: #666666;
  margin-top: 0.2667rem;
}
.c20 ul {
  display: flex;
  justify-content: space-between;
  padding: 0 0.4rem;
  margin-top: 0.8rem;
}
.c20 ul li {
  width: 30.98%;
  height: 3.7733rem;
  background-image: linear-gradient(135deg, #00d2ff 0%, #005ffd 100%);
  border-radius: 0.2667rem;
  color: #ffffff;
}
.c20 ul li:nth-child(2) {
  background-image: linear-gradient(
    135deg,
    #ffe400 0%,
    #ffb100 34%,
    #ff7e00 100%
  );
}
.c20 ul li:nth-child(3) {
  background-image: linear-gradient(
    135deg,
    #f11ab7 0%,
    #b40ddb 31%,
    #7600ff 100%
  );
}
.c20 ul li h3 {
  width: 2.0267rem;
  height: 0.6267rem;
  line-height: 0.6267rem;
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 0.32rem;
  text-align: center;
  margin: 0.4rem auto 0.36rem auto;
  font-size: 0.3733rem;
}
.c20 ul li p {
  font-size: 0.3467rem;
  line-height: 0.5067rem;
}
.c20 ul li p span {
  font-weight: bold;
}
.c21 ul {
  padding-top: 0.1333rem;
}
.c21 ul li {
  padding-top: 0.6667rem;
  padding-bottom: 0.6667rem;
  border-bottom: 1px solid #cccccc;
}
.c21 ul li a {
  display: flex;
  align-items: center;
}
.c21 ul li:last-child {
  border: none;
}
.c21 ul li .c21-pic {
  width: 2.7067rem;
  height: 2.7067rem;
  background-size: 2.7067rem;
  background-repeat: no-repeat;
  margin-right: 0.44rem;
  border-radius: 50%;
  overflow: hidden;
  text-align: center;
}
.c21 ul li .c21-pic img {
  max-width: 100%;
  max-height: 100%;
}
.c21 ul li .c21-info {
  flex: 1;
}
.c21 ul li .c21-info h3 {
  margin-bottom: 0.2667rem;
}
.c21 ul li .c21-info h3 .title {
  font-family: PingFangSC-Semibold;
  font-size: 0.48rem;
  color: #000000;
  margin-right: 0.1833rem;
}
.c21 ul li .c21-info h3 .subtitle {
  font-size: 0.3733rem;
  color: #666666;
  padding-left: 0.1833rem;
  border-left: 0.0267rem solid #666666;
}
.c21 ul li .c21-info p {
  font-family: PingFangSC-Regular;
  font-size: 0.32rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.48rem;
  letter-spacing: 0px;
  color: #000000;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}
/*分页*/
.pagination {
  display: flex;
  display: -webkit-flex;
  justify-content: center;
  -webkit-justify-content: center;
  padding: 0.1333rem 0.37rem;
  margin-bottom: 0.5rem;
}
.pagination a {
  display: block;
  font-size: 0.3733rem;
  color: #333;
  border: solid 1px #cccccc;
  box-sizing: border-box;
  border-radius: 0.1333rem;
  padding: 0.1867rem 0.2rem;
  margin-right: 0.14rem;
}
.pagination a:last-child {
  margin-right: 0;
}
.pagination a.current {
  border: solid 1px #326cf6;
  color: #326cf6;
}
.pagination a.next,
.pagination a.prev {
  padding: 0.1867rem 0.1333rem;
}
.c40 .tabs {
  position: relative;
  width: 9.6533rem;
  height: 2.6267rem;
  background-size: 9.6533rem 2.6267rem;
  background-position: center top;
  margin: -1.1667rem auto 0 auto;
  z-index: 1;
}
.c40 .tabs div {
  display: flex;
  justify-content: center;
  width: 9.2rem;
  margin: 0 auto;
}
.c40 .tabs div span {
  width: 50%;
  height: 0.8rem;
  line-height: 0.8rem;
  text-align: center;
  border-right: 1px solid #cccccc;
  margin-top: 0.7067rem;
}
.c40 .tabs div span.active {
  font-family: PingFangSC-Semibold;
  font-size: 0.48rem;
  color: #326cf6;
}
.c40 .tabs div span:last-child {
  border: none;
}
.c40 .c40-con {
  display: none;
  margin-bottom: 0.5rem;
}
.c40 .c40-con.active {
  display: block;
}
.c40 .con ul {
  width: 92%;
  margin: 0 auto;
  padding-top: 0.6667rem;
}
.c40 .con ul li {
  margin-bottom: 0.8rem;
}
.c40 .con ul li a {
  display: flex;
}
.c40 .con ul li img {
  width: 2.8rem;
  height: 1.9333rem;
  background-color: #326cf6;
  border-radius: 0.1333rem;
  margin-right: 0.4267rem;
}
.c40 .con ul li div {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: space-between;
}
.c40 .con ul li div h3 {
  font-family: PingFangSC-Semibold;
  font-size: 0.3733rem;
  font-weight: normal;
  /* font-stretch: normal;
  line-height: 0.48rem;
  letter-spacing: 0px; */
  color: #333333;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.c40 .con ul li div p {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.c40 .con ul li div p .label {
  width: 3.4667rem;
  height: 0.6133rem;
  line-height: 0.6133rem;
  background-color: #eaf0fe;
  border-radius: 0.3067rem;
  color: #326cf6;
  font-size: 0.32rem;
  text-align: center;
}
.c40 .con ul li div p .label .javafont {
  font-size: 0.3067rem;
  margin-right: 0.08rem;
}
.c40 .con ul li div p .time {
  font-size: 0.32rem;
  color: #999999;
}
.c40 .con .more {
  position: relative;
  display: block;
  width: 4.1467rem;
  height: 1.1067rem;
  line-height: 1.1067rem;
  background-color: #326cf6;
  border-radius: 0.5467rem;
  border: solid 1px #326cf6;
  margin: 0 auto;
  font-family: PingFangSC-Semibold;
  font-size: 0.48rem;
  color: #fff;
  padding-left: 0.6667rem;
}
.c40 .con .more span {
  position: absolute;
  top: -0.1867rem;
  right: -0.4267rem;
  width: 1.24rem;
  height: 1.24rem;
  line-height: 1.24rem;
  background-image: linear-gradient(
    -45deg,
    #ff003b 0%,
    #ff541e 51%,
    #ffa800 100%
  );
  text-align: center;
  border: solid 0.1067rem #ffffff;
  border-radius: 50%;
  font-size: 0.5733rem;
  font-weight: bold;
}
.c40 .con1 ul li {
  height: 2.48rem;
}
.c40 .con1 ul li:nth-child(odd) {
  background: #f9faff;
}
.c40 .con1 ul li .box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 2.48rem;
}
.c40 .con1 ul li .box .javafont {
  font-size: 0.8533rem;
  color: #326cf6;
  width: 0.8933rem;
}
.c40 .con1 ul li .box div {
  width: 86%;
}
.c40 .con1 ul li .box h3 {
  font-family: PingFangSC-Semibold;
  font-size: 0.3733rem;
  color: #333333;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.c40 .con1 ul li .box p {
  font-size: 0.32rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.4533rem;
  color: #333333;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.c41 {
  width: 9.2rem;
  height: 14.04rem;
  background: url(//wap.mobiletrain.org/java/img/c41-bg.png) no-repeat;
  background-size: 100%;
  margin: 0 auto;
  color: #fff;
}
.c41 h3 {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  height: 0.72rem;
  padding-top: 1.0667rem;
}
.c41 h3 span {
  font-weight: bold;
  font-size: 0.64rem;
}
.c41 h3 span.java-zaixiandayi_huaban1 {
  font-size: 0.72rem;
  font-weight: normal;
  margin-right: 0.2667rem;
}
.c41 p {
  font-family: SourceHanSansCN-Bold;
  font-size: 0.4rem;
  margin-top: 0.5333rem;
  text-align: center;
  margin-bottom: 0.2667rem;
}
.c41 i {
  display: block;
  font-family: SourceHanSansCN-Regular;
  font-size: 0.3733rem;
  text-align: center;
}
.c41 textarea {
  display: block;
  width: 7.6667rem;
  height: 2.76rem;
  background-color: #ffffff;
  border-radius: 0.1333rem;
  border: none;
  outline: none;
  margin: 0.5333rem auto 0 auto;
  padding: 0.4rem;
  line-height: 0.64rem;
  font-size: 0.4rem;
}
.c41 ::-webkit-input-placeholder {
  color: #cccccc;
}
.c41 .phone {
  display: flex;
  align-items: center;
  width: 8.4667rem;
  height: 1.12rem;
  background-color: #ffffff;
  border-radius: 0.1333rem;
  border: solid 1px #f1f1f1;
  box-sizing: border-box;
  margin: 0.3733rem auto 0.8rem auto;
}
.c41 .phone .java-shouji {
  font-size: 0.64rem;
  color: #999999;
  margin-left: 0.6667rem;
  margin-right: 0.48rem;
}
.c41 a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 6.9733rem;
  height: 1.2267rem;
  background: #fff;
  border-radius: 0.6133rem;
  margin: 0 auto 0.48rem auto;
}
.c41 a span {
  font-family: PingFangSC-Semibold;
  font-size: 0.48rem;
  background: linear-gradient(to left, #ff4e00 40%, #ffae00);
  -webkit-background-clip: text;
  color: transparent;
}