.swiper-container {
  width: 100%;
  height: 300px; /* 适当设置轮播图高度 */
}

.swiper-slide {
  display: flex;
  justify-content: center;  /* 居中内容 */
    /* 垂直居中 */
}
.card-content-wrapper {
  display: flex; /* 使用 Flexbox 布局 */
  justify-content: space-between; /* 两边对齐 */
}

.text-content {
  flex: 0 0 30%; /* 文字部分占 30% 宽度 */
  padding: 10px;
}

.image-content {
  flex: 0 0 70%; /* 图片部分占 70% 宽度 */
}

ion-card {
  width: 100%;  /* 控制卡片宽度 */
   /* 居中显示 */
   
}
.card-image {
  height: auto;  /* 保持图片比例 */
  max-height: 250px;  /* 限制图片最大高度 */
}
.swiper-pagination {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
}
.page-content {
  background: linear-gradient(#135, #5cb85c, #20c997) !important; 
  
}
.card-style {
  border-radius: 10px;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  margin-bottom: 16px;
}

.card-image {
  width: 100%;
  height: auto;
  border-bottom: 2px solid #ddd;
}
.card-style:hover {
  transform: scale(1.05);
  box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.3);
  transition: all 0.3s ease-in-out;
}

ion-button {
  transition: transform 0.2s ease, background-color 0.3s ease;
}
ion-button:active {
  transform: scale(0.95);
  background-color: #218838;
}
ion-card-header {
  background-color: rgba(255, 255, 255, 0.1);
  padding: 10px;
  margin-bottom: 10px;
}

ion-card-title {
  font-weight: bold;
}
.large-avatar {
  width: 100px; /* 将头像宽度设置为 80px */
  height: 100px; /* 将头像高度设置为 80px */
}

.large-avatar img {
  width: 100%; /* 图片宽度占满头像 */
  height: 100%; /* 图片高度占满头像 */
  object-fit: cover; /* 保证图片填充整个头像区域，且保持图片的比例 */
}
ion-button {
  margin-top: 15px;
}

ion-button.success {
  background-color: #2874a7;
 
  border-radius: 5px;
  font-weight: bold;
}

ion-button.outline {
  border: 1px solid #287fa7;
  color: #2878a7;
  border-radius: 5px;
}

ion-footer {
  color: white;
  font-size: 10px;
}
