﻿/*新版导航栏目*/
/* 头部外层 白色背景 */

/*全局BANNER*/


.footer-banner {
	position: relative;
	background: url('/images/footer_bg.jpg') center no-repeat;
	height: 270px;
	overflow: hidden;
	color: #fff;
	text-align: center
	
}

.footer-banner img{
display:block;
    width:100%;
}
.footer-banner-text {
	padding-top: 100px;
	font-size: 28px
}
.footer-banner-button a {
	display: inline-block;
	margin-top: 24px;
	width: 180px;
	height: 44px;
	line-height: 42px;
	border: 1px solid #fff;
	color: #fff
}
.footer-banner-button a:hover {
	color: #333;
	background-color: #fff
}
.footer-bubble {
	position: absolute
}
.bubble-1 {
	top: -120px;
	left: 50%;
	z-index: 10;
	margin-left: 20%;
	width: 240px;
	height: 240px;
	background: url(./images/footer_bubble_1.png);
	-webkit-animation: bubble-animate-1 linear 10s infinite;
	-moz-animation: bubble-animate-1 linear 10s infinite;
	-o-animation: bubble-animate-1 linear 10s infinite;
	animation: bubble-animate-1 linear 10s infinite
}
.bubble-2 {
	top: 50px;
	left: 34%;
	z-index: 11;
	width: 360px;
	height: 360px;
	background: url(./images/footer_bubble_2.png);
	-webkit-animation: bubble-animate-2 linear 12s infinite;
	-moz-animation: bubble-animate-2 linear 12s infinite;
	-o-animation: bubble-animate-2 linear 12s infinite;
	animation: bubble-animate-2 linear 12s infinite
}
.bubble-3 {
	top: 50px;
	left: 48%;
	z-index: 12;
	width: 300px;
	height: 300px;
	background: url(./images/footer_bubble_3.png);
	-webkit-animation: bubble-animate-3 linear 11s infinite;
	-moz-animation: bubble-animate-3 linear 11s infinite;
	-o-animation: bubble-animate-3 linear 11s infinite;
	animation: bubble-animate-3 linear 11s infinite
}
@-webkit-keyframes bubble-animate-1 {
from, to {
top:-120px
}
50% {
top:-180px
}
}
@-moz-keyframes bubble-animate-1 {
from, to {
top:-120px
}
50% {
top:-180px
}
}
@-o-keyframes bubble-animate-1 {
from, to {
top:-120px
}
50% {
top:-180px
}
}
@keyframes bubble-animate-1 {
from, to {
top:-120px
}
50% {
top:-180px
}
}
@-webkit-keyframes bubble-animate-2 {
from, to {
top:50px;
left:34%
}
50% {
top:80px;
left:24%
}
}
@-moz-keyframes bubble-animate-2 {
from, to {
top:50px;
left:34%
}
50% {
top:80px;
left:24%
}
}
@-o-keyframes bubble-animate-2 {
from, to {
top:50px;
left:34%
}
50% {
top:80px;
left:24%
}
}
@keyframes bubble-animate-2 {
from, to {
top:50px;
left:34%
}
50% {
top:80px;
left:24%
}
}
@-webkit-keyframes bubble-animate-3 {
from, to {
top:50px;
left:48%
}
50% {
top:80px;
left:58%
}
}
@-moz-keyframes bubble-animate-3 {
from, to {
top:50px;
left:48%
}
50% {
top:80px;
left:58%
}
}
@-o-keyframes bubble-animate-3 {
from, to {
top:50px;
left:48%
}
50% {
top:80px;
left:58%
}
}
@keyframes bubble-animate-3 {
from, to {
top:50px;
left:48%
}
50% {
top:80px;
left:58%
}
}

.sub-nav-wrap {
    margin: 30px 0;
    padding: 20px;
    background: #fef8f8;
    border-radius: 6px;
}
.sub-nav-title {
    font-size: 16px;
    color: #b81c22;
    font-weight: bold;
    margin-bottom: 16px;
    padding-left: 10px;
    border-left: 3px solid #b81c22;
}
.sub-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
	justify-content: center; /* 整体居中 */
}
/* 二级导航链接 古风边框样式（和顶部导航同源） */
.sub-nav a {
    padding: 7px 18px;
    font-size: 14px;
    position: relative;
    border: 1px solid #b81c22;
    transition: all 0.3s;
}
/* 四角装饰线 */
.sub-nav a::before,
.sub-nav a::after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    border-color: #b81c22;
    border-style: solid;
}
.sub-nav a::before {
    top: -1px;
    left: -1px;
    border-width: 1px 0 0 1px;
}
.sub-nav a::after {
    bottom: -1px;
    right: -1px;
    border-width: 0 1px 1px 0;
}
/* hover效果 */
.sub-nav a:hover,
.sub-nav a.active {
    background-color: #b81c22;
    color: #ffffff;
}






/*新闻详情页面内容区样式*/
* {margin: 0; padding: 0; box-sizing: border-box;}
        body {font-family: "微软雅黑",sans-serif; font-size: 14px; color: #333; background: #f6f6f6; line-height: 2;}
        a {text-decoration: none;  transition: 0.3s;}
        
        .wrap {width: 1200px; margin: 0 auto; background: #fff; padding: 30px;}
       
        .news-title {font-size: 30px; text-align: center; font-weight: bold; color: #222; margin-bottom: 20px;}
        .news-content {font-size: 16px; color: #444; margin: 24px 0;
}
        .news-content p {text-indent: 2em; line-height: 2; margin-bottom: 18px;}
        .news-content img {max-width: 80%; height: auto; margin: 24px auto; display: block; border-radius: 10px; box-shadow: 0 2px 12px rgba(0,0,0,0.08);}
		
        .mod-title {font-size: 18px; border-left: 4px solid #b81c22; padding-left: 12px; margin: 50px 0 20px; font-weight: bold;}
        .comment-box {padding: 20px; background: #fafafa; text-align: center; color: #999; border-radius: 4px;}
        
        .join-box {margin-top: 60px; padding: 30px; background: #fef2f2; border-radius: 8px; text-align: center;}
        .join-box p {font-size: 17px; color: #b81c22; font-weight: 500;}
        @media screen and (max-width: 1200px) {
            .wrap {width: 96%; padding: 15px;}
            .news-title {font-size: 24px;}
	