.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );}.elementor-745 .elementor-element.elementor-element-8e9443a img{opacity:1;}.elementor-745 .elementor-element.elementor-element-b8b4d0a{width:var( --container-widget-width, 101.717% );max-width:101.717%;--container-widget-width:101.717%;--container-widget-flex-grow:0;}.elementor-745 .elementor-element.elementor-element-b8b4d0a.elementor-element{--flex-grow:0;--flex-shrink:0;}@media(max-width:1024px){.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}}@media(max-width:767px){.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}}/* Start custom CSS for wp-widget-nav_menu, class: .elementor-element-b8b4d0a *//* =========================================
   1. จัดกลุ่มกล่องให้อยู่กึ่งกลางหน้า
========================================= */
.elementor-745 .elementor-element.elementor-element-b8b4d0a ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 auto !important; 
    
    /* ใช้ Flexbox ดันกล่องทั้งหมดให้อยู่ตรงกลางคอลัมน์ */
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; 
    width: 100% !important;
}

.elementor-745 .elementor-element.elementor-element-b8b4d0a li::marker,
.elementor-745 .elementor-element.elementor-element-b8b4d0a li::before {
    display: none !important;
    content: "" !important;
}

/* =========================================
   2. ดีไซน์กล่องเมนู (ตัวหนังสือชิดซ้าย)
========================================= */
.elementor-745 .elementor-element.elementor-element-b8b4d0a li {
    margin-bottom: 10px !important; 
    width: 100% !important;
    /* จำกัดความกว้างของกล่องให้เท่ากันทุกข้อ (ปรับลด-เพิ่มตัวเลข 350px นี้ได้ครับ) */
    max-width: 350px !important; 
}

.elementor-745 .elementor-element.elementor-element-b8b4d0a li > a {
    display: block !important;
    padding: 14px 25px !important; 
    text-align: left !important; /* ⭐ บังคับตัวหนังสือให้ชิดซ้าย */
    
    /* สีสัน */
    background-color: #f0f8ff !important; 
    color: #0b598b !important; 
    font-size: 16px !important;
    font-weight: bold !important; 
    text-decoration: none !important;
    
    /* กรอบและเงา */
    border-radius: 8px !important; 
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05) !important; 
    border: 1px solid #dcecf8 !important; 
    
    transition: all 0.3s ease !important; 
}

/* =========================================
   3. เอฟเฟกต์เวลาเอาเมาส์ไปชี้ (Hover)
========================================= */
.elementor-745 .elementor-element.elementor-element-b8b4d0a li > a:hover {
    background-color: #1a82c4 !important; 
    color: #ffffff !important; 
    
    /* เอฟเฟกต์ลอยขึ้น */
    transform: translateY(-4px) !important; 
    box-shadow: 0 8px 15px rgba(26, 130, 196, 0.25) !important; 
    
    /* ลูกเล่นเสริม: เลื่อนตัวหนังสือไปทางขวานิดนึงเวลาชี้เมาส์ */
    padding-left: 32px !important; 
}/* End custom CSS */