/* 서브페이지 공통 상단 */
.cert-page { padding: 100px 0; }
.sub-title-area { text-align: center; margin-bottom: 60px; }
.sub-tit { font-size: var(--fs32); color: var(--c_base3); font-weight: 700; margin-bottom: 15px; }
.sub-desc { font-size: var(--fs18); color: #888; }

/* 리스트 레이아웃 */
.cert-list { display: flex; flex-wrap: wrap; gap: 40px 2.66%; }
.cert-list li { width: 23%; text-align: center; }
.cert-list+.cert-list {margin:50px 0 0;}

/* 이미지 박스 호버 효과 */
.cert-list li .img-box { 
    position: relative; 
    border: 1px solid var(--border1); 
    padding: 20px; 
    background: #fff; 
    overflow: hidden;
    aspect-ratio: 1 / 1.4; /* 인증서 비율 유지 */
    display: flex; align-items: center; justify-content: center;
	transition:all .3s;
}
.cert-list li .img-box img { width: 100%; height: auto; object-fit: scale-down; }
.cert-list li:hover .img-box { border-color: var(--c_base1); box-shadow: 0 10px 20px rgba(0,0,0,0.08); transform: translateY(-5px); }

/* 텍스트 스타일 */
.cert-name { 
    margin-top: 20px; 
    font-size: var(--fs18); 
    color: #333; 
    font-weight: 500; 
    line-height: 1.4; 
    word-break: keep-all; 
}

/* 반응형 처리 */
@media screen and (max-width: 1200px) {
    .cert-list { gap: 30px 2%; }
    .cert-list li { width: 32%; }
    .cert-page { padding: 70px 0; }
}

@media screen and (max-width: 768px) {
    .cert-list { gap: 20px 4%; }
    .cert-list li { width: 48%; }
    .sub-tit { font-size: var(--fs26); }
}

@media screen and (max-width: 500px) {
    .cert-name { font-size: var(--fs15); }
    .cert-page { padding: 50px 0; }
}