.elementor-10884 .elementor-element.elementor-element-315d8b8c{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:18px 18px;--row-gap:18px;--column-gap:18px;--margin-top:60px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-widget-gallery .elementor-gallery-item__title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-gallery .elementor-gallery-item__description{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-gallery{--galleries-title-color-normal:var( --e-global-color-primary );--galleries-title-color-hover:var( --e-global-color-secondary );--galleries-pointer-bg-color-hover:var( --e-global-color-accent );--gallery-title-color-active:var( --e-global-color-secondary );--galleries-pointer-bg-color-active:var( --e-global-color-accent );}.elementor-widget-gallery .elementor-gallery-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-10884 .elementor-element.elementor-element-e038aa6 .e-gallery-item:hover .elementor-gallery-item__overlay, .elementor-10884 .elementor-element.elementor-element-e038aa6 .e-gallery-item:focus .elementor-gallery-item__overlay{background-color:rgba(0,0,0,0.5);}.elementor-10884 .elementor-element.elementor-element-e038aa6{--image-transition-duration:800ms;--overlay-transition-duration:800ms;--content-text-align:center;--content-padding:20px;--content-transition-duration:800ms;--content-transition-delay:800ms;}@media(max-width:880px){.elementor-10884 .elementor-element.elementor-element-315d8b8c{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}}@media(min-width:768px){.elementor-10884 .elementor-element.elementor-element-315d8b8c{--width:968px;}}/* Start custom CSS for gallery, class: .elementor-element-e038aa6 *//* --- CSS สำหรับดีไซน์ Gallery แบบ Grid --- */

/* 1. กำหนดให้ Container เป็น Grid และสร้างโครงสร้างหลัก */
.galleryv2 .elementor-gallery__container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: auto;
  gap: 20px;
}

/* 2. กำหนดให้รูปภาพเต็มพื้นที่ในช่องของตัวเอง */
.galleryv2 .e-gallery-item .e-gallery-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 3. จัดวางรูปภาพแต่ละชิ้นลงใน Grid ตามลำดับ */
.galleryv2 .elementor-gallery__container .e-gallery-item:nth-child(1) {
  grid-row: span 2;
  margin-top: 50%;
  margin-bottom: 50%;
}

.galleryv2 .elementor-gallery__container .e-gallery-item:nth-child(2) {
  grid-column: span 2;
}

.galleryv2 .elementor-gallery__container .e-gallery-item:nth-child(3) {
    margin-right: 30px;
}

.galleryv2 .elementor-gallery__container .e-gallery-item:nth-child(4) {
  /* ไม่ต้องกำหนดค่าพิเศษ ใช้ขนาด 1x1 ตามปกติ */
}

.galleryv2 .elementor-gallery__container .e-gallery-item:nth-child(5) {
  grid-column: span 2;
}

/* 🔥🔥 โค้ดที่เพิ่มเข้ามาใหม่ 🔥🔥
  ซ่อนรูปภาพตั้งแต่ลำดับที่ 7 เป็นต้นไป 
*/
.galleryv2 .elementor-gallery__container .e-gallery-item:nth-child(n + 6) {
  display: none;
}

.elementor-lightbox-prevent-close .e-eicon-share-arrow,
.elementor-lightbox-prevent-close .e-eicon-zoom-in-bold,
.e-eicon-frame-expand,
.elementor-slideshow__footer{
    display: none;
}

/* 4. ทำให้รองรับการแสดงผลบนมือถือ (Responsive) */
@media (max-width: 1024px) {
    
  .galleryv2 .elementor-gallery__container {
    grid-template-columns: repeat(6, 4fr) !important;
    gap: 10px;
  }

.galleryv2 .elementor-gallery__container .e-gallery-item:nth-child(1) {
  grid-row: span 1;
  grid-column: span 6;
  margin-top: 0%;
  margin-bottom: 0%;
}

.galleryv2 .elementor-gallery__container .e-gallery-item:nth-child(2) {
  grid-column: span 2;
}

.galleryv2 .elementor-gallery__container .e-gallery-item:nth-child(3) {
    grid-column: span 4;
    margin-right: 0px;
}

.galleryv2 .elementor-gallery__container .e-gallery-item:nth-child(4) {
  grid-column: span 4;
}

.galleryv2 .elementor-gallery__container .e-gallery-item:nth-child(5) {
  grid-column: span 2;
}

}


.galleryv2 .e-gallery-item {
  background-color: #f0f0f0; /* สีของพื้นที่ขณะรอรูปโหลด */
  overflow: hidden; /* ป้องกันไม่ให้รูปภาพล้นขอบตอนทำ Animation */
}

/* กำหนดสถานะเริ่มต้นของรูปภาพ: ทำให้โปร่งใสและขยายใหญ่เล็กน้อย */
.galleryv2 .e-gallery-item .e-gallery-image {
  opacity: 0;
  transform: scale(1.05); /* เริ่มจากขนาดใหญ่กว่าปกติเล็กน้อย */
  transition: opacity 0.6s ease-out, transform 0.6s ease-out; /* กำหนดความเร็วของ Animation */
}

/* กำหนดสถานะเมื่อรูปภาพโหลดเสร็จแล้ว: ทำให้มองเห็นและกลับมาขนาดปกติ */
.galleryv2 .e-gallery-item .e-gallery-image.e-gallery-image-loaded {
  opacity: 1;
  transform: scale(1); /* กลับสู่ขนาดปกติ */
}

.elementor-lightbox .swiper .swiper-pagination-fraction {
    display: none;
}
.elementor-lightbox .dialog-lightbox-close-button {
    margin-top: 4vh !important;
    margin-right: 14vw;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-315d8b8c */.elementor-10884 .elementor-element.elementor-element-315d8b8c {
    cursor: pointer;
    max-width: 100%;
}/* End custom CSS */