/* ========================================
   About.css - 关于金雷 Page Styles
   ======================================== */

/* ---------- Banner (#nyBan) ---------- */
.p_list { color: #fff; }
.p_s { color: #fff; line-height: 1.2; }
.p_b { color: #fff; line-height: 1; }
.p_list { display: flex; }
.p_miao {
    color: #fff;
    line-height: 1.8;
    width: 86%;
    font-weight: normal; /* 显式去掉加粗（防止任何继承/默认加粗） */
    font-family: 'Alibaba-PuHuiTi-Regular', 'Noto Sans SC', 'Microsoft YaHei', sans-serif; /* 普惠体 Regular，字形更细 */
}
.list_item { margin-right: 60px; }
.list_d { margin-left: 10px; }

/* ---------- 分子公司 (mkBox1) ---------- */
.mkBox1 {
    position: relative;
    width: 100%;
    height: 100%;
}
.mk_z { color: #fff; }
.mk_t { color: #fff; }
.mk_item {
    position: relative;
    width: 100%;
    transition: all 1s;
}
.mk_item img {
    width: 100%;
    height: 100%;
    height: 130px;
    object-fit: cover;
}
.mk_bt {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
}
.mk_button {
    display: block;
    line-height: 50px;
    text-align: center;
    width: 50px;
    height: 50px;
    background: #fff;
    border-radius: 50%;
}
.mk_button:hover { background: #164F8F; }
.mk_button:hover .icon path { fill: #fff !important; }
.mk_f {
    color: #fff;
    padding: 0 34%;
    line-height: 100px;
}
.mk_left {
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(22, 79, 143, .8);
    width: 160px;
    height: 100%;
    z-index: 5;
    display: flex;
    align-items: center;
}
.mk_item .mk_btn { display: none; }
.mk_item .mk_z { display: none; }
.mk_item .mk_t { font-size: 28px; }
.mk_active img {
    width: 100%;
    height: 100%;
    height: 430px;
    object-fit: cover;
}
.mk_active .mk_bt { padding: 118px 0 155px 0px; }
.mk_active .mk_btn { display: block; }
.mk_item .mk_t { margin-top: 0; line-height: 130px; }
.mk_active .mk_t { margin-top: 10px; line-height: normal; }
.mk_active .mk_btn { margin-top: 20px; }
.mk_active .mk_z { display: block; }
.mk_active .mk_t { font-size: 40px; }
.mk_mask {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .7);
    z-index: 3;
}
.mk_active .mk_mask { display: none; }
.mk_active .mk_t { font-size: 30px; }

/* 子公司 badge */
.mk_badge {
    display: inline-block;
    background: #164F8F;
    color: #fff;
    font-size: 14px;
    padding: 2px 10px;
    border-radius: 3px;
    margin-left: 10px;
    vertical-align: middle;
    line-height: 1.5;
}

/* ---------- 经营理念 (brandBox) ---------- */
.brandBox {
    position: relative;
    width: 100%;
    /* ↓↓↓ 模块高度（唯一控制参数）↓↓↓
       内置背景图 img/About/bg_img1.webp 为 1920×1080；
       宽屏下 1000px 高度几乎能完整呈现该图（仅上下各裁 ~36px），
       原值 800px 会裁掉上下各约 136px。 */
    height: 1000px;
    overflow: hidden;
}
.brandBox .brand_bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.brand_content {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 80px;
    text-align: center;
}
.brand_title {
    color: #fff;
    font-size: 36px;
    font-weight: bold;
    line-height: 1.2;
    margin-bottom: 20px;
}
.brand_subtitle {
    color: #fff;
    font-size: 28px;
    line-height: 1.3;
    margin-bottom: 40px;
}
.brand_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: #164F8F;
    font-size: 18px;
    padding: 14px 36px;
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.3s;
    text-decoration: none;
}
.brand_btn:hover {
    background: #e8f0f8;
    color: #164F8F;
}
.brand_btn svg {
    margin-left: 8px;
    width: 14px;
    height: 14px;
}
.brand_btn:hover svg path {
    fill: #fff;
}

/* ---------- 荣誉奖项 (honorBox) ---------- */
.honorBox {
    position: relative;
    width: 100%;
    overflow-x: clip; /* 裁掉荣誉墙轮播平铺溢出的远端部分，消除横向滚动条（保留两侧露边效果） */
}
.honorBox .honor_bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.honor_content {
    position: absolute;
    left: 0;
    top: 192px;
    width: 100%;
}
.honor_header {
    text-align: center;
    color: #222;
}
.honor_header_bottom {
    text-align: center;
    color: #222;
}
.honor_h_title {
    font-size: 42px;
    color: #222;
    font-weight: bold;
    margin-bottom: 28px;
}
.honor_h_sub {
    font-size: 32px;
    color: #222;
}
.honor_carousel {
    position: relative;
    margin-top: 140px;
    overflow: visible !important;
    width: 100%;
}
.honor_carousel .swiper-container {
    overflow: visible !important;
}
.honor_carousel .swiper-wrapper {
    overflow: visible !important;
}
.honor_carousel .swiper-slide {
    width: 12.5%; /* 随容器等比缩放：1440px 容器下 = 180px，窗口缩放时轮播图跟随变化 */
    height: auto;
    text-align: center;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    transition: 300ms;
    transform: scale(0.7);
    transform-origin: center bottom;
}
.honor_carousel .box_image {
    width: 100%;
}
.honor_carousel .box_image img {
    width: 100%;
    height: auto;
    object-fit: contain;
    transform: scale(1.8);
    transform-origin: center center;
}

/* Swiper navigation buttons */
.honor_prev,
.honor_next {
    position: absolute;
    top: 67%;
    transform: translateY(-50%);
    width: 60px;
    height: 60px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 100;
    transition: all 0.3s;
}
.honor_prev { left: 0; }
.honor_next { right: 0; }
.honor_prev svg,
.honor_next svg {
    width: 14px;
    height: auto;
    fill: #164F8F;
}
.honor_prev:hover,
.honor_next:hover {
    background-color: #164F8F;
}
.honor_prev:hover svg,
.honor_next:hover svg {
    fill: #fff;
}

/* Swiper container */
.honor_swiper {
    overflow: visible !important;
}

/* Pagination */
.honor_pagination {
    text-align: center;
    margin-top: 30px;
}
.honor_pagination .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: #ccc;
    border-radius: 50%;
    display: inline-block;
    margin: 0 5px;
    cursor: pointer;
    transition: all 0.3s;
}
.honor_pagination .swiper-pagination-bullet-active {
    background-color: #164F8F;
    width: 24px;
    border-radius: 5px;
}

/* ========================================
   Responsive Breakpoints
   ======================================== */

@media screen and (max-width: 1780px) {
    .wh1600 {
        width: 75% !important;
        margin: 0 auto !important;
    }
}

@media screen and (max-width: 1600px) {
    .wh1600 {
        width: 75% !important;
        margin: 0 auto !important;
    }
    .honor_prev { left: -30px; }
    .honor_next { right: -30px; }
    .brand_content { }
}

@media screen and (max-width: 1200px) {
    .brand_subtitle { font-size: 36px; }
    .honor_h_sub { font-size: 36px; }
}

@media screen and (max-width: 1024px) {
    .wh1600 {
        width: 60% !important;
    }
    .honor_content { top: 40px; }
    .honor_carousel { margin-top: 30px; }
    .honor_carousel .box_image img { height: 90%; }
    .brand_subtitle { font-size: 28px; }
    .brand_btn { font-size: 16px; padding: 10px 30px; }
    .honor_h_sub { font-size: 28px; }
}

@media screen and (max-width: 768px) {
    .p_miao { display: none; }
    .p_list { display: none; }
    .mk_left { width: 80px; }
    .mk_active .mk_bt { padding: 30px 0; }
    .mk_item img { height: 80px; }
    .mk_item .mk_t { font-size: 20px; line-height: 80px; }
    .mk_active .mk_t { font-size: 20px; line-height: normal; white-space: nowrap; }
    .mk_active img { height: 180px; }
    .mk_button { width: 35px; height: 35px; line-height: 35px; }
    .wh1600 {
        width: 55% !important;
        margin: 0 auto !important;
    }

    .brand_subtitle { font-size: 22px; margin-bottom: 20px; }
    .brand_title { font-size: 16px; margin-bottom: 10px; }
    .brand_btn { font-size: 14px; padding: 8px 24px; }
    /* 窄屏不让模块跟着变高：1920×1080 的图在 375 宽下 cover 会裁成一条缝，越高裁得越狠 */
    .brandBox { height: 800px; }

    .honor_content { top: 30px; }
    .honor_h_sub { font-size: 22px; margin-top: 8px; }
    .honor_h_title { font-size: 16px; }
    .honor_carousel { margin-top: 20px; }
    .honor_carousel .swiper-slide { width: 45%; } /* 移动端放大单张，避免 12.5% 过小 */
    .honor_carousel .box_image { height: 200px; }
    .honor_carousel .box_image img { height: 80%; }
    .honorBox { min-height: 360px; }
    .honor_bg { min-height: 360px; }
    .honor_prev,
    .honor_next { display: none; }
    .honor_pagination { display: block; margin-top: 15px; }
}

@media screen and (max-width: 500px) {
    .brand_subtitle { font-size: 18px; }
    .brand_btn { font-size: 13px; padding: 6px 20px; }
    .honor_h_sub { font-size: 18px; }
}

/* =========================================================
   首页底部导航栏（footer）定制样式
	   说明：index.css 仅首页加载，以下规则用于覆盖 style.css 中
	        共享的 footer 默认样式，避免内联 style 散落在 HTML 中。
	   微调提示：带「微调」注释的属性可直接改值。
	   ========================================================= */

	/* 底部整体背景（深蓝） */
	.footer {
		background: #02192F !important;
	}

	/* 顶部纵向排列：Logo → 短横线 → 导航 */
	.footer .footer_top {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}

	/* Logo 位置：向下 / 向右（微调改 margin-top / margin-left） */
	.footer_logo {
		margin-top: 40px;
		margin-left: 120px;
	}

	/* Logo 下方短横线：宽 90%，左右各留 5%（微调改 width / margin） */
	.footer_top > .footer_line {
		width: 90%;
		height: 1px;
		background: #33495e;
		opacity: 1;
		margin: 24px 5% 34px;
	}

	/* 导航 + 右侧图标整行：**不换行** —— 否则窄屏时右侧图标会掉到下一行 */
	.footer .footer_row {
		display: flex;
		flex-wrap: nowrap;
		justify-content: space-between;
		align-items: flex-start;
		width: 100%;
	}

	/* 左侧导航整列右移（微调改 margin-left）。
	   核心：width:auto + flex:1 1 auto —— 导航不再固定 75% 宽，而是占满
	   「整行 − 右侧图标区」的剩余空间；列间距由 space-between 分配余量得到，
	   因此**视口变窄时先压缩的是列间距，而不是把文字挤到折行**。 */
	.footer .footer_nav {
		margin-left: 40px;
		width: auto;
		flex: 1 1 auto;
		flex-wrap: nowrap;
	}

	/* 导航列：宽度 = 内容宽度，禁止被压缩（列被压窄就会导致文字折行） */
	.footer .footer_nav_col {
		flex: 0 0 auto;
	}

	/* 导航与右侧图标之间的旧分隔线：隐藏 */
	.footer .footer_row > .footer_line {
		display: none;
	}

	/* 右侧图标整体左移（微调改 margin-right） */
	.footer .footer_center {
		margin-right: 130px;
	}

	/* 导航文字：偏暗白、非加粗（微调改 color 透明度 0.78） */
	.footer .footer_nav_col a {
		color: rgba(255, 255, 255, 0.78) !important;
		font-weight: normal !important;
		white-space: nowrap;
	}

	/* 灰色版权条：整屏宽、去白线、与上方接壤（微调改 margin-top） */
	.footer .footer_btm {
		background: #1C3044 !important;
		position: static;
		border-top: none;
		width: 100%;
		padding: 22px 0 20px;
		margin-top: 60px;
	}

	/* 版权文字颜色 */
	.footer .footer_btm_left {
		color: rgb(170, 170, 170);
	}

/* ---------------------------------------------------------
   底部导航响应式：① 先压缩列间距 → ② 再收窄两侧留白 → ③ 极限时只留图标
   --------------------------------------------------------- */
@media only screen and (max-width: 1600px) {
	.footer .footer_nav {
		padding: 0 60px;
	}

	.footer .footer_nav_col a {
		padding: 0 14px;
	}

	.footer .footer_center {
		margin-right: 80px;
	}
}

@media only screen and (max-width: 1440px) {
	.footer .footer_nav {
		padding: 0 40px;
	}

	.footer .footer_nav_col a {
		padding: 0 10px;
	}

	.footer .footer_center {
		margin-right: 50px;
	}
}

@media only screen and (max-width: 1280px) {
	.footer .footer_nav {
		padding: 0 20px;
	}

	.footer .footer_nav_col a {
		padding: 0 6px;
	}

	.footer .footer_center {
		margin-right: 30px;
	}
}

/* 压到极限（列间距已收无可收）→ 隐藏导航文字，只保留图标；
   此时 Logo（上方大图标）与图标区一并**水平居中** */
@media only screen and (max-width: 1120px) {
	.footer .footer_nav {
		display: none;
	}

	/* 纵向排版方向上的水平居中（首页 footer_top 是 column） */
	.footer .footer_top {
		align-items: center;
	}

	/* 去掉 Logo 的左侧偏移与右侧内边距，使其真正居中 */
	.footer_logo {
		margin-left: 0;
		padding-right: 0;
	}

	/* 整行只剩图标区 → 居中（并清掉原本贴右/贴左的 margin / padding） */
	.footer .footer_row {
		justify-content: center;
	}

	.footer .footer_center {
		margin-left: 0;
		margin-right: 0;
		padding-left: 0;
	}
}
