.banners .owl-carousel .item{
    position: relative;
    display: flex;
    display: -webkit-flex;
    align-items: center;
}

.banners .owl-carousel .item .container{
    position: absolute;
    inset: auto 0;
}

.banners .owl-carousel .item img{
    width: 100%;
}

.banners .sectitle,
.banners .text{
    width: 372px;
}

.banners .text{
    color: var(--title);
    margin-top: 46px;
}

.banners .dbtn{
    margin-top: 49px;
}


.institute{
    background: url(../../assets/img/instbg-6.png) no-repeat center/cover;
    padding: 149px 0 261px;
}

.institute .row{
    flex-wrap: wrap-reverse;
    -ms-flex-wrap: wrap-reverse;
    grid-gap: 2rem 0;
}

.institute .img{
    position: relative;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    width: 100%;
    height: 100%;
}
.institute .img img{
    position: absolute;
    z-index: 1;
}

.institute .dbtn{
    margin-top: 25px;
}

.aboutus{
    background: url(../../assets/img/iconbg.svg) repeat-y top right,url(../../assets/img/wavefx-100.png) no-repeat center/cover,var(--main);
    background-blend-mode: normal,multiply;
    padding: 78px 0 87px;
}

.aboutus .row{
    grid-gap: 4rem 0;
}

.aboutus .row>*{
    position: relative;
    z-index: 1;
    display: flex;
    display: -webkit-flex;
    flex-direction: column;
    -ms-flex-direction: column;
    justify-content: center;
    -webkit-justify-content: center;
}

.aboutus hr{
    width: 328px;
}

.aboutus .text,
.aboutus .dbtn{
    margin-top: 39px;
}

.aboutus .text{
    width: 417px;
}

.aboutus .img{
    position: relative;
    display: flex;
    display: -webkit-flex;
    align-items: flex-end;
    justify-content: center;
    -webkit-justify-content: center;
    width: 460px;
    max-width: 95%;
    aspect-ratio: 1/1.32173;
    background-color: var(--white);
}

.aboutus .img::before{
    content: '';
    position: absolute;
    z-index: -1;
    inset: auto -5.65217% -3.78289% auto;
    width: 100%;
    height: 100%;
    background-color: var(--line);
}

.aboutus .img img{
    position: absolute;
    width: 79%;
}

.aboutus .img figcaption{
    position: absolute;
    z-index: 1;
    inset: auto auto 4.44078% -10.86956%;
    width: fit-content;
    color: var(--white);
    font-family: var(--bau);
    font-weight: 700;
    background-color: var(--main);
    padding: 1rem 28px;
}

.intentions{
    margin-top: -6.66666vw;
    padding: 22.26rem 0;
}

.intentions .sectitle{
    width: 500px;
    color: #626362;
    font-size: 52px;
    line-height: 1.03703;
}

.intentions .sectitle strong{
    color: var(--main);
}

.structure{
    background: url(../../assets/img/instbg-100.png) no-repeat center/cover,var(--footer-design);
    background-blend-mode: multiply;
    padding: 136px 0 140px;
}

.structure .sectitle{
    width: 510px;
}

.structure hr{
    width: 588px;
    margin: 1rem auto;
}

.structure .text{
    width: 590px;
}

.structure .owl-carousel{
    margin-top: 74px;
}

.structure .owl-carousel .item{
    border: 1px solid var(--white);
    background-color: var(--footer-design);
    padding: 26px 2rem 44px;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
}

.structure .owl-carousel .item:hover{
    background-color: var(--black);
}

.structure .owl-carousel .item img{
    width: auto;
    height: 66px;
}

.structure .owl-carousel .item .title{
    font-family: var(--metro);
    color: var(--white);
    font-weight: 700;
    border-bottom: 1px solid var(--white);
    margin-top: 36px;
    padding-bottom: 8.5px;
}

.adas{
    padding: 89px 0 118px;
}

.adas .sectitle strong,
.techs .sectitle strong,
.jus .sectitle strong{
    color: var(--line);
}

.adas hr{
    width: 316px;
    margin-left: auto;
    margin-right: auto;
}

.adas .text{
    width: 615px;
}

.adas .row{
    grid-gap: 19px 0;
    margin-top: 4rem;
}

.adas .row>*{
    padding: 0 9px;
}

.adas .box{
    position: relative;
    display: block;
    display: -webkit-block;
    width: 100%;
    aspect-ratio: 1/1.15235;
}

.adas .box img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    -o-object-fit: cover;
    transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
}

.adas .box::before{
    content: '';
    position: absolute;
    z-index: 1;
    inset: 0;
    background-color: transparent;
    mix-blend-mode: multiply;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
}

.adas .box:hover::before{
    background-color: var(--main);
}

.adas .box .title{
    position: absolute;
    z-index: 2;
    inset: auto auto 0 0;
    max-width: 287px;
    font-family: var(--metro);
    color: var(--white);
    font-weight: 700;
    background-color: var(--main);
    padding: 7px 11px;
}

.field{
    position: relative;
    background: url(../../assets/img/wavefx-100.png) no-repeat center/cover,var(--main);
    background-blend-mode: multiply;
    padding: 200px 0 139px;
}

.field .row{
    flex-wrap: wrap-reverse;
    -ms-flex-wrap: wrap-reverse;
    grid-gap: 2rem 0;
}

.field .img{
    position: absolute;
    inset: 0 auto auto 0;
    width: clamp(1px,61.35416vw,1178px);
    height: 100%;
    clip-path: polygon(0 0, 98% 0,62% 100%,0 100%);
    -webkit-clip-path: polygon(0 0, 98% 0,62% 100%,0 100%);
}

.field::before{
    content: '';
    position: absolute;
    z-index: 1;
    inset: 0 auto auto 0;
    width: clamp(1px,61.35416vw,1178px);
    height: 100%;
    background: url(../../assets/img/linefx.svg) no-repeat right center/cover;
}

.field .img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    -o-object-fit: cover;
}

.procedure{
    background: url(../../assets/img/stepsbg1-49.png) no-repeat left center,url(../../assets/img/stepsbg2-49.png) no-repeat right center,#F9F9F9;
    padding: 129px 0;
}

.procedure .steps{
    display: flex;
    display: -webkit-flex;
    flex-direction: column;
    -ms-flex-direction: column;
    grid-gap: 1rem;
    width: 482px;
    margin: 0 auto;
}

.procedure .steps>*{
    display: flex;
    display: -webkit-flex;
    align-items: stretch;
    background-color: var(--white);
    box-shadow: 0 3px 6px #00000029;
}

.procedure .steps>*:nth-child(even){
    background-color: #F3F3F3;
}

.procedure .steps>*:nth-child(even) .icon,
.procedure .steps>*:nth-child(even) .icon::after{
    background-color: var(--line);
}

.procedure .steps>* .icon{
    position: relative;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    position: relative;
    width: 40px;
    aspect-ratio: 1/1;
    background-color: var(--main);
}

.procedure .steps>* .icon::after{
    content: '';
    position: absolute;
    left: 100%;
    width: 11px;
    height: 17px;
    background-color: var(--main);
    clip-path: polygon(0 0,100% 50%,0 100%);
    -webkit-clip-path: polygon(0 0,100% 50%,0 100%);
}

.procedure .steps>*>*:last-child{
    align-content: center;
    padding-left: 1rem;
}

.procedure .steps>* .text{
    text-align: center;
    color: #104226;
}

.procedure .steps>* .text strong{
    padding-bottom: 3px;
    border-bottom: 1px solid #E1DEDE;
}

.techs{
    background: url(../../assets/img/wavefx-13.png) no-repeat top center/cover;
    padding: 95px 0 102px;
}

.techs .text{
    width: 835px;
    margin: 47px auto 0;
}

.techs .owl-carousel{
    margin-top: 75px;
}

.techs .item{
    background-color: var(--main);
}

.techs .item .img{
    width: 100%;
    aspect-ratio: 1/.80689;
    background-color: #F9F9F9;
}

.techs .item img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    -o-object-fit: cover;
}

.techs .item .bottom{
    padding: 2rem 4rem 1rem 2rem;
}

.techs .item .bottom .title,
.techs .item .bottom .text,
.techs .item .bottom .sm{
    color: var(--white);
    font-size: 14px;
    line-height: 1.28;
}

.techs .item .bottom .title,
.techs .item .bottom .sm{
    font-weight: 700;
}

.techs .item .bottom .text,
.techs .item .bottom .sm{
    margin-top: 14px;
}

.techs .item .bottom .text{
    display: -webkit-box;
    display: -moz-box;
    line-clamp: 4;
    -webkit-line-clamp: 4;
    -moz-line-clamp: 4;
    box-orient: vertical;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    overflow: hidden;
}

.techs .item .bottom .sm{
    display: flex;
    display: -webkit-flex;
    align-items: center;
    grid-gap: 5px;
}

.techs .item .bottom .sm::after{
    content: '';
    width: 13px;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background: url('data:image/svg+xml;utf8,<svg width="4" height="7" viewBox="0 0 4 7" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.600553 6.03757C0.7558 6.03546 0.904042 5.97264 1.01355 5.86257L3.55057 3.32358C3.60677 3.26656 3.65099 3.19887 3.68063 3.12449C3.71027 3.05011 3.72473 2.97055 3.72314 2.89049C3.72156 2.81044 3.70397 2.73151 3.67141 2.65836C3.63885 2.58521 3.59199 2.51933 3.53357 2.46458L0.997556 0.116583C0.878775 0.0292585 0.731994 -0.011278 0.585233 0.00270692C0.438472 0.0166918 0.302021 0.0842175 0.201871 0.192404C0.101721 0.300591 0.0449015 0.441852 0.0422641 0.589255C0.0396268 0.736657 0.0913426 0.879883 0.187558 0.991583L2.26956 2.91857L0.169553 5.01858C0.0873686 5.10321 0.0319651 5.21018 0.0102512 5.32613C-0.0114628 5.44208 0.00148978 5.56188 0.0474826 5.67051C0.0934755 5.77914 0.170455 5.8718 0.268827 5.93691C0.367199 6.00202 0.482585 6.03768 0.600553 6.03757Z" fill="white"/></svg>') no-repeat center,var(--line);
}

.techs .dbtn{
    margin-top: 70px;
}

.jus .row{
    grid-gap: 2rem 0;
}

.jus .row>*{
    position: relative;
    display: flex;
    display: -webkit-flex;
    flex-direction: column;
    -ms-flex-direction: column;
    justify-content: center;
    -webkit-justify-content: center;
}

.jus .row>*:first-child{
    padding-top: 150px;
    padding-bottom: 205px;
}

.jus .row>*:last-child{
    justify-content: flex-end;
    -webkit-justify-content: flex-end;
}

.jus .row>*:last-child img{
    position: absolute;
}

.jus .text{
    width: 330px;
    color: var(--title);
    margin-top: 68px;
}

.jus .dbtn{
    margin-top: 43px;
}

@media(max-width:1780px){.field::before{width:clamp(1px,62vw,1178px)}}

@media(max-width:1650px){
    .field::before{
        display: none;
        display: -webkit-none;
    }
}

@media(max-width:1200px){
    .field{
        padding: 2rem 0;
    }
    .field::before{
        display: none;
        display: -webkit-none;
    }
    .field .img{
        position: initial;
        width: fit-content;
        clip-path: unset;
        -webkit-clip-path: unset;
    }
}

@media(max-width:992px){
    .institute,
    .aboutus,
    .intentions,
    .structure,
    .adas,
    .procedure,
    .techs,
    .jus{
        padding: 2rem 0;
    }
    .banners .owl-carousel .item{
        padding: 2.5rem 0;
    }
    /* .banners .owl-carousel .item::before{
        content: '';
        position: absolute;
        z-index: 1;
        inset: 0;
        background-color: #00000061;
    } */
    .banners .owl-carousel .item .container{
        position: relative;
        z-index: 2;
    }
    .banners .owl-carousel .item img{
        position: absolute;
        width: 100%;
        height: 100%;
        object-fit: cover;
        -o-object-fit: cover;
    }
    .banners .sectitle,
    .banners .text,
    .aboutus .text,
    .intentions .sectitle,
    .procedure .steps,
    .jus .text{
        width: 100%;
    }
    .institute .img img{
        position: initial;
    }
    .intentions{
        margin-top: 0;
        background: linear-gradient(to right,#C3C1C1,#FEFCFD,#C3C1C1) !important;
    }
    .jus .row>*:first-child{
        padding-top: 0;
        padding-bottom: 0;
    }
    .jus .row>*:last-child img{
        display: none;
        display: -webkit-none;
    }
    .jus .text{
        margin-top: 2rem;
    }
}

@media(max-width:768px){
    .aboutus .img figcaption{
        inset: auto auto 0 0;
    }
    .intentions .sectitle{
        text-align: center;
        font-size: clamp(16px,6.77083vw,52px);
    }
    .adas .owl-carousel{
        margin-top: 2.5rem;
    }
}