안녕하세요 혼자 이것저것 정보보면서 배우고 있는 사람입니다

메인페이지에 최근갤러리가 4개 2줄로 가운데로 정렬시키고 여백을 서로 각각 조금씩 주고싶습니다

/* 새글 스킨 (latest) */

.lat_pic_basic > h2{display:none;}
.lat_pic_basic .lat_pic_basic_inner{font-size:0;}
.lat_pic_basic .lat_pic_basic_item{display:inline-block; position:relative; width:25%; vertical-align:top; font-size:15px;}
.lat_pic_basic .lat_pic_basic_item:after{content:""; position:absolute; top:0; left:20; bottom:0; right:0; background:rgba(0,0,0,.75); opacity:0; z-index:-1; 
    -webkit-transition:all .3s ease; transition:all .3s ease;}
.lat_pic_basic .lat_pic_basic_item a{display:block; position:relative;}
.lat_pic_basic .lat_pic_basic_item img{100%;}

.lat_pic_basic .pic_thumb{position:relative; padding-top:68.4684%;}
.lat_pic_basic .pic_thumb > p{position:absolute; top:0; left:0; bottom:0; right:0; overflow:hidden;}
.lat_pic_basic .pic_thumb > p img{width:80%; height:80%; object-fit:cover;}

.lat_pic_basic .pic_title{position:absolute; top:20px; left:0; bottom:0; right:0; text-align:center; opacity:0; webkit-transition:all .4s ease; transition:all .4s ease;}
.lat_pic_basic .pic_title .pic_title_inner{display:inline-block; padding:4px 15px; border-radius:20px; background:#fff; color:#222;}

/* 갤러리 베이직 hover */
.lat_pic_basic .lat_pic_basic_item:hover:after{opacity:1; z-index:2}
.lat_pic_basic .lat_pic_basic_item:hover .pic_title{opacity:1; z-index:4; top:40%;}

.pic_lt .empty_li {line-height:145px ;color:#666;text-align:center;padding:0}
.pic_lt .empty_li:before {background:none;padding:0}
 

지금 어느정도 수정을 해봤는데 왼쪽으로 최근갤러리 4개가 출력되는데 너무 왼쪽으로 치우쳐져 있으며

가운데로 정렬 각각 이미지 1개씩 여백을 조금씩 주고싶은데 어디쪽을 수정해야 할까요?

감사합니다