.container {
  min-width: 1200px;
}

.section-content {
  padding: 30px 0 30px;
  width: 1200px;
  margin: 0 auto;
}

.section-title {
  width: 100%;
  height: 74px;
  background-repeat: no-repeat;
  background-size: 100% !important;
  margin-bottom: 30px;
}

.section-btn-group {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.section-btn {
  cursor: pointer;
  line-height: 33px;
  font-family: PingFangSC-Semibold;
  font-weight: 600;
  font-size: 24px;
  color: #FFFFFF;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  background-image: linear-gradient(179deg, #E31937 0%, #C1121F 100%);
  border-radius: 26px;
  &:hover {
    box-shadow: 0 2px 6px 0 #a70019;
  }
}

.section-btn.section-btn-primary {
  background-image: linear-gradient(0deg, #2A2FFF 0%, #63DCFF 100%);
}

.section-small-btn {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
  border: 1px solid #2A2FFF;
  border-radius: 4px;
  padding: 8px;
  line-height: 20px;
  font-family: PingFangSC-Semibold;
  font-weight: 600;
  font-size: 14px;
  color: #2A2FFF;
}

.section-small-btn1 {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
  border: 1px solid #2A2FFF;
  border-radius: 8px;
  padding: 8px;
  line-height: 22px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  font-size: 16px;
  color: #2A2FFF;
}

.section-round-btn {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-image: linear-gradient(179deg, #E31937 0%, #C1121F 100%);
  border-radius: 26px;
  padding: 8px;
  font-family: PingFangSC-Semibold;
  font-weight: 600;
  font-size: 18px;
  color: #FFFFFF;
  line-height: 26px;
}

/* banner */
.section-banner {
  /* background-image: url(../img/section-banner.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover; */
  /* height: 500px; */
  width: 100%;
  position: relative;
}

.section-banner-img {
  width: 100%;
}

.section-banner-btn-group {
  gap: 60px;
  position: absolute;
  bottom: 11.8%;
}

/* 金吉列语培项目 */
.section-why {
  width: 100%;
  min-height: 570px;
  background-color: #FFFFFF;
  /* background-image: url(https://h5cdn.jjl.cn/pc/20250526_languageTraining/why/section-why-top.png);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: contain; */
}

/* .section-why .section-title {
  background-image: url(../img/section-why-title.png);
} */

.section-why-cards {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px;
}

.section-why-card {
  width: 224px;
  height: 160px;
  background: #003ca21c;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition: all 0.3s;
  border: 1px solid #fff;
}

.section-why-card:hover {
  border: 1px solid #003CA2;
}

.section-why-card-img {
  width: 68px;
  height: 68px;
}

.section-why-card-title {
  margin-top: 14px;
  line-height: 40px;
  font-family: PingFangSC-Medium;
  font-weight: 500;
  font-size: 28px;
  color: #333333;
}

/* 金吉列语培专属优势 */
.section-advantage {
  width: 100%;
  height: 624px;
  background-color: #EEF4FF;
  /* background-image: url(https://h5cdn.jjl.cn/pc/20250526_languageTraining/advantage/section-advantage-bg.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover; */
}

.section-advantage .section-title {
  margin-bottom: -42px;
}

.section-advantage .section-content {
  padding-top: 35px;
  padding-bottom: 0;
}

.section-advantage .section-title {
  background-image: url(../img/section-advantage-title.png);
}

.section-advantage .section-advantage-info {
  position: relative;
  background-image: url(../img/section-advantage-info.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  height: 557px;
  padding: 77px 20px 46px;
}

.section-advantage-info .section-btn-group {
  position: absolute;
  bottom: -9px;
}

.section-advantage-cards {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 82px;
}

.section-advantage-card {
  flex-shrink: 0;
  width: 282px;
  height: 176px;
  background: #FFFFFF;
  border: 1px solid #003CA2;
  border-radius: 12px;
  padding: 0 14px;
}

.section-advantage-card[data-row="1"]:not(.section-advantage-card-right) {
  margin-left: 210px;
  margin-right: 176px;
}

.section-advantage-card.section-advantage-card-right[data-row="1"] {
  margin-left: 0;
  margin-right: 210px;
}

.section-advantage-card.section-advantage-card-right[data-row="2"] {
  margin-left: auto;
}

.section-advantage-card-title {
  width: 100%;
  height: 46px;
  background: #003CA2;
  box-shadow: 0 2px 6px 0 #003ca238;
  border-radius: 0 0 12px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}

.section-advantage-card-title-text {
  line-height: 30px;
  font-family: PingFangSC-Semibold;
  font-weight: 600;
  font-size: 22px;
  color: #FFFFFF;
  text-align: center;
}

.section-advantage-card-desc {
  line-height: 25px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  font-size: 18px;
  color: #333333;
  text-align: center;
}

.section-advantage-card-btn-wrap {
  margin-top: 10px;
  text-align: center;
}

.section-advantage-card-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  width: 134px;
  height: 40px;
  margin: 0 auto;
  background: #FFFFFF;
  border-radius: 20px;
  line-height: 40px;
  font-family: PingFangSC-Medium;
  font-weight: 500;
  font-size: 14px;
  color: #003CA2;
  transition: all 0.3s;
  div {
    display: flex;
    align-items: center;
  }
  &:hover { 
    box-shadow: 0 0 6px 0 #003ca26b;
  }
}

.section-advantage-card-btn-icon {
  width: 14px;
  margin-left: 4px;
}

/* 金吉列语培课程体系 */
.section-cost {
  width: 100%;
}

.section-cost1,
.section-cost2 {
  height: 552px;
}

.section-cost2 {
  background-image: url(https://h5cdn.jjl.cn/pc/20250526_languageTraining/img/cost/section-cost-bg.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.section-cost3 {
  height: 476px;
}

.section-cost1 .section-title {
  background-image: url(../img/section-cost-title1.png);
}

.section-cost2 .section-title {
  background-image: url(../img/section-cost-title2.png);
}

.section-cost3 .section-title {
  background-image: url(../img/section-cost-title3.png);
}

.section-cost1 .section-cost-table {
  background: url('https://h5cdn.jjl.cn/pc/20250526_languageTraining/img/table-bg1.png') no-repeat center center / 100% 100%;
}
.section-cost2 .section-cost-table {
  background: url('https://h5cdn.jjl.cn/pc/20250526_languageTraining/img/table-bg2.png') no-repeat center center / 100% 100%;
}
.section-cost3 .section-cost-table {
  background: url('https://h5cdn.jjl.cn/pc/20250526_languageTraining/img/table-bg3.png') no-repeat center center / 100% 100%;
}
.section-cost .section-cost-table-td-content {
  opacity: 0;
}
.section-cost-table {
  /* 让边框合并，去掉双线 */
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 30px;
}

.cost-table-btn {
  cursor: pointer;
  width: 166px;
  height: 36px;
  background-image: linear-gradient(179deg, #FF6178 0%, #B51E0F 100%);
  border-radius: 6px;
  line-height: 20px;
  font-family: PingFangSC-Semibold;
  font-weight: 600;
  font-size: 14px;
  color: #ffffff;
  text-align: center;
}

.section-cost-table-th,
.section-cost-table-td {
  border: 2px solid #ffffff;
  text-align: center;
  padding: 11px 28px;
}

.section-cost-table-th {
  line-height: 28px;
  font-family: PingFangSC-Medium;
  font-weight: 500;
  font-size: 20px;
  color: #FFFFFF;
  /* background: #003CA2; */
  padding: 10px 0 !important;
  opacity: 0;
}

.section-cost-table-td-content {
  line-height: 28px;
  font-family: PingFangSC-Medium;
  font-weight: 500;
  font-size: 18px;
  color: #000000;
}

.section-cost-table-td-highlight {
  font-size: 24px !important;
  font-weight: 500;
}

/* 金吉列语培教师团队 */
.section-teacher {
  width: 100%;
  height: 794px;
  background-image: url(../img/section-teacher-bg.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.section-teacher .section-title {
  background-image: url(../img/section-teacher-title.png);
  margin-bottom: 30px;
  position: relative;
}

.section-title-desc {
  width: 100%;
  position: absolute;
  bottom: -43px;
  line-height: 33px;
  font-family: PingFangSC-Medium;
  font-weight: 500;
  font-size: 24px;
  color: rgb(255, 255, 255, 0.7);
  text-align: center;
}

.teacher-info {
  height: 400px;
  background: #EBF3FF;
  border-radius: 12px;
  padding: 20px 25px 20px 20px;
  display: flex;
}

.teacher-info-left {
  width: 594px;
  height: 360px;
  /* background-repeat: no-repeat;
  background-size: 100%; */
  flex-shrink: 0;
  border-radius: 12px;
  overflow: hidden;
}

teacher-info-left-img {
  width: 100%;
  height: 100%;
}

.teacher-info-right {
  padding-left: 29px;
}

.teacher-info-right-name {
  font-family: PingFangSC-Semibold;
  font-weight: 600;
  font-size: 34px;
  color: #222222;
  line-height: 48px;
  text-align: left;
  font-style: normal;
  margin-top: 30px;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
}

.teacher-info-right-row {
  display: flex;
  align-items: flex-start;
  margin-bottom: 8px;
}

.teacher-info-right-label {
  flex-shrink: 0;
  line-height: 30px;
  font-family: PingFangSC-Medium;
  font-weight: 500;
  font-size: 16px;
  color: #333333;
}

.teacher-info-right-text {
  margin-top: 5px;
  line-height: 20px;
  font-family: PingFangSC-Medium;
  font-weight: 500;
  font-size: 14px;
  color: #333333;
}

.teacher-info-right-button {
  width: 216px;
  height: 60px;
  background-image: linear-gradient(179deg, #E31937 0%, #C1121F 100%), linear-gradient(0deg, #FF7000 0%, #FFCF63 100%);
  box-shadow: 0 2px 12px 0 #e3193759;
  border-radius: 30px;
  font-family: PingFangSC-Medium;
  font-weight: 500;
  font-size: 20px;
  color: #FFFFFF;
  line-height: 28px;
  padding-left: 21px;
  display: flex;
  align-items: center;
  cursor: pointer;
  position: absolute;
  bottom: 10px;
  right: 5px;
  &:hover {
    position: absolute !important;
  }
}

.teacher-info-right-button-icon {
  width: 42px;
  height: 42px;
  margin-left: auto;
  margin-right: 9px;
}

.teacher-info-right {
  position: relative;
}

.teacher-avatar-toggle-wrap {
  padding: 0 66px;
  position: relative;
}

.teacher-avatar-left-icon,
.teacher-avatar-right-icon {
  cursor: pointer;
  width: 36px;
  height: 36px;
  position: absolute;
  top: calc(43px + 68px);
  transform: translateY(-50%);
}

.teacher-avatar-icon-disabled {
  opacity: 0.5;
  cursor: default;
}

.teacher-avatar-left-icon {
  left: 0;
}

.teacher-avatar-right-icon {
  right: 0;
}

.teacher-avatar-wrap {
  overflow: hidden;
}

.teacher-avatar {
  margin-top: 43px;
  display: flex;
  align-items: center;
  will-change: transform;
  /* 提示浏览器优化 */
  transition: transform 0.5s ease;
  /* 平滑滚动动画 */
}

.teacher-avatar-item {
  flex-shrink: 0;
  width: 138px;
  height: 138px;
  background-repeat: no-repeat;
  background-size: 100%;
  position: relative;
  cursor: pointer;
  margin: 0 20px;
}

.teacher-avatar-item-active-bg {
  position: absolute;
  top: -6px;
  bottom: 0;
  right: 0;
  left: 0;
  width: 138px;
}

.teacher-toggle {
  margin-top: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.teacher-toggle-icon {
  margin-right: 20px;
  width: 18px;
  height: 18px;
  background: rgb(0, 145, 130, 0.5);
  border-radius: 50%;
  cursor: pointer;
}

.teacher-toggle-icon.active {
  background: #009182;
  border: 1px solid #009182;
}

/* 表单 */
.section-form-wrap {
  width: 100%;
  height: 506px;
  background-color: #ffffff;
  padding: 84px 0 84px;
}

.section-form-wrap .section-content {
  width: 100% !important;
  height: 338px;
  background-image: url(https://h5cdn.jjl.cn/pc/20250526_languageTraining/img/form/section-form-bg.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
  padding: 0;
}

.section-content-box {
  position: relative;
  width: 1200px;
  margin: 0 auto;
}

.section-form {
  position: absolute;
  top: -56px;
  right: -14px;
  width: calc(468px + 24px);
  height: calc(426px + 24px);
  background-image: url(../img/section-form.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 12px 50px 0 52px;
}

.section-form .form-title {
  height: 80px;
  line-height: 80px;
  font-family: Alibaba-PuHuiTi-B;
  font-weight: Bold;
  font-size: 30px;
  color: #FFFFFF;
  text-align: center;
  margin-bottom: 24px;
}

.section-form .form-item {
  min-height: 44px;
  border-bottom: 1px solid #EEEEEE;
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.section-form .form-label {
  flex-shrink: 0;
  margin-right: 6px;
}

.section-form .form-label,
.section-form .form-input {
  line-height: 22px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  font-size: 16px;
  color: #333333;
}

.section-form .form-input {
  outline: none;
  border: none;
  flex: 1;
  width: 0%;
}

.form-input-send {
  cursor: pointer;
  width: 124px;
  height: 45px;
  line-height: 45px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  font-size: 16px;
  color: #FFFFFF;
  text-align: center;
  background-image: linear-gradient(179deg, #E31937 0%, #C1121F 100%), linear-gradient(180deg, #FFA15F 2%, #EC6609 100%);
  border-radius: 22.5px;
  margin-bottom: 5px;
}

.section-form .form-input::placeholder {
  color: #999999;
}

.form-agreement {
  display: flex;
  align-items: flex-start;
  margin-bottom: 18px;
}

.section-form .form-agreement-img {
  cursor: pointer;
  width: 15px;
  margin-top: 3.5px;
  margin-right: 10px;
}

.section-form .form-agreement-text,
.section-form .form-agreement-link {
  color: #999999;
  font-size: 16px;
  line-height: 22px;
  font-family: PingFangSC;
  font-weight: 400;
}

.section-form .form-agreement-link {
  color: #003CA2 !important;
}

/* 四重免费好礼等你来领 */
.section-gift {
  width: 100%;
  height: 492px;
  background: #EEF4FF;
}

.section-gift .section-content {
  padding-top: 40px;
}

.section-gift .section-title {
  background-image: url(../img/section-gift-title.png);
}

.section-gift-cards {
  display: flex;
  align-items: center;
  gap: 24px;
}

.section-gift-card {
  padding: 0 0 18px 0;
  flex: 1;
  height: 258px;
  background-color: #FFFFFF;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.section-gift-card-title {
  margin-top: -8px;
  margin-bottom: 18px;
  background-image: url(../img/section-gift-card-img.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  width: 228px;
  height: 49px;
  display: flex;
  align-items: center;
  justify-content: center;
  word-break: break-all;
  line-height: 33px;
  font-family: Alibaba-PuHuiTi-B;
  font-weight: Bold;
  font-size: 24px;
  color: #FFFFFF;
  text-align: center;
}

.section-gift-card-desc {
  line-height: 22px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  font-size: 16px;
  color: #333333;
  margin-top: auto;
  margin-bottom: 13px;
}

/* 语培受欢迎专业院校推荐 */
.section-school {
  width: 100%;
  height: 931px;
}

.section-school .section-content {
  padding-top: 40px;
}

.section-school .section-title {
  background-image: url(../img/section-school-title.png);
}

.section-school-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.section-school-card {
  width: 190px;
  height: 80px;
  background-color: #FFFFFF;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.section-school-card-btn {
  margin-left: auto;
  display: flex;
  align-items: center;
  height: 80px;
}

.section-school-card-title {
  line-height: 36px;
  font-family: Alibaba-PuHuiTi-B;
  font-weight: Bold;
  font-size: 24px;
  color: #FFFFFF;
  text-align: center;
  line-height: 36px;
  text-shadow: 0 2px 4px #00000080;
}

.btn-big {
  cursor: pointer;
  transition: all 0.3s;
}
.btn-big:hover {
  position: relative;
  transform: scale(1.2);
  z-index: 9;
}