/* 响应式布局 */
@media (max-width: 1024px) {
    .page-cent .content,
    .page-about .content {
        padding-left: 0;
        padding-right: px;
    }
}

@media (max-width: 720px) {
    .page-cent .content {
        width: 100%;
    }

    .page-home .content h2 {
        font-size: 40px;
    }

    .page-home .content h3 {
        font-size: 15px;
    }
    .page-home .content h4 {
        font-size: 1px;
    }
}

/* 按钮组样式 */
.button-group {
    margin-bottom: 20px; /* 按钮组之间添加一些垂直间距 */
}

/* 搜索输入框样式 */
.search-input {
    width: 100%; /* 输入框宽度占满父容器 */
    box-sizing: border-box; /* 输入框宽度包括边框和内边距 */
}

/* 小屏幕下的响应式布局 */
@media screen and (max-width: 768px) {
    .page-cover,
    .page-main,
    .page-when {
        padding: 30px; /* 在小屏幕下减少内边距 */
        
    }

    .button-group {
        display: flex;
        flex-wrap: wrap; /* 按钮组自动换行 */
        
    }

    .button-group button {
        flex: 0 0 100%; /* 按钮宽度自动适应屏幕，并占据一半宽度 */
        margin: 2px; /* 按钮之间添加一些间距 */
        
    }
}