/* R108_AAA_PACKAGES_MOBILE_EQUAL_SIDES_V132_CSS_ACTIVE */

@media (max-width: 760px) {
  /* โมดูล Packages ใช้ความกว้างเดียวกับโมดูลอื่น และจัดกึ่งกลางจริง */
  html body#r108-landing-body #packages.landing-managed-section {
    width: 97vw !important;
    max-width: 97vw !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }

  /* เอา padding และ margin ซ้อนของ container ออก */
  html body#r108-landing-body #packages > .container {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  html body#r108-landing-body #packages .section-head {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* ยกเลิกกฎเก่า 94vw ที่เลื่อนกริดจากกึ่งกลาง viewport ทำให้ซ้ายขวาไม่เท่ากัน */
  html body#r108-landing-body #packages .aaa-package-image-grid {
    position: static !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
    box-sizing: border-box !important;
  }

  html body#r108-landing-body #packages .aaa-package-image-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  html body#r108-landing-body #packages .aaa-package-image-card img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    object-fit: cover !important;
    box-sizing: border-box !important;
  }

  html body#r108-landing-body #packages .r108-package-pagination {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
}
