table {
    border-spacing: 0;
    border-collapse: collapse;
}
[class^="bi-"]::before, [class*=" bi-"]::before {
    line-height: unset;
}
body {

}

/* ##################### Table ##################### */
table {
    width: 100%;
    border-collapse: collapse;
}

    table th, table td {
        vertical-align: top;
        padding: 0.5rem 0.5rem;
    }

.table > :not(caption) > * > * {
    background-color: rgba(0,0,0,0);
}

/* =============================== Bootstap ======================================== */
.list-group {
    margin-bottom: 1rem;
}

.embed-responsive {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    overflow: hidden;
}

.embed-responsive-16by9::before {
    padding-top: 56.25%;
}

.embed-responsive::before {
    display: block;
    content: "";
}

.embed-responsive .embed-responsive-item, .embed-responsive embed, .embed-responsive iframe, .embed-responsive object, .embed-responsive video {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.navMenuBox428BCA {
    background-color: white;
}

.navMenu428BCA {
    margin: 5px 0;
    padding: 5px;
    border-left: 4px solid #428BCA;
}

.navMenuBoxWhite {
    background-color: white;
}

.navMenuWhite {
    margin: 5px 0;
    padding: 5px;
    border-left: 4px solid #666;
}

.navMenuGray {
    margin: 5px 0;
    padding: 5px;
    border-left: 4px solid #eee;
}

.navMenuBoxGray {
    background-color: #f3f3f3;
    border-color: #d0d0d0;
}

.navMenuGreen {
    margin: 5px 0;
    padding: 5px;
    border-left: 6px solid #003300;
}

.navMenuBoxGreen {
    background-color: #608a0b;
    border-color: #003300;
}

.headerBox428BCA {
    display: block;
    color: #fafafa;
    background-color: #005E00;
    padding: 5px 5px 5px 5px;
}

.headerBoxD3D3D3 {
    display: block;
    color: #3b3b3b;
    background-color: #D3D3D3;
    padding: 5px 5px 5px 5px;
}


.headerBar005E00 {
    display: block;
    color: #005E00;
    border-bottom: 2px solid #005E00;
    padding: 5px 5px 5px 5px;
}

.headerBar7DBE32 {
    display: block;
    color: #333;
    border-bottom: 2px solid #7DBE32;
    padding: 5px 5px 5px 5px;
}

.headerBarAC193D {
    display: block;
    color: #333;
    border-bottom: 2px solid #AC193D;
    padding: 5px 5px 5px 5px;
}

.headerBarF04F03 {
    display: block;
    color: #333;
    border-bottom: 2px solid #F04F03;
    padding: 5px 5px 5px 5px;
}

.headerBar8C0095 {
    display: block;
    color: #333;
    border-bottom: 2px solid #8C0095;
    padding: 5px 5px 5px 5px;
}

.headerBar0072C6 {
    display: block;
    color: #333;
    border-bottom: 2px solid #0072C6;
    padding: 5px 5px 5px 5px;
}

.headerBar4617B4 {
    display: block;
    color: #333;
    border-bottom: 2px solid #4617B4;
    padding: 5px 5px 5px 5px;
}

.headerBar008A17 {
    display: block;
    color: #333;
    border-bottom: 2px solid #008A17;
    padding: 5px 5px 5px 5px;
}

.headerBarDC4FAD {
    display: block;
    color: #333;
    border-bottom: 2px solid #DC4FAD;
    padding: 5px 5px 5px 5px;
}
/* =============================== Media Window Width ======================================== */
@media (max-width:575px) {
    /* window xs */

}

@media (min-width:576px) {
    /* window sm */

}

@media (min-width:768px) {
    /* window md */

}

@media (min-width:992px) {
    /* window lg */

}

@media (min-width:1200px) {
    /* window xl */

}

@media (min-width:1400px) {
    /* window xxl */

}

/* =============================== Banner ======================================== */
.carousel {
    background: url('../images/BGbanner.jpg') no-repeat center;
    background-size: cover;
    margin-bottom: 1rem;
}

/* =============================== Control Object ======================================== */
table.radioList-vertical{
    width:100%;
}
    table.radioList-vertical td {
        padding: 10px;
        border-bottom: 1px solid #dee2e6;
    }
    table.radioList-vertical td input{
        margin-right:0.75rem;
    }

/* =============================== Animation ======================================== */
.animation-box-move-up {
    /* ทำให้ animation นุ่ม */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    /* เมื่อ hover */
    .animation-box-move-up:hover {
        transform: translateY(-10px);
        box-shadow: 0 10px 10px rgba(0,0,0,0.2);
    }

.animation-box-line-move-bottom {
    position: relative;
}

    .animation-box-line-move-bottom::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: -3px; /* ระยะห่างจากข้อความ */
        width: 100%;
        height: 2px;
        background-color: #017f3f;
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.3s ease;
    }

    /* เมื่อ hover */
    .animation-box-line-move-bottom:hover::after {
        transform: scaleX(1);
        transform-origin: left;
    }

    /* ตอนเอาเมาส์ออก */
    .animation-box-line-move-bottom::after {
        transform-origin: left;
    }