* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
body {
  background-image: url(../img/bg1.jpg);
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
}

.box {
  width: 100%;
  max-width: 1200px;
  margin: auto;
  /*   display: flex;
  flex-direction: row; */
}
.box1 {
  text-align: center;
}
.box2 {
  width: 100%;
  margin: auto;
  list-style: none;
  display: flex;

  font-size: 18px;
  justify-content: space-around;
}
.box2 li a {
  text-decoration: none;
  color: #000;
}
.box2 li .active {
  color: rgb(255, 0, 136);
}
.box3 {
  display: flex;
  align-items: center;
  padding-left: 50px;
}
.z1 img {
  width: 400px;
}
.z2 img {
  width: 600px;
  margin-left: 50px;
}
.z4 img {
  height: 600px;
}
.box4 {
  margin-top: 50px;
  padding-left: 100px;
  display: flex;
}
.z5 {
  margin-top: 100px;
  margin-left: 100px;
}
.z6 {
  margin-top: 30px;
}
.z6 p {
  font-size: 15px;
}
.z7 {
  margin-top: 50px;
  list-style: none;
  display: flex;
}
.z7 li {
  margin-left: 30px;
}
.z7 img {
  width: 30px;
}
.all {
  display: flex;
}
.all img {
  margin-top: -5px;
}

.img1 {
  margin-top: -5px;
}
.b {
  display: flex;
  margin-top: 50px;
  margin: 60px auto 0px;
  justify-content: space-around;
}
.b1 {
  height: 600px;
  position: relative;
  width: 400px;
  padding-top: 40px;
  padding-left: 30px;
  border-radius: 28.5px;
  background-color: white;
  background-repeat: no-repeat;
  border: 1px solid #000;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  background-size: 100% 100%;
  transition: background-color 0.3s ease;
  /* background-image: url(../img/Frame\ 8.png); */
}
.b1::after {
  content: "";
  position: absolute;
  border-radius: 28.5px;
  top: 50%;
  left: 50%;
  width: 400px;
  height: 585px;
  background: rgba(214, 232, 253);
  transform: skew(-4deg, 6deg) translate(-50%, -50%);
  z-index: -1;
  transition: background 0.3s ease;
}
.b1:hover::after {
  background: rgba(166, 210, 255);
  /* 悬停时的颜色 */
}
.b1:hover {
}
.b2 {
  padding-top: 80px;
  padding-left: 50px;
  height: 600px;
  width: 450px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url(../img/Frame\ 7.png);
}
.b3 {
  padding-top: 80px;
  padding-left: 50px;
  height: 600px;
  width: 450px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url(../img/Frame\ 7.png);
}
.bb1 {
  display: flex;
  align-items: center;
  font-weight: bold;
}
.bb1 .p1 {
  width: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 50%;
  height: 30px;
  background-color: rgb(215, 232, 252);
}
.bb2 {
  font-size: 20px;
  margin-left: 10px;
  margin-top: 10px;
}
.bb3 {
  margin-top: 20px;
  width: 318px;
  height: 180px;
}
.bb3 img {
  border-radius: 10px;
  width: 100%;
  height: 100%;
}
.bb4 {
  display: flex;

  list-style: none;
  flex-wrap: wrap;
}
.li1 {
  margin-left: 20px;
}
.bb4 li {
  width: 150px;
  font-size: 14px;
  margin-top: 10px;
  height: 40px;
  text-align: center;
  border: 1px solid #000;
  line-height: 40px;
  border-radius: 28.5px;
}
.bb4 li:nth-child(1) {
  background-color: rgb(248, 198, 223);
}
.bb4 li:nth-child(3) {
  background-color: rgb(215, 232, 252);
}
.bb5 {
  margin-top: 20px;
}
.bb5 p {
  font-size: 14px;
}
.v1 {
  width: 100%;
}
.v1 img {
  width: 100%;
}
.v {
  background-color: rgb(225, 226, 231);
}
.t1 {
  text-align: center;
}

.v2 {
  list-style: none;
  display: flex;
  justify-content: space-between;
}
.vv {
  width: 1050px;
  margin: auto;
}
.v3 {
  list-style: none;
  display: flex;
  justify-content: space-around;
}
.v2 li {
  padding-left: 67px;
  padding-top: 80px;
  width: 200px;
  box-shadow: 13px -7px 2px 0px rgb(216, 232, 252);
  height: 270px;
  border: 1px solid #000;
  border-radius: 140.5px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: none;
  background-color: white;
  /* background-image: url(../img/Frame 10.png); */
  margin-top: 35px;
}

.vv1 h1 {
  margin-left: 20px;
}
.v3 li {
  padding-left: 67px;
  padding-top: 80px;
  width: 200px;
  height: 270px;
  border: 1px solid #000;
  border-radius: 140.5px;
  box-shadow: 13px -7px 2px 0px rgb(216, 232, 252);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: none;
  background-color: white;
  /* background-image: url(../img/Frame 10.png); */
  margin-top: 35px;
}
.vv1 {
  width: 900px;
  margin: auto;
}
.v2 li a {
  text-decoration: none;
  color: #000;
}
.v3 li {
  padding-left: 67px;
  padding-top: 80px;
  width: 200px;
  height: 270px;
  border: 1px solid #000;
  border-radius: 140.5px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: none;
  background-color: white;

  /* background-image: url(../img/Frame 10.png); */
  margin-top: 35px;
}
.v2 li:hover {
  box-shadow: 13px -7px 2px 0px rgb(172, 210, 255);
  background-color: rgb(240, 199, 231);
  cursor: pointer;
}
.v3 li:hover {
  box-shadow: 13px -7px 2px 0px rgb(172, 210, 255);
  background-color: rgb(240, 199, 231);
  cursor: pointer;
}
.v3 li:nth-child(2):hover {
  box-shadow: 13px -7px 2px 0px rgb(172, 210, 255);
  background-color: rgb(240, 199, 231);
  cursor: pointer;
}
.v3 li a {
  text-decoration: none;
  color: #000;
}

.bb1 p:nth-child(2) {
  margin-left: -3px;
}

.b a {
  text-decoration: none;
  color: #000;
}
.vv h1 {
  margin-left: 20px;
  font-size: 40px;
}
.w {
  margin-left: 10px;
}
.top {
  width: 10px;
  height: 10px;
  border: 1px solid #000;
  background-color: white;
  border-radius: 50%;
  margin-top: -30px;
  margin-left: 27px;
  margin-bottom: 20px;
}

@media (max-width: 725px) {
}
.Semester {
  list-style: none;
  margin: 50px auto;
  width: 500px;
}
.Semester li {
  margin-top: 20px;
  text-align: center;
  width: 500px;
  line-height: 60px;
  border-radius: 28.5px;
  height: 60px;
  background-color: rgba(172, 209, 255, 0.594);
}
.Semester li:hover {
  background-color: rgb(172, 209, 255);
}
.Semester li a {
  text-decoration: none;
  color: #000;
  font-size: 15px;
}
/* 一级菜单样式 */
.nav {
  position: relative;
  display: flex;
  cursor: pointer;
}
.navs {
  position: relative;
  display: flex;
  cursor: pointer;
}
/* 二级菜单样式 */
.zz1 {
  position: absolute;
  z-index: 1000; /* 增加 z-index */
  background-color: white;
  list-style: none;

  padding: 10px;
  top: 100px;
  border-radius: 10px;
  visibility: hidden; /* 使用 visibility */
  opacity: 0;
  transition: visibility 0s, opacity 0.3s;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.zz1 p {
  font-size: 15px;
  height: 30px;
  line-height: 30px;
  color: #000;
}

.zz1 a {
  padding: 0px 18px;
  font-size: 15px !important;
}

/* 悬停一级菜单时显示二级菜单 */
.op:hover .zz1 {
  visibility: visible;
  opacity: 1;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* 三级菜单样式 */
.post {
  position: relative;
}

.post ul {
  position: absolute;
  left: 120px; /* 调整位置以避免重叠 */
  top: 0px;
  /* 调整宽度 */
  list-style: none;
  visibility: hidden;
  width: 120px;
  opacity: 0;

  transition: visibility 0s, opacity 0.3s;
  background-color: white;
  padding: 10px 0px;
  border-radius: 10px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  z-index: 1001; /* 更高的 z-index */
}
.post ul li a {
  padding: 20px 27px;
}
/* 悬停二级菜单项时显示三级菜单 */
.post:hover > ul {
  visibility: visible;
  opacity: 1;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* 保持三级菜单显示当鼠标在上面悬停 */
.post ul:hover {
  visibility: visible;
  opacity: 1;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* 悬停时改变颜色 */
.t1 div a:hover,
.post ul li a:hover {
  color: rgb(255, 0, 136);
}
.ban1 {
  padding: 20px;
}
.ban2 {
  display: flex;
  justify-content: space-between;
  font-size: 18px;
}
.ban21 {
  margin-left: 30px;
}
.ban22 {
  cursor: pointer;
  margin-right: 30px;
  padding: 10px 20px;
  border-radius: 10px;
  background-color: rgb(215, 232, 252);
}
.ban3 {
  height: 600px;
  background-color: rgb(215, 232, 252);
}
/* .ban3 {
  position: relative;
  width: 95%;

  margin: 0 auto;
  overflow: hidden;
} */

.ban3 {
  position: relative;
  overflow: hidden;
  width: 95%;
  margin: 0 auto;
}

.carousel-container {
  display: flex;
  transition: transform 0.5s ease-in-out;
}

.carousel-container a {
  flex: 0 0 100%;
  width: 100%;
}

.carousel-container img {
  width: 10%;
  height: 100%;
  display: block;
}

.carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  border: none;
  padding: 10px 20px;
  cursor: pointer;
  font-size: 20px;
  z-index: 10;
}

.prev-btn {
  left: 10px;
}

.next-btn {
  right: 10px;
}
.ban4 {
  margin-top: 20px;
}
.ban23 {
  width: 170px;
  font-size: 18px;
  margin-left: 30px;
  padding: 20px 20px;
  border-radius: 10px;
  background-color: rgb(215, 232, 252);
  margin-top: 30px;
}
.ban23s {
  width: 170px;
  font-size: 18px;
  margin-left: 30px;
  padding: 30px 25px;
  border-radius: 10px;
  background-color: rgb(215, 232, 252);
}
.ban23s a {
  text-decoration: none;
  color: #000;
}
.ban23s1 {
  width: 230px;
  font-size: 18px;
  text-align: center;
  margin-left: 30px;
  padding: 20px 25px;
  border-radius: 10px;
  background-color: rgb(215, 232, 252);
}
.ban23s1 a {
  text-decoration: none;
  color: #000;
}
.ban24 {
  margin: auto;
  width: 1100px;
  padding-left: 20px;
  font-size: 20px;
  padding-top: 20px;
  height: 200px;
  background-color: rgb(215, 232, 252);
}
.ban24s {
  margin: auto;
  width: 1100px;
  padding-left: 20px;
  font-size: 20px;
  padding-top: 20px;
  height: 230px;
  background-color: rgb(215, 232, 252);
}
.ban25 {
  margin: auto;
  width: 1100px;
  padding-left: 20px;
  font-size: 20px;
  padding-top: 20px;
  height: 650px;
  background-color: rgb(215, 232, 252);
}
.ban25 img {
  width: 98%;
}
.ban26 {
  margin: auto;
  width: 1100px;
  padding-left: 20px;
  font-size: 20px;
  padding-top: 20px;
  height: 240px;
  background-color: rgb(215, 232, 252);
}
.ban2t {
  display: flex;
  margin-bottom: 30px;
}
.ban2t a {
  text-decoration: none;
  color: #000;
}
/* 二级菜单样式 */
.zz1s {
  position: absolute;
  z-index: 1000; /* 增加 z-index */
  background-color: white;
  list-style: none;

  padding: 10px;
  top: 100px;
  border-radius: 10px;
  visibility: hidden; /* 使用 visibility */
  opacity: 0;
  transition: visibility 0s, opacity 0.3s;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.zz1s p {
  font-size: 15px;
  height: 30px;
  line-height: 30px;
  color: #000;
}

.zz1s a {
  padding: 0px 25px;
  font-size: 15px !important;
}

/* 悬停一级菜单时显示二级菜单 */
.op:hover .zz1s {
  visibility: visible;
  opacity: 1;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* 三级菜单样式 */
.posts {
  position: relative;
}

.posts ul {
  position: absolute;
  left: 100px; /* 调整位置以避免重叠 */
  top: 0px;
  /* 调整宽度 */
  list-style: none;
  visibility: hidden;
  width: 125px;
  opacity: 0;

  transition: visibility 0s, opacity 0.3s;
  background-color: white;
  padding: 10px 0px;
  border-radius: 10px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  z-index: 1001; /* 更高的 z-index */
}
.posts ul li a {
  padding: 20px 27px;
}
/* 悬停二级菜单项时显示三级菜单 */
.posts:hover > ul {
  visibility: visible;
  opacity: 1;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* 保持三级菜单显示当鼠标在上面悬停 */
.posts ul:hover {
  visibility: visible;
  opacity: 1;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
/* 悬停时改变颜色 */
.t1s div a:hover,
.post ul li a:hover {
  color: rgb(255, 0, 136);
}
.b1s {
  height: 400px;
  position: relative;
  width: 400px;
  padding-top: 40px;
  padding-left: 30px;
  border-radius: 28.5px;
  background-color: white;
  background-repeat: no-repeat;
  border: 1px solid #000;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  background-size: 100% 100%;
  transition: background-color 0.3s ease;
  /* background-image: url(../img/Frame\ 8.png); */
}
.b1s::after {
  content: "";
  position: absolute;
  border-radius: 28.5px;
  top: 50%;
  left: 50%;
  width: 400px;
  height: 385px;
  background: rgba(214, 232, 253);
  transform: skew(-4deg, 6deg) translate(-50%, -50%);
  z-index: -1;
  transition: background 0.3s ease;
}
.b1s:hover::after {
  background: rgba(166, 210, 255);
  /* 悬停时的颜色 */
}
.bb3s {
  /* width: 418px;
  height: 300px; */
  margin-left: -30px;

  margin-top: -50px;
}
.bb3s img {
  border-radius: 10px;
  width: 100%;
  height: 100%;
}
.bs {
  display: flex;
  margin-top: 50px;
  margin: 100px auto 0px;
  justify-content: space-around;
}
.bs a {
  text-decoration: none;
  color: #000;
}
