﻿.topbanner .osui-carousel .splide__arrow {
    border: 1px solid #00708D;
    width: 60px;
    border-radius: 40px;
    height: 36px;
}

.topbanner .osui-carousel .splide__arrow svg path {
    fill: #0087A8;
}

.topbanner .osui-carousel .splide__pagination__page.is-active
 {
    background-color: #ffff;
    width: 43px;
    height: 14px;
    border-radius: 14px;
    border: 1px solid var(--Brand-Kinto-Blue, #00708D);
}

.topbanner .splide__pagination__page{
  width: 14px;
    height: 14px;
    border-radius: 14px;
    margin: 9px;
    display: flex;
    background: #4CD4F6;
    align-items: center;
    justify-content: center;
}

.topbanner .osui-carousel--has-pagination:not(.splide) .splide__pagination {
    bottom: 25px;
    padding: 0px;
}

.topbanner .osui-carousel .splide img {
    width: 100%;
}


.recommend-car .osui-carousel .splide__arrow {
    border: 1px solid #00708D;
    width: 60px;
    border-radius: 40px;
    height: 36px;
}

.recommend-car .osui-carousel .splide__arrow svg path {
    fill: #0087A8;
}

.recommend-car .osui-carousel .splide__pagination__page.is-active
 {
    background-color: #00495C;
    width: 43px;
    height: 14px;
    border-radius: 14px;
    border: 1px solid #59A2B5;
}

.recommend-car .splide__pagination__page{
  width: 14px;
    height: 14px;
    border-radius: 14px;
    margin: 9px;
    display: flex;
    background: #A6CDD7;
    align-items: center;
    justify-content: center;
    opacity: 1;
}

.recommend-car .osui-carousel--has-pagination:not(.splide) .splide__pagination {
    bottom: -70px;
    padding: 0px;
}

.recommend-car .splide__arrow--prev{
    left: -7em;
}

.recommend-car .splide__arrow--next{
    right: -7em;
}


/** Mobile" portrait **/
 @media screen and (orientation: portrait) and (max-width:515px){
.topbanner .osui-carousel .splide img{

}
.topbanner .osui-carousel .splide__arrow{display: none;}

.topbanner .osui-carousel .splide__pagination{
    display: none;
}

.see-more .btn{
    width: 99px !important;
    height: 26px !important;
font-weight: 400 !important;
font-style: Regular;
font-size: 14px !important;
line-height: 150%;
vertical-align: middle;
/* text-transform: uppercase; */
}

.content-middle {
    margin-top: 0px;
}
    .recommend-car .osui-carousel--has-pagination:not(.splide) .splide__pagination{
        display: none;
    }

    .rec-car-card:hover {
    transform: scale(1) !important;
}
    .package-car-mobile .title{
        font-size: 20px;
        white-space: nowrap;
    }
 }

.promotion .osui-carousel .splide__arrow {
    border: 1px solid #00708D;
    width: 60px;
    border-radius: 40px;
    height: 36px;
}

.promotion .osui-carousel .splide__pagination__page.is-active
 {
    background-color: #00495C;
    width: 43px;
    height: 14px;
    border-radius: 14px;
    border: 1px solid #59A2B5;
    margin: 10px;
}


.promotion .osui-carousel .splide__arrow svg path {
    fill: #0087A8;
}

.promotion .splide__pagination__page{
  width: 14px;
    height: 14px;
    border-radius: 14px;
    display: flex;
    background: #A6CDD7;
    align-items: center;
    justify-content: center;
    opacity: 1;
    margin: 4px;
}

.promotion .osui-carousel .splide__pagination{
    bottom: -60px !important;
}

.promotion  .splide__arrow--prev{
    left: -7em;
}
.promotion .splide__arrow--next{
    right: -7em;
}

.testimonial .splide__arrow--next {
    right: -6em;
}

.testimonial .splide__arrow--prev {
    left: -6em;
}

.testimonial .osui-carousel .splide__arrow {
    border: 1px solid #00708D;
    width: 60px;
    border-radius: 40px;
    height: 36px;
}

.testimonial .osui-carousel .splide__arrow svg path{
    fill: #59A2B5;
}

.testimonial .splide:not(.is-overflow) .splide__pagination{
    display: flex;
    bottom: -80px;
}

.testimonial .osui-carousel .splide__pagination__page.is-active {
    background-color: #00495C;
    width: 43px;
    height: 14px;
    border-radius: 14px;
    border: 1px solid #59A2B5;
    margin: 10px;
}

.testimonial .splide__pagination__page {
    width: 14px;
    height: 14px;
    border-radius: 14px;
    display: flex;
    background: #A6CDD7;
    align-items: center;
    justify-content: center;
    opacity: 1;
    margin: 4px;
}

.FooterAdvertise{
    height: 653px;
    object-fit: cover;
}


.testimonial .osui-carousel--has-pagination:not(.splide) .splide__pagination{
    bottom: -70px;
}

/** Mobile" portrait **/
 @media screen and (orientation: portrait) and (max-width:515px){
     .testimonial .osui-carousel .splide__arrow{
         display: none;
     }
     .recommend-car .osui-carousel--has-pagination:not(.splide) .splide__pagination{
         display: none;
     }
     .FooterAdvertise{
    height: 203px;
}
    .pack-s-t{
        display: none;
    }
    .promotion .osui-carousel .splide__pagination__page.is-active{
            width: 30px;
    height: 10px;
        background-color: #ffff;
    }
    .promotion .splide__pagination__page {
    width: 10px;
    height: 10px;
        background: #4CD4F6;
    }
 }

    .pack-s-t{
        display: none;
    }
    .qa-sm{
            display: none;
        }

 /** Small Mobile" portrait **/
 @media screen and (orientation: portrait) and (max-width:380px){
     .pack-s-t{
    font-weight: 700;
    font-style: Bold;
    font-size: 32px;
    line-height: 125%;
    letter-spacing: 0%;
    display: block;
     }

     .package-car-mobile .title{
         display: none;
     }
         .package-car-wrap {
        padding: 25px 15px 20px 15px;
    }
    .pack-car-mobile .pack-card{
        max-width: 345px;
        height: 184px;
    }
    .pack-car-mobile .pack-card.speedygo .pack-img {
    width: 200px;
    height: 40px;
}
    .pack-car-mobile .pack-card.speedygo .detail-wrap .text{
        font-weight: 500;
    font-size: 16px;
    }
    .pack-car-mobile .pack-card .detail{
        height: 154px;
    }
    .package-car-mobile{
        padding-right: 10px;
    }
    .pack-car-mobile .pack-card .btn{
        width: 156px !important;
        height: 42px;
    }
    .pack-car-mobile .pack-card.newcar .header-title{
        white-space: nowrap;
        margin-top: 6px;
    }
    .pack-car-mobile .pack-card.newcar .text{
        font-size: 18px;
        font-weight: 400;
        margin-top: 5px;
    }

    .pack-car-mobile .pack-card .car-img{
        width: 150px;
        height: 147px;
    }

    .pack-car-mobile .pack-card.used-car .text{
        font-size: 16px;
        margin-top: 5px;
    }
    .pack-car-mobile .pack-card.speedygo .detail-wrap{
            gap: 20px;
    margin-top: 6px;
    }
    .pack-car-mobile .pack-card.used-car .header-title{
        margin-top: 5px;
    }
    .package-car .header-package .btn{
        width: 98px !important;
        height: 44px;
        font-size: 16px;
        white-space: nowrap;
    }
    .reccom-car .header-package .btn{
        width: 98px !important;
        height: 44px;
        font-size: 16px;
        white-space: nowrap;
    }
    .rec-car-card {
        width: 300px;
        height: 400px;
    }

    .rec-car-card .topleftimg{
        width: 100px !important;
    height:20px !important;
    }

    .rec-car-card .carimg-wrap img {
    width: 260px !important;
    height: 160px !important;
    }

    .rec-car-card .newcar{
        font-size: 16px;
    }
        .reccom-car-wrap {
        padding: 30px 0px 10px 10px;
        }
        .rec-car-card{
            margin: 6px;
        }
        .promotion-mobile{
            padding: 58px 12px 12px 12px;
            gap: 0px;
            height: auto;
        }
        .promotion-mobile .content-detail{
            max-height: 255px;
        padding: 12px 24px 24px 24px;
        }
        .promotion-mobile .content-detail .m-title{
            font-size: 32px;
        }
        .promotion-mobile .content-detail .s-title{
            font-size: 20px;
        }
        .promotion-mobile .content-detail .btn-wrap .btn {
    width: 100px !important;
    height: 44px;
    font-size: 16px;
        }
        .promotion-mobile img {
    width: 100%;
    height: 158px !important;
        }
        .service-wrap .head-t{
            font-size: 32px;
        }
        .service-wrap .head-s{
            font-size: 20px;
            margin-top: 6px;
            line-height: 125%;
        }
        .service-wrap .service-card-wrap .service-card .card-detail .m-title{
            font-size: 32px;
        }

        .MobilitySimplified-mobile{
            padding: 84px 16px 16px 16px;
        }
        .MobilitySimplified-mobile .m-t {
            font-size: 32px;
        }
        .MobilitySimplified-mobile img {
    width: 345px;
    height: 345px;
        }
            .worryfree-driving {
        padding: 40px 12px;
    }   
    .worryfree-driving .m-t{
        font-size: 32px;
    }
        .worryfree-driving .s-t{
            font-size: 20px;
            line-height: 110%;
        }
        .worryfree-driving .display{
            font-size: 12px;
        }

        .worryfree-driving .condi{
            font-size: 16px;
        }
        .worryfree-driving{
            height: auto;
        }
        .cilp-kinto .t-wrap .m-t {
            font-size: 32px;
        }
        .cilp-kinto{
            padding: 48px 12px;
        }

        .customer-say .title{
            font-size: 32px;
        }
        .worryfree-driving .table-mobile .new-first{
           
        }
        .FAQ .faq-card .left .plus{
            width: 14px;
            height: 14px;
        }
        .FAQ .faq-card .left .m-t {
            font-size: 32px;
            margin-left: 24px;
        }
        .FAQ .faq-card .left{
            padding: 30px 16px;
        }
        .FAQ .faq-card .left .q-t{
            margin-left: 0px;
        }
        .FAQ .faq-card .left .minus {
            width: 14px;
            height: 2px;
        }
        .FAQ .faq-card .plus-minus{
            margin-right: 5px;
        }
        .FAQ .faq-card .left .btn-wrap .btn{
        width: 130px;
        height: 41px;
        margin-left: 24px;
        }
        .FooterAdvertise {
        height: 183px;
    }
        .service-wrap .service-card-wrap .service-card .serviceimg{
            height: 257.25px;
        }
        .qa-nor{
            display: none;
        }
        .qa-sm{
            display: block;
        }
        
 }

  @media screen and (orientation: portrait) and (max-width:1056px){
      .service-wrap .service-card-wrap {
          flex-wrap: wrap;
      }
      .service-wrap{
          height: auto;
      }
  }