css 반응형 정사각형 비율 유지

<figure class="pdImage">
	<img src="<?php echo $image_url; ?>" alt="<?php echo htmlspecialchars($row['wr_subject']); ?>" class="img">
</figure>

.pdList .pdImage {
	border-radius: 16px;
    border: 1px solid #E8E8E9;
    overflow: hidden;
    position: relative;
}
.pdList .pdImage::after {
	display: block;
	content: "";
	padding-bottom: 100%;
}
.pdList .pdImage .img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}