/* =====================================================
   ganran.css — 常见胸骨感染列表页（listganran）
   依据：常见胸骨感染.psd (1920x2900)
   依赖：css2/css3/style/index/about/ketang.css，本文件最后加载
   ===================================================== */

/* ---- 顶部照片带 + 团队水滴（结构同 ketang-hero / ketang-team） ---- */
.ganran-hero {
  position: relative;
  height: 44.36rem;
  background: url(../image/ganran-band.jpg) top center / cover no-repeat;
}
.ganran-team {
  position: absolute;
  top: 13.86rem;
  right: 6.77%;
  width: 36.2%;
  max-width: 695px;
  pointer-events: none;
  z-index: 1;
}
.ganran-team img { display: block; width: 100%; height: auto; }

/* ---- 白区（暖白底，与贴片下部烘焙底色一致） ---- */
.ganran-main { background: #f9f5f2; padding-bottom: 6rem; }
.ganran-head { padding-top: 5.1rem; }
.ganran-head .title-uppercase { margin: 0 0 0.6rem; color: #0f2552; }
.ganran-head .sec-en { margin: 0; color: #9aa3b0; }
.ganran-main .case-row { margin-top: 3.5rem; }

/* ---- 响应式 ---- */
@media (max-width: 1199px) {
  .ganran-hero { height: 36rem; }
  .ganran-team { top: 9rem; right: 3%; width: 40%; }
}
@media (max-width: 991px) {
  .ganran-hero { height: 30rem; }
  .ganran-team { top: 7rem; width: 44%; }
  .ganran-head { padding-top: 3.4rem; }
  .ganran-main .case-row { margin-top: 2.4rem; }
  .ganran-main { padding-bottom: 4rem; }
}
@media (max-width: 767px) {
  .ganran-hero { height: 24rem; }
  .ganran-team { top: 5.5rem; width: 52%; right: 2%; }
  .ganran-head { padding-top: 2.6rem; }
  .ganran-main .case-row { margin-top: 2rem; }
}