﻿/* 图片容器：使用flex实现横向排列 */
.images-container {
    display: flex;
    /* 自动换行，适配小屏幕 */
    flex-wrap: wrap;
    /* 图片之间均匀分布 */
    /* 核心修改：从space-around改为flex-start，实现左对齐 */
    justify-content: flex-start;
    /* 垂直方向居中 */
    align-items: flex-start;
    gap: 20px; /* 图片卡片之间的间距 */
    /* max-width: 1200px; /* 容器最大宽度，避免太宽 */
    margin: 0 auto; /* 水平居中 */
}

/* 单个图片卡片 */
.image-card {
    /* 每张卡片的宽度，可根据需求调整 */
    width: 200px;
    text-align: center; /* 文字居中 */
}

    /* 图片样式：保证统一尺寸，避免变形 */
    .image-card img {
        width: 100%; /* 宽度自适应卡片 */
        /* height: 150px;  固定高度 */
        object-fit: cover; /* 保持比例裁剪，不拉伸 */
        /* border-radius: 8px; 圆角，提升美观度 */
        /*box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); 轻微阴影 */
        margin-bottom: 10px; /* 图片和文字的间距 */
    }

    /* 说明文字样式 */
    .image-card .caption {
        font-size: 18px;
        color: #333;
        line-height: 1.4;
    }

.desc {
    text-align: left;
    text-indent: 2em;
    line-height: 1.9em;
    font-size: 1.2em;
}

.hanziA a {
    cursor: pointer;
    color: #007bff !important;
    margin-bottom: .5rem !important;
    margin-right: .5rem !important;
    background-color: #f8f9fa;
    border-color: #f8f9fa;
    display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    user-select: none;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
