:root {
  --qing-pic-text-tip-size: 16px;
  --qing-pic-text-title-size: 36px;
  --qing-pic-text-p-size: 20px;
  --color-primary: #0066cc;
  --title-text-color: #fff;
}

/* æ¿å—å…¨å± 1920px */
.qing_pic_text {
  width: 100%;
  margin: 0 auto;
  padding: 0;
  position: relative;
  overflow: hidden;
  min-height: 680px;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: bgFade 1.2s ease;
}

/* èƒŒæ™¯æ¸å˜é®ç½©ï¼ˆè®©æ–‡å­—æ›´æ¸…æ™°ï¼‰ */
.qing_pic_text::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #2161c2 0%, #1f61c257 50%, #3a506bcc 100%);
  z-index: 1;
}

/* èƒŒæ™¯åŠ¨ç”» */
@keyframes bgFade {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}

/* å›¾ç‰‡é“ºæ»¡æ•´ä¸ªæ¿å— */
.qing_pic_text .pic {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.qing_pic_text .pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* æ–‡å­—æ‚¬æµ®åœ¨å›¾ç‰‡ä¸Šæ–¹ 1440px å±…ä¸­ */
.qing_pic_text .txt {
  position: relative;
  z-index: 2;
  width: 100%;
  /* max-width: 1440px; */
  padding: 0 24px;
  color: #fff;
  text-align: center;
  animation: textSlide 1s .3s forwards;
  opacity: 0;
}

@keyframes textSlide {
  to { opacity: 1; transform: translateY(0); }
  from { opacity: 0; transform: translateY(20px); }
}

.qing_pic_text .txt .tip {
  color: #6fffe9;
  font-size: var(--qing-pic-text-tip-size);
  margin-bottom: 8px;
  display: none;
}

.qing_pic_text .txt h3 {
  color: #fff;
  margin: 0 0 30px;
  font-size: clamp(24px, 2.40vw, 46px);
  line-height: 1.3;
  font-weight: 700;
  text-transform: uppercase;
}

.qing_pic_text .txt .content {
  font-size: clamp(14px, 0.94vw, 18px);
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.95);
  max-width: 1400px;
  margin: 0 auto;
  text-align: left;
}

/* ===================== å“åº”å¼ ===================== */
@media screen and (max-width: 992px) {
  .qing_pic_text {
    min-height: 550px;
  }
  .qing_pic_text .txt {
    padding: 0 24px;
  }
  .qing_pic_text .txt h3 {
    margin: 0 0 20px;
  }
}

@media screen and (max-width: 768px) {
  .qing_pic_text .txt .content {
    text-align: center;
    line-height: 22px;
  }  
  
  .qing_pic_text .txt h3 {
    margin: 0 0 20px;
  }

}

@media screen and (max-width: 480px) {

  .qing_pic_text .txt h3 {
    margin: 0 0 10px;
  }
}