.flex_box_l {float:left; width: 70%;}
.flex_box_r {float:right; width: 30%;}

.flex_box_ll {float:left; width: 50%}
.flex_box_rr {float:right; width: 50%}
/* Media query for responsive view */


.sec3:before { content:""; position:absolute; left:50%; top:0; bottom:0; width:100vw; transform:translateX(-50%); z-index:-1; background:rgba(var(--main-color3-rgb),.1); }
.sec3 ul { display:flex; flex-wrap:wrap; margin:30px -5px -5px; }
.sec3 li { width:calc(100%/3 - 10px); margin:5px; text-align:center; border-radius:10px; background:#f8f8f8; padding:30px; }

.sec3 li .icon { height:60px; margin-bottom:20px; background:none no-repeat center/contain; }
.sec3 li .head { color:#666; overflow:hidden; }
.sec3 li .head b { font-size:2rem; color:#f77100; display:inline-block; }
.sec3 li .desc { margin-top:5px; }



@media all and (max-width:768px) {
    .flex_box_l {width: auto; float: none;}
    .flex_box_r {width: auto; float: none;}
    .flex_box_ll {width: auto; float: none;}
    .flex_box_rr {width: auto; float: none;}

    .sec3 li { width:calc(50% - 10px); padding:25px; }
    .sec3 li .icon { height:50px; margin-bottom:10px; }
    .sec3 li .head b { font-size:1.5rem; }
}
