/*背景*/
.header {
    position: relative;
}
@media (max-width: 784px) {
	.header {
	    margin-top: 20%;
	}
	
		
}
.lunbo {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh; /* 或者根据实际需要调整高度 */
	z-index: 1; /* 使轮播图在导航栏的下方 */
}
.navbar {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 100; /* 确保导航栏在轮播图之上 */
    transition: background-color 0.3s; /* 添加过渡效果 */
}

/* 滚动后背景颜色变为白色 */
.navbar.scrolled {
    background-color: #fff; /* 背景色为白色 */
	box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
}

.slideshow-container {
    /* 设置轮播图容器的样式 */
}

/* 默认样式 */
.top_ul_link {
    text-decoration: none;
    color: black; /* 默认文字颜色 */
}
/*第一部分*/
.first{
	margin-top: 31.25%;
	background-color: #eee;

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

/*图片轮播*/
 .pic-lunbo {
     position: relative;
     width: 600px; /* 轮播图宽度 */
     height: 400px; /* 轮播图高度 */
     overflow: hidden;
     margin-top: 6.25rem;
     margin-bottom: 6.25rem;
 }
 
 .pic-lunbo img {
     width: 100%;
     height: auto;
     display: block;
     position: absolute;
     transition: opacity 1s ease;
 }
 
 .pic-lunbo .prev, .pic-lunbo .next {
     position: absolute;
     top: 50%;
     width: 40px;
     height: 40px;
     background-color: rgba(0, 0, 0, 0);
     border: none;
     cursor: pointer;
     transform: translateY(-50%);
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center;
 }
 
 .pic-lunbo .prev {
     left: 10px;
     background-image: url("../../img/home_left.png"); /* 替换为你的图片路径 */
 }
 
 .pic-lunbo .next {
     right: 10px;
     background-image: url("../../img/home_right.png"); /* 替换为你的图片路径 */
 }
/*文字部分*/
.first-word{
	width: 28.125rem;
	margin-left: 5.375rem;
	margin-top: 60px;
}
.first-word h2{
	color: #686868;
	display: inline-block; /* 使 h2 的宽度与内容一致 */
	border-bottom: 3px solid #b52b21; /* 设置红色下划线 */
	padding-bottom: 5px; /* 添加下内边距使下划线与文字有些间距 */
	
}
.first-word p:first-of-type{
	margin-top: 3.125rem;
	}
.first-word p{
	color: #838383;
	line-height: 2;
	font-size: 11pt;
}
.konwmore{
	margin-top: 2.5rem;
		
}
.konwmore a{
	text-decoration: none;
}
.konwmore span{
	font-size: 16pt;
	color: #b52b21;
	border:0.125rem #b52b21 solid;
	padding: 0.5rem 3.125rem;
	cursor: pointer;
}
.konwmore span:hover{
	color: #fff;
	background-color: #b52b21;
}
@media (max-width: 1450px) {
	.first{
		margin-top: 31%;
		height: 40rem;
	}
}

/* 媒体查询：小于 784px 屏幕 */
@media (max-width: 784px) {
	.first{
		margin-top: 5%;
		background-color: #eee;
	
	}
    .first-content {
        flex-direction: column; /* 竖向排列 */
        align-items: stretch; /* 让子元素占满宽度 */
        gap: 0; /* 不需要间距 */
    }

    .first-word {
        width: 100%; /* 文字部分占满宽度 */
        margin-left: 0; /* 去掉左边距 */
        margin-top: 0; /* 去掉顶部边距 */
		transform: scale(0.9);
    }
	
    .first-word h2 {
        margin: 1rem 0; /* 上下间距 */
        text-align: center; /* 居中对齐 */
		padding-top: 1rem;
    }

    .pic-lunbo {
        width: 100%; /* 占满宽度 */
        height: 50vw; /* 高度为宽度的50% */
        margin-top: 0; /* 去掉顶部边距 */
        margin-bottom: 0; /* 去掉底部边距 */
    }

    .pic-lunbo img {
        width: 100%;
        height: 100%;
        object-fit: cover; /* 保持图片的覆盖效果 */
    }

    .konwmore {
        margin-top: 1rem; /* 调整按钮的顶部边距 */
        text-align: center; /* 居中对齐 */
    }

    .konwmore span {
        font-size: 14pt; /* 调整字体大小 */
        padding: 0.5rem 2rem; /* 调整内边距 */
    }

    .konwmore span:hover {
        background-color: #b52b21; /* 悬停效果 */
    }
}
/*第二部分*/

.second-content {
    display: flex;
    
    align-items: center; /* 垂直居中对齐 */
    gap: 1rem; /* 设置横向间距 */
}


/*文字部分*/
.second{
	width: 100%;
	background-image: url("../../img/abytl/abytlrongyu.jpg");
	background-repeat: no-repeat;
	background-position: 90%;
}
.second-word{
	margin-left: 10%;
	width: 500px;
	margin-top: 5%;
	margin-bottom: 5%;

}
.second-word h2{
	color: #686868;
	display: inline-block; /* 使 h2 的宽度与内容一致 */
	border-bottom: 3px solid #b52b21; /* 设置红色下划线 */
	padding-bottom: 5px; /* 添加下内边距使下划线与文字有些间距 */
}
.second-word p:first-of-type{
	margin-top: 3.125rem;
}

.second-word p{
	color: #838383;
	line-height: 2;
	font-size: 11pt;
}
.konwmore2{
	margin-top: 2.5rem;
		
}
.konwmore2 a{
	text-decoration: none;
}
.konwmore2 span{
	font-size: 16pt;
	color: #b52b21;
	border:0.125rem #b52b21 solid;
	padding: 0.5rem 3.125rem;
	cursor: pointer;
}
.konwmore2 span:hover{
	color: #fff;
	background-color: #b52b21;
}
/* 媒体查询：小于 784px 屏幕 */
@media (max-width: 784px) {
	.second{
		height: 40rem;
		background-image: none;
	}
    .second-content {
        flex-direction: column; /* 竖向排列 */
        align-items: stretch; /* 让子元素占满宽度 */
        gap: 0; /* 不需要间距 */
    }

    .second-word {
        width: 100%; /* 文字部分占满宽度 */
        margin-left: 0; /* 去掉左边距 */
        margin-top: 0; /* 去掉顶部边距 */
		transform: scale(0.9);
    }

    .second-word h2 {
        margin: 1rem 0; /* 上下间距 */
        text-align: center; /* 居中对齐 */
    }

    .pic-lunbo2 {
        width: 100%; /* 占满宽度 */
        height: 50vw; /* 高度为宽度的50% */
        margin-top: 0; /* 去掉顶部边距 */
		margin-left: 0;
        margin-bottom: 0; /* 去掉底部边距 */
    }

    .pic-lunbo2 img {
        width: 100%;
        height: 100%;
        object-fit: cover; /* 保持图片的覆盖效果 */
    }

    .konwmore {
        margin-top: 3rem; /* 调整按钮的顶部边距 */
        text-align: left; /* 居中对齐 */
		
    }

    .konwmore span {
        font-size: 14pt; /* 调整字体大小 */
        padding: 0.5rem 2rem; /* 调整内边距 */.
    }

    .konwmore span:hover {
        background-color: #b52b21; /* 悬停效果 */
    }
	.horner-word{
		transform: scale(0.9);
	}
	.horner{
		height: 500px;
		margin-top: -225px;
	}
	.horner-word h2{
		
	}
	.konwmore2 {
	    margin-top: 3rem; /* 调整按钮的顶部边距 */
	    text-align: center; /* 居中对齐 */
		
	}
	
	.konwmore2 span {
	    font-size: 14pt; /* 调整字体大小 */
	    padding: 0.5rem 2rem; /* 调整内边距 */.
	}
	
	.konwmore2 span:hover {
	    background-color: #b52b21; /* 悬停效果 */
	}
}




/*集团荣誉*/
.horner{
	background-color:#eee ;
}
.horner img{
	width: 100%;
	height: auto;
		
	background-size: cover; /* 根据需要调整背景图像的尺寸 */
	background-position: center; /* 确保背景图像居中显示 */
	background-repeat: no-repeat; /* 防止背景图像重复 */
	
	z-index: -1; /* 确保背景图片在内容下方 */
} 
/*文字部分*/
.horner-word{
	
	width: 100%;
}
.horner-word {
    text-align: center; /* 文本居中对齐 */
    margin: 0 auto; /* 可选：水平居中对齐，前提是设置了固定宽度 */
    padding: 40px; /* 可选：内边距 */
}
.horner-word h2{
	color: #686868;
	margin-top: 0px;
	display: inline-block; /* 使 h2 的宽度与内容一致 */
	border-bottom: 3px solid #b52b21; /* 设置红色下划线 */
	padding-bottom: 5px; /* 添加下内边距使下划线与文字有些间距 */
}
.horner-word p:first-of-type{
	margin-top: 1.875rem;
}

.horner-word p{
	color: #666;
	line-height: 2;
	font-size: 11pt;
}
@media (max-width: 784px) {
   .horner {
      height: 40%;
   }
}
/*二维码放置处*/
.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; /* 保持图片的纵横比 */
    }
}