/* 基礎重置 */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* 確保圖片在任何寬度下都能響應式縮放 */
.image-gallery img {
    /* 讓圖片寬度永遠充滿其父容器 */
    width: 100%;
    /* 保持圖片的原始比例 */
    height: auto;
    /* 移除圖片底部可能產生的微小間隙 */
    display: block;
}

/* 圖片容器的樣式 */
.image-item {
    /* 設定最大寬度，避免在大螢幕上圖片過大 */
    max-width: 600px;
    /* 讓整個容器在父元素中置中 */
    margin-left: auto;
    margin-right: auto;
    
    /* 設定圖片之間的垂直間距 */
    margin-bottom: 20px; 
}

/* 移除最後一張圖片的底部間距，讓排版更乾淨 */
.image-gallery .image-item:last-child {
    margin-bottom: 0;
}