@charset "utf-8";

.intro-title7 {
  font-family: Source Han Sans;
  font-size: 40px;
  font-weight: 500;
  letter-spacing: 0em;
  color: #002fa5;padding-top: 70px !important;
}


#section_padding0 .search_news_con{text-align: right;
  padding-top: 160px;
  display: flex;
  align-items: center;
  justify-content: end;}
.layer-search { position:relative;  width:350px; height:80px; border: 1px solid rgba(0, 47, 165, 0.1);border-radius: 8px; padding:5px 15px;}
/* 搜索输入框本体 → 控制【输入内容的文字颜色】 */
.layer-search .search {
  display: block;
  background-color: transparent;
  border: none;
  line-height: 25px;
  text-indent: 0;
  width: 100%; 
  /* 👇 这里单独设置【输入文字的颜色】，可自由修改数值 */
  color: rgba(0, 47, 165, 1); 
  font-size: 16px;
}

/* 提示文字 → 控制【placeholder 灰色提示语】颜色（不变） */
.layer-search .search::placeholder {
    color: rgba(0, 47, 165, 0.5) !important;
    opacity: 1 !important;
}
.layer-search  .input-search-btn{ position:absolute; right:15px; bottom:10px; border:0; background:none; font-size:20px; color:#002FA5}

#section_padding0 .change_pages{text-align: right;
  padding-top: 0px; padding-bottom:100px;
  display: flex;
  align-items: center;
  justify-content: end;}
.change_pages .layer-set{ margin-left:10px;}

/* 新闻列表样式 */

			.news-list {
				padding: 70px 0 88px;
				background: #fff;
			}

			.news-container {
				display: grid;
				grid-template-columns: repeat(3, 1fr);
				gap: 18px;
			}

			.news-item {
				background: #fff;
				cursor: pointer;
				transition: all 0.3s ease;
			}

			.news-item:hover {
				transform: translateY(-5px);
			}
			
		/* 父容器：隐藏溢出内容，让滑动效果更干净 */
.news-item .news-jiantou {
  text-align: right;
  display: flex;
  align-items: center;
  justify-content: end;
  padding-top: 40px;padding-bottom: 40px;
  overflow: hidden; /* 关键：隐藏图片滑动时的超出部分 */
}

/* 默认状态：图片透明 + 向左位移隐藏 */
.news-item .news-jiantou img {
  height: 20px;
  width: 20px;
  opacity: 0; /* 透明隐藏 */
  transform: translateX(-20px); /* 向左位移 20px（可根据需要调整距离） */
  transition: all 0.3s ease; /* 过渡动画：0.3秒，缓动效果 */
}

/* 悬停状态：图片完全显示 + 位移归位 */
.news-item:hover .news-jiantou img {
  opacity: 1; /* 完全不透明 */
  transform: translateX(0); /* 位移回到原位，实现从左到右滑入 */
}

			.news-image {
				width: 100%;
				height: 280px;
				object-fit: cover;
				display: block;
				border-radius: 12px;
			}

			.news-title {
				font-size: 24px;
				font-weight: 500;
				color: #002fa5;

				margin: 24px 0 14px;
				line-height: 1.5;
			}
			.news-item:hover .news-title {
				color: rgba(0, 47, 165, 0.8);
			}

			.news-date {
				font-size: 12px;
				font-weight: 350;
				margin: 0;
				color: rgba(0, 47, 165, 0.5);
				font-family: Source Han Sans;
			}
			.news-item:hover .news-date {
				color: rgba(0, 47, 165, 0.8);
			}

			/* 响应式 */
			@media screen and (max-width: 1024px) {
				.nav-links {
					gap: clamp(20px, 5vw, 30px);
				}

				.news-container {
					gap: 30px;
				}
			}

			@media screen and (max-width: 768px) {
				.nav-links {
					gap: clamp(10px, 5vw, 20px);
				}

				.section {
					padding: clamp(40px, 5vw, 60px) clamp(15px, 3vw, 20px);
				}

				nav {
					padding: clamp(10px, 2vw, 12px) clamp(10px, 2vw, 15px);
				}

				.section-title {
					font-size: clamp(24px, 4vw, 28px);
				}

				.news-container {
					grid-template-columns: repeat(2, 1fr);
					gap: 20px;
				}

				.news-list {
					padding: 60px 0 80px;
				}
			}

			@media screen and (max-width: 576px) {
				nav {
					flex-direction: column;
					padding: clamp(8px, 2vw, 10px) clamp(10px, 2vw, 15px);
					gap: clamp(5px, 1vw, 10px);
					background: rgba(0, 20, 60, 0.8);
				}

				.nav-links {
					gap: clamp(8px, 2vw, 12px);
					flex-wrap: wrap;
					justify-content: center;
				}

				.section-title {
					font-size: clamp(20px, 3vw, 24px);
				}

				.news-container {
					grid-template-columns: 1fr;
					gap: 20px;
				}

				.news-image {
					height: 200px;
				}

				.news-list {
					padding: 40px 0 60px;
				}
			}
			/* ========== 移动端新闻页面适配 ========== */
			@media screen and (max-width: 576px) {
				/* 隐藏桌面版导航 */
				nav:not(.mobile-nav) {
					display: none;
				}

				/* 显示移动版导航 */
				.mobile-nav {
					display: flex;
				}

				/* Hero 区域适配 */
				.hero {
					min-height: 50vh;
					margin-top: 60px; /* 为移动端导航留出空间 */
				}

				.hero-content {
					padding-top: 8px;
					align-items: center;
					position: relative;
					min-height: 50vh;
				}

				.banner-image {
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					object-fit: cover;
					object-position: center top;
					z-index: -1;
				}

				.page-title {
					position: absolute;
					left: 10%;
					bottom: 15%; /* 调整位置，避免显示不全 */
					text-align: center;
					z-index: 2;
					color: #fff;
					font-size: clamp(20px, 6vw, 36px);
				}

				/* 新闻列表区域适配 */
				.news-list {
					padding: 40px 0 60px !important;
					background: #fff;
				}

				.section {
					width: 100% !important;
					padding: 0 16px !important;
					margin: 0 auto !important;
					box-sizing: border-box;
				}

				/* 新闻网格布局适配 */
				.news-container {
					grid-template-columns: 1fr !important;
					gap: 24px !important;
					width: 100%;
					margin: 0 auto;
				}

				/* 新闻项适配 */
				.news-item {
					width: 100%;
					margin: 0 auto;
					background: #fff;
					border-radius: 12px;
					overflow: hidden;
					box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
					transition: all 0.3s ease; margin-bottom:20px;
				}

				.news-item:hover {
					transform: translateY(-4px);
					box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
				}

				.news-image {
					width: 100%;
					height: 200px !important;
					object-fit: cover;
					border-radius: 12px 12px 0 0;
				}

				.news-title {
					font-size: 18px !important;
					font-weight: 500;
					color: #002fa5;
					margin: 16px 16px 8px !important;
					line-height: 1.8;
					padding: 0;
				}

				.news-date {
					font-size: 14px !important;
					color: #999;
					margin: 0 16px 16px !important;
					font-weight: 350;
				}

				/* 页脚适配 */
				.footer-content {
					width: 100% !important;
					margin: 40px 16px 32px !important;
					flex-direction: column;
					align-items: flex-start;
				}

				.footer-logo {
					margin-left: 0 !important;
					margin-right: 0 !important;
					margin-bottom: 24px;
					flex-direction: column;
					/* align-items: center; */
					gap: 16px;
				}

				.footer-logo-blue {
					width: 120px;
				}

				.footer-logo-text {
					position: relative;
					width: 100px;
					top: -11px;
					left: 40px;
					margin-left: 0px !important;
					margin-top: 0 !important;
				}

				.footer-section {
					margin-bottom: 24px;
					width: 100%;
				}

				.margin-right-63 {
					margin-right: 0 !important;
				}

				.copyright {
					width: 100% !important;
					padding-right: 0 !important;
					text-align: center;
					margin-bottom: 40px;
					font-size: 14px;
					padding: 0 16px;
				}

				.footer-bg-img {
					min-height: 400px;
				}

				/* 返回顶部按钮适配 */
				.back-to-top {
					right: 20px;
					bottom: 20px;
					width: 40px;
					height: 40px;
				}
			}

			/* 平板设备 (768px - 1024px) */
			@media screen and (max-width: 768px) {
				/* 移动端导航隐藏 */
				nav:not(.mobile-nav) {
					display: none;
				}

				/* 显示移动版导航 */
				.mobile-nav {
					display: flex;
				}

				/* 调整内容区域宽度 */
				.section {
					padding: clamp(40px, 5vw, 60px) clamp(15px, 3vw, 20px);
				}

				/* 新闻网格布局适配 */
				.news-container {
					grid-template-columns: repeat(2, 1fr) !important;
					gap: 20px !important;
				}

				.news-list {
					padding: 60px 0 40px !important;
				}

				.news-image {
					height: 180px !important;
				}

				.news-title {
					font-size: 18px !important;
				}
			}

			/* 超小屏手机 (< 360px) */
			@media screen and (max-width: 360px) {
				.hero {
					min-height: 40vh;
				}

				.page-title {
					font-size: 18px;
					bottom: 20%;
				}

				.news-image {
					height: 180px !important;
				}

				.news-title {
					font-size: 16px !important;
				}

				.news-date {
					font-size: 13px !important;
				}
			}

			/* 保持1440px以上样式不变 */
			@media screen and (min-width: 1440px) {
				.section {
					width: 1146px !important;
					margin: 0 auto !important;
				}

				.news-container {
					grid-template-columns: repeat(3, 1fr) !important;
					gap: 18px !important;
				}

				.news-list {
					padding: 70px 0 88px !important;
				}

				.news-image {
					height: 280px !important;
				}

				.news-title {
					font-size: 24px !important;
					margin: 24px 0 14px !important;
				}

				.news-date {
					font-size: 14px !important;
					margin: 0 !important;
				}
			}
.back_up_btn{ margin-top:-50px;margin-bottom:20px;}			
.back_up_btn_show {
            position: relative; /* 作为遮罩层的定位参考 */
            overflow: hidden; /* 隐藏超出的遮罩层 */
            cursor: pointer;
            transition: color 0.3s ease; /* 图标颜色过渡 */
  background: linear-gradient(#EEF4FA, #F4F4FA); 
  /* 可选：圆角（内外层要一致） */
  border-radius: 100px; padding:4px;display: inline-block;font-size: initial;
        }
		.back_up_btn_show  .gradient-bg-container{
		    display: inline-flex;
            align-items: center;
            justify-content: center; 
		    width: auto;
            height: auto;
            border-radius: 100px; /* 圆形效果，可根据需求调整 */
            text-decoration: none;
            color: #002FA5; /* 图标默认颜色 */
			background: linear-gradient(#FFFFFF, #FAFBFE); transition: transform 0.3s ease;padding: 8px 25px;
			}

        /* 遮罩层样式 */
        .back_up_btn_show .mask {
            position: absolute;
            top: 0;
            right: 0; /* 从右侧开始 */
            width: 0; /* 默认隐藏 */
            height: 100%;
            background-color: #002FA5; /* 悬停背景色，可自定义 */
            transition: width 0.5s ease; /* 宽度过渡动画 */
            z-index: 0; /* 遮罩层在底层 */
			border-radius: 100px;
        }

        /* 图标容器 */
        .back_up_btn_show .layer-icon {
            position: relative; /* 确保图标在遮罩层上方 */
            z-index: 1;
            font-size:14px; /* 图标大小，可调整 */
			display: flex;
            align-items: center;
            gap: 15px; /* 文字和图标之间的间距 */
        }

        /* 鼠标悬停效果 */
        .back_up_btn_show:hover .mask {
            width: 100%; /* 遮罩层展开，从右到左 */
        }
        .back_up_btn_show:hover .layer-icon {
            color: #fff; /* 悬停时图标变为白色，可自定义 */
        }
		
		.back_up_btn_show .layer-icon .iconfont {
		transition: transform 0.3s ease;font-size:10px;
        }
		.back_up_btn_show:hover .layer-icon .iconfont {
		 transform: translateX(-44px);
		}
		.back_up_btn_show:hover .layer-icon .more_font {
  transform: translateX(23px);
}
  
  
  
	@media screen and (max-width: 768px) {			
			.layer-search {
  position: relative;
  width: 100%;}
  .news-container{ display:block;}
  .news-item .news-jiantou{ display:none}
  .layer-search .search{ font-size:14px;}
  }