﻿/*
 * Extracted from css/widget.css, lines 55419-55569
 * Region label: CB-007 : KSE-Carousel banner-560
 */
    /*#region CB-007 : KSE-Carousel banner-560*/

    .cb007 .banner-master .container-banner {
        height: 560px;
        max-height: 560px;
        border-bottom: 0px;
    }

    .cb007 .banner-master .swiper-slide {
        position: relative; /* เพื่อจัดการตำแหน่งขององค์ประกอบภายใน */
        overflow: hidden; /* ป้องกันองค์ประกอบล้นออกมา */
    }

    .cb007 .banner-master picture img {
        position: absolute; /* กำหนดภาพให้วางบน container */
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover; /* ทำให้ภาพครอบคลุม container โดยไม่เสียอัตราส่วน */
        z-index: 1; /* จัดรูปให้อยู่ด้านล่างข้อความ */
    }

    .cb007 .banner-master .text-overlay {
        position: relative; /* ทำให้ข้อความซ้อนทับได้ */
        z-index: 2; /* ข้อความอยู่ด้านบนรูปภาพ */
        color: white; /* สีข้อความให้เด่นชัด */
    }

    .cb007 .banner-master .gradient {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 3; /* Gradient อยู่ด้านบนรูปภาพ แต่ด้านล่างข้อความ */
        /*background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));*/ /* Gradient โปร่งใส */
    }

    @media (max-width: 767px) {
        .cb007 .banner-master {
            height: 400px;
            max-height: 400px;
        }

            .cb007 .banner-master picture img {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 400px;
                max-height: 400px;
                object-fit: cover;
            }
    }

    .cb007 .banner-master {
        height: 560px;
        overflow: hidden;
        position: relative;
    }

    .cb007 .shadow-text {
        text-shadow: 2px 3px 4px #000000b8;
    }

    .cb007 .color-white {
        color: #ffffff;
    }

    .cb007 .mt-8px-all {
        margin-top: 8px;
    }

    @media (max-width: 767px) {
        .cb007 .banner-master picture img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 400px !important;
            max-height: 400px;
            object-fit: cover;
        }

        .cb007 .banner-master .container-banner {
            height: 400px;
            max-height: 400px;
            border-bottom: 0px;
        }
    }

    .cb007 .banner-master .swiper-slide {
        position: relative; /* เพื่อให้สามารถควบคุม z-index */
    }

    .cb007 .banner-master picture img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover; /* ปรับให้รูปภาพครอบคลุม */
    }

    .cb007 .banner-master .text-overlay {
        position: relative;
        z-index: 1; /* ข้อความอยู่ด้านล่าง */
    }

    .cb007 .swiper-pagination .swiper-pagination-bullet {
        border: 2px solid #fff;
        width: 10px;
        height: 10px;
        margin: 5px 7px;
        background: #d6d6d6;
        -webkit-backface-visibility: visible;
        transition: opacity 200ms ease;
        border-radius: 30px;
        width: 13px;
        height: 13px;
        margin-left: 12px;
        margin-right: 12px;
        background: transparent;
        border: 2px solid #fff;
        opacity: unset;
    }

        .cb007 .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
            background: #ad8b19;
            border: unset
        }

    .cb007 .banner-master:before {
        content: ' ';
        position: absolute;
        width: 100%;
        height: 120px;
        opacity: .8;
        background: linear-gradient(180deg, #222 0%, rgba(71, 71, 71, 0) 100%);
        z-index: 2;
    }

    .cb007 .text-right {
        text-align: -webkit-right !important;
    }

    .cb007 .text-center {
        text-align: -webkit-center !important;
    }

/*CM-007*/
.cm007 button#mockBtn {
    cursor: pointer;
    color: #3c3a3a;
    border: none;
    border-radius: 0 3px 3px 0;
    background: #ffd400 !important;
    width: 52px !important;
    height: 44px;
    min-width: auto;
    float: right;
    text-align: center;
    display: inline-block;
}

.cm007 button,
select {
    text-transform: none;
}

.cm007 button,
input {
    overflow: visible;
}

.cm007 button,
input,
optgroup,
select,
textarea {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

.cm007 button {
    border-radius: 0;
}

.cb007 h2.shadow-text.mt-40px-all.color-white {
    font-family: thongterm-bold !important;
}


    /* #endregion CB-007 : KSE-Carousel banner-560*/
