.img-container {
    display: flex;
    justify-content: center;
    gap: 20px; /* 이미지 사이 간격 */
    margin: 20px auto;
    max-width: 900px; /* 컨테이너 너비 제한 */
    margin-bottom: 200px;
}

.img-container > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 45%; /* 1행 2열 구조 */
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 15px;
    background: #f9f9f9;
    cursor: pointer;
}

.product-hero {
    position: relative; /* 오버레이를 추가하기 위한 상대적 위치 지정 */
    background: url('/img/cnjg/da656e_520d998c2cc545eda9ed9b93d6205aa5~mv2.avif') center 16% no-repeat;
    background-size: cover; /* 화면을 꽉 채우도록 */
}

.product-hero h1 {
    text-align: center; /* 중앙 정렬 */
    font-size: 68px; /* 제목 폰트 크기 */
    line-height: 68px; /* 줄 간격 68px */
    margin-bottom: 20px; /* 하단 여백 */
    text-shadow: 3px 3px 10px rgba(0, 0, 0, 0.7); /* 텍스트 음영 효과 */
}

.product-hero h3 {
    font-size: 23px; /* 설명 폰트 크기 */
    color: #333; /* 텍스트 색상 */
    background-color: #bbb; /* 배경 색상 */
    margin-top: 40px;
    padding: 5px; /* 세로 여백을 줄여서 텍스트 높이 조정 */
    border-radius: 5px; /* 둥근 모서리 */
    display: inline-block; /* 텍스트와 배경 영역을 줄이기 위해 inline-block 사용 */
}


.img-container img {
    width: 100%;
    max-width: 300px; /* 이미지 크기 제한 */
    border-radius: 8px;
}

.img-container p {
    margin-top: 10px;
    font-size: 1.1rem;
    font-weight: bold;
}

.hero h3 {
    top: 0px;
    left: 0px;
}