/* 针对宽度大于768px的屏幕，确保 homepage_image 与 page_index_journal 左上角对齐 */
@media (min-width: 769px) {
    .page_index_journal {
        position: relative; /* 确保子元素可以相对于父元素定位 */
    }

    .homepage_image {
        width: 200px;
        height: 283px;
        position: absolute;
        top: 30px;
        left: 30px;
    }

    .homepage_image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .homepage_about {
        margin-left: 230px; /* 确保内容与图片之间留出足够的空间 */
        margin-top: 0px; /* 确保与图片顶部对齐 */
        box-sizing: border-box;
        float: none; /* 确保不会影响其他元素 */
    }

    .current_issue, .additional_content {
        clear: both; /* 确保在图片和 homepage_about 之后显示 */
        margin-top: 100px !important; /* 留出顶部空间，使用 !important 确保生效 */
        position: relative; /* 取消任何可能的浮动或绝对定位 */
    }
}

/* 针对宽度小于等于768px的屏幕，取消绝对定位，确保默认布局 */
@media (max-width: 768px) {
    .page_index_journal {
        position: relative; /* 确保子元素可以相对于父元素定位 */
    }

    .homepage_image {
        width: 200px;
        height: 283px;
        position: relative; /* 使用相对定位 */
        margin: 0 auto; /* 居中显示图片 */
        left: 5vw; /* 向右移动30px */
    }

    .homepage_image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .homepage_about {
        width: 100%; /* 确保 homepage_about 与 page_index_journal 的宽度一致 */
        margin-left: 0 !important; /* 取消左边的间距 */
        margin-top: 30px; /* 确保有适当的顶部间距 */
    }

    .current_issue {
        clear: both; /* 确保在图片和 homepage_about 之后显示 */
        margin-top: 10px; /* 留出顶部空间 */
    }
}

/* 设置 homepage_image 的初始样式，并添加过渡效果 */
.homepage_image {
    transition: transform 0.3s ease, box-shadow 0.3s ease; /* 添加平滑过渡效果 */
}

/* 鼠标悬停时 homepage_image 变大并添加阴影 */
.homepage_image:hover {
    transform: scale(1.1); /* 放大1.1倍 */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* 添加阴影 */
}

/* 确保 homepage_about 与图片不重合，并正确对齐 */
.homepage_about {
    margin-left: 230px; /* 确保内容与图片之间留出足够的空间 */
    margin-top: 0px; /* 确保与图片顶部对齐 */
    box-sizing: border-box;
    float: none; /* 确保不会影响其他元素 */
}

/* 确保 current_issue 与其他元素正确对齐，和其布局 */
.current_issue, .additional_content {
    clear: both; /* 确保在图片和 homepage_about 之后显示 */
    margin-top: 10px; /* 留出顶部空间 */
}

.published {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.sections {
    margin-top: 0 !important;
}

/* 仅在 pkp_page_APC pkp_op_index 页面中应用表格格式 */
.pkp_page_APC.pkp_op_index .table-bordered {
    border: 1px solid #ddd; /* 设置表格边框颜色 */
}

.pkp_page_APC.pkp_op_index .table-bordered th, 
.pkp_page_APC.pkp_op_index .table-bordered td {
    border: 1px solid #ddd; /* 设置单元格边框颜色 */
    padding: 8px; /* 设置单元格内边距 */
    text-align: center; /* 居中对齐表格内容 */
    vertical-align: middle; /* 垂直居中对齐表格内容 */
}

.pkp_page_APC.pkp_op_index .table-striped tbody tr:nth-of-type(odd) {
    background-color: #f9f9f9; /* 设置奇数行的背景颜色 */
}

.pkp_page_APC.pkp_op_index .table-striped tbody tr:nth-of-type(even) {
    background-color: #fff; /* 设置偶数行的背景颜色 */
}

/* 选择特定页面的主体内容，将段落和列表项的文本设置为两端对齐 */
.pkp_page_about.pkp_op_index p,
.pkp_page_about.pkp_op_index li,
.pkp_page_APC.pkp_op_index p,
.pkp_page_APC.pkp_op_index li,
.pkp_page_about.pkp_op_privacy p,
.pkp_page_about.pkp_op_privacy li,
.pkp_page_information.pkp_op_readers p,
.pkp_page_information.pkp_op_readers li,
.pkp_page_information.pkp_op_authors p,
.pkp_page_information.pkp_op_authors li,
.pkp_page_information.pkp_op_librarians p,
.pkp_page_information.pkp_op_librarians li {
    text-align: justify;
}

/* 确保标题保持原有的对齐方式，不受上述规则影响 */
.pkp_page_about.pkp_op_index h1, .pkp_page_about.pkp_op_index h2, .pkp_page_about.pkp_op_index h3, .pkp_page_about.pkp_op_index h4, .pkp_page_about.pkp_op_index h5, .pkp_page_about.pkp_op_index h6,
.pkp_page_APC.pkp_op_index h1, .pkp_page_APC.pkp_op_index h2, .pkp_page_APC.pkp_op_index h3, .pkp_page_APC.pkp_op_index h4, .pkp_page_APC.pkp_op_index h5, .pkp_page_APC.pkp_op_index h6,
.pkp_page_about.pkp_op_privacy h1, .pkp_page_about.pkp_op_privacy h2, .pkp_page_about.pkp_op_privacy h3, .pkp_page_about.pkp_op_privacy h4, .pkp_page_about.pkp_op_privacy h5, .pkp_page_about.pkp_op_privacy h6,
.pkp_page_information.pkp_op_readers h1, .pkp_page_information.pkp_op_readers h2, .pkp_page_information.pkp_op_readers h3, .pkp_page_information.pkp_op_readers h4, .pkp_page_information.pkp_op_readers h5, .pkp_page_information.pkp_op_readers h6,
.pkp_page_information.pkp_op_authors h1, .pkp_page_information.pkp_op_authors h2, .pkp_page_information.pkp_op_authors h3, .pkp_page_information.pkp_op_authors h4, .pkp_page_information.pkp_op_authors h5, .pkp_page_information.pkp_op_authors h6,
.pkp_page_information.pkp_op_librarians h1, .pkp_page_information.pkp_op_librarians h2, .pkp_page_information.pkp_op_librarians h3, .pkp_page_information.pkp_op_librarians h4, .pkp_page_information.pkp_op_librarians h5, .pkp_page_information.pkp_op_librarians h6 {
    text-align: left; /* 或其他你希望的对齐方式 */
}