/* 设置整个容器的样式 */
.container {
  padding: 0rpx;
  display: flex;
  flex-direction: column;
  /* background-color: #f8f8f8; 轻微的灰色背景 */
  width: 100%; /* 宽度占满整个屏幕 */
  /* height: 100vh;  */
  background-image: linear-gradient(to bottom, #effffa, #f2ffff, #f7feff, #fcfeff, #ffffff);
}
/* 设置副标题文本的样式 */
.subtitle-text {
  /* display: flex; */
  font-size: 20px;
  color: #555;
  max-width: 80%; /*限制文本宽度，防止过长*/
  line-height: 1.5; /* 行高 */
  font-family: "Lucida Calligraphy", cursive, serif, sans-serif;
  font-weight: bold;
}
.swiper-container {  
  overflow: hidden;
  width: 90%;  
  height: 360rpx; /* 根据需要调整高度 */  
  border-radius: 28rpx;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
}  

  
.swiper-image {  
  width: 100%;  
  height: 300rpx;  
}


/* 设置课程列表的样式 */
.course-list {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%; 
}

/* 设置单个课程项的样式 */
.course-item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width:50%; /*设置宽度为容器的50%*/
  margin-top: 10rpx;
  margin-bottom: 40rpx;
  margin-left: 35rpx;
  margin-right: 35rpx;  
  padding: 15rpx;
  background-color: rgb(239, 255, 250); 
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4); 
  border-radius: 28rpx; 
  align-items: flex-start; 
}

.png{
    text-align:center ;
    margin: auto;
    width: 200rpx;  
    height:300rpx; 
  }


/* 设置课程标题的样式 */
.course-title {
  font-size: 16px;
  color: #333;
  margin: auto;
  font-weight: bolder; 
}

/* 设置课程内容的样式
.course-content {
  font-size: 14px;
  color: #555;
  opacity: 0.8; 降低透明度，以区分标题和内容 
  line-height: 1.5;
} */

.NewLesson{
  background-color: transparent;
  border-style: none;
}


/* 为课程项添加鼠标悬停效果 */
.course-item:hover {
  transform: translateY(-5px); /* 向上移动 */
  transition: transform 0.3s ease-in-out; /* 平滑过渡动画 */
}
.category-contanier{
  /*课程列表大容器*/
  width: 100%;
}

.lessonlist{
  /*课表*/
  display: flex;
  flex-direction: column;
  align-items: center;/*垂直居中*/
  justify-content: center;/*水平居中*/
  width: 100%;
}

.list_container{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;/*垂直居中*/
  justify-content: center;/*水平居中*/
  width: 100%;
  height: 475rpx;
}
.blackboard{
  position: absolute;
  z-index: 1;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 1.0);
}

.li-item-father{
  position: absolute;
  z-index:2;
}
.li-item{
  width: 80%;
  padding: 20rpx; 
  /* border:  1rpx solid gray; */
  border-radius: 27rpx; 
  text-align: center;
  margin-top: 30rpx;
}
.li-name{
  font-size: 50rpx;
  font-family: "Lucida Calligraphy", cursive, serif, sans-serif;
  font-weight: bolder;
  color: #f7feff;
}
.li-status{
  font-size:40rpx;
  font-weight: bold;
  color: #ffffff;
}