.home-service-jj {
    /* background: url(../../../Design/img/KigiResort/BGrs.png) no-repeat center center; */
    /* background-size: cover; */
    position: relative;
    margin-top: 84px;
}

.home-service-container {
    position: relative;
    z-index: 4;
}

.sasdfav {
    display: block;
    width: 100%;
    text-align: center;
    color: #003959;
    font-family: 'MonR';
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.swiper-slide a {
    pointer-events: none; /* Vô hiệu hóa tất cả link trước */
}

.swiper-slide.swiper-slide-active a {
    pointer-events: auto; /* Chỉ cho phép link trong slide active hoạt động */
}

.home-service-jj:before {
    content: "";
    position: absolute;
    right: 0%;
    width: 26%; /* Hoặc 100vw */
    height: 16%; /* Hoặc 100vh */
    background: url(../../../Design/img/KigiResort/so2.png) no-repeat;
    /* hoặc 'contain' nếu bạn muốn ảnh không bị cắt */
    z-index: 999999;
    bottom: 0%;
}

.home-service-jj:after {
    content: "";
    position: absolute;
    bottom: -32px;
    left: 0;
    width: 23%; /* Hoặc 100vw */
    height: 18%; /* Hoặc 100vh */
    background: url(../../../Design/img/KigiResort/so3.png) no-repeat;
    /* hoặc 'contain' nếu bạn muốn ảnh không bị cắt */
    z-index: 12;
}

.kashdf img { /* position: absolute; */ /* top: -59px; */ /* left: 0px; */
    width: 100%;
    height: 100%; /* object-fit: cover; */ /* Giúp ảnh lấp đầy mà không méo */
}

.kasjd:before {
    content: "";
    position: absolute;
    top: -62px;
    left: 0;
    width: 100%; /* Hoặc 100vw */
    height: 62px; /* Hoặc 100vh */
    background: url(../../../Design/img/KigiResort/Vector.png) no-repeat;
    background-size: 100% 100%; /* hoặc 'contain' nếu bạn muốn ảnh không bị cắt */
    z-index: 0;
}

.ajsh {
    display: grid;
    grid-auto-rows: minmax(min-content,max-content);
    grid-template-columns: repeat(5,minmax(0,1fr));
    column-gap: 20px;
    row-gap: 20px;
}



    .ajsh .items:before {
        position: absolute;
        content: "";
        background: #008AEB;
        width: 1px;
        height: 72%;
        left: -10px;
    }
.home-service-jj {
    /* background: url(../../../Design/img/KigiResort/BGrs.png) no-repeat center center; */
    /* background-size: cover; */
    position: relative;
    margin-top: 84px;
}

.home-service-container {
    position: relative;
    z-index: 4;
}

.sasdfav {
    display: block;
    width: 100%;
    text-align: center;
    color: #003959;
    font-family: 'MonR';
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.swiper-slide a {
    pointer-events: none; /* Vô hiệu hóa tất cả link trước */
}

.swiper-slide.swiper-slide-active a {
    pointer-events: auto; /* Chỉ cho phép link trong slide active hoạt động */
}

.home-service-jj:before {
    content: "";
    position: absolute;
    right: 0%;
    width: 26%; /* Hoặc 100vw */
    height: 16%; /* Hoặc 100vh */
    background: url(../../../Design/img/KigiResort/so2.png) no-repeat;
    /* hoặc 'contain' nếu bạn muốn ảnh không bị cắt */
    z-index: 999999;
    bottom: 0%;
}

.home-service-jj:after {
    content: "";
    position: absolute;
    bottom: -32px;
    left: 0;
    width: 23%; /* Hoặc 100vw */
    height: 18%; /* Hoặc 100vh */
    background: url(../../../Design/img/KigiResort/so3.png) no-repeat;
    /* hoặc 'contain' nếu bạn muốn ảnh không bị cắt */
    z-index: 12;
}

.kashdf img { /* position: absolute; */ /* top: -59px; */ /* left: 0px; */
    width: 100%;
    height: 100%; /* object-fit: cover; */ /* Giúp ảnh lấp đầy mà không méo */
}

.kasjd:before {
    content: "";
    position: absolute;
    top: -62px;
    left: 0;
    width: 100%; /* Hoặc 100vw */
    height: 62px; /* Hoặc 100vh */
    background: url(../../../Design/img/KigiResort/Vector.png) no-repeat;
    background-size: 100% 100%; /* hoặc 'contain' nếu bạn muốn ảnh không bị cắt */
    z-index: 0;
}
.ajsh {
    display: flex;
    gap: 40px;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.ajsh .items {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer;
}

.ajsh .items svg {
    width: 64px;
    height: 64px;
    transition: transform 0.3s ease;
}

.ajsh .items .asav {
    font-size: 16px;
    font-weight: 500;
    text-transform: capitalize;
    color: #333;
}

.ajsh .items:hover {
    transform: translateY(-5px);
}

.ajsh .items:hover svg {
    transform: scale(1.1);
}

.ajsh .items:hover .asav {
    color: #05A1E5;
}

.ajsh {
    display: grid;
    grid-auto-rows: minmax(min-content,max-content);
    grid-template-columns: repeat(5,minmax(0,1fr));
    column-gap: 20px;
    row-gap: 20px;
}



    .ajsh .items:before {
        position: absolute;
        content: "";
        background: #008AEB;
        width: 1px;
        height: 46%;
        left: -10px;
    }

    .ajsh .items {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        gap: 14px;
        padding: 49px 0px;
        position: relative;
    }

        .ajsh .items .asav {
            color: #003959;
            text-align: center;
            font-family: 'PlaySB';
            font-size: 22px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
            text-transform: capitalize;
        }

.serviceals a {
    display: inline-flex;
    align-items: center;
    gap: 0px;
    text-decoration: none;
    color: #003959;
    transition: all 0.3s ease;
    font-weight: 900;
    position: relative;
    width: 21%;
    justify-content: center;
}

    .serviceals a:hover {
        color: #05A1E5;
        transform: translateY(-2px);
    }

    .serviceals a svg path {
        transition: all 0.3s ease;
    }

    .serviceals a svg {
        width: 21%;
    }

    .serviceals a:hover svg path {
        fill: #003959;
        transform: translateX(4px);
        width: 100%;
    }

.serviceals {
    text-align: center;
    color: #003959;
    font-family: monR;
    font-size: 20px;
    width: 100%;
    font-style: normal;
    font-weight: 900;
    line-height: 150%; /* 30px */
    margin-top: -9px;
    padding-bottom: 22px;
}

.kasjd:after {
    content: "";
    position: absolute;
    top: -147px;
    right: -69%;
    width: 100%; /* Hoặc 100vw */
    height: 100%; /* Hoặc 100vh */
    background: url(../../../Design/img/KigiResort/so1.png) no-repeat;
    /* hoặc 'contain' nếu bạn muốn ảnh không bị cắt */
    z-index: 0;
}

.sashdj:before {
    content: "";
    position: absolute;
    top: -156%;
    width: 19%; /* Hoặc 100vw */
    height: 581px; /* Hoặc 100vh */
    background: url(../../../Design/img/KigiResort/La.png) no-repeat;
    /* hoặc 'contain' nếu bạn muốn ảnh không bị cắt */
    z-index: 5;
}

.sashdj {
    position: relative;
}

.kasjd {
    position: relative;
    background: #d6ecf5;
    padding-top: 30px;
}

.kashdf {
    position: absolute;
    /* width: 100vh; */
    width: 100%;
    overflow: hidden;
    top: -166px;
    z-index: 3;
}

.wqoqw {
    font-family: 'PlaySB';
    font-size: 45px;
    font-style: normal;
    font-weight: 600;
    line-height: 157%; /* 70.65px */

    text-transform: capitalize;
    margin: 11px 0px 0 0;
    background: linear-gradient(180deg, #0AE8EA 0%, #0046ED 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-align: center;
}

.aslkcfas {
    color: #003959;
    text-align: center;
    font-family: 'MonR';
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 22.5px */

    display: block;
    /* width: 100%; */

    margin: 0px 136px;
}

@media (max-width:739px) {
    .sasdfav {
        font-size: 12px
    }

    .wqoqw {
        font-size: 30px
    }

    .aslkcfas {
        margin: 0;
        margin-top: 5px;
        font-size: 12px;
    }

    .ll-room-item-home {
        font-size: 22px !important;
        display: block !important;
        width: 160px !important;
    }

    .p-qwe-img {
        align-items: center;
        justify-content: left;
        /* gap: 23px !important; */
    }

    .serviceals a {
        font-size: 13px;
        width: 50%;
    }

    .home-service-jj:after {
        bottom: 0;
    }

    .home-service-jj:before {
        height: 22%;
        bottom: 25px;
    }

    .ajsh {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 10px;
        row-gap: 10px;
        padding: 20px 5px;
    }

        .ajsh .items:last-child {
            grid-column: span 2;
            justify-content: center;
        }

        .ajsh .items {
            padding: 4px 0px;
            border-radius: 20px;
            background: linear-gradient(270deg, #FFC300 0%, #FF5100 100%);
            width: 100%;
            flex-direction: row;
            display: flex;
            justify-content: flex-start;
            padding-left: 16px;
        }

    .items svg {
        width: 30px;
        height: 30px
    }

    .ajsh .items .asav {
        font-size: 14px;
        color: #FFFF;
    }

    .ajsh .items:before {
        left: -6px;
        display: none;
    }

    .items svg path {
        fill: #FFFF;
    }

    .kasjd:before {
        height: 21px;
        top: -20px;
    }
}

    .ajsh .items {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        gap: 14px;
        padding: 49px 0px;
        position: relative;
    }

        .ajsh .items .asav {
            color: #003959;
            text-align: center;
            font-family: 'PlaySB';
            font-size: 22px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
            text-transform: capitalize;
        }

.serviceals a {
    display: inline-flex;
    align-items: center;
    gap: 0px;
    text-decoration: none;
    color: #003959;
    transition: all 0.3s ease;
    font-weight: 900;
    position: relative;
    width: 21%;
    justify-content: center;
}

    .serviceals a:hover {
        color: #05A1E5;
        transform: translateY(-2px);
    }

    .serviceals a svg path {
        transition: all 0.3s ease;
    }

    .serviceals a svg {
        width: 21%;
    }

    .serviceals a:hover svg path {
        fill: #003959;
        transform: translateX(4px);
        width: 100%;
    }

.serviceals {
    text-align: center;
    color: #003959;
    font-family: monR;
    font-size: 20px;
    width: 100%;
    font-style: normal;
    font-weight: 900;
    line-height: 150%; /* 30px */
    margin-top: -9px;
    padding-bottom: 22px;
}

.kasjd:after {
    content: "";
    position: absolute;
    top: -147px;
    right: -69%;
    width: 100%; /* Hoặc 100vw */
    height: 100%; /* Hoặc 100vh */
    background: url(../../../Design/img/KigiResort/so1.png) no-repeat;
    /* hoặc 'contain' nếu bạn muốn ảnh không bị cắt */
    z-index: 0;
}

.sashdj:before {
    content: "";
    position: absolute;
    top: -156%;
    width: 19%; /* Hoặc 100vw */
    height: 581px; /* Hoặc 100vh */
    background: url(../../../Design/img/KigiResort/La.png) no-repeat;
    /* hoặc 'contain' nếu bạn muốn ảnh không bị cắt */
    z-index: 5;
}

.sashdj {
    position: relative;
}

.kasjd {
    position: relative;
    background: #d6ecf5;
    padding-top: 30px;
}

.kashdf {
    position: absolute;
    /* width: 100vh; */
    width: 100%;
    overflow: hidden;
    top: -166px;
    z-index: 3;
}

.wqoqw {
    font-family: 'PlaySB';
    font-size: 45px;
    font-style: normal;
    font-weight: 600;
    line-height: 157%; /* 70.65px */

    text-transform: capitalize;
    margin: 11px 0px 0 0;
    background: linear-gradient(180deg, #0AE8EA 0%, #0046ED 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-align: center;
}

.aslkcfas {
    color: #003959;
    text-align: center;
    font-family: 'MonR';
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 22.5px */

    display: block;
    /* width: 100%; */

    margin: 0px 136px;
}

@media (max-width:739px) {
    .sasdfav {
        font-size: 12px
    }

    .wqoqw {
        font-size: 30px
    }

    .aslkcfas {
        margin: 0;
        margin-top: 5px;
        font-size: 12px;
    }

    .ll-room-item-home {
        font-size: 22px !important;
        display: block !important;
        width: 160px !important;
    }

    .p-qwe-img {
        align-items: center;
        justify-content: left;
        /* gap: 23px !important; */
    }

    .serviceals a {
        font-size: 13px;
        width: 50%;
    }

    .home-service-jj:after {
        bottom: 0;
    }

    .home-service-jj:before {
        height: 22%;
        bottom: 25px;
    }

    .ajsh {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 10px;
        row-gap: 10px;
        padding: 20px 5px;
    }

        .ajsh .items:last-child {
            grid-column: span 2;
            justify-content: center;
        }

        .ajsh .items {
            padding: 4px 0px;
            border-radius: 20px;
            background: linear-gradient(270deg, #FFC300 0%, #FF5100 100%);
            width: 100%;
            flex-direction: row;
            display: flex;
            justify-content: flex-start;
            padding-left: 16px;
        }

    .items svg {
        width: 30px !important;
        height: 30px !important;
    }

    .ajsh .items .asav {
        font-size: 14px;
        color: #FFFF;
    }

    .ajsh .items:before {
        left: -6px;
        display: none;
    }

    .items svg path {
        fill: #FFFF;
    }

    .kasjd:before {
        height: 21px;
        top: -20px;
    }
}