.advantage-box {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: max(3vw, 30px);
}

.advantage-box .advantage-item {
    border-radius: var(--BorderRadius);
    overflow: hidden;
    background: linear-gradient(to bottom, #fff 50%, #cceaff 100%);
}

.advantage-top {
    background: linear-gradient(to bottom, #213574 50%, #1b4487 100%);
    padding: 2rem 3.5rem;
    display: grid;
    grid-template-columns: max-content auto;
    gap: 1rem;
    position: relative;
}
.advantage-top i {
    font-size: calc(var(--FontSizeP)*2.3);
    color: white;
    position: relative;
    top: 2px;
}
p.q-txt {
    color: white;
}
.advantage-top:after {
    border: solid transparent;
    content: '';
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    border-color: rgba(255, 255, 255, 0);
    border-top-width: 12px;
    border-bottom-width: 10px;
    border-left-width: 12px;
    border-right-width: 12px;
    margin-left: -10px;
    border-top-color: #1b4487;
    top: 100%;
    left: 50%;
}

.advantage-bottom {
    padding: 4rem 3.5rem;
    position: relative;
}

h3.a-title {
    font-size: calc(var(--FontSizeH4)*1.1);
    font-weight: 600;
    /*color: var(--SubColor);*/
    color: #42a0df;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px dashed #d6d6d6;
    text-align: center;
}

h3.a-title, p.a-txt {
    position: relative;
    z-index: 2;  
}

.a-num {
    font-size: calc(var(--FontSizeH4)* 0.8);
    font-style: italic;
    display: inline-block;
    color: #69c5e4;
    font-weight: 500;
    margin-right: 10px;
}





@media (max-width: 1800px) {

.advantage-top {
    padding: 2rem 3rem;
}
.advantage-bottom {
    padding: 3.5rem 3rem;
}

}






@media (max-width: 1536px) {

.advantage-top {
    padding: 1.8rem 2.5rem;
}
.advantage-bottom {
    padding: 3.5rem 2.5rem 3rem;
}

}





@media (max-width: 1366px) {

.advantage-top {
    padding: 1.8rem 2rem;
    gap: 12px;
}
.advantage-bottom {
    padding: 3.2rem 2rem 3rem;
}

}





@media (max-width: 1300px) {

.advantage-box {
    grid-template-columns: auto;
}
.advantage-box .advantage-item {
    display: grid;
    grid-template-columns: 1fr 1.1fr;
}
.advantage-top {
    padding: 1.8rem 3rem;
    align-items: center;
}
.advantage-bottom {
    padding: 3.2rem 3rem 3rem;
}
.advantage-top:after {
    border: 0;
    width: 14px;
    height: 22px;
    clip-path: polygon(100% 50%, 0 0, 0 100%);
    background: #1b4487;
    margin-left: 0;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    left: auto;
    margin-right: -13px;
}


}




@media (max-width: 1100px) {

h3.a-title {
    font-size: calc(var(--FontSizeH4)* 1.15);
    text-align: left;
}

}



@media (max-width: 991px) {

.advantage-top {
    padding: 2rem 2rem;
}
.advantage-bottom {
    padding: 2rem 2.5rem;
}



}





@media (max-width: 768px) {

.advantage-top {
    padding: 2rem 1.5rem;
}
.advantage-top i {
    font-size: calc(var(--FontSizeP)* 2);
}

}





@media (max-width: 767px) {

.advantage-box .advantage-item {
    grid-template-columns: auto;
}
.advantage-top {
    padding: 2rem 2rem;
}
.advantage-bottom {
    padding: 2.5rem 2rem 2rem;
}
h3.a-title {
    margin-bottom: 12px;
    padding-bottom: 12px;
}
.advantage-top:after {
    border: solid transparent;
    height: 0;
    width: 0;
    border-color: rgba(255, 255, 255, 0);
    border-top-width: 10px;
    border-bottom-width: 10px;
    border-left-width: 12px;
    border-right-width: 12px;
    margin-left: -10px;
    border-top-color: #1b4487;
    background: transparent;
    top: 100%;
    left: 50%;
    clip-path: none;
    margin-right: auto;
    transform: none;
}


}



@media (max-width: 600px) {

.advantage-box {
    gap: 20px;
}

}



@media (max-width: 480px) {

.advantage-top {
    padding: 1.5rem;
    grid-template-columns: auto;
    gap: 10px;
}
.advantage-bottom {
    padding: 2rem 1.5rem 1.5rem;
}
.advantage-top i {
    text-align: center;
}


}