.py-industrial {
    padding-top: 90px;
    padding-bottom: 90px;
}



.py-approach {
    padding-top: 80px;
    padding-bottom: 80px;
}

.min-w-icon {
    min-width: 30px;
}

.mt-56 {
    margin-top: 56px;
}

.pt-123 {
    padding-top: 110px;
}

.key-box {
    width: 100%;
    max-width: 450px;
    padding-left: 23px;
    padding-top: 27px;
    padding-bottom: 27px;
    background-color: white;
    box-shadow: 2px 4px 4px 2px #00000040;
    border-radius: 30px;
    padding-right: 4px;
    position: relative;
    z-index: 20;
}

.black-border {
    height: 165px;
    width: 1px;
    background: #000;
}

.gap-22 {
    gap: 22px;
}
.gap-16 {
    gap: 16px;
}

.key-text {
    font-size: 18px;
    line-height: 125%;
}

.key-blue-layer-top {
    width: 229px;
    height: 288px;
    background: #4A6486;
    border-radius: 30px;
    top: -15%;
    left: 50px;
}
.key-blue-layer-btm {
    width: 229px;
    height: 288px;
    background: #4A6486;
    border-radius: 30px;
    top: -15%;
    left: 62px;
}

.pt-158 {
    padding-top: 158px;
}

.pb-144 {
    padding-bottom: 120px;
}

.key-icon {
    min-width: 55px;
}

@media (min-width:1200px) {
    .blue-layer {
        width: 542px;
        height: 542px;
        background: #4A6486;
        left: 0;
        top: 8.5%;

    }
}

@media (max-width:1200px) {
    .approach-img {
        max-width: 474px;
        object-fit: cover;
        width: 100%;
    }
}

@media (max-width:1182px) {

.key-blue-layer-top {
    left: 40px;
}
.key-blue-layer-btm {
    left: 40px;
}
}
@media (max-width:1111px) {

.key-blue-layer-top {
    left: 5%;
}
.key-blue-layer-btm {
    left: 5%;
}
}
@media (max-width:992px) {
    .py-industrial {
        padding-top: 70px;
        padding-bottom: 70px;
    }

    .py-approach {
        padding-top: 70px;
        padding-bottom: 70px;
    }

    .mt-56 {
        margin-top: 40px;
    }

    .pt-158 {
        padding-top: 24px;
    }

    .pt-123 {
        padding-top: 54px;
    }

    .pb-144 {
        padding-bottom: 58px;
    }
}

@media (max-width:786px) {
    .min-w-icon {
        min-width: 24px;
    }

    .pt-123 {
        padding-top: 42px;
    }

    .pt-123 {
        padding-top: 66px;
    }
}
@media (max-width:487px){
    .key-box {
        flex-direction: column;
    }
    .key-icon {
       width: 30px;
    }
    .black-border{
    rotate: 180deg;
    height: 1px;
    width: 90%;
    background: #000;
    position: relative;
    left: -50%;
    transform: translateX(-50%);
    }
}
@media (max-width:576px) {
    .py-industrial {
        padding-top: 48px;
        padding-bottom: 48px;
    }

    .py-approach {
        padding-top: 48px;
        padding-bottom: 48px;
    }

    .key-icon {
        min-width: 55px;
    }

    .pb-144 {
        padding-bottom: 48px;
    }
}