<style>
body { background: #f8f9fa; }
        h4 { color: #0d6efd; }
/* กำหนดสไตล์สำหรับรูปภาพผู้บริหาร */

.executive-photo {
    /* กำหนดขนาดตายตัวให้รูปภาพเป็นวงกลมและเท่ากันทุกภาพ */
    width: 100px ; 
    height: 100px ; 
    
    /* สำคัญ: object-fit: cover; ทำให้ภาพเต็มพื้นที่ 150x150 โดยไม่ผิดสัดส่วน */
    object-fit: cover; 
    
    border: 5px solid #007bff; /* ขอบสีน้ำเงินดูโดดเด่น */
}
/* จัดกึ่งกลางรูปภาพและเพิ่มระยะห่างด้านบน */
.card-img-top-wrapper {
    text-align: center;
    padding-top: 20px;
    padding-bottom: 10px;
}

/* สไตล์ Card: เพิ่มความทันสมัยและดูสะอาดตา */
.card {
    border-radius: 15px; /* มุมโค้งมน */
    border: none;
    transition: transform 0.3s ease; /* เพิ่ม Transition เพื่อให้ดูนุ่มนวล */
}

/* Hover Effect: เมื่อเอาเมาส์ไปชี้ */
.card:hover {
    transform: translateY(-5px); /* ยก Card ขึ้นเล็กน้อย */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15) !important;
}

/* จัดให้ข้อมูลติดต่ออยู่ซ้ายมือของพื้นที่ที่กำหนด */
.contact-info {
    padding-left: 10px;
}

/* สีตำแหน่งที่โดดเด่น */
.text-primary.fw-bold {
    color: #007bff !important;
    font-size: 1.15rem;
}
.text-secondary {
    color: #6c757d !important;
    font-size: 1rem;
}

/* สำหรับจอเล็ก: จัดให้รองนายกฯ มี Card 100% และจัดกึ่งกลางอัตโนมัติ */
@media (max-width: 576px) {
    .col-sm-6 {
        /* บังคับให้ Card เต็มความกว้างในจอเล็ก */
        width: 100%;
    }
}
a{
    text-decoration: none;
    
}

</style>