/* 新闻 */
.first {
    margin-top: 41%;
    background-color: #fff;
}

.first-content {
    display: flex;
    flex-direction: column; /* 竖向排列 */
    justify-content: center; /* 水平居中对齐 */
    align-items: center; /* 垂直居中对齐 */
    gap: 1rem; /* 设置纵向间距 */
}

.first-bottom {
    margin: 0 365px;
    display: flex;
    justify-content: space-between; /* 使时间和 knowmore 之间的空间相等 */
    align-items: center; /* 垂直居中对齐 */
    position: relative; /* 为绝对定位的下边框线提供相对定位 */
}

.bottom-border {
    position: absolute;
    bottom: -25px; /* 距离底部为 0 */
    left: 5%; /* 从左侧开始 */
    right: 5%; /* 到达右侧 */
    height: 1px; /* 边框线的高度 */
    background-color: #484848; /* 边框线的颜色 */
}
@media (max-width: 1450px)  {
	.bottom-border {
	    position: absolute;
	    bottom: 0; /* 距离底部为 0 */
	    left: -26%; /* 从左侧开始 */
	    right:-26%; /* 到达右侧 */
	    height: 1px; /* 边框线的高度 */
	    background-color: #484848; /* 边框线的颜色 */
	}
}
@media (max-width: 1300px)  {
	.bottom-border {
	   display: none;
	}
}
/* 图片轮播 */
.pic-lunbo {
    position: relative;
    width: 100%; /* 图片占满宽度 */
    max-width: 1000px; /* 图片最大宽度 */
    height: auto; /* 高度自适应 */
    overflow: hidden;
    margin-top: 2rem; /* 调整顶部间距 */
    margin-bottom: 2rem; /* 调整底部间距 */
}

.pic-lunbo img {
    width: 100%; /* 图片占满宽度 */
    height: auto; /* 高度自适应 */
    display: block;
    position: relative; /* 调整定位方式 */
    transition: opacity 1s ease;
}

/* 文字部分 */
.first-word {
    width: 100%; /* 文字部分占满宽度 */
    max-width: 1000px; /* 文字部分最大宽度 */
    margin-top: 1rem; /* 调整顶部间距 */
    text-align: left; /* 文字左对齐 */
	margin-bottom: 1.5rem; 
}

.first-word h2 {
    color: #b52b21;
	text-align: left;
    margin-bottom: 3rem; /* 调整标题下间距 */
}

.first-word p {
    color: #484848;
    line-height: 2.5;
    font-size: 11pt;
    margin-bottom: 0; /* 调整段落下间距 */
}
.first-word h3 {
    color: #b52b21;
    font-size: 11pt;

}
.first-word p:first-of-type {
    margin-top: 0; /* 去掉首段的顶部间距 */
}

/* 媒体查询：小于 784px 屏幕 */
@media (max-width: 784px) {
    .first-content {
		
        flex-direction: column; /* 保持竖向排列 */
        align-items: center; /* 文字居中对齐 */
        gap: 1rem; /* 设置纵向间距 */
    }
	.first{
		margin-top: 35%;
	}
    .first-word {
        width: 100%; /* 文字部分占满宽度 */
        margin-left: 0; /* 去掉左边距 */
		padding-left: 3.125rem;
		padding-right: 3.125rem;
        margin-top: 0; /* 去掉顶部边距 */
    }

    .first-word h2 {
        margin: 1rem 0; /* 上下间距 */
        text-align: center; /* 标题左对齐 */
    }

    .pic-lunbo {
        width: 100%; /* 占满宽度 */
        height: auto; /* 高度自适应 */
        margin-top: 0; /* 去掉顶部边距 */
        margin-bottom: 0; /* 去掉底部边距 */
    }

    .pic-lunbo img {
        width: 100%; /* 图片占满宽度 */
        height: auto; /* 高度自适应 */
        object-fit: cover; /* 保持图片的覆盖效果 */
    }
}


/*为什么删了搜索栏样式就变了？*/
button {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	z-index: 10;
}



/*二维码放置处*/
.QRcode {
    margin-top: 6.25rem;
    padding-bottom: 6.25rem;
    display: flex;
    justify-content: center; /* 整体居中 */
	/*background: linear-gradient(to bottom, transparent 12.5%, #eef3fa 12.5%);*/
}
.QRcode a{
	text-decoration: none;
	color: #666666;
}
.QR-whole {
    display: flex;
    flex-direction: row; /* 横向布局 */
    align-items: center; /* 子元素在纵向上居中对齐 */
}

.QR-whole a {
    display: flex;
    flex-direction: column; /* 竖向布局 */
    align-items: center; /* 子元素在横向上居中对齐 */
    text-align: center; /* 文字居中对齐 */
    margin: 0 70px; /* 左右间距为 70px，每对相邻的子元素间距为 140px */
	
}

.QR-whole img {
    width: 60px;
    height: 62px;
    display: block;
    margin-bottom: 12px; /* 图片和文字之间的间距 */
}

/* 鼠标移入时文字颜色变为红色 */
.QR-whole > div:hover p {
    color: #b51b21 ;
}

.QR-whole a img:hover {
    transform: scale(2.5); /* 放大 10% */
    transition: transform 0.3s ease; /* 添加平滑过渡效果 */
}
@media (max-width: 1050px) {
	
    .QR-whole {
        flex-direction: row; /* 横向布局 */
        justify-content: space-between; /* 元素之间的间距均匀分布 */
		margin-left: 10%;
    }

    .QR-whole a {
        flex: 1 1 calc(50% - 20px); 
        margin: 10px; 
    }

    .QR-whole img {
        width: 60px; /* 根据需求调整缩放后的宽度 */
        height: auto; /* 保持图片的纵横比 */
    }
}
@media (max-width: 784px) {
    .QR-whole {
        flex-direction: row; /* 横向布局 */
        justify-content: space-between; /* 元素之间的间距均匀分布 */
		margin-left: 5%;
    }

    .QR-whole a {
        flex: 1 1 calc(50% - 20px); 
        margin: 10px; 
    }

    .QR-whole img {
        width: 50px; /* 根据需求调整缩放后的宽度 */
        height: auto; /* 保持图片的纵横比 */
    }
}