/*
    * Globals
    */

    .onepage-pagination{
        margin: 0px;
    }

    * {
        font-family: Zeekr Headline, Noto Sans Thai, sans-serif;
        font-weight: 400;
    }

    /* Custom default button */
    .btn-light,
    .btn-light:hover,
    .btn-light:focus {
        color: #333;
        text-shadow: none;
        /* Prevent inheritance from `body` */
    }

    .btn-outline-primary {
        border: solid 1px #ED8734;
        color: #ED8734;
        background-color: transparent;
    }

    .btn-outline-primary:hover {
        background-color: transparent;
        color: #ED8734;
        border: solid 1px #ED8734;

    }

    .btn-outline-primary:active {
        background-color: #ED8734 !important;
        color: #ED8734;
        border: solid 1px #ED8734 !important;

    }

    #btn_news_preprev {
        color: #ED8734;

    }

    #btn_news_next {
        color: #ED8734;
    }

    /*
* Base structure
*/

    body {
        /* text-shadow: 0 .05rem .1rem rgba(0, 0, 0, .5); */
        /* box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5); */
    }

    .cover-container {
        /* max-width: 1440px; */
        min-height: 75vh;
        /* background-image: url({{ url('storage/zr01-zeekrx.mp4') }}); */

    }


    /*
* Header
*/

    .mainnav+.sticky-top {
        background-color: #fff;
    }

    .mainnav {
        padding-top: 2em;
        transition: linear 0.3s;
        transition-delay: 0.3s;
        /* background-color: white; */
        transition: linear 0.3s;
        transition-delay: 0.2s;
        padding-bottom: 1em;
        padding-top: 1em;
        color: white;
        /* box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px; */
    }

    .mainnav-sticky-active {
        background-color: white;
        transition: linear 0.3s;
        transition-delay: 0.2s;
        padding-bottom: 1em;
        padding-top: 1em;
        box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
    }



    .mainnav.mainnav-sticky-active .nav-masthead a {
        color: #030303;
    }

    .nav-masthead .nav-link {
        color: rgba(255, 255, 255, 0.932);
        border-bottom: .15rem solid transparent;
        left: 0;

    }

    .nav-masthead .nav-link:hover,
    .nav-masthead .nav-link:focus {
        border-bottom-color: #ED8734;
        transition: width 3s;
    }

    .nav-masthead .nav-link+.nav-link {
        margin-left: 3rem;
    }

    .nav-masthead .active {
        color: #ffffff;
        border-bottom-color: #ED8734;
    }


    .bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
    }


    .carousel-cell-image {
        display: block;
        max-height: 100%;
        margin: 0 auto;
        max-width: 100%;
        opacity: 0;
        -webkit-transition: opacity 0.4s;
        transition: opacity 0.4s;
    }

    /* fade in lazy loaded image */
    .carousel-cell-image.flickity-lazyloaded,
    .carousel-cell-image.flickity-lazyerror {
        opacity: 1;
    }


    @media (min-width: 768px) {

        h1 {
            font-size: 1.5em !important;
        }

        h2 {
            font-size: 1.4rem !important;
            line-height: 1.4em;
        }

        h3 {
            font-size: 1.3rem !important;
        }

        h5 {
            font-size: 1.1rem !important;

        }

        p {
            font-size: 1rem;
            line-height: 1.6rem;
            font-weight: 300;
        }


        .bd-placeholder-img-lg {
            font-size: 3.5rem;
        }
    }

    .b-example-divider {
        width: 100%;
        height: 3rem;
        background-color: rgba(0, 0, 0, .1);
        border: solid rgba(0, 0, 0, .15);
        border-width: 1px 0;
        box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
    }

    .b-example-vr {
        flex-shrink: 0;
        width: 1.5rem;
        height: 100vh;
    }

    .bi {
        vertical-align: -.125em;
        fill: currentColor;
    }

    .nav-scroller {
        position: relative;
        z-index: 2;
        height: 2.75rem;
        overflow-y: hidden;
    }

    .nav-scroller .nav {
        display: flex;
        flex-wrap: nowrap;
        padding-bottom: 1rem;
        margin-top: -1px;
        overflow-x: auto;
        text-align: center;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .btn-bd-primary {
        --bd-violet-bg: #712cf9;
        --bd-violet-rgb: 112.520718, 44.062154, 249.437846;

        --bs-btn-font-weight: 600;
        --bs-btn-color: var(--bs-white);
        --bs-btn-bg: var(--bd-violet-bg);
        --bs-btn-border-color: var(--bd-violet-bg);
        --bs-btn-hover-color: var(--bs-white);
        --bs-btn-hover-bg: #6528e0;
        --bs-btn-hover-border-color: #6528e0;
        --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
        --bs-btn-active-color: var(--bs-btn-hover-color);
        --bs-btn-active-bg: #5a23c8;
        --bs-btn-active-border-color: #5a23c8;
    }

    .bd-mode-toggle {
        z-index: 1500;
    }

    .bd-mode-toggle .dropdown-menu .active .bi {
        display: block !important;
    }

    .sec-h-100 {
        min-height: 100vh;
        width: 100%;
    }

    .cover-content-model {
        bottom: 25%;
    }

    .sec-news {
        background-color: #D7D0C8;
    }

    .swiper {
        width: 100%;
        height: 100%;
        max-height: 100vh;
    }

    .swiper-slide {
        height: auto;
        text-align: center;
        font-size: 18px;
        /* background: #fff;     */
        color: #030303;
        display: block;
        justify-content: center;
        align-items: center;
    }

    .swiper-slide img {
        display: block;
        width: 100%;
        height: auto !important;
        object-fit: cover;
    }

    .swiper-button-prev {
        color: white;
    }

    .swiper-button-next {
        color: white;
    }

    /* .slide-offer{
        display: flex;
    } */

    .slide-offers {
        box-shadow: rgba(0, 0, 0, 0.4) 0px 30px 90px;
    }

    .slide-offers img {
        /* height: 100%; */
        /* max-height: 100vh; */
        box-shadow: rgba(0, 0, 0, 0.4) 0px 30px 90px;
    }

    .item-location {
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 300px;
        overflow: visible;
        transition: all .3s ease;
    }


    .item-location.swiper-slide-active {
        transform: scale(1.5);
        z-index: 2;
        transition: all .3s ease;
    }

    .slide-location .swiper-wrapper {
        align-items: center;

    }

    .slide-location {
        height: 400px;
        width: 98vw;
        /* transform: scale(0.8); */
        /* transform: scale(0.8) */
    }

    /* .slide-location.swiper-slide-active {
        transform: scale(1.4);
        z-index: 2
    } */

    .item-location .card-img-overlay {
        background-color: #0000008f;
        border: 0px;
        justify-content: center;
        display: flex;
        flex-direction: column;
    }

    .item-location .card {
        border: 0px
    }

    .location-slide {
        transition: ease-out 0.2s;
        transition-delay: 0.1s;
        position: relative;

    }

    .location-slide-active {
        transform: scale(1.3);
        transition: ease 0.6s;
        z-index: 1;
        transition-delay: 0.1s;
    }

    .location-slide-active .location-card-overlay {
        display: block;
        transition: all ease-in 0.8s;
    }

    .location-card-overlay {
        top: 0;
        text-align: center;
        align-content: center;
        background-color: #12121573;
        display: none;
        transition: all ease-in-out 0.6s;
    }

    .card-location-detail {
        min-height: 200px;
        background-color: #121215;
        color: white;
        padding: 2em 1em 2em 2em;
    }

    .card-location-detail ul {
        padding: 3em;

    }

    .card-location {
        /* display: ; */
    }

    .card-location .card-location-active {
        display: block !important;
    }

    .location-list li {
        list-style-position: outside;
    }

    .location-list li h5 {
        margin-left: 15px;
        margin-bottom: 1.3em
    }

    .location-list li a {
        color: white;
        text-decoration: none;
    }

    .location-list li:nth-child(1) {
        padding-right: 10px;
        list-style-image:url('/../storage/call.png');

    }


    .location-list li:nth-child(2) {
        list-style-image: url('/../storage/icons8-facebook_25.png');

    }


    .location-list li:nth-child(3) {
        list-style-image: url('/../storage/line.png');
    }

    .location-list li:nth-child(4) {
        list-style-image:url('/../storage/location.png') ;
    }

    .nav-mb {
        display: none;
    }

    btn .nav-mb.active>i {
        color: black;
    }

    body>div.mainnav.mb-auto.w-100.fixed-top.mainnav-sticky-active>div>div:nth-child(3)>button>i {
        color: black !important;
    }

    .swiper-news-pagination {
        display: none;
    }

    @media screen and (max-width:768px) {

        .hero-title {
            min-height: 65vh;
        }

        h1 {
            font-size: 1.5em !important;
        }

        h2 {
            font-size: 1.4rem !important;
            line-height: 1.4em;
        }

        h3 {
            font-size: 1.3rem !important;
        }

        p {
            font-size: 0.9rem;
            line-height: 1.6rem;
            font-weight: 300;
        }

        .box-about img {
            width: 100%;
        }


        .box-about h2 {
            font-size: 1.4em;
        }

        .box-about h4 {
            font-size: 0.9rem;
        }

        .container {
            padding: 0px;
        }

        .row>* {
            padding: 0px;
        }

        .nav-mb {
            display: block
        }

        .mainnav {
            padding-top: 1.4em;
        }

        .nav-masthead {
            display: none !important;
        }

        .mainnav div {
            display: flex;
            /* align-items: center;
            justify-content: space-around; */
        }

        #model_zeekr_009 {
            min-height: 100vh;
        }

        #model_zeekr_x {
            min-height: 100vh;
        }

        .cover-content-model {
            bottom: 37%;
        }

        .cover-content-model>div>h1 {
            font-size: 4em;
        }

        .cover-content-model>div>p {
            font-size: 1.3em;
        }

        .cover-content-model>div>button {
            font-size: 1.3rem !important;
            padding: 1rem 3rem !important;
        }

        .model_more_desc_009 {
            min-height: 46% !important;
            transition: height ease-in 0.6s;
        }

        .model_more_desc_x {
            min-height: 46% !important;

        }

        .sec-news {
            padding: 0px !important;
        }

        .sec-news .swiper-slide img {
            height: 19em !important;
        }

        .sec-news .swiper-slide .slide-news-content {
            padding: 3em 0px !important;
        }

        .sec-news .swiper-slide .slide-news-content div {
            width: 90% !important;
        }

        .sec-news .swiper-button-next {
            display: none;
        }

        .sec-news .swiper-button-disabled {
            display: none;
        }

        .sec-news .swiper-button-prev {
            display: none;
        }

        .swiper-pagination-bullets {
            width: 100% !important;
            transform: none !important;
            display: block;
            background: transparent;
        }

        .swiper-pagination-bullet {
            background: #ffffff00;
            border: solid 3px #ffffff00;
            height: 15px;
            width: 15px;
        }

        .swiper-news-pagination .swiper-pagination-bullet-active {
            color: #030303;
            background: #030303;
        }

        .swiper-pagination-bullet-active {
            border: 1px solid #ffffff00;
            background: #ffffff00;
        }

        .sec-offers {
            padding: 10px 0px !important;
        }

        .sec-offers-img {
            padding: 0px !important;
        }

        .slide-news-content {
            padding: 1em 0px !important;
        }

        .card-location-detail {
            min-height: 250px;
        }

        .card-location-map {
            height: 100%;
            border: 0px;
        }

        .card-location-detail ul {
            padding: 2rem 4rem;
        }

        .zeekr-explain-box {
            padding: 40px 20px;
        }

        .zeekr-explain-items {
            padding: 60px 30px 30px 15px !important;
        }

        .zeekr-carousel-immersive {
            padding: 40px 20px !important;
        }

    }

    .slide-news-content {
        color: white;
    }

    .h-35 {
        min-height: 45%;
    }

    .bg-grey {
        background-color: #D9D9D9;
    }

    .model_more_desc_009 {
        display: none;
        transition: ease-in 0.6s;
    }

    .model_more_desc_x {
        display: none;
        transition: ease-in 0.6s;
    }

    .model_more_desc_x:active {
        transition: ease-in 0.6s;

    }

    .nav-border {
        border-bottom: 2px solid #ED8734;
    }

    .cover-container .carousel-caption h1 {
        font-size: 3em;
    }

    .cover-container .carousel-caption p {
        font-size: 1.5em;
    }

    .carousel-caption {
        bottom: 4.25rem;
    }

    .select-colors-model {
        height: 40px;
        width: 40px;
        border-radius: 50%;
        border: 1px solid black;
        transition: all ease 0.5;
    }

    .select-colors-model.active {
        border: 3px solid white;
        width: 40px;
        height: 40px;
        outline: 1px solid #000;
        transition: all linear 0.5s;
    }

    .select-colors-model.active::after {
        box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;

    }

    .slide-dimention img {
        min-height: auto;
        width: 100%;
    }

    .slide-dimention {
        /* height: 70vh; */
    }

    .slide-dimention .swiper-button-next {
        top: 8em;
        /* font-size: 2em; */
    }

    .slide-dimention .swiper-button-prev {
        top: 8em;
        /* font-size: 2em; */

    }

    .slide-int .swiper-button-next {
        top: 8em;
        /* font-size: 2em; */

    }

    .slide-int .swiper-button-prev {
        top: 8em;
        /* font-size: 2em; */

    }

    .ext-color-img {
        /* position: absolute; */
        object-fit: cover;
        /* opacity: 0; */
        width: 100%;
        height: 100%;
        /* display: none; */

    }

    .ext-color-img.active {
        opacity: 1;
        display: block;
    }

    @media screen and (min-width:769px) {
        .cover-container video {
            left: calc(100% - 100vw) !important;
        }

        .cover-container {
            height: 80vh !important;
        }

        .carousel-caption {
            height: 20vh !important;
        }

        .hero-title {
            min-height: 100vh;

        }

        .sec-ext-colors {
            height: 70vh;
        }

        .sec-ext-title {
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            align-items: flex-start;
        }

        .box-about img {
            width: 80%;
        }



    }



    @media (min-width:1200px) {


        .sec-ext-colors {
            height: 85vh;
        }

        .slide-dimention .swiper-slide {
            padding-bottom: 30px;
        }



        .slide-dimention img {
            width: 110vh;
            margin: auto;
            margin-top: 40px;
            margin-bottom: 20px;
        }


        .swiper-pagination {
            padding: 20px;
            color: white;
        }

        .swiper-pagination .swiper-pagination-current {
            color: #ED8734;
        }


        .sec-ext-colors {
            margin-top: 3rem;
        }

        .sec-ext-feature {
            height: 17vh !important;
        }

        .slide-dimention .swiper-button-next {
            top: 17em;
            width: 15%;
        }

        .slide-dimention .swiper-button-prev {
            top: 17em;
            width: 15%;
        }

        p.fs-4 {
            font-size: 18px !important;
        }

        .row {
            padding: 0px;
        }

        .sec-int {
            margin-top: 3rem;
            min-height: 80vh;
        }

        .sec-int-content {
            height: auto !important;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            align-items: flex-start;
        }

        .int-color-img {
            object-fit: cover;
            opacity: 1;
            width: 100%;
            height: 100%;
            /* display: none; */
        }

        .int-color-img.active {
            /* display: block; */
        }

        .slide-int img {
            width: 110vh;
            margin: auto;
            margin-top: 40px;
            margin-bottom: 20px;
        }

        .slide-int .swiper-button-next {
            top: 17em;
            width: 15%;
        }

        .slide-int .swiper-button-prev {
            top: 17em;
            width: 15%;
        }

        .card-feature {
            height: 320px;
        }

        .card-feature div {
            height: 100%;
        }

        .card-feature .card-feature-img {
            height: 100% !important;
        }

        .sec-int-feature {
            height: auto !important;
        }

        .carousel-cell img {
            height: 60vh;
        }

        .zeekr-explain {
            margin-top: 160px;

        }

        .zeekr-explain-box {
            padding: 160px 0 64px;
        }

        /* .zeekr-explain-box img {
            width: ;
        } */

        .carousel-video-body-content-handle__title {
            font-weight: 450;
            line-height: 1.2em;
            font-size: 44px !important;
            width: auto;
        }


        .zeekr-carousel-immersive {
            padding: 60px 0px 60px 0px;
        }

    }

    .zeekr-explain-box {
        background-color: #f1efeb;
    }



    .zeekr-explain-items {
        align-items: center;
        border-top: 1px solid #161819;
        display: flex;
        justify-content: space-between;
        margin-bottom: 40px;
        padding-top: 24px;
        justify-content: flex-start;
        margin-bottom: 0;
        padding: 60px 60px 0px 0px;
    }

    .zeekr-explain-items__title {
        width: auto;
        margin-right: 20px;
        font-size: 36px !important;
    }

    .zeekr-explain-items__description {
        text-align: left;
        width: auto;
    }

    .zeekr-carousel-immersive {
        background-color: #121215;
        padding: 100px 0px;
    }

    .carousel-video-body-content-handle__title {
        font-weight: 450;
        line-height: 1.2em;
        font-size: 44px !important;
        width: auto;
    }

    .carousel-video-body-content-handle__description {
        width: auto;
    }

    .carousel-video-body-content-handle__playback {
        color: #ed8733;
    }