.container {  
  padding: 0;  
  display: flex;  
  flex-direction: column;  
  width: 100%; /* 宽度占满整个屏幕 */  
  /* height: 100%; */
  
}
.toptwo{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.classname{
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  margin-top: 5rpx;
  text-align: center;
  font-family: "Lucida Calligraphy", cursive, serif, sans-serif;
  font-size: 70rpx;  /* 字体大小 */
  color: rgb(224, 222, 222);
  font-weight: bolder;
  z-index: 20;
  width:100%;
}

.blackboard{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  z-index: 10;

}
image{
  width: 750rpx;
}

.attend {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 20rpx;
}

.ope {
  display: flex;
  margin-left: 20rpx;
  margin-right: 20rpx;
}

.class_button {  
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 20rpx;
  padding-right: 20rpx;  
  /* font: large; */
  background-color: #3f5a3b; /* 淡蓝色 */  
  color: white;  
  border: none;  
  border-radius: 35rpx;  
  margin-bottom: 20rpx;  
  font-size: 22px;
}  

.roll {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 20rpx;
}

.r1 {
  text-align: center;
  font-size:45rpx;
  padding-left: 5rpx;
  padding-right: 5rpx;
  font-weight: bold;
}
.scroll-text {  
  font-size: 24px;  
  font-weight: bold;  
  white-space: nowrap;  
}
.teacher {
  width: 150px;
  height: auto;
  margin-left: 100rpx;
  /* margin-right: -300rpx; */

}

.surperise {  
  display: flex;  
  align-items: center; /* 垂直居中 */  
  justify-content: center; /* 水平居中，但这里可能不需要，因为我们希望元素靠左对齐但内部居中 */  
  width: 100%;  
  box-sizing: border-box; /* 确保padding不影响宽度 */  
  padding: 50rpx; /* 可选，增加内边距以避免内容紧贴边缘 */  
  /* margin-top: -40rpx;
  margin-bottom: 60rpx; */
  /* justify-content: space-between; 移除这个，因为我们不需要元素之间的间距 */  
  
}  
  
.s {  
  width: 60rpx;   /* 适当调整宽度 */  
  height: 60rpx;  /* 适当调整高度 */  
  margin-right: 20rpx; /* 调整图标和文字之间的间距 */  
  /* background-color: lightblue;  移除背景颜色，实际使用时不需要 */  
  /* background-color: lightblue; */
}  
  
.word {  
  display: flex; /* 保持flex布局，但这里其实不需要设置display: flex，因为里面只有一个子元素 */  
  align-items: center; /* 保持垂直居中，但这里其实可以省略，因为默认就是居中的 */  
  /* flex-direction: column; 移除这个，因为我们不需要纵向排列 */  
}  
  
.s1 {  
  font-size: 20px;  
  font-weight: bolder;  
}